Open in a new tab
View code
tsx
<FlowDiagram
	aria-label="A deploy, step by step"
	pauseLabel="Pause the animation"
	trigger={{
		icon: <GitBranchIcon size={14} aria-hidden="true" />,
		title: "A push to main starts a deploy",
		detail: "Every commit, in order",
	}}
	steps={[
		{ title: "Install", code: "bun install --frozen-lockfile" },
		{ title: "Check", code: "bun check" },
		{ title: "Test", code: "bun run test" },
		{ title: "Ship", code: "sdxc deploy" },
	]}
	outcome="Deployed"
	footnote={
		<>
			<BellIcon size={14} aria-hidden="true" />
			A failed step pages the on-call
		</>
	}
/>