@fairmint/ui 0.4.16 → 0.4.18

package/dist/_virtual/index3.cjs

@@ -1,7 +1,5 @@
 "use strict";
-const _commonjsHelpers = require("./_commonjsHelpers.cjs");
-const index = require("../node_modules/fast-deep-equal/index.cjs");
-var fastDeepEqualExports = index.__require();
-const isEqual = /* @__PURE__ */ _commonjsHelpers.getDefaultExportFromCjs(fastDeepEqualExports);
-module.exports = isEqual;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+var propTypes = { exports: {} };
+exports.__module = propTypes;
 //# sourceMappingURL=index3.cjs.map

package/dist/_virtual/index3.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index3.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index3.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/_virtual/index3.js

@@ -1,8 +1,5 @@
-import { getDefaultExportFromCjs } from "./_commonjsHelpers.js";
-import { __require as requireFastDeepEqual } from "../node_modules/fast-deep-equal/index.js";
-var fastDeepEqualExports = requireFastDeepEqual();
-const isEqual = /* @__PURE__ */ getDefaultExportFromCjs(fastDeepEqualExports);
+var propTypes = { exports: {} };
 export {
-  isEqual as default
+  propTypes as __module
 };
 //# sourceMappingURL=index3.js.map

package/dist/_virtual/index3.js.map

@@ -1 +1 @@
-{"version":3,"file":"index3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/_virtual/index4.cjs

@@ -1,5 +1,7 @@
 "use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-var propTypes = { exports: {} };
-exports.__module = propTypes;
+const _commonjsHelpers = require("./_commonjsHelpers.cjs");
+const index = require("../node_modules/fast-deep-equal/index.cjs");
+var fastDeepEqualExports = index.__require();
+const isEqual = /* @__PURE__ */ _commonjsHelpers.getDefaultExportFromCjs(fastDeepEqualExports);
+module.exports = isEqual;
 //# sourceMappingURL=index4.cjs.map

package/dist/_virtual/index4.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index4.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index4.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/_virtual/index4.js

@@ -1,5 +1,8 @@
-var propTypes = { exports: {} };
+import { getDefaultExportFromCjs } from "./_commonjsHelpers.js";
+import { __require as requireFastDeepEqual } from "../node_modules/fast-deep-equal/index.js";
+var fastDeepEqualExports = requireFastDeepEqual();
+const isEqual = /* @__PURE__ */ getDefaultExportFromCjs(fastDeepEqualExports);
 export {
-  propTypes as __module
+  isEqual as default
 };
 //# sourceMappingURL=index4.js.map

package/dist/_virtual/index4.js.map

@@ -1 +1 @@
-{"version":3,"file":"index4.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index4.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/components/generic/StepProgress/StepProgress.cjs

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
 const index = require("../../../theme/index.cjs");
 const layout = require("../../primitives/layout.cjs");
 ;/* empty css                   */
@@ -20,11 +21,36 @@ const CheckIcon = () => /* @__PURE__ */ jsxRuntime.jsx(
     children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m5 13 4 4 10-10" })
   }
 );
+const StopIcon = () => /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    width: "11",
+    height: "11",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 7l10 10M17 7 7 17" })
+  }
+);
+const STATUS_TEXT = {
+  complete: "(done)",
+  active: void 0,
+  pending: void 0,
+  stopped: "(stopped)"
+};
 const resolveActiveStep = (activeStep, stepCount) => {
   if (!Number.isFinite(activeStep)) return 1;
   return Math.min(Math.max(Math.trunc(activeStep), 1), stepCount);
 };
