chore: import upstream snapshot with attribution

2026-07-13 13:32:57 +08:00
commit cd420f9332
4811 changed files with 884702 additions and 0 deletions
@@ -0,0 +1,48 @@
+import { cn } from "~/utils/cn";
+import { Header2 } from "./Headers";
+import { Spinner } from "./Spinner";
+import { CheckIcon } from "@heroicons/react/24/solid";
+
+export function StepNumber({
+  stepNumber,
+  active = false,
+  complete = false,
+  displaySpinner = false,
+  title,
+  className,
+}: {
+  stepNumber?: string;
+  active?: boolean;
+  complete?: boolean;
+  title?: React.ReactNode;
+  className?: string;
+  displaySpinner?: boolean;
+}) {
+  return (
+    <div className={cn("mr-3", className)}>
+      {active ? (
+        <div className="flex items-center gap-x-3">
+          <span className="flex h-6 w-6 items-center justify-center rounded bg-success py-1 text-xs font-semibold text-charcoal-900">
+            {stepNumber}
+          </span>
+          <Header2>{title}</Header2>
+        </div>
+      ) : (
+        <div className="flex items-center gap-x-3">
+          <span className="flex h-6 w-6 items-center justify-center rounded border border-grid-bright bg-background-bright py-1 text-xs font-semibold text-text-dimmed">
+            {complete ? <CheckIcon className="size-4" /> : stepNumber}
+          </span>
+
+          {displaySpinner ? (
+            <div className="flex items-center gap-x-2">
+              <Header2>{title}</Header2>
+              <Spinner />
+            </div>
+          ) : (
+            <Header2>{title}</Header2>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}