-const getStepProgressStatus = (step, stepNumber, activeStep) => {
+const getStepProgressStatus = (step, stepNumber, activeStep, variant = "navigation") => {
+  if (variant === "status") {
+    if (step.stopped) return "stopped";
+    if (step.completed) return "complete";
+  }
   if (stepNumber === activeStep) return "active";
   if (step.completed ?? stepNumber < activeStep) return "complete";
   return "pending";
@@ -33,11 +59,28 @@ function StepProgress({
   steps,
   activeStep,
   orientation = "horizontal",
+  variant = "navigation",
   onStepChange,
   ariaLabel = "Progress"
 }) {
+  const listRef = React.useRef(null);
+  const resolvedActiveStep = resolveActiveStep(activeStep, Math.max(steps.length, 1));
+  React.useEffect(() => {
+    const list = listRef.current;
+    const pill = list?.children[resolvedActiveStep - 1]?.querySelector(
+      ".fairmint-step-progress__pill"
+    );
+    if (!list || !pill || list.scrollWidth <= list.clientWidth) return;
+    const listBox = list.getBoundingClientRect();
+    const pillBox = pill.getBoundingClientRect();
+    if (pillBox.left < listBox.left) {
+      list.scrollLeft -= listBox.left - pillBox.left;
+    } else if (pillBox.right > listBox.right) {
+      list.scrollLeft += pillBox.right - listBox.right;
+    }
+  }, [resolvedActiveStep]);
   if (steps.length === 0) return null;
-  const resolvedActiveStep = resolveActiveStep(activeStep, steps.length);
+  const isStatus = variant === "status";
   const rootStyle = {
     "--fairmint-step-progress-brand": index.brandColors.indigo,
     // colorBorderDefault washes out on colorBgSurfaceSecondary; text-secondary clears 3:1.
@@ -53,23 +96,37 @@ function StepProgress({
     "--fairmint-step-progress-active-border": index.indigoColors[3],
     "--fairmint-step-progress-active-indicator-text": index.commonColors.white,
     "--fairmint-step-progress-complete-border": index.indigoColors[3],
-    "--fairmint-step-progress-complete-text": index.fairmintVars.colorIconOnSurfaceSelected
+    "--fairmint-step-progress-complete-text": index.fairmintVars.colorIconOnSurfaceSelected,
+    // The detail line is the one place that needs muted ink; pending labels above it stay primary.
+    "--fairmint-step-progress-detail": index.fairmintVars.colorTextSecondary,
+    "--fairmint-step-progress-stopped": index.fairmintVars.colorErrorSolid,
+    "--fairmint-step-progress-stopped-text": index.fairmintVars.colorErrorText,
+    // Status rows lay out as a grid; the last column never stretches, so it stays flush right.
+    "--fairmint-step-progress-columns": steps.length > 1 ? `repeat(${steps.length - 1}, auto) minmax(min-content, max-content)` : "minmax(min-content, max-content)"
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     layout.Box,
     {
-      component: "nav",
+      component: isStatus ? "div" : "nav",
+      role: isStatus ? "group" : void 0,
       "aria-label": ariaLabel,
       className: "fairmint-step-progress",
       "data-orientation": orientation,
+      "data-variant": variant,
       style: rootStyle,
-      children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "fairmint-step-progress__list", children: steps.map((step, index2) => {
+      children: /* @__PURE__ */ jsxRuntime.jsx("ol", { ref: listRef, className: "fairmint-step-progress__list", children: steps.map((step, index2) => {
         const stepNumber = index2 + 1;
-        const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep);
-        const isInteractive = Boolean(onStepChange) && !step.disabled;
+        const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep, variant);
+        const isInteractive = !isStatus && Boolean(onStepChange) && !step.disabled;
+        const detail = isStatus ? step.detail : void 0;
+        const statusText = isStatus ? STATUS_TEXT[status] : void 0;
         const pillContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__indicator", "aria-hidden": "true", children: status === "complete" ? /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, {}) : stepNumber }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__label", children: step.label })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__indicator", "aria-hidden": "true", children: status === "complete" ? /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, {}) : status === "stopped" ? /* @__PURE__ */ jsxRuntime.jsx(StopIcon, {}) : stepNumber }),
+          detail ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "fairmint-step-progress__text", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__label", children: step.label }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__detail", children: detail })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__label", children: step.label }),
+          statusText ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fairmint-step-progress__status-text", children: statusText }) : null
         ] });
         return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "fairmint-step-progress__item", children: [
           isInteractive ? /* @__PURE__ */ jsxRuntime.jsx(

package/dist/components/generic/StepProgress/StepProgress.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"StepProgress.cjs","sources":["../../../../src/components/generic/StepProgress/StepProgress.tsx"],"sourcesContent":["import { brandColors, commonColors, fairmintVars, indigoColors } from \"../../../theme\";\nimport { Box, UnstyledButton } from \"../../primitives/layout\";\nimport \"./StepProgress.css\";\n\nexport type StepProgressOrientation = \"horizontal\" | \"vertical\";\nexport type StepProgressStepStatus = \"complete\" | \"active\" | \"pending\";\n\nexport interface StepProgressStep {\n  /** Visible label in the progress pill. */\n  label: string;\n  /** Explicitly mark a step complete when completion is not derived from activeStep. */\n  completed?: boolean;\n  /** Prevent navigation to this step when onStepChange is supplied. */\n  disabled?: boolean;\n}\n\nexport interface StepProgressProps {\n  /** Ordered steps. The visible number is derived from this array and is 1-indexed. */\n  steps: readonly StepProgressStep[];\n  /** Current step number. This is intentionally 1-indexed to match StepCard and the UI. */\n  activeStep: number;\n  /** Row of pills for in-app progress or a rail for onboarding. @default \"horizontal\" */\n  orientation?: StepProgressOrientation;\n  /** Called with the 1-indexed step number when a pill is activated. */\n  onStepChange?: (step: number) => void;\n  /** Accessible label for the navigation. @default \"Progress\" */\n  ariaLabel?: string;\n}\n\nconst CheckIcon = () => (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.5\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"m5 13 4 4 10-10\" />\n  </svg>\n);\n\nconst resolveActiveStep = (activeStep: number, stepCount: number) => {\n  if (!Number.isFinite(activeStep)) return 1;\n  return Math.min(Math.max(Math.trunc(activeStep), 1), stepCount);\n};\n\nexport const getStepProgressStatus = (\n  step: StepProgressStep,\n  stepNumber: number,\n  activeStep: number,\n): StepProgressStepStatus => {\n  if (stepNumber === activeStep) return \"active\";\n  if (step.completed ?? stepNumber < activeStep) return \"complete\";\n  return \"pending\";\n};\n\n/**\n * Numbered progress pills shared by horizontal in-app flows and vertical\n * onboarding rails. Owns navigation only — the numbered content container is\n * `StepCard`, and `StepFlow` pairs the two into the canonical shell.\n */\nexport function StepProgress({\n  steps,\n  activeStep,\n  orientation = \"horizontal\",\n  onStepChange,\n  ariaLabel = \"Progress\",\n}: StepProgressProps) {\n  if (steps.length === 0) return null;\n\n  const resolvedActiveStep = resolveActiveStep(activeStep, steps.length);\n  const rootStyle = {\n    \"--fairmint-step-progress-brand\": brandColors.indigo,\n    // colorBorderDefault washes out on colorBgSurfaceSecondary; text-secondary clears 3:1.\n    \"--fairmint-step-progress-border\": fairmintVars.colorTextSecondary,\n    // Kept off the ring token: the ring carries the step number and needs 3:1, the\n    // connector is decorative and reads as a hairline between pills.\n    \"--fairmint-step-progress-connector\": fairmintVars.colorBorderDefault,\n    \"--fairmint-step-progress-text-primary\": fairmintVars.colorTextPrimary,\n    // Pending labels use primary ink; active hierarchy is weight + fill, not mute gray.\n    \"--fairmint-step-progress-text-secondary\": fairmintVars.colorTextPrimary,\n    // indigo[1] — surface-selected (indigo[0]) is too close to the secondary canvas.\n    \"--fairmint-step-progress-surface-selected\": fairmintVars.colorBgBrandSubtleHover,\n    \"--fairmint-step-progress-active-border\": indigoColors[3],\n    \"--fairmint-step-progress-active-indicator-text\": commonColors.white,\n    \"--fairmint-step-progress-complete-border\": indigoColors[3],\n    \"--fairmint-step-progress-complete-text\": fairmintVars.colorIconOnSurfaceSelected,\n  };\n\n  return (\n    <Box\n      component=\"nav\"\n      aria-label={ariaLabel}\n      className=\"fairmint-step-progress\"\n      data-orientation={orientation}\n      style={rootStyle}\n    >\n      <ol className=\"fairmint-step-progress__list\">\n        {steps.map((step, index) => {\n          const stepNumber = index + 1;\n          const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep);\n          const isInteractive = Boolean(onStepChange) && !step.disabled;\n          const pillContent = (\n            <>\n              <span className=\"fairmint-step-progress__indicator\" aria-hidden=\"true\">\n                {status === \"complete\" ? <CheckIcon /> : stepNumber}\n              </span>\n              <span className=\"fairmint-step-progress__label\">{step.label}</span>\n            </>\n          );\n\n          return (\n            <li key={`${stepNumber}-${step.label}`} className=\"fairmint-step-progress__item\">\n              {isInteractive ? (\n                <UnstyledButton\n                  type=\"button\"\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-interactive=\"true\"\n                  data-disabled=\"false\"\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-label={`Step ${stepNumber}: ${step.label}`}\n                  onClick={() => onStepChange?.(stepNumber)}\n                >\n                  {pillContent}\n                </UnstyledButton>\n              ) : (\n                <span\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-disabled={step.disabled ? \"true\" : \"false\"}\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-disabled={step.disabled || undefined}\n                  title={`Step ${stepNumber}: ${step.label}`}\n                >\n                  {pillContent}\n                </span>\n              )}\n              {index < steps.length - 1 ? (\n                <span\n                  className=\"fairmint-step-progress__connector\"\n                  data-state={status}\n                  aria-hidden=\"true\"\n                />\n              ) : null}\n            </li>\n          );\n        })}\n      </ol>\n    </Box>\n  );\n}\n\nexport const STEP_PROGRESS_MOBILE_BREAKPOINT = \"48em\";\n"],"names":["jsx","brandColors","fairmintVars","indigoColors","commonColors","Box","index","jsxs","Fragment","UnstyledButton"],"mappings":"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"}
+{"version":3,"file":"StepProgress.cjs","sources":["../../../../src/components/generic/StepProgress/StepProgress.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { brandColors, commonColors, fairmintVars, indigoColors } from \"../../../theme\";\nimport { Box, UnstyledButton } from \"../../primitives/layout\";\nimport \"./StepProgress.css\";\n\nexport type StepProgressOrientation = \"horizontal\" | \"vertical\";\nexport type StepProgressVariant = \"navigation\" | \"status\";\nexport type StepProgressStepStatus = \"complete\" | \"active\" | \"pending\" | \"stopped\";\n\nexport interface StepProgressStep {\n  /** Visible label in the progress pill. */\n  label: string;\n  /** Explicitly mark a step complete when completion is not derived from activeStep. */\n  completed?: boolean;\n  /** Prevent navigation to this step when onStepChange is supplied. */\n  disabled?: boolean;\n  /** Second line under the label, such as when the step happened. Shown by the status variant only. */\n  detail?: string;\n  /** The record stopped at this step (rejected, failed, cancelled). Shown by the status variant only. */\n  stopped?: boolean;\n}\n\nexport interface StepProgressProps {\n  /** Ordered steps. The visible number is derived from this array and is 1-indexed. */\n  steps: readonly StepProgressStep[];\n  /** Current step number. This is intentionally 1-indexed to match StepCard and the UI. */\n  activeStep: number;\n  /** Row of pills for in-app progress or a rail for onboarding. @default \"horizontal\" */\n  orientation?: StepProgressOrientation;\n  /**\n   * `navigation` is where the user is in a flow they are filling in. `status` is where a\n   * record is in its lifecycle: read-only, no pill, and each step can carry a `detail`.\n   * @default \"navigation\"\n   */\n  variant?: StepProgressVariant;\n  /** Called with the 1-indexed step number when a pill is activated. Ignored by the status variant. */\n  onStepChange?: (step: number) => void;\n  /** Accessible label for the navigation. @default \"Progress\" */\n  ariaLabel?: string;\n}\n\nconst CheckIcon = () => (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.5\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"m5 13 4 4 10-10\" />\n  </svg>\n);\n\nconst StopIcon = () => (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.5\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"M7 7l10 10M17 7 7 17\" />\n  </svg>\n);\n\nconst STATUS_TEXT: Readonly<Record<StepProgressStepStatus, string | undefined>> = {\n  complete: \"(done)\",\n  active: undefined,\n  pending: undefined,\n  stopped: \"(stopped)\",\n};\n\nconst resolveActiveStep = (activeStep: number, stepCount: number) => {\n  if (!Number.isFinite(activeStep)) return 1;\n  return Math.min(Math.max(Math.trunc(activeStep), 1), stepCount);\n};\n\nexport const getStepProgressStatus = (\n  step: StepProgressStep,\n  stepNumber: number,\n  activeStep: number,\n  variant: StepProgressVariant = \"navigation\",\n): StepProgressStepStatus => {\n  if (variant === \"status\") {\n    if (step.stopped) return \"stopped\";\n    // A finished record has no current step: its last step is done, not in progress.\n    if (step.completed) return \"complete\";\n  }\n  if (stepNumber === activeStep) return \"active\";\n  if (step.completed ?? stepNumber < activeStep) return \"complete\";\n  return \"pending\";\n};\n\n/**\n * Numbered progress pills shared by horizontal in-app flows and vertical\n * onboarding rails. Owns navigation only — the numbered content container is\n * `StepCard`, and `StepFlow` pairs the two into the canonical shell.\n *\n * The `status` variant reuses the same anatomy as a read-only lifecycle track,\n * so a record's progress and a flow's progress look like one component.\n */\nexport function StepProgress({\n  steps,\n  activeStep,\n  orientation = \"horizontal\",\n  variant = \"navigation\",\n  onStepChange,\n  ariaLabel = \"Progress\",\n}: StepProgressProps) {\n  const listRef = useRef<HTMLOListElement>(null);\n  const resolvedActiveStep = resolveActiveStep(activeStep, Math.max(steps.length, 1));\n\n  // When the row scrolls, keep the current step in view as it changes. Scrolls the\n  // list only — scrollIntoView would also move the page to the progress row.\n  useEffect(() => {\n    const list = listRef.current;\n    const pill = list?.children[resolvedActiveStep - 1]?.querySelector<HTMLElement>(\n      \".fairmint-step-progress__pill\",\n    );\n    if (!list || !pill || list.scrollWidth <= list.clientWidth) return;\n    const listBox = list.getBoundingClientRect();\n    const pillBox = pill.getBoundingClientRect();\n    if (pillBox.left < listBox.left) {\n      list.scrollLeft -= listBox.left - pillBox.left;\n    } else if (pillBox.right > listBox.right) {\n      list.scrollLeft += pillBox.right - listBox.right;\n    }\n  }, [resolvedActiveStep]);\n\n  if (steps.length === 0) return null;\n\n  const isStatus = variant === \"status\";\n  const rootStyle = {\n    \"--fairmint-step-progress-brand\": brandColors.indigo,\n    // colorBorderDefault washes out on colorBgSurfaceSecondary; text-secondary clears 3:1.\n    \"--fairmint-step-progress-border\": fairmintVars.colorTextSecondary,\n    // Kept off the ring token: the ring carries the step number and needs 3:1, the\n    // connector is decorative and reads as a hairline between pills.\n    \"--fairmint-step-progress-connector\": fairmintVars.colorBorderDefault,\n    \"--fairmint-step-progress-text-primary\": fairmintVars.colorTextPrimary,\n    // Pending labels use primary ink; active hierarchy is weight + fill, not mute gray.\n    \"--fairmint-step-progress-text-secondary\": fairmintVars.colorTextPrimary,\n    // indigo[1] — surface-selected (indigo[0]) is too close to the secondary canvas.\n    \"--fairmint-step-progress-surface-selected\": fairmintVars.colorBgBrandSubtleHover,\n    \"--fairmint-step-progress-active-border\": indigoColors[3],\n    \"--fairmint-step-progress-active-indicator-text\": commonColors.white,\n    \"--fairmint-step-progress-complete-border\": indigoColors[3],\n    \"--fairmint-step-progress-complete-text\": fairmintVars.colorIconOnSurfaceSelected,\n    // The detail line is the one place that needs muted ink; pending labels above it stay primary.\n    \"--fairmint-step-progress-detail\": fairmintVars.colorTextSecondary,\n    \"--fairmint-step-progress-stopped\": fairmintVars.colorErrorSolid,\n    \"--fairmint-step-progress-stopped-text\": fairmintVars.colorErrorText,\n    // Status rows lay out as a grid; the last column never stretches, so it stays flush right.\n    \"--fairmint-step-progress-columns\":\n      steps.length > 1\n        ? `repeat(${steps.length - 1}, auto) minmax(min-content, max-content)`\n        : \"minmax(min-content, max-content)\",\n  };\n\n  return (\n    <Box\n      // A status track is not navigation: nothing in it goes anywhere.\n      component={isStatus ? \"div\" : \"nav\"}\n      role={isStatus ? \"group\" : undefined}\n      aria-label={ariaLabel}\n      className=\"fairmint-step-progress\"\n      data-orientation={orientation}\n      data-variant={variant}\n      style={rootStyle}\n    >\n      <ol ref={listRef} className=\"fairmint-step-progress__list\">\n        {steps.map((step, index) => {\n          const stepNumber = index + 1;\n          const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep, variant);\n          const isInteractive = !isStatus && Boolean(onStepChange) && !step.disabled;\n          const detail = isStatus ? step.detail : undefined;\n          // The indicator icons are aria-hidden, so a status track says done and stopped in words.\n          const statusText = isStatus ? STATUS_TEXT[status] : undefined;\n          const pillContent = (\n            <>\n              <span className=\"fairmint-step-progress__indicator\" aria-hidden=\"true\">\n                {status === \"complete\" ? (\n                  <CheckIcon />\n                ) : status === \"stopped\" ? (\n                  <StopIcon />\n                ) : (\n                  stepNumber\n                )}\n              </span>\n              {detail ? (\n                <span className=\"fairmint-step-progress__text\">\n                  <span className=\"fairmint-step-progress__label\">{step.label}</span>\n                  <span className=\"fairmint-step-progress__detail\">{detail}</span>\n                </span>\n              ) : (\n                <span className=\"fairmint-step-progress__label\">{step.label}</span>\n              )}\n              {statusText ? (\n                <span className=\"fairmint-step-progress__status-text\">{statusText}</span>\n              ) : null}\n            </>\n          );\n\n          return (\n            <li key={`${stepNumber}-${step.label}`} className=\"fairmint-step-progress__item\">\n              {isInteractive ? (\n                <UnstyledButton\n                  type=\"button\"\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-interactive=\"true\"\n                  data-disabled=\"false\"\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-label={`Step ${stepNumber}: ${step.label}`}\n                  onClick={() => onStepChange?.(stepNumber)}\n                >\n                  {pillContent}\n                </UnstyledButton>\n              ) : (\n                <span\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-disabled={step.disabled ? \"true\" : \"false\"}\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-disabled={step.disabled || undefined}\n                  title={`Step ${stepNumber}: ${step.label}`}\n                >\n                  {pillContent}\n                </span>\n              )}\n              {index < steps.length - 1 ? (\n                <span\n                  className=\"fairmint-step-progress__connector\"\n                  data-state={status}\n                  aria-hidden=\"true\"\n                />\n              ) : null}\n            </li>\n          );\n        })}\n      </ol>\n    </Box>\n  );\n}\n\nexport const STEP_PROGRESS_MOBILE_BREAKPOINT = \"48em\";\n"],"names":["jsx","useRef","useEffect","brandColors","fairmintVars","indigoColors","commonColors","Box","index","jsxs","Fragment","UnstyledButton"],"mappings":"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"}

package/dist/components/generic/StepProgress/StepProgress.d.ts

@@ -1,5 +1,6 @@
 export type StepProgressOrientation = "horizontal" | "vertical";
-export type StepProgressStepStatus = "complete" | "active" | "pending";
+export type StepProgressVariant = "navigation" | "status";
+export type StepProgressStepStatus = "complete" | "active" | "pending" | "stopped";
 export interface StepProgressStep {
     /** Visible label in the progress pill. */
     label: string;
@@ -7,6 +8,10 @@ export interface StepProgressStep {
     completed?: boolean;
     /** Prevent navigation to this step when onStepChange is supplied. */
     disabled?: boolean;
+    /** Second line under the label, such as when the step happened. Shown by the status variant only. */
+    detail?: string;
+    /** The record stopped at this step (rejected, failed, cancelled). Shown by the status variant only. */
+    stopped?: boolean;
 }
 export interface StepProgressProps {
     /** Ordered steps. The visible number is derived from this array and is 1-indexed. */
@@ -15,17 +20,26 @@ export interface StepProgressProps {
     activeStep: number;
     /** Row of pills for in-app progress or a rail for onboarding. @default "horizontal" */
     orientation?: StepProgressOrientation;
-    /** Called with the 1-indexed step number when a pill is activated. */
+    /**
+     * `navigation` is where the user is in a flow they are filling in. `status` is where a
+     * record is in its lifecycle: read-only, no pill, and each step can carry a `detail`.
+     * @default "navigation"
+     */
+    variant?: StepProgressVariant;
+    /** Called with the 1-indexed step number when a pill is activated. Ignored by the status variant. */
     onStepChange?: (step: number) => void;
     /** Accessible label for the navigation. @default "Progress" */
     ariaLabel?: string;
 }
-export declare const getStepProgressStatus: (step: StepProgressStep, stepNumber: number, activeStep: number) => StepProgressStepStatus;
+export declare const getStepProgressStatus: (step: StepProgressStep, stepNumber: number, activeStep: number, variant?: StepProgressVariant) => StepProgressStepStatus;
 /**
  * Numbered progress pills shared by horizontal in-app flows and vertical
  * onboarding rails. Owns navigation only — the numbered content container is
  * `StepCard`, and `StepFlow` pairs the two into the canonical shell.
+ *
+ * The `status` variant reuses the same anatomy as a read-only lifecycle track,
+ * so a record's progress and a flow's progress look like one component.
  */
-export declare function StepProgress({ steps, activeStep, orientation, onStepChange, ariaLabel, }: StepProgressProps): import("react").JSX.Element | null;
+export declare function StepProgress({ steps, activeStep, orientation, variant, onStepChange, ariaLabel, }: StepProgressProps): import("react").JSX.Element | null;
 export declare const STEP_PROGRESS_MOBILE_BREAKPOINT = "48em";
 //# sourceMappingURL=StepProgress.d.ts.map

package/dist/components/generic/StepProgress/StepProgress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StepProgress.d.ts","sourceRoot":"","sources":["../../../../src/components/generic/StepProgress/StepProgress.tsx"],"names":[],"mappings":"AAEA,OAAO,oBAAoB,CAAC;AAE5B,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAAG,UAAU,CAAC;AAChE,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEvE,MAAM,WAAW,gBAAgB;IAC/B,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,sFAAsF;IACtF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,iBAAiB;IAChC,qFAAqF;IACrF,KAAK,EAAE,SAAS,gBAAgB,EAAE,CAAC;IACnC,yFAAyF;IACzF,UAAU,EAAE,MAAM,CAAC;IACnB,uFAAuF;IACvF,WAAW,CAAC,EAAE,uBAAuB,CAAC;IACtC,sEAAsE;IACtE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD,eAAO,MAAM,qBAAqB,GAChC,MAAM,gBAAgB,EACtB,YAAY,MAAM,EAClB,YAAY,MAAM,KACjB,sBAIF,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,UAAU,EACV,WAA0B,EAC1B,YAAY,EACZ,SAAsB,GACvB,EAAE,iBAAiB,sCAoFnB;AAED,eAAO,MAAM,+BAA+B,SAAS,CAAC"}
+{"version":3,"file":"StepProgress.d.ts","sourceRoot":"","sources":["../../../../src/components/generic/StepProgress/StepProgress.tsx"],"names":[],"mappings":"AAGA,OAAO,oBAAoB,CAAC;AAE5B,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAAG,UAAU,CAAC;AAChE,MAAM,MAAM,mBAAmB,GAAG,YAAY,GAAG,QAAQ,CAAC;AAC1D,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC;AAEnF,MAAM,WAAW,gBAAgB;IAC/B,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,sFAAsF;IACtF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qGAAqG;IACrG,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uGAAuG;IACvG,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,iBAAiB;IAChC,qFAAqF;IACrF,KAAK,EAAE,SAAS,gBAAgB,EAAE,CAAC;IACnC,yFAAyF;IACzF,UAAU,EAAE,MAAM,CAAC;IACnB,uFAAuF;IACvF,WAAW,CAAC,EAAE,uBAAuB,CAAC;IACtC;;;;OAIG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,qGAAqG;IACrG,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA8CD,eAAO,MAAM,qBAAqB,GAChC,MAAM,gBAAgB,EACtB,YAAY,MAAM,EAClB,YAAY,MAAM,EAClB,UAAS,mBAAkC,KAC1C,sBASF,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,UAAU,EACV,WAA0B,EAC1B,OAAsB,EACtB,YAAY,EACZ,SAAsB,GACvB,EAAE,iBAAiB,sCAuInB;AAED,eAAO,MAAM,+BAA+B,SAAS,CAAC"}

package/dist/components/generic/StepProgress/StepProgress.js

@@ -1,4 +1,5 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
 import { fairmintVars, indigoColors, commonColors, brandColors } from "../../../theme/index.js";
 import { Box } from "../../primitives/layout.js";
 /* empty css                 */
@@ -18,11 +19,36 @@ const CheckIcon = () => /* @__PURE__ */ jsx(
     children: /* @__PURE__ */ jsx("path", { d: "m5 13 4 4 10-10" })
   }
 );
+const StopIcon = () => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "11",
+    height: "11",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ jsx("path", { d: "M7 7l10 10M17 7 7 17" })
+  }
+);
+const STATUS_TEXT = {
+  complete: "(done)",
+  active: void 0,
+  pending: void 0,
+  stopped: "(stopped)"
+};
 const resolveActiveStep = (activeStep, stepCount) => {
   if (!Number.isFinite(activeStep)) return 1;
   return Math.min(Math.max(Math.trunc(activeStep), 1), stepCount);
 };
-const getStepProgressStatus = (step, stepNumber, activeStep) => {
+const getStepProgressStatus = (step, stepNumber, activeStep, variant = "navigation") => {
+  if (variant === "status") {
+    if (step.stopped) return "stopped";
+    if (step.completed) return "complete";
+  }
   if (stepNumber === activeStep) return "active";
   if (step.completed ?? stepNumber < activeStep) return "complete";
   return "pending";
@@ -31,11 +57,28 @@ function StepProgress({
   steps,
   activeStep,
   orientation = "horizontal",
+  variant = "navigation",
   onStepChange,
   ariaLabel = "Progress"
 }) {
+  const listRef = useRef(null);
+  const resolvedActiveStep = resolveActiveStep(activeStep, Math.max(steps.length, 1));
+  useEffect(() => {
+    const list = listRef.current;
+    const pill = list?.children[resolvedActiveStep - 1]?.querySelector(
+      ".fairmint-step-progress__pill"
+    );
+    if (!list || !pill || list.scrollWidth <= list.clientWidth) return;
+    const listBox = list.getBoundingClientRect();
+    const pillBox = pill.getBoundingClientRect();
+    if (pillBox.left < listBox.left) {
+      list.scrollLeft -= listBox.left - pillBox.left;
+    } else if (pillBox.right > listBox.right) {
+      list.scrollLeft += pillBox.right - listBox.right;
+    }
+  }, [resolvedActiveStep]);
   if (steps.length === 0) return null;
-  const resolvedActiveStep = resolveActiveStep(activeStep, steps.length);
+  const isStatus = variant === "status";
   const rootStyle = {
     "--fairmint-step-progress-brand": brandColors.indigo,
     // colorBorderDefault washes out on colorBgSurfaceSecondary; text-secondary clears 3:1.
@@ -51,23 +94,37 @@ function StepProgress({
     "--fairmint-step-progress-active-border": indigoColors[3],
     "--fairmint-step-progress-active-indicator-text": commonColors.white,
     "--fairmint-step-progress-complete-border": indigoColors[3],
-    "--fairmint-step-progress-complete-text": fairmintVars.colorIconOnSurfaceSelected
+    "--fairmint-step-progress-complete-text": fairmintVars.colorIconOnSurfaceSelected,
+    // The detail line is the one place that needs muted ink; pending labels above it stay primary.
+    "--fairmint-step-progress-detail": fairmintVars.colorTextSecondary,
+    "--fairmint-step-progress-stopped": fairmintVars.colorErrorSolid,
+    "--fairmint-step-progress-stopped-text": fairmintVars.colorErrorText,
+    // Status rows lay out as a grid; the last column never stretches, so it stays flush right.
+    "--fairmint-step-progress-columns": steps.length > 1 ? `repeat(${steps.length - 1}, auto) minmax(min-content, max-content)` : "minmax(min-content, max-content)"
   };
   return /* @__PURE__ */ jsx(
     Box,
     {
-      component: "nav",
+      component: isStatus ? "div" : "nav",
+      role: isStatus ? "group" : void 0,
       "aria-label": ariaLabel,
       className: "fairmint-step-progress",
       "data-orientation": orientation,
+      "data-variant": variant,
       style: rootStyle,
-      children: /* @__PURE__ */ jsx("ol", { className: "fairmint-step-progress__list", children: steps.map((step, index) => {
+      children: /* @__PURE__ */ jsx("ol", { ref: listRef, className: "fairmint-step-progress__list", children: steps.map((step, index) => {
         const stepNumber = index + 1;
-        const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep);
-        const isInteractive = Boolean(onStepChange) && !step.disabled;
+        const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep, variant);
+        const isInteractive = !isStatus && Boolean(onStepChange) && !step.disabled;
+        const detail = isStatus ? step.detail : void 0;
+        const statusText = isStatus ? STATUS_TEXT[status] : void 0;
         const pillContent = /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__indicator", "aria-hidden": "true", children: status === "complete" ? /* @__PURE__ */ jsx(CheckIcon, {}) : stepNumber }),
-          /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__label", children: step.label })
+          /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__indicator", "aria-hidden": "true", children: status === "complete" ? /* @__PURE__ */ jsx(CheckIcon, {}) : status === "stopped" ? /* @__PURE__ */ jsx(StopIcon, {}) : stepNumber }),
+          detail ? /* @__PURE__ */ jsxs("span", { className: "fairmint-step-progress__text", children: [
+            /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__label", children: step.label }),
+            /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__detail", children: detail })
+          ] }) : /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__label", children: step.label }),
+          statusText ? /* @__PURE__ */ jsx("span", { className: "fairmint-step-progress__status-text", children: statusText }) : null
         ] });
         return /* @__PURE__ */ jsxs("li", { className: "fairmint-step-progress__item", children: [
           isInteractive ? /* @__PURE__ */ jsx(

package/dist/components/generic/StepProgress/StepProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepProgress.js","sources":["../../../../src/components/generic/StepProgress/StepProgress.tsx"],"sourcesContent":["import { brandColors, commonColors, fairmintVars, indigoColors } from \"../../../theme\";\nimport { Box, UnstyledButton } from \"../../primitives/layout\";\nimport \"./StepProgress.css\";\n\nexport type StepProgressOrientation = \"horizontal\" | \"vertical\";\nexport type StepProgressStepStatus = \"complete\" | \"active\" | \"pending\";\n\nexport interface StepProgressStep {\n  /** Visible label in the progress pill. */\n  label: string;\n  /** Explicitly mark a step complete when completion is not derived from activeStep. */\n  completed?: boolean;\n  /** Prevent navigation to this step when onStepChange is supplied. */\n  disabled?: boolean;\n}\n\nexport interface StepProgressProps {\n  /** Ordered steps. The visible number is derived from this array and is 1-indexed. */\n  steps: readonly StepProgressStep[];\n  /** Current step number. This is intentionally 1-indexed to match StepCard and the UI. */\n  activeStep: number;\n  /** Row of pills for in-app progress or a rail for onboarding. @default \"horizontal\" */\n  orientation?: StepProgressOrientation;\n  /** Called with the 1-indexed step number when a pill is activated. */\n  onStepChange?: (step: number) => void;\n  /** Accessible label for the navigation. @default \"Progress\" */\n  ariaLabel?: string;\n}\n\nconst CheckIcon = () => (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.5\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"m5 13 4 4 10-10\" />\n  </svg>\n);\n\nconst resolveActiveStep = (activeStep: number, stepCount: number) => {\n  if (!Number.isFinite(activeStep)) return 1;\n  return Math.min(Math.max(Math.trunc(activeStep), 1), stepCount);\n};\n\nexport const getStepProgressStatus = (\n  step: StepProgressStep,\n  stepNumber: number,\n  activeStep: number,\n): StepProgressStepStatus => {\n  if (stepNumber === activeStep) return \"active\";\n  if (step.completed ?? stepNumber < activeStep) return \"complete\";\n  return \"pending\";\n};\n\n/**\n * Numbered progress pills shared by horizontal in-app flows and vertical\n * onboarding rails. Owns navigation only — the numbered content container is\n * `StepCard`, and `StepFlow` pairs the two into the canonical shell.\n */\nexport function StepProgress({\n  steps,\n  activeStep,\n  orientation = \"horizontal\",\n  onStepChange,\n  ariaLabel = \"Progress\",\n}: StepProgressProps) {\n  if (steps.length === 0) return null;\n\n  const resolvedActiveStep = resolveActiveStep(activeStep, steps.length);\n  const rootStyle = {\n    \"--fairmint-step-progress-brand\": brandColors.indigo,\n    // colorBorderDefault washes out on colorBgSurfaceSecondary; text-secondary clears 3:1.\n    \"--fairmint-step-progress-border\": fairmintVars.colorTextSecondary,\n    // Kept off the ring token: the ring carries the step number and needs 3:1, the\n    // connector is decorative and reads as a hairline between pills.\n    \"--fairmint-step-progress-connector\": fairmintVars.colorBorderDefault,\n    \"--fairmint-step-progress-text-primary\": fairmintVars.colorTextPrimary,\n    // Pending labels use primary ink; active hierarchy is weight + fill, not mute gray.\n    \"--fairmint-step-progress-text-secondary\": fairmintVars.colorTextPrimary,\n    // indigo[1] — surface-selected (indigo[0]) is too close to the secondary canvas.\n    \"--fairmint-step-progress-surface-selected\": fairmintVars.colorBgBrandSubtleHover,\n    \"--fairmint-step-progress-active-border\": indigoColors[3],\n    \"--fairmint-step-progress-active-indicator-text\": commonColors.white,\n    \"--fairmint-step-progress-complete-border\": indigoColors[3],\n    \"--fairmint-step-progress-complete-text\": fairmintVars.colorIconOnSurfaceSelected,\n  };\n\n  return (\n    <Box\n      component=\"nav\"\n      aria-label={ariaLabel}\n      className=\"fairmint-step-progress\"\n      data-orientation={orientation}\n      style={rootStyle}\n    >\n      <ol className=\"fairmint-step-progress__list\">\n        {steps.map((step, index) => {\n          const stepNumber = index + 1;\n          const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep);\n          const isInteractive = Boolean(onStepChange) && !step.disabled;\n          const pillContent = (\n            <>\n              <span className=\"fairmint-step-progress__indicator\" aria-hidden=\"true\">\n                {status === \"complete\" ? <CheckIcon /> : stepNumber}\n              </span>\n              <span className=\"fairmint-step-progress__label\">{step.label}</span>\n            </>\n          );\n\n          return (\n            <li key={`${stepNumber}-${step.label}`} className=\"fairmint-step-progress__item\">\n              {isInteractive ? (\n                <UnstyledButton\n                  type=\"button\"\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-interactive=\"true\"\n                  data-disabled=\"false\"\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-label={`Step ${stepNumber}: ${step.label}`}\n                  onClick={() => onStepChange?.(stepNumber)}\n                >\n                  {pillContent}\n                </UnstyledButton>\n              ) : (\n                <span\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-disabled={step.disabled ? \"true\" : \"false\"}\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-disabled={step.disabled || undefined}\n                  title={`Step ${stepNumber}: ${step.label}`}\n                >\n                  {pillContent}\n                </span>\n              )}\n              {index < steps.length - 1 ? (\n                <span\n                  className=\"fairmint-step-progress__connector\"\n                  data-state={status}\n                  aria-hidden=\"true\"\n                />\n              ) : null}\n            </li>\n          );\n        })}\n      </ol>\n    </Box>\n  );\n}\n\nexport const STEP_PROGRESS_MOBILE_BREAKPOINT = \"48em\";\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"StepProgress.js","sources":["../../../../src/components/generic/StepProgress/StepProgress.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { brandColors, commonColors, fairmintVars, indigoColors } from \"../../../theme\";\nimport { Box, UnstyledButton } from \"../../primitives/layout\";\nimport \"./StepProgress.css\";\n\nexport type StepProgressOrientation = \"horizontal\" | \"vertical\";\nexport type StepProgressVariant = \"navigation\" | \"status\";\nexport type StepProgressStepStatus = \"complete\" | \"active\" | \"pending\" | \"stopped\";\n\nexport interface StepProgressStep {\n  /** Visible label in the progress pill. */\n  label: string;\n  /** Explicitly mark a step complete when completion is not derived from activeStep. */\n  completed?: boolean;\n  /** Prevent navigation to this step when onStepChange is supplied. */\n  disabled?: boolean;\n  /** Second line under the label, such as when the step happened. Shown by the status variant only. */\n  detail?: string;\n  /** The record stopped at this step (rejected, failed, cancelled). Shown by the status variant only. */\n  stopped?: boolean;\n}\n\nexport interface StepProgressProps {\n  /** Ordered steps. The visible number is derived from this array and is 1-indexed. */\n  steps: readonly StepProgressStep[];\n  /** Current step number. This is intentionally 1-indexed to match StepCard and the UI. */\n  activeStep: number;\n  /** Row of pills for in-app progress or a rail for onboarding. @default \"horizontal\" */\n  orientation?: StepProgressOrientation;\n  /**\n   * `navigation` is where the user is in a flow they are filling in. `status` is where a\n   * record is in its lifecycle: read-only, no pill, and each step can carry a `detail`.\n   * @default \"navigation\"\n   */\n  variant?: StepProgressVariant;\n  /** Called with the 1-indexed step number when a pill is activated. Ignored by the status variant. */\n  onStepChange?: (step: number) => void;\n  /** Accessible label for the navigation. @default \"Progress\" */\n  ariaLabel?: string;\n}\n\nconst CheckIcon = () => (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.5\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"m5 13 4 4 10-10\" />\n  </svg>\n);\n\nconst StopIcon = () => (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.5\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"M7 7l10 10M17 7 7 17\" />\n  </svg>\n);\n\nconst STATUS_TEXT: Readonly<Record<StepProgressStepStatus, string | undefined>> = {\n  complete: \"(done)\",\n  active: undefined,\n  pending: undefined,\n  stopped: \"(stopped)\",\n};\n\nconst resolveActiveStep = (activeStep: number, stepCount: number) => {\n  if (!Number.isFinite(activeStep)) return 1;\n  return Math.min(Math.max(Math.trunc(activeStep), 1), stepCount);\n};\n\nexport const getStepProgressStatus = (\n  step: StepProgressStep,\n  stepNumber: number,\n  activeStep: number,\n  variant: StepProgressVariant = \"navigation\",\n): StepProgressStepStatus => {\n  if (variant === \"status\") {\n    if (step.stopped) return \"stopped\";\n    // A finished record has no current step: its last step is done, not in progress.\n    if (step.completed) return \"complete\";\n  }\n  if (stepNumber === activeStep) return \"active\";\n  if (step.completed ?? stepNumber < activeStep) return \"complete\";\n  return \"pending\";\n};\n\n/**\n * Numbered progress pills shared by horizontal in-app flows and vertical\n * onboarding rails. Owns navigation only — the numbered content container is\n * `StepCard`, and `StepFlow` pairs the two into the canonical shell.\n *\n * The `status` variant reuses the same anatomy as a read-only lifecycle track,\n * so a record's progress and a flow's progress look like one component.\n */\nexport function StepProgress({\n  steps,\n  activeStep,\n  orientation = \"horizontal\",\n  variant = \"navigation\",\n  onStepChange,\n  ariaLabel = \"Progress\",\n}: StepProgressProps) {\n  const listRef = useRef<HTMLOListElement>(null);\n  const resolvedActiveStep = resolveActiveStep(activeStep, Math.max(steps.length, 1));\n\n  // When the row scrolls, keep the current step in view as it changes. Scrolls the\n  // list only — scrollIntoView would also move the page to the progress row.\n  useEffect(() => {\n    const list = listRef.current;\n    const pill = list?.children[resolvedActiveStep - 1]?.querySelector<HTMLElement>(\n      \".fairmint-step-progress__pill\",\n    );\n    if (!list || !pill || list.scrollWidth <= list.clientWidth) return;\n    const listBox = list.getBoundingClientRect();\n    const pillBox = pill.getBoundingClientRect();\n    if (pillBox.left < listBox.left) {\n      list.scrollLeft -= listBox.left - pillBox.left;\n    } else if (pillBox.right > listBox.right) {\n      list.scrollLeft += pillBox.right - listBox.right;\n    }\n  }, [resolvedActiveStep]);\n\n  if (steps.length === 0) return null;\n\n  const isStatus = variant === \"status\";\n  const rootStyle = {\n    \"--fairmint-step-progress-brand\": brandColors.indigo,\n    // colorBorderDefault washes out on colorBgSurfaceSecondary; text-secondary clears 3:1.\n    \"--fairmint-step-progress-border\": fairmintVars.colorTextSecondary,\n    // Kept off the ring token: the ring carries the step number and needs 3:1, the\n    // connector is decorative and reads as a hairline between pills.\n    \"--fairmint-step-progress-connector\": fairmintVars.colorBorderDefault,\n    \"--fairmint-step-progress-text-primary\": fairmintVars.colorTextPrimary,\n    // Pending labels use primary ink; active hierarchy is weight + fill, not mute gray.\n    \"--fairmint-step-progress-text-secondary\": fairmintVars.colorTextPrimary,\n    // indigo[1] — surface-selected (indigo[0]) is too close to the secondary canvas.\n    \"--fairmint-step-progress-surface-selected\": fairmintVars.colorBgBrandSubtleHover,\n    \"--fairmint-step-progress-active-border\": indigoColors[3],\n    \"--fairmint-step-progress-active-indicator-text\": commonColors.white,\n    \"--fairmint-step-progress-complete-border\": indigoColors[3],\n    \"--fairmint-step-progress-complete-text\": fairmintVars.colorIconOnSurfaceSelected,\n    // The detail line is the one place that needs muted ink; pending labels above it stay primary.\n    \"--fairmint-step-progress-detail\": fairmintVars.colorTextSecondary,\n    \"--fairmint-step-progress-stopped\": fairmintVars.colorErrorSolid,\n    \"--fairmint-step-progress-stopped-text\": fairmintVars.colorErrorText,\n    // Status rows lay out as a grid; the last column never stretches, so it stays flush right.\n    \"--fairmint-step-progress-columns\":\n      steps.length > 1\n        ? `repeat(${steps.length - 1}, auto) minmax(min-content, max-content)`\n        : \"minmax(min-content, max-content)\",\n  };\n\n  return (\n    <Box\n      // A status track is not navigation: nothing in it goes anywhere.\n      component={isStatus ? \"div\" : \"nav\"}\n      role={isStatus ? \"group\" : undefined}\n      aria-label={ariaLabel}\n      className=\"fairmint-step-progress\"\n      data-orientation={orientation}\n      data-variant={variant}\n      style={rootStyle}\n    >\n      <ol ref={listRef} className=\"fairmint-step-progress__list\">\n        {steps.map((step, index) => {\n          const stepNumber = index + 1;\n          const status = getStepProgressStatus(step, stepNumber, resolvedActiveStep, variant);\n          const isInteractive = !isStatus && Boolean(onStepChange) && !step.disabled;\n          const detail = isStatus ? step.detail : undefined;\n          // The indicator icons are aria-hidden, so a status track says done and stopped in words.\n          const statusText = isStatus ? STATUS_TEXT[status] : undefined;\n          const pillContent = (\n            <>\n              <span className=\"fairmint-step-progress__indicator\" aria-hidden=\"true\">\n                {status === \"complete\" ? (\n                  <CheckIcon />\n                ) : status === \"stopped\" ? (\n                  <StopIcon />\n                ) : (\n                  stepNumber\n                )}\n              </span>\n              {detail ? (\n                <span className=\"fairmint-step-progress__text\">\n                  <span className=\"fairmint-step-progress__label\">{step.label}</span>\n                  <span className=\"fairmint-step-progress__detail\">{detail}</span>\n                </span>\n              ) : (\n                <span className=\"fairmint-step-progress__label\">{step.label}</span>\n              )}\n              {statusText ? (\n                <span className=\"fairmint-step-progress__status-text\">{statusText}</span>\n              ) : null}\n            </>\n          );\n\n          return (\n            <li key={`${stepNumber}-${step.label}`} className=\"fairmint-step-progress__item\">\n              {isInteractive ? (\n                <UnstyledButton\n                  type=\"button\"\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-interactive=\"true\"\n                  data-disabled=\"false\"\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-label={`Step ${stepNumber}: ${step.label}`}\n                  onClick={() => onStepChange?.(stepNumber)}\n                >\n                  {pillContent}\n                </UnstyledButton>\n              ) : (\n                <span\n                  className=\"fairmint-step-progress__pill\"\n                  data-state={status}\n                  data-disabled={step.disabled ? \"true\" : \"false\"}\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  aria-disabled={step.disabled || undefined}\n                  title={`Step ${stepNumber}: ${step.label}`}\n                >\n                  {pillContent}\n                </span>\n              )}\n              {index < steps.length - 1 ? (\n                <span\n                  className=\"fairmint-step-progress__connector\"\n                  data-state={status}\n                  aria-hidden=\"true\"\n                />\n              ) : null}\n            </li>\n          );\n        })}\n      </ol>\n    </Box>\n  );\n}\n\nexport const STEP_PROGRESS_MOBILE_BREAKPOINT = \"48em\";\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -100,7 +100,7 @@ export type { StepCardProps } from './components/generic/StepCard/StepCard';
 export { StepCard } from './components/generic/StepCard/StepCard';
 export type { StepFlowOrientation, StepFlowProps, StepFlowStep, } from './components/generic/StepFlow/StepFlow';
 export { STEP_FLOW_DEFAULT_MAX_WIDTH, StepFlow } from './components/generic/StepFlow/StepFlow';
-export type { StepProgressOrientation, StepProgressProps, StepProgressStep, StepProgressStepStatus, } from './components/generic/StepProgress/StepProgress';
+export type { StepProgressOrientation, StepProgressProps, StepProgressStep, StepProgressStepStatus, StepProgressVariant, } from './components/generic/StepProgress/StepProgress';
 export { getStepProgressStatus, STEP_PROGRESS_MOBILE_BREAKPOINT, StepProgress, } from './components/generic/StepProgress/StepProgress';
 export type { TablePaginationProps, TablePaginationRowsPerPageOption, } from './components/generic/TablePagination/TablePagination';
 export { TablePagination } from './components/generic/TablePagination/TablePagination';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/node_modules/@mantine/form/esm/hooks/use-form-status/use-form-status.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const index = require("../../../../../../_virtual/index3.cjs");
+const index = require("../../../../../../_virtual/index4.cjs");
 const getStatus = require("../../get-status/get-status.cjs");
 const clearListState = require("../../lists/clear-list-state.cjs");
 const getPath = require("../../paths/get-path.cjs");

package/dist/node_modules/@mantine/form/esm/hooks/use-form-status/use-form-status.js

@@ -1,5 +1,5 @@
 import { useState, useRef, useCallback } from "react";
-import isEqual from "../../../../../../_virtual/index3.js";
+import isEqual from "../../../../../../_virtual/index4.js";
 import { getStatus } from "../../get-status/get-status.js";
 import { clearListState } from "../../lists/clear-list-state.js";
 import { getPath } from "../../paths/get-path.js";

package/dist/node_modules/prop-types/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index$1 = require("../../_virtual/index4.cjs");
+const index$1 = require("../../_virtual/index3.cjs");
 const index = require("./node_modules/react-is/index.cjs");
 const factoryWithTypeCheckers = require("./factoryWithTypeCheckers.cjs");
 const factoryWithThrowingShims = require("./factoryWithThrowingShims.cjs");

package/dist/node_modules/prop-types/index.js

@@ -1,4 +1,4 @@
-import { __module as propTypes } from "../../_virtual/index4.js";
+import { __module as propTypes } from "../../_virtual/index3.js";
 import { __require as requireReactIs } from "./node_modules/react-is/index.js";
 import { __require as requireFactoryWithTypeCheckers } from "./factoryWithTypeCheckers.js";
 import { __require as requireFactoryWithThrowingShims } from "./factoryWithThrowingShims.js";

package/dist/styles.css

@@ -27,24 +27,31 @@
 }
 
 /*
- * Sized to its label, capped, and never grown to fill a share.
+ * Sized to its label, capped, and joined to the next step by a connector.
  *
  * Three things have to hold at once. A short step like "Sign" should not sit in a
- * pill stretched to a quarter of the row, so the item takes its content width
+ * pill stretched to a quarter of the row, so the pill takes its content width
  * rather than an equal share. A wordy step should not push its neighbours aside,
- * so `max-width` caps it and the label ellipsises inside. And once the steps stop
- * fitting, the row should run past the container for the list to scroll rather than
- * every pill squeezing down — which is what shrinking to `min-width: 0` used to do.
+ * so `max-width` caps the pill and the label ellipsises inside. And once the steps
+ * stop fitting, the row should run past the container for the list to scroll rather
+ * than every pill squeezing down, so neither the item nor the pill shrinks.
  *
- * The spare room goes *between* the pills via `justify-content` on the list, not
- * inside them.
+ * The spare room goes into the connectors *between* the pills, not inside them:
+ * every item but the last grows, and its connector takes the growth.
  */
 .fairmint-step-progress__item {
-  flex: 0 1 auto;
-  max-width: 14rem;
+  display: flex;
+  flex: 1 0 auto;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.fairmint-step-progress__item:last-child {
+  flex: none;
 }
 
 .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__item {
+  display: block;
   flex: none;
   width: 100%;
   max-width: none;
@@ -59,6 +66,8 @@
  * classes here settles it in any order.
  */
 .fairmint-step-progress .fairmint-step-progress__pill {
+  /* Positioned so the visually hidden labels inside stay inside the scrolling row. */
+  position: relative;
   box-sizing: border-box;
   display: flex;
   align-items: center;
@@ -78,10 +87,9 @@
 }
 
 /*
- * Centered, because a pill only has slack when something other than its content
- * set its width — and then that slack should sit evenly rather than all on the
- * right. In a row above the mobile breakpoint the item is sized to its content,
- * so this is a no-op; the `min-width` floor further down is what makes it show.
+ * Centered, so that if something other than its content sets a pill's width, the
+ * slack sits evenly rather than all on the right. Row pills are sized to their own
+ * content at every width, so normally this changes nothing.
  *
  * The vertical rail keeps the `flex-start` from the rule above: its pills stretch
  * to the rail width by design, and labels down a rail read as a left-aligned
@@ -91,7 +99,10 @@
  * ellipsises from the end rather than being clipped at both.
  */
 .fairmint-step-progress[data-orientation="horizontal"] .fairmint-step-progress__pill {
+  flex: none;
   justify-content: center;
+  width: auto;
+  max-width: 14rem;
 }
 
 .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__pill {
@@ -176,8 +187,19 @@
   white-space: normal;
 }
 
+/*
+ * A hairline from each step to the next, so the pills read as one sequence. The
+ * line leaving a completed step takes the completed indicator's border color, so
+ * progress shows along the line as well as on the pills.
+ */
 .fairmint-step-progress__connector {
-  display: none;
+  flex: 1 0 1rem;
+  height: 1px;
+  background: var(--fairmint-step-progress-connector, #e5e7eb);
+}
+
+.fairmint-step-progress__connector[data-state="complete"] {
+  background: var(--fairmint-step-progress-complete-border, #a5b4fc);
 }
 
 .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__connector {
@@ -185,16 +207,11 @@
   width: 1px;
   height: 0.875rem;
   margin-left: 1.3125rem;
-  background: var(--fairmint-step-progress-connector, #e5e7eb);
-}
-
-.fairmint-step-progress[data-orientation="vertical"]
-  .fairmint-step-progress__connector[data-state="complete"] {
-  background: var(--fairmint-step-progress-complete-border, #a5b4fc);
 }
 
 @media (max-width: 47.99em) {
-  .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__list {
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__list {
     flex-direction: row;
     gap: 0.5rem;
     margin-bottom: 1.5rem;
@@ -205,43 +222,331 @@
     padding-bottom: 0.25rem;
   }
 
-  .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__item {
-    flex: 0 0 auto;
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__item {
+    display: flex;
+    flex: 1 0 auto;
     width: auto;
-    max-width: 14rem;
+  }
+
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__item:last-child {
+    flex: none;
   }
 
   .fairmint-step-progress .fairmint-step-progress__pill {
     justify-content: center;
     width: auto;
-    min-width: 9rem;
   }
 
-  .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__pill {
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__pill {
+    flex: none;
+    max-width: 14rem;
     min-height: 2.125rem;
     padding: 0.5rem 0.75rem;
     border-radius: 999px;
   }
 
-  .fairmint-step-progress[data-orientation="vertical"]
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
     .fairmint-step-progress__pill[data-state="active"] {
     border-color: var(--fairmint-step-progress-active-border, #a5b4fc);
   }
 
-  .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__indicator {
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__indicator {
     flex-basis: 1.125rem;
     width: 1.125rem;
     height: 1.125rem;
   }
 
-  .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__label {
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__label {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
   }
 
-  .fairmint-step-progress[data-orientation="vertical"] .fairmint-step-progress__connector {
-    display: none;
+  .fairmint-step-progress[data-orientation="vertical"]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__connector {
+    width: auto;
+    height: 1px;
+    margin-left: 0;
+  }
+
+  /*
+   * On a phone only the current step keeps its label; the others shrink to their
+   * numbered indicator. Five labelled pills don't fit across a phone, and a row
+   * that scrolls with no cue reads as a shorter flow than it is. Numbers keep the
+   * whole sequence in view and still take a tap (36px tall, 30px wide). The label
+   * stays in the markup for assistive tech, and interactive pills carry it in
+   * their aria-label too. Spacing tightens so five steps fit at 375px; the row
+   * still scrolls if a flow has more steps than that. Navigation only: a status
+   * track shows every label and stacks into a rail instead.
+   */
+  .fairmint-step-progress[data-orientation]:where(:not([data-variant="status"]))
+  .fairmint-step-progress__list,
+  .fairmint-step-progress[data-orientation]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__item {
+    gap: 0.25rem;
+  }
+
+  .fairmint-step-progress[data-orientation]:where(:not([data-variant="status"]))
+    .fairmint-step-progress__connector {
+    flex-basis: 0.375rem;
+  }
+
+  .fairmint-step-progress:where(:not([data-variant="status"]))
+    .fairmint-step-progress__pill:not([data-state="active"]) {
+    min-width: 0;
+    padding: 0.5rem 0.3125rem;
+  }
+
+  .fairmint-step-progress:where(:not([data-variant="status"]))
+    .fairmint-step-progress__pill[data-state="active"] {
+    max-width: 10.5rem;
+  }
+
+  .fairmint-step-progress:where(:not([data-variant="status"]))
+    .fairmint-step-progress__pill:not([data-state="active"])
+    .fairmint-step-progress__label {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    margin: -1px;
+    padding: 0;
+    overflow: hidden;
+    clip: rect(0 0 0 0);
+    white-space: nowrap;
+    border: 0;
+  }
+}
+
+/* Read by screen readers, kept off screen: the status track's done/stopped icons are aria-hidden. */
+.fairmint-step-progress__status-text {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+/*
+ * Status variant: where a record is in its lifecycle, not where the user is in a
+ * flow. Same indicator, label, and connector as navigation, minus the pill — a
+ * filled pill reads as "click me" and nothing here is clickable. Position moves
+ * onto the indicator instead (an outlined brand ring with a soft halo), as the
+ * design-quality rules ask: selected borders sit on the indicator, not the row.
+ *
+ * The phone collapse above skips status tracks (`:where(:not([data-variant="status"]))`),
+ * and these rules out-rank the one mobile pill rule that still reaches them.
+ */
+
+/*
+ * The list scrolls, so it clips anything drawn outside it — including the current
+ * step's halo when the first step sits flush at the edge. Padding gives the halo
+ * room and the matching negative margin keeps the steps aligned with the card.
+ * No bottom margin: a status track sits in its own card, not above a StepCard.
+ */
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__list {
+  width: calc(100% + 0.5rem);
+  margin: -0.25rem;
+  padding: 0.25rem;
+}
+
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__pill,
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__pill[data-state="active"] {
+  justify-content: flex-start;
+  gap: 0.625rem;
+  min-height: 0;
+  padding: 0.25rem 0;
+  border-color: transparent;
+  border-radius: 0;
+  background: transparent;
+}
+
+/* Two lines of text beside it, so the indicator steps up a size from the navigation pill. */
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__indicator {
+  flex-basis: 1.5rem;
+  width: 1.5rem;
+  height: 1.5rem;
+  font-size: 0.75rem;
+}
+
+.fairmint-step-progress[data-variant="status"]
+  .fairmint-step-progress__pill[data-state="active"]
+  .fairmint-step-progress__indicator {
+  border-color: var(--fairmint-step-progress-brand, #6366f1);
+  background: transparent;
+  box-shadow: 0 0 0 3px var(--fairmint-step-progress-surface-selected, #e0e7ff);
+  /*
+   * The number takes the completed check's ink, not the brand: brand on the card is
+   * 4.47:1 light and 3.94:1 dark, under AA for text this small. The ring stays brand.
+   */
+  color: var(--fairmint-step-progress-complete-text, #4f46e5);
+}
+
+.fairmint-step-progress[data-variant="status"]
+  .fairmint-step-progress__pill[data-state="stopped"]
+  .fairmint-step-progress__indicator {
+  border-color: var(--fairmint-step-progress-stopped, #e5484d);
+  background: var(--fairmint-step-progress-stopped, #e5484d);
+  color: var(--fairmint-step-progress-active-indicator-text, #ffffff);
+}
+
+.fairmint-step-progress[data-variant="status"]
+  .fairmint-step-progress__pill[data-state="stopped"]
+  .fairmint-step-progress__label {
+  color: var(--fairmint-step-progress-stopped-text, #b42318);
+  font-weight: 600;
+}
+
+.fairmint-step-progress__text {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  gap: 0.125rem;
+}
+
+.fairmint-step-progress__detail {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--fairmint-step-progress-detail, #6c737f);
+  font-size: 0.75rem;
+  line-height: 1.3;
+}
+
+/*
+ * With no pill padding, the rail's connector lines up under the larger indicator's
+ * center: half the 1.5rem indicator, plus the pill's 1px border, less half the line.
+ */
+.fairmint-step-progress[data-variant="status"][data-orientation="vertical"]
+.fairmint-step-progress__connector {
+  height: 1rem;
+  margin-left: calc(0.75rem + 0.5px);
+}
+
+/*
+ * When a status row runs short of room, labels wrap inside their step instead of
+ * the row scrolling. A record page is read at a glance, and a track whose last step
+ * sits off the edge with no cue looks like it ends early. Labels never ellipsise —
+ * "Approved · hold placed" cut short loses the part that matters.
+ *
+ * A grid rather than flex, for which label wraps. Flex shrinks every step by the
+ * same proportion, so even "TA review" breaks onto two lines. Grid starts each step
+ * at its narrowest and hands out the room evenly until a step fits on one line, so
+ * short labels settle first and only the long ones wrap. The columns come from the
+ * component (`repeat(n - 1, auto)` plus a last column that never stretches), so the
+ * spare room past that goes into the connectors and the last step stays flush right.
+ *
+ * The track is a size container, for the rail fallback below. A size container
+ * ignores its content when its own width is worked out, so a status track fills its
+ * parent like a block and needs a parent with a set width. In a parent that sizes to
+ * its content (a centered flex item, a Group, inline-block, a popover) it collapses.
+ */
+.fairmint-step-progress[data-variant="status"] {
+  container: fairmint-step-progress-status / inline-size;
+}
+
+.fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+  .fairmint-step-progress__list {
+  display: grid;
+  grid-template-columns: var(--fairmint-step-progress-columns, none);
+  grid-auto-flow: column;
+  /* The base list's space-between would put the spare room in the gaps instead. */
+  justify-content: normal;
+}
+
+/* No clipping: it would cut the current step's halo and let a step shrink past its widest word. */
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__pill {
+  overflow: visible;
+}
+
+.fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+  .fairmint-step-progress__pill {
+  flex: 0 1 auto;
+  justify-content: flex-start;
+  min-width: 0;
+  max-width: none;
+}
+
+/*
+ * A step in the row is never narrower than its detail line, and isn't capped: a cap
+ * or a shrinking text column would let a long detail paint over the connector and the
+ * next step. Labels still wrap, so this only widens a step that has a long detail.
+ */
+.fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+.fairmint-step-progress__text {
+  min-width: auto;
+}
+
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__label {
+  overflow: visible;
+  text-overflow: clip;
+  white-space: normal;
+  text-wrap: balance;
+}
+
+/*
+ * In a row the detail holds its line, so a timestamp doesn't break mid-time. A rail
+ * has height to spare but not width, so there a long detail wraps instead.
+ */
+.fairmint-step-progress[data-variant="status"] .fairmint-step-progress__detail {
+  overflow: visible;
+  text-overflow: clip;
+}
+
+.fairmint-step-progress[data-variant="status"][data-orientation="vertical"]
+  .fairmint-step-progress__detail {
+  white-space: normal;
+}
+
+/*
+ * Below this the steps would wrap past two lines, so the track stacks into a rail.
+ * This keys off the track's own width, not the viewport: the same track can sit in
+ * a wide page or a narrow side column. The row's scroll stays as the last resort
+ * for a step count this width doesn't cover.
+ */
+@container fairmint-step-progress-status (max-width: 40rem) {
+  .fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+    .fairmint-step-progress__list {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+    overflow: visible;
+  }
+
+  .fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+    .fairmint-step-progress__item,
+  .fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+    .fairmint-step-progress__item:last-child {
+    display: block;
+    flex: none;
+    width: 100%;
+  }
+
+  .fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+    .fairmint-step-progress__text {
+    min-width: 0;
+  }
+
+  .fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+    .fairmint-step-progress__detail {
+    white-space: normal;
+  }
+
+  .fairmint-step-progress[data-variant="status"][data-orientation="horizontal"]
+    .fairmint-step-progress__connector {
+    display: block;
+    width: 1px;
+    height: 1rem;
+    margin-left: calc(0.75rem + 0.5px);
   }
 }
 .fairmint-step-flow {
@@ -9425,6 +9730,15 @@ fieldset:disabled .m_38aeed47:where(:not([data-inverted])),
 .fairmint-multiselect-pills-list > * {
   flex-shrink: 0;
 }
+
+/* Badges set overflow: hidden, so table layout can shrink them and clip the
+   label ("Earning fees" becomes "EARNING…"). Keep a badge inside a cell at
+   least as wide as its label; the table scrolls instead of clipping it.
+   Same rule as the ta-service workaround. */
+
+.mantine-Table-td .mantine-Badge-root {
+  min-width: max-content;
+}
 .fairmint-equity-ribbon {
   position: relative;
   width: 100%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fairmint/ui",
-  "version": "0.4.16",
+  "version": "0.4.18",
   "type": "module",
   "description": "Fairmint design system and UI component library",
   "license": "SEE LICENSE IN LICENSE",