@tetrascience-npm/tetrascience-react-ui 0.5.0-beta.65.1 → 0.5.0-beta.67.1

package/dist/components/composed/ProcessFlow/ProcessFlow.js

@@ -0,0 +1,543 @@
+import { jsx as s, jsxs as w, Fragment as V } from "react/jsx-runtime";
+import { CheckIcon as q, TriangleAlertIcon as U, LockIcon as W, DotIcon as Z } from "lucide-react";
+import { hasCustomStepLayout as z, positionStep as E, resolveConnections as N, getConnectionPath as j, getStepAccessibleLabel as F, STATUS_LABELS as K, getDescriptionVisibility as S } from "./ProcessFlow.utils.js";
+import { PROCESS_FLOW_STEP_STATUSES as ge } from "./ProcessFlow.utils.js";
+import { cn as f } from "../../../lib/utils.js";
+const Q = {
+  pending: "text-muted-foreground",
+  active: "text-foreground",
+  completed: "text-foreground",
+  error: "text-destructive",
+  disabled: "text-muted-foreground"
+}, $ = {
+  pending: "border-border bg-background text-muted-foreground",
+  active: "border-primary bg-primary text-primary-foreground",
+  completed: "border-positive bg-positive text-background",
+  error: "border-destructive bg-destructive text-background",
+  disabled: "border-border bg-muted text-muted-foreground"
+}, B = {
+  pending: "stroke-muted-foreground/35",
+  active: "stroke-primary",
+  completed: "stroke-positive",
+  error: "stroke-destructive",
+  disabled: "stroke-border"
+}, H = {
+  default: "11rem",
+  compact: "8.5rem"
+}, L = {
+  default: "8rem",
+  compact: "7rem"
+}, D = {
+  default: "5.5rem",
+  compact: "4.75rem"
+}, G = {
+  default: "2.75rem",
+  compact: "2.5rem"
+}, k = {
+  default: "7.5rem",
+  compact: "5.75rem"
+}, I = {
+  default: "6.5rem",
+  compact: "5rem"
+}, y = {
+  default: "4.5rem",
+  compact: "3.75rem"
+}, R = {
+  default: "3.5rem",
+  compact: "3rem"
+}, J = {
+  default: "1.25rem",
+  compact: "0.75rem"
+}, X = {
+  default: "0.875rem",
+  compact: "0.625rem"
+}, Y = {
+  default: "0.5rem",
+  compact: "0.375rem"
+}, ee = {
+  default: "0.375rem",
+  compact: "0.25rem"
+}, T = {
+  default: "2.5rem",
+  compact: "1.75rem"
+}, C = {
+  default: "2rem",
+  compact: "1.5rem"
+}, A = {
+  default: "1.5rem",
+  compact: "1.25rem"
+}, M = {
+  default: "1.25rem",
+  compact: "1.125rem"
+};
+function re(r, a) {
+  return r === "completed" ? /* @__PURE__ */ s(q, { "aria-hidden": "true" }) : r === "error" ? /* @__PURE__ */ s(U, { "aria-hidden": "true" }) : r === "disabled" ? /* @__PURE__ */ s(W, { "aria-hidden": "true" }) : r === "active" ? /* @__PURE__ */ s(Z, { "aria-hidden": "true" }) : a;
+}
+function te(r, a) {
+  return {
+    left: `calc(${(r + 0.5) / a * 100}% + (var(--process-flow-marker-size) / 2))`,
+    width: `calc(${1 / a * 100}% - var(--process-flow-marker-size))`
+  };
+}
+function oe(r, a) {
+  return {
+    height: `calc(${1 / a * 100}% - var(--process-flow-marker-size))`,
+    top: `calc(${(r + 0.5) / a * 100}% + (var(--process-flow-marker-size) / 2))`
+  };
+}
+function se() {
+  const r = "calc(((100% / var(--process-flow-count)) / 2) + (var(--process-flow-marker-size) / 2))";
+  return {
+    left: r,
+    right: r
+  };
+}
+function ae() {
+  const r = "calc(((100% / var(--process-flow-count)) / 2) + (var(--process-flow-marker-size) / 2))";
+  return {
+    bottom: r,
+    top: r
+  };
+}
+function le({ contentLayout: r, onStepSelect: a, isDisabled: l, size: t, status: n }) {
+  return f(
+    "flex w-full min-w-0 border-0 bg-transparent p-0 text-sm outline-none transition-all focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50",
+    r === "inline" && "flex-row items-center gap-3 text-left",
+    r === "stacked" && "flex-col items-center gap-2 text-center",
+    r === "anchored" && "relative h-full flex-col items-center justify-center text-center",
+    t === "compact" && (r === "inline" ? "gap-2" : "gap-1.5"),
+    a && !l && f("cursor-pointer hover:text-foreground", r !== "anchored" && "hover:-translate-y-px"),
+    a && l && "cursor-not-allowed",
+    Q[n]
+  );
+}
+function ie({
+  isSelected: r,
+  size: a,
+  status: l
+}) {
+  return f(
+    "flex size-[var(--process-flow-marker-size)] shrink-0 items-center justify-center rounded-full border text-xs font-semibold tabular-nums transition-colors [&_svg]:size-4",
+    a === "compact" && "text-[0.7rem] [&_svg]:size-3",
+    "shadow-[0_0_0_0.25rem_var(--background)]",
+    r && "ring-4 ring-primary/20",
+    $[l]
+  );
+}
+function ne({
+  layout: r,
+  isSelected: a,
+  status: l
+}) {
+  return f(
+    "block max-w-full truncate font-medium text-current",
+    r === "linear" && a && l === "completed" && "text-positive",
+    r === "linear" && a && l !== "completed" && l !== "error" && "text-primary"
+  );
+}
+function P({
+  item: r,
+  isSelected: a,
+  onStepSelect: l,
+  descriptionVisibility: t,
+  size: n,
+  layout: o,
+  contentLayout: m
+}) {
+  const { step: d, stepIndex: p, status: e } = r, c = e === "disabled" || d.selectable === !1, v = F(d, e, p + 1), u = t === "visible" ? "visible" : "auto", h = le({
+    contentLayout: m,
+    onStepSelect: l,
+    isDisabled: c,
+    size: n,
+    status: e
+  }), g = /* @__PURE__ */ s(
+    "span",
+    {
+      "aria-hidden": "true",
+      className: ie({
+        isSelected: a,
+        size: n,
+        status: e
+      }),
+      "data-slot": "process-flow-marker",
+      children: re(e, p + 1)
+    }
+  ), x = /* @__PURE__ */ w(
+    "span",
+    {
+      "data-slot": "process-flow-text",
+      "data-text-visibility": u,
+      className: f(
+        "flex min-w-0 flex-col gap-0.5",
+        m === "stacked" && "w-full items-center",
+        m === "anchored" && "pointer-events-none absolute left-1/2 top-[calc(50%+var(--process-flow-marker-size)/2+0.375rem)] w-max max-w-[calc(var(--process-flow-step-min-width)-0.5rem)] -translate-x-1/2 items-center px-1"
+      ),
+      children: [
+        /* @__PURE__ */ s("span", { className: ne({ layout: o, isSelected: a, status: e }), "data-slot": "process-flow-label", children: d.label }),
+        t !== "hidden" && d.description ? /* @__PURE__ */ s(
+          "span",
+          {
+            className: "line-clamp-2 text-xs leading-snug text-muted-foreground",
+            "data-description-visibility": t,
+            "data-slot": "process-flow-description",
+            children: d.description
+          }
+        ) : null,
+        /* @__PURE__ */ w("span", { className: "sr-only", children: [
+          "Status: ",
+          K[e]
+        ] })
+      ]
+    }
+  ), b = /* @__PURE__ */ w(V, { children: [
+    g,
+    x
+  ] });
+  return l ? /* @__PURE__ */ s(
+    "button",
+    {
+      type: "button",
+      "aria-current": e === "active" ? "step" : void 0,
+      "aria-invalid": e === "error" || void 0,
+      "aria-label": v,
+      "aria-pressed": a,
+      className: h,
+      "data-selected": a || void 0,
+      "data-status": e,
+      disabled: c,
+      onClick: (_) => l(d, {
+        nativeEvent: _,
+        status: e,
+        stepIndex: p
+      }),
+      children: b
+    }
+  ) : /* @__PURE__ */ s(
+    "div",
+    {
+      "aria-current": e === "active" ? "step" : void 0,
+      "aria-disabled": c || void 0,
+      "aria-invalid": e === "error" || void 0,
+      "aria-label": v,
+      className: h,
+      "data-selected": a || void 0,
+      "data-status": e,
+      children: b
+    }
+  );
+}
+function ce({
+  steps: r,
+  selectedStepId: a,
+  onStepSelect: l,
+  size: t,
+  showDescriptions: n
+}) {
+  const o = r.map((e, c) => E(e, c, "horizontal")), m = N(o), d = S(n), p = {
+    "--process-flow-count": r.length,
+    "--process-flow-step-min-width-base": H[t],
+    "--process-flow-step-min-width-responsive": L[t],
+    "--process-flow-step-min-width-squeezed": D[t],
+    "--process-flow-step-min-width-mini": G[t],
+    "--process-flow-row-min-height-base": k[t],
+    "--process-flow-row-min-height-responsive": I[t],
+    "--process-flow-row-min-height-squeezed": y[t],
+    "--process-flow-row-min-height-mini": R[t],
+    "--process-flow-marker-size-base": T[t],
+    "--process-flow-marker-size-responsive": C[t],
+    "--process-flow-marker-size-squeezed": A[t],
+    "--process-flow-marker-size-mini": M[t]
+  };
+  return /* @__PURE__ */ s("div", { className: "overflow-hidden px-3 py-4", "data-slot": "process-flow-viewport", style: p, children: /* @__PURE__ */ w(
+    "ol",
+    {
+      className: "relative grid min-w-0 min-h-[var(--process-flow-row-min-height)] list-none p-0",
+      "data-slot": "process-flow-list",
+      style: {
+        gridTemplateColumns: "repeat(var(--process-flow-count), minmax(0, 1fr))"
+      },
+      children: [
+        r.length > 1 ? /* @__PURE__ */ s(
+          "li",
+          {
+            "aria-hidden": "true",
+            className: "absolute top-[calc(var(--process-flow-marker-size)/2)] h-0.5 -translate-y-1/2 rounded-full bg-muted",
+            style: se()
+          }
+        ) : null,
+        m.map((e, c) => /* @__PURE__ */ s(
+          "li",
+          {
+            "aria-hidden": "true",
+            className: f(
+              "absolute top-[calc(var(--process-flow-marker-size)/2)] h-0.5 -translate-y-1/2 rounded-full transition-colors",
+              e.status === "completed" && "bg-positive",
+              e.status === "active" && "bg-primary",
+              e.status === "error" && "bg-destructive",
+              e.status === "pending" && "bg-muted",
+              e.status === "disabled" && "bg-border"
+            ),
+            style: te(c, r.length)
+          },
+          e.id
+        )),
+        o.map((e) => /* @__PURE__ */ s(
+          "li",
+          {
+            className: "relative z-[1] flex min-w-0 items-start justify-center",
+            "data-slot": "process-flow-item",
+            children: /* @__PURE__ */ s(
+              P,
+              {
+                item: e,
+                contentLayout: "stacked",
+                descriptionVisibility: d,
+                isSelected: a === e.step.id,
+                layout: "linear",
+                onStepSelect: l,
+                size: t
+              }
+            )
+          },
+          e.step.id
+        ))
+      ]
+    }
+  ) });
+}
+function de({
+  steps: r,
+  selectedStepId: a,
+  onStepSelect: l,
+  size: t,
+  showDescriptions: n
+}) {
+  const o = r.map((e, c) => E(e, c, "vertical")), m = N(o), d = S(n), p = {
+    "--process-flow-count": r.length,
+    "--process-flow-row-min-height-base": k[t],
+    "--process-flow-row-min-height-responsive": I[t],
+    "--process-flow-row-min-height-squeezed": y[t],
+    "--process-flow-row-min-height-mini": R[t],
+    "--process-flow-marker-size-base": T[t],
+    "--process-flow-marker-size-responsive": C[t],
+    "--process-flow-marker-size-squeezed": A[t],
+    "--process-flow-marker-size-mini": M[t]
+  };
+  return /* @__PURE__ */ s("div", { className: "overflow-x-auto px-3 py-3", "data-slot": "process-flow-viewport", style: p, children: /* @__PURE__ */ w(
+    "ol",
+    {
+      className: "relative grid min-h-[calc(var(--process-flow-count)*var(--process-flow-row-min-height))] min-w-72 list-none p-0",
+      "data-slot": "process-flow-list",
+      style: {
+        gridTemplateRows: "repeat(var(--process-flow-count), minmax(var(--process-flow-row-min-height), auto))"
+      },
+      children: [
+        r.length > 1 ? /* @__PURE__ */ s(
+          "li",
+          {
+            "aria-hidden": "true",
+            className: "absolute left-[calc(var(--process-flow-marker-size)/2)] w-0.5 -translate-x-1/2 rounded-full bg-muted",
+            style: ae()
+          }
+        ) : null,
+        m.map((e, c) => /* @__PURE__ */ s(
+          "li",
+          {
+            "aria-hidden": "true",
+            className: f(
+              "absolute left-[calc(var(--process-flow-marker-size)/2)] w-0.5 -translate-x-1/2 rounded-full transition-colors",
+              e.status === "completed" && "bg-positive",
+              e.status === "active" && "bg-primary",
+              e.status === "error" && "bg-destructive",
+              e.status === "pending" && "bg-muted",
+              e.status === "disabled" && "bg-border"
+            ),
+            style: oe(c, r.length)
+          },
+          e.id
+        )),
+        o.map((e) => /* @__PURE__ */ s("li", { className: "relative z-[1] flex min-w-0 items-center", "data-slot": "process-flow-item", children: /* @__PURE__ */ s(
+          P,
+          {
+            item: e,
+            contentLayout: "inline",
+            descriptionVisibility: d,
+            isSelected: a === e.step.id,
+            layout: "linear",
+            onStepSelect: l,
+            size: t
+          }
+        ) }, e.step.id))
+      ]
+    }
+  ) });
+}
+function we({
+  steps: r,
+  connections: a,
+  selectedStepId: l,
+  onStepSelect: t,
+  orientation: n = "horizontal",
+  size: o = "default",
+  showDescriptions: m,
+  className: d,
+  style: p,
+  "aria-label": e = "Process flow",
+  ...c
+}) {
+  if (r.length === 0)
+    return null;
+  const v = a || z(r) ? "branching" : "linear";
+  if (v === "linear" && n === "horizontal")
+    return /* @__PURE__ */ s(
+      "nav",
+      {
+        "aria-label": e,
+        className: f("w-full min-w-0", d),
+        "data-orientation": n,
+        "data-slot": "process-flow",
+        "data-size": o,
+        style: p,
+        ...c,
+        children: /* @__PURE__ */ s(
+          ce,
+          {
+            steps: r,
+            selectedStepId: l,
+            onStepSelect: t,
+            showDescriptions: m,
+            size: o
+          }
+        )
+      }
+    );
+  if (v === "linear" && n === "vertical")
+    return /* @__PURE__ */ s(
+      "nav",
+      {
+        "aria-label": e,
+        className: f("w-full min-w-0", d),
+        "data-orientation": n,
+        "data-slot": "process-flow",
+        "data-size": o,
+        style: p,
+        ...c,
+        children: /* @__PURE__ */ s(
+          de,
+          {
+            steps: r,
+            selectedStepId: l,
+            onStepSelect: t,
+            showDescriptions: m,
+            size: o
+          }
+        )
+      }
+    );
+  const u = r.map((i, O) => E(i, O, n)), h = Math.max(...u.map((i) => i.row + 1), 1), g = Math.max(...u.map((i) => i.column + 1), 1), x = N(u, a), b = S(m), _ = {
+    "--process-flow-columns": g,
+    "--process-flow-rows": h,
+    "--process-flow-step-min-width-base": H[o],
+    "--process-flow-step-min-width-responsive": L[o],
+    "--process-flow-step-min-width-squeezed": D[o],
+    "--process-flow-step-min-width-mini": G[o],
+    "--process-flow-row-min-height-base": k[o],
+    "--process-flow-row-min-height-responsive": I[o],
+    "--process-flow-row-min-height-squeezed": y[o],
+    "--process-flow-row-min-height-mini": R[o],
+    "--process-flow-gap-base": J[o],
+    "--process-flow-gap-responsive": X[o],
+    "--process-flow-gap-squeezed": Y[o],
+    "--process-flow-gap-mini": ee[o],
+    "--process-flow-marker-size-base": T[o],
+    "--process-flow-marker-size-responsive": C[o],
+    "--process-flow-marker-size-squeezed": A[o],
+    "--process-flow-marker-size-mini": M[o]
+  };
+  return /* @__PURE__ */ s(
+    "nav",
+    {
+      "aria-label": e,
+      className: f("w-full min-w-0", d),
+      "data-orientation": n,
+      "data-slot": "process-flow",
+      "data-size": o,
+      style: p,
+      ...c,
+      children: /* @__PURE__ */ s("div", { className: "overflow-x-auto py-2", "data-slot": "process-flow-viewport", style: _, children: /* @__PURE__ */ w(
+        "div",
+        {
+          className: "relative min-w-[calc(var(--process-flow-columns)*var(--process-flow-step-min-width))] min-h-[calc(var(--process-flow-rows)*var(--process-flow-row-min-height))]",
+          "data-slot": "process-flow-canvas",
+          children: [
+            /* @__PURE__ */ s(
+              "svg",
+              {
+                "aria-hidden": "true",
+                className: "pointer-events-none absolute inset-0 z-0 size-full overflow-visible",
+                preserveAspectRatio: "none",
+                viewBox: "0 0 100 100",
+                children: x.map((i) => /* @__PURE__ */ s(
+                  "path",
+                  {
+                    className: f(
+                      "fill-none stroke-2 transition-colors",
+                      B[i.status],
+                      i.status === "disabled" && "opacity-60"
+                    ),
+                    d: j(i, h, g),
+                    "data-status": i.status,
+                    strokeLinecap: "round",
+                    vectorEffect: "non-scaling-stroke"
+                  },
+                  i.id
+                ))
+              }
+            ),
+            /* @__PURE__ */ s(
+              "ol",
+              {
+                className: "relative z-[1] grid min-h-[inherit] list-none p-0",
+                "data-slot": "process-flow-list",
+                style: {
+                  gap: "var(--process-flow-gap)",
+                  gridTemplateColumns: "repeat(var(--process-flow-columns), minmax(var(--process-flow-step-min-width), 1fr))",
+                  gridTemplateRows: "repeat(var(--process-flow-rows), minmax(var(--process-flow-row-min-height), auto))"
+                },
+                children: u.map((i) => /* @__PURE__ */ s(
+                  "li",
+                  {
+                    className: "flex min-w-0 items-center justify-center",
+                    "data-slot": "process-flow-item",
+                    style: {
+                      gridColumn: i.column + 1,
+                      gridRow: i.row + 1
+                    },
+                    children: /* @__PURE__ */ s(
+                      P,
+                      {
+                        item: i,
+                        contentLayout: "anchored",
+                        descriptionVisibility: b,
+                        isSelected: l === i.step.id,
+                        layout: "branching",
+                        onStepSelect: t,
+                        size: o
+                      }
+                    )
+                  },
+                  i.step.id
+                ))
+              }
+            )
+          ]
+        }
+      ) })
+    }
+  );
+}
+export {
+  ge as PROCESS_FLOW_STEP_STATUSES,
+  we as ProcessFlow
+};
+//# sourceMappingURL=ProcessFlow.js.map

package/dist/components/composed/ProcessFlow/ProcessFlow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProcessFlow.js","sources":["../../../../src/components/composed/ProcessFlow/ProcessFlow.tsx"],"sourcesContent":["import { CheckIcon, DotIcon, LockIcon, TriangleAlertIcon } from \"lucide-react\";\n\nimport {\n  getConnectionPath,\n  getDescriptionVisibility,\n  getStepAccessibleLabel,\n  hasCustomStepLayout,\n  positionStep,\n  resolveConnections,\n  STATUS_LABELS,\n  type PositionedStep,\n  type ProcessFlowConnection,\n  type ProcessFlowDescriptionVisibility,\n  type ProcessFlowOrientation,\n  type ProcessFlowSize,\n  type ProcessFlowStep,\n  type ProcessFlowStepStatus,\n} from \"./ProcessFlow.utils\";\n\nimport type { ComponentPropsWithoutRef, CSSProperties, MouseEvent } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nexport { PROCESS_FLOW_STEP_STATUSES } from \"./ProcessFlow.utils\";\nexport type {\n  ProcessFlowConnection,\n  ProcessFlowOrientation,\n  ProcessFlowSize,\n  ProcessFlowStep,\n  ProcessFlowStepConfig,\n  ProcessFlowStepPosition,\n  ProcessFlowStepStatus,\n  ProcessStep,\n  ProcessStepStatus,\n} from \"./ProcessFlow.utils\";\n\ntype ProcessFlowLayout = \"linear\" | \"branching\";\ntype ProcessFlowStepContentLayout = \"stacked\" | \"inline\" | \"anchored\";\n\nexport interface ProcessFlowStepSelectDetails {\n  /** Zero-based index of the selected step in the steps prop. */\n  stepIndex: number;\n  /** Current visual status of the selected step. */\n  status: ProcessFlowStepStatus;\n  nativeEvent: MouseEvent<HTMLButtonElement>;\n}\n\n/**\n * Presentational process flow.\n *\n * ProcessFlow is fully controlled by props. It visualizes parent-owned workflow state and emits user selection through\n * onStepSelect. It intentionally does not own status transitions or fire completion/error side effects.\n */\nexport interface ProcessFlowProps extends Omit<ComponentPropsWithoutRef<\"nav\">, \"onSelect\"> {\n  /** Ordered list of steps to render. Each step controls its own visual status. */\n  steps: ProcessFlowStep[];\n  /** Optional explicit connections for branching/configurable flows. */\n  connections?: ProcessFlowConnection[];\n  /** Selected/viewed step id. This is separate from the active workflow status. */\n  selectedStepId?: string;\n  /** Called when a selectable step is clicked. Disabled and non-selectable steps do not call this. */\n  onStepSelect?: (step: ProcessFlowStep, details: ProcessFlowStepSelectDetails) => void;\n  orientation?: ProcessFlowOrientation;\n  size?: ProcessFlowSize;\n  /** Defaults to true. Set to false to hide step descriptions. */\n  showDescriptions?: boolean;\n}\n\ninterface StepControlClassOptions {\n  layout: ProcessFlowLayout;\n  contentLayout: ProcessFlowStepContentLayout;\n  onStepSelect?: ProcessFlowProps[\"onStepSelect\"];\n  isDisabled: boolean;\n  isSelected: boolean;\n  size: ProcessFlowSize;\n  status: ProcessFlowStepStatus;\n}\n\nconst LINEAR_STEP_STATUS_CLASSES: Record<ProcessFlowStepStatus, string> = {\n  pending: \"text-muted-foreground\",\n  active: \"text-foreground\",\n  completed: \"text-foreground\",\n  error: \"text-destructive\",\n  disabled: \"text-muted-foreground\",\n};\n\nconst MARKER_STATUS_CLASSES: Record<ProcessFlowStepStatus, string> = {\n  pending: \"border-border bg-background text-muted-foreground\",\n  active: \"border-primary bg-primary text-primary-foreground\",\n  completed: \"border-positive bg-positive text-background\",\n  error: \"border-destructive bg-destructive text-background\",\n  disabled: \"border-border bg-muted text-muted-foreground\",\n};\n\nconst CONNECTION_STATUS_CLASSES: Record<ProcessFlowStepStatus, string> = {\n  pending: \"stroke-muted-foreground/35\",\n  active: \"stroke-primary\",\n  completed: \"stroke-positive\",\n  error: \"stroke-destructive\",\n  disabled: \"stroke-border\",\n};\n\nconst STEP_MIN_WIDTH: Record<ProcessFlowSize, string> = {\n  default: \"11rem\",\n  compact: \"8.5rem\",\n};\n\nconst RESPONSIVE_STEP_MIN_WIDTH: Record<ProcessFlowSize, string> = {\n  default: \"8rem\",\n  compact: \"7rem\",\n};\n\nconst SQUEEZED_STEP_MIN_WIDTH: Record<ProcessFlowSize, string> = {\n  default: \"5.5rem\",\n  compact: \"4.75rem\",\n};\n\nconst MINI_STEP_MIN_WIDTH: Record<ProcessFlowSize, string> = {\n  default: \"2.75rem\",\n  compact: \"2.5rem\",\n};\n\nconst ROW_MIN_HEIGHT: Record<ProcessFlowSize, string> = {\n  default: \"7.5rem\",\n  compact: \"5.75rem\",\n};\n\nconst RESPONSIVE_ROW_MIN_HEIGHT: Record<ProcessFlowSize, string> = {\n  default: \"6.5rem\",\n  compact: \"5rem\",\n};\n\nconst SQUEEZED_ROW_MIN_HEIGHT: Record<ProcessFlowSize, string> = {\n  default: \"4.5rem\",\n  compact: \"3.75rem\",\n};\n\nconst MINI_ROW_MIN_HEIGHT: Record<ProcessFlowSize, string> = {\n  default: \"3.5rem\",\n  compact: \"3rem\",\n};\n\nconst GRID_GAP: Record<ProcessFlowSize, string> = {\n  default: \"1.25rem\",\n  compact: \"0.75rem\",\n};\n\nconst RESPONSIVE_GRID_GAP: Record<ProcessFlowSize, string> = {\n  default: \"0.875rem\",\n  compact: \"0.625rem\",\n};\n\nconst SQUEEZED_GRID_GAP: Record<ProcessFlowSize, string> = {\n  default: \"0.5rem\",\n  compact: \"0.375rem\",\n};\n\nconst MINI_GRID_GAP: Record<ProcessFlowSize, string> = {\n  default: \"0.375rem\",\n  compact: \"0.25rem\",\n};\n\nconst LINEAR_MARKER_SIZE: Record<ProcessFlowSize, string> = {\n  default: \"2.5rem\",\n  compact: \"1.75rem\",\n};\n\nconst RESPONSIVE_LINEAR_MARKER_SIZE: Record<ProcessFlowSize, string> = {\n  default: \"2rem\",\n  compact: \"1.5rem\",\n};\n\nconst SQUEEZED_LINEAR_MARKER_SIZE: Record<ProcessFlowSize, string> = {\n  default: \"1.5rem\",\n  compact: \"1.25rem\",\n};\n\nconst MINI_LINEAR_MARKER_SIZE: Record<ProcessFlowSize, string> = {\n  default: \"1.25rem\",\n  compact: \"1.125rem\",\n};\n\nfunction getMarkerContent(status: ProcessFlowStepStatus, stepNumber: number) {\n  if (status === \"completed\") {\n    return <CheckIcon aria-hidden=\"true\" />;\n  }\n\n  if (status === \"error\") {\n    return <TriangleAlertIcon aria-hidden=\"true\" />;\n  }\n\n  if (status === \"disabled\") {\n    return <LockIcon aria-hidden=\"true\" />;\n  }\n\n  if (status === \"active\") {\n    return <DotIcon aria-hidden=\"true\" />;\n  }\n\n  return stepNumber;\n}\n\nfunction getLinearSegmentStyle(index: number, count: number): CSSProperties {\n  return {\n    left: `calc(${((index + 0.5) / count) * 100}% + (var(--process-flow-marker-size) / 2))`,\n    width: `calc(${(1 / count) * 100}% - var(--process-flow-marker-size))`,\n  };\n}\n\nfunction getVerticalSegmentStyle(index: number, count: number): CSSProperties {\n  return {\n    height: `calc(${(1 / count) * 100}% - var(--process-flow-marker-size))`,\n    top: `calc(${((index + 0.5) / count) * 100}% + (var(--process-flow-marker-size) / 2))`,\n  };\n}\n\nfunction getHorizontalRailStyle(): CSSProperties {\n  const inset = \"calc(((100% / var(--process-flow-count)) / 2) + (var(--process-flow-marker-size) / 2))\";\n\n  return {\n    left: inset,\n    right: inset,\n  };\n}\n\nfunction getVerticalRailStyle(): CSSProperties {\n  const inset = \"calc(((100% / var(--process-flow-count)) / 2) + (var(--process-flow-marker-size) / 2))\";\n\n  return {\n    bottom: inset,\n    top: inset,\n  };\n}\n\nfunction getStepControlClassName({ contentLayout, onStepSelect, isDisabled, size, status }: StepControlClassOptions) {\n  return cn(\n    \"flex w-full min-w-0 border-0 bg-transparent p-0 text-sm outline-none transition-all focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50\",\n    contentLayout === \"inline\" && \"flex-row items-center gap-3 text-left\",\n    contentLayout === \"stacked\" && \"flex-col items-center gap-2 text-center\",\n    contentLayout === \"anchored\" && \"relative h-full flex-col items-center justify-center text-center\",\n    size === \"compact\" && (contentLayout === \"inline\" ? \"gap-2\" : \"gap-1.5\"),\n    onStepSelect &&\n      !isDisabled &&\n      cn(\"cursor-pointer hover:text-foreground\", contentLayout !== \"anchored\" && \"hover:-translate-y-px\"),\n    onStepSelect && isDisabled && \"cursor-not-allowed\",\n    LINEAR_STEP_STATUS_CLASSES[status],\n  );\n}\n\nfunction getMarkerClassName({\n  isSelected,\n  size,\n  status,\n}: Pick<StepControlClassOptions, \"isSelected\" | \"size\" | \"status\">) {\n  return cn(\n    \"flex size-[var(--process-flow-marker-size)] shrink-0 items-center justify-center rounded-full border text-xs font-semibold tabular-nums transition-colors [&_svg]:size-4\",\n    size === \"compact\" && \"text-[0.7rem] [&_svg]:size-3\",\n    \"shadow-[0_0_0_0.25rem_var(--background)]\",\n    isSelected && \"ring-4 ring-primary/20\",\n    MARKER_STATUS_CLASSES[status],\n  );\n}\n\nfunction getLabelClassName({\n  layout,\n  isSelected,\n  status,\n}: Pick<StepControlClassOptions, \"layout\" | \"isSelected\" | \"status\">) {\n  return cn(\n    \"block max-w-full truncate font-medium text-current\",\n    layout === \"linear\" && isSelected && status === \"completed\" && \"text-positive\",\n    layout === \"linear\" && isSelected && status !== \"completed\" && status !== \"error\" && \"text-primary\",\n  );\n}\n\nfunction ProcessFlowStepControl({\n  item,\n  isSelected,\n  onStepSelect,\n  descriptionVisibility,\n  size,\n  layout,\n  contentLayout,\n}: {\n  item: PositionedStep;\n  isSelected: boolean;\n  onStepSelect?: ProcessFlowProps[\"onStepSelect\"];\n  descriptionVisibility: ProcessFlowDescriptionVisibility;\n  size: ProcessFlowSize;\n  layout: ProcessFlowLayout;\n  contentLayout: ProcessFlowStepContentLayout;\n}) {\n  const { step, stepIndex, status } = item;\n  const isDisabled = status === \"disabled\" || step.selectable === false;\n  const accessibleLabel = getStepAccessibleLabel(step, status, stepIndex + 1);\n  const textVisibility = descriptionVisibility === \"visible\" ? \"visible\" : \"auto\";\n  const controlClassName = getStepControlClassName({\n    layout,\n    contentLayout,\n    onStepSelect,\n    isDisabled,\n    isSelected,\n    size,\n    status,\n  });\n  const markerContent = (\n    <span\n      aria-hidden=\"true\"\n      className={getMarkerClassName({\n        isSelected,\n        size,\n        status,\n      })}\n      data-slot=\"process-flow-marker\"\n    >\n      {getMarkerContent(status, stepIndex + 1)}\n    </span>\n  );\n  const textContent = (\n    <span\n      data-slot=\"process-flow-text\"\n      data-text-visibility={textVisibility}\n      className={cn(\n        \"flex min-w-0 flex-col gap-0.5\",\n        contentLayout === \"stacked\" && \"w-full items-center\",\n        contentLayout === \"anchored\" &&\n          \"pointer-events-none absolute left-1/2 top-[calc(50%+var(--process-flow-marker-size)/2+0.375rem)] w-max max-w-[calc(var(--process-flow-step-min-width)-0.5rem)] -translate-x-1/2 items-center px-1\",\n      )}\n    >\n      <span className={getLabelClassName({ layout, isSelected, status })} data-slot=\"process-flow-label\">\n        {step.label}\n      </span>\n      {descriptionVisibility !== \"hidden\" && step.description ? (\n        <span\n          className=\"line-clamp-2 text-xs leading-snug text-muted-foreground\"\n          data-description-visibility={descriptionVisibility}\n          data-slot=\"process-flow-description\"\n        >\n          {step.description}\n        </span>\n      ) : null}\n      <span className=\"sr-only\">Status: {STATUS_LABELS[status]}</span>\n    </span>\n  );\n  const content = (\n    <>\n      {markerContent}\n      {textContent}\n    </>\n  );\n\n  if (!onStepSelect) {\n    return (\n      <div\n        aria-current={status === \"active\" ? \"step\" : undefined}\n        aria-disabled={isDisabled || undefined}\n        aria-invalid={status === \"error\" || undefined}\n        aria-label={accessibleLabel}\n        className={controlClassName}\n        data-selected={isSelected || undefined}\n        data-status={status}\n      >\n        {content}\n      </div>\n    );\n  }\n\n  return (\n    <button\n      type=\"button\"\n      aria-current={status === \"active\" ? \"step\" : undefined}\n      aria-invalid={status === \"error\" || undefined}\n      aria-label={accessibleLabel}\n      aria-pressed={isSelected}\n      className={controlClassName}\n      data-selected={isSelected || undefined}\n      data-status={status}\n      disabled={isDisabled}\n      onClick={(nativeEvent) =>\n        onStepSelect(step, {\n          nativeEvent,\n          status,\n          stepIndex,\n        })\n      }\n    >\n      {content}\n    </button>\n  );\n}\n\nfunction HorizontalProcessFlow({\n  steps,\n  selectedStepId,\n  onStepSelect,\n  size,\n  showDescriptions,\n}: Pick<ProcessFlowProps, \"steps\" | \"selectedStepId\" | \"onStepSelect\" | \"showDescriptions\"> & {\n  size: ProcessFlowSize;\n}) {\n  const positionedSteps = steps.map((step, index) => positionStep(step, index, \"horizontal\"));\n  const resolvedConnections = resolveConnections(positionedSteps);\n  const descriptionVisibility = getDescriptionVisibility(showDescriptions);\n  const flowStyle = {\n    \"--process-flow-count\": steps.length,\n    \"--process-flow-step-min-width-base\": STEP_MIN_WIDTH[size],\n    \"--process-flow-step-min-width-responsive\": RESPONSIVE_STEP_MIN_WIDTH[size],\n    \"--process-flow-step-min-width-squeezed\": SQUEEZED_STEP_MIN_WIDTH[size],\n    \"--process-flow-step-min-width-mini\": MINI_STEP_MIN_WIDTH[size],\n    \"--process-flow-row-min-height-base\": ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-responsive\": RESPONSIVE_ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-squeezed\": SQUEEZED_ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-mini\": MINI_ROW_MIN_HEIGHT[size],\n    \"--process-flow-marker-size-base\": LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-responsive\": RESPONSIVE_LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-squeezed\": SQUEEZED_LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-mini\": MINI_LINEAR_MARKER_SIZE[size],\n  } as CSSProperties;\n\n  return (\n    <div className=\"overflow-hidden px-3 py-4\" data-slot=\"process-flow-viewport\" style={flowStyle}>\n      <ol\n        className=\"relative grid min-w-0 min-h-[var(--process-flow-row-min-height)] list-none p-0\"\n        data-slot=\"process-flow-list\"\n        style={{\n          gridTemplateColumns: \"repeat(var(--process-flow-count), minmax(0, 1fr))\",\n        }}\n      >\n        {steps.length > 1 ? (\n          <li\n            aria-hidden=\"true\"\n            className=\"absolute top-[calc(var(--process-flow-marker-size)/2)] h-0.5 -translate-y-1/2 rounded-full bg-muted\"\n            style={getHorizontalRailStyle()}\n          />\n        ) : null}\n        {resolvedConnections.map((connection, index) => (\n          <li\n            key={connection.id}\n            aria-hidden=\"true\"\n            className={cn(\n              \"absolute top-[calc(var(--process-flow-marker-size)/2)] h-0.5 -translate-y-1/2 rounded-full transition-colors\",\n              connection.status === \"completed\" && \"bg-positive\",\n              connection.status === \"active\" && \"bg-primary\",\n              connection.status === \"error\" && \"bg-destructive\",\n              connection.status === \"pending\" && \"bg-muted\",\n              connection.status === \"disabled\" && \"bg-border\",\n            )}\n            style={getLinearSegmentStyle(index, steps.length)}\n          />\n        ))}\n        {positionedSteps.map((item) => (\n          <li\n            key={item.step.id}\n            className=\"relative z-[1] flex min-w-0 items-start justify-center\"\n            data-slot=\"process-flow-item\"\n          >\n            <ProcessFlowStepControl\n              item={item}\n              contentLayout=\"stacked\"\n              descriptionVisibility={descriptionVisibility}\n              isSelected={selectedStepId === item.step.id}\n              layout=\"linear\"\n              onStepSelect={onStepSelect}\n              size={size}\n            />\n          </li>\n        ))}\n      </ol>\n    </div>\n  );\n}\n\nfunction VerticalProcessFlow({\n  steps,\n  selectedStepId,\n  onStepSelect,\n  size,\n  showDescriptions,\n}: Pick<ProcessFlowProps, \"steps\" | \"selectedStepId\" | \"onStepSelect\" | \"showDescriptions\"> & {\n  size: ProcessFlowSize;\n}) {\n  const positionedSteps = steps.map((step, index) => positionStep(step, index, \"vertical\"));\n  const resolvedConnections = resolveConnections(positionedSteps);\n  const descriptionVisibility = getDescriptionVisibility(showDescriptions);\n  const flowStyle = {\n    \"--process-flow-count\": steps.length,\n    \"--process-flow-row-min-height-base\": ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-responsive\": RESPONSIVE_ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-squeezed\": SQUEEZED_ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-mini\": MINI_ROW_MIN_HEIGHT[size],\n    \"--process-flow-marker-size-base\": LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-responsive\": RESPONSIVE_LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-squeezed\": SQUEEZED_LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-mini\": MINI_LINEAR_MARKER_SIZE[size],\n  } as CSSProperties;\n\n  return (\n    <div className=\"overflow-x-auto px-3 py-3\" data-slot=\"process-flow-viewport\" style={flowStyle}>\n      <ol\n        className=\"relative grid min-h-[calc(var(--process-flow-count)*var(--process-flow-row-min-height))] min-w-72 list-none p-0\"\n        data-slot=\"process-flow-list\"\n        style={{\n          gridTemplateRows: \"repeat(var(--process-flow-count), minmax(var(--process-flow-row-min-height), auto))\",\n        }}\n      >\n        {steps.length > 1 ? (\n          <li\n            aria-hidden=\"true\"\n            className=\"absolute left-[calc(var(--process-flow-marker-size)/2)] w-0.5 -translate-x-1/2 rounded-full bg-muted\"\n            style={getVerticalRailStyle()}\n          />\n        ) : null}\n        {resolvedConnections.map((connection, index) => (\n          <li\n            key={connection.id}\n            aria-hidden=\"true\"\n            className={cn(\n              \"absolute left-[calc(var(--process-flow-marker-size)/2)] w-0.5 -translate-x-1/2 rounded-full transition-colors\",\n              connection.status === \"completed\" && \"bg-positive\",\n              connection.status === \"active\" && \"bg-primary\",\n              connection.status === \"error\" && \"bg-destructive\",\n              connection.status === \"pending\" && \"bg-muted\",\n              connection.status === \"disabled\" && \"bg-border\",\n            )}\n            style={getVerticalSegmentStyle(index, steps.length)}\n          />\n        ))}\n        {positionedSteps.map((item) => (\n          <li key={item.step.id} className=\"relative z-[1] flex min-w-0 items-center\" data-slot=\"process-flow-item\">\n            <ProcessFlowStepControl\n              item={item}\n              contentLayout=\"inline\"\n              descriptionVisibility={descriptionVisibility}\n              isSelected={selectedStepId === item.step.id}\n              layout=\"linear\"\n              onStepSelect={onStepSelect}\n              size={size}\n            />\n          </li>\n        ))}\n      </ol>\n    </div>\n  );\n}\n\nexport function ProcessFlow({\n  steps,\n  connections,\n  selectedStepId,\n  onStepSelect,\n  orientation = \"horizontal\",\n  size = \"default\",\n  showDescriptions,\n  className,\n  style,\n  \"aria-label\": ariaLabel = \"Process flow\",\n  ...props\n}: ProcessFlowProps) {\n  if (steps.length === 0) {\n    return null;\n  }\n\n  const layout: ProcessFlowLayout = connections || hasCustomStepLayout(steps) ? \"branching\" : \"linear\";\n\n  if (layout === \"linear\" && orientation === \"horizontal\") {\n    return (\n      <nav\n        aria-label={ariaLabel}\n        className={cn(\"w-full min-w-0\", className)}\n        data-orientation={orientation}\n        data-slot=\"process-flow\"\n        data-size={size}\n        style={style}\n        {...props}\n      >\n        <HorizontalProcessFlow\n          steps={steps}\n          selectedStepId={selectedStepId}\n          onStepSelect={onStepSelect}\n          showDescriptions={showDescriptions}\n          size={size}\n        />\n      </nav>\n    );\n  }\n\n  if (layout === \"linear\" && orientation === \"vertical\") {\n    return (\n      <nav\n        aria-label={ariaLabel}\n        className={cn(\"w-full min-w-0\", className)}\n        data-orientation={orientation}\n        data-slot=\"process-flow\"\n        data-size={size}\n        style={style}\n        {...props}\n      >\n        <VerticalProcessFlow\n          steps={steps}\n          selectedStepId={selectedStepId}\n          onStepSelect={onStepSelect}\n          showDescriptions={showDescriptions}\n          size={size}\n        />\n      </nav>\n    );\n  }\n\n  const positionedSteps = steps.map((step, index) => positionStep(step, index, orientation));\n  const rowCount = Math.max(...positionedSteps.map((step) => step.row + 1), 1);\n  const columnCount = Math.max(...positionedSteps.map((step) => step.column + 1), 1);\n  const resolvedConnections = resolveConnections(positionedSteps, connections);\n  const descriptionVisibility = getDescriptionVisibility(showDescriptions);\n  const flowStyle = {\n    \"--process-flow-columns\": columnCount,\n    \"--process-flow-rows\": rowCount,\n    \"--process-flow-step-min-width-base\": STEP_MIN_WIDTH[size],\n    \"--process-flow-step-min-width-responsive\": RESPONSIVE_STEP_MIN_WIDTH[size],\n    \"--process-flow-step-min-width-squeezed\": SQUEEZED_STEP_MIN_WIDTH[size],\n    \"--process-flow-step-min-width-mini\": MINI_STEP_MIN_WIDTH[size],\n    \"--process-flow-row-min-height-base\": ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-responsive\": RESPONSIVE_ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-squeezed\": SQUEEZED_ROW_MIN_HEIGHT[size],\n    \"--process-flow-row-min-height-mini\": MINI_ROW_MIN_HEIGHT[size],\n    \"--process-flow-gap-base\": GRID_GAP[size],\n    \"--process-flow-gap-responsive\": RESPONSIVE_GRID_GAP[size],\n    \"--process-flow-gap-squeezed\": SQUEEZED_GRID_GAP[size],\n    \"--process-flow-gap-mini\": MINI_GRID_GAP[size],\n    \"--process-flow-marker-size-base\": LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-responsive\": RESPONSIVE_LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-squeezed\": SQUEEZED_LINEAR_MARKER_SIZE[size],\n    \"--process-flow-marker-size-mini\": MINI_LINEAR_MARKER_SIZE[size],\n  } as CSSProperties;\n\n  return (\n    <nav\n      aria-label={ariaLabel}\n      className={cn(\"w-full min-w-0\", className)}\n      data-orientation={orientation}\n      data-slot=\"process-flow\"\n      data-size={size}\n      style={style}\n      {...props}\n    >\n      <div className=\"overflow-x-auto py-2\" data-slot=\"process-flow-viewport\" style={flowStyle}>\n        <div\n          className=\"relative min-w-[calc(var(--process-flow-columns)*var(--process-flow-step-min-width))] min-h-[calc(var(--process-flow-rows)*var(--process-flow-row-min-height))]\"\n          data-slot=\"process-flow-canvas\"\n        >\n          <svg\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute inset-0 z-0 size-full overflow-visible\"\n            preserveAspectRatio=\"none\"\n            viewBox=\"0 0 100 100\"\n          >\n            {resolvedConnections.map((connection) => (\n              <path\n                key={connection.id}\n                className={cn(\n                  \"fill-none stroke-2 transition-colors\",\n                  CONNECTION_STATUS_CLASSES[connection.status],\n                  connection.status === \"disabled\" && \"opacity-60\",\n                )}\n                d={getConnectionPath(connection, rowCount, columnCount)}\n                data-status={connection.status}\n                strokeLinecap=\"round\"\n                vectorEffect=\"non-scaling-stroke\"\n              />\n            ))}\n          </svg>\n\n          <ol\n            className=\"relative z-[1] grid min-h-[inherit] list-none p-0\"\n            data-slot=\"process-flow-list\"\n            style={{\n              gap: \"var(--process-flow-gap)\",\n              gridTemplateColumns:\n                \"repeat(var(--process-flow-columns), minmax(var(--process-flow-step-min-width), 1fr))\",\n              gridTemplateRows: \"repeat(var(--process-flow-rows), minmax(var(--process-flow-row-min-height), auto))\",\n            }}\n          >\n            {positionedSteps.map((item) => (\n              <li\n                key={item.step.id}\n                className=\"flex min-w-0 items-center justify-center\"\n                data-slot=\"process-flow-item\"\n                style={{\n                  gridColumn: item.column + 1,\n                  gridRow: item.row + 1,\n                }}\n              >\n                <ProcessFlowStepControl\n                  item={item}\n                  contentLayout=\"anchored\"\n                  descriptionVisibility={descriptionVisibility}\n                  isSelected={selectedStepId === item.step.id}\n                  layout=\"branching\"\n                  onStepSelect={onStepSelect}\n                  size={size}\n                />\n              </li>\n            ))}\n          </ol>\n        </div>\n      </div>\n    </nav>\n  );\n}\n"],"names":["LINEAR_STEP_STATUS_CLASSES","MARKER_STATUS_CLASSES","CONNECTION_STATUS_CLASSES","STEP_MIN_WIDTH","RESPONSIVE_STEP_MIN_WIDTH","SQUEEZED_STEP_MIN_WIDTH","MINI_STEP_MIN_WIDTH","ROW_MIN_HEIGHT","RESPONSIVE_ROW_MIN_HEIGHT","SQUEEZED_ROW_MIN_HEIGHT","MINI_ROW_MIN_HEIGHT","GRID_GAP","RESPONSIVE_GRID_GAP","SQUEEZED_GRID_GAP","MINI_GRID_GAP","LINEAR_MARKER_SIZE","RESPONSIVE_LINEAR_MARKER_SIZE","SQUEEZED_LINEAR_MARKER_SIZE","MINI_LINEAR_MARKER_SIZE","getMarkerContent","status","stepNumber","jsx","CheckIcon","TriangleAlertIcon","LockIcon","DotIcon","getLinearSegmentStyle","index","count","getVerticalSegmentStyle","getHorizontalRailStyle","inset","getVerticalRailStyle","getStepControlClassName","contentLayout","onStepSelect","isDisabled","size","cn","getMarkerClassName","isSelected","getLabelClassName","layout","ProcessFlowStepControl","item","descriptionVisibility","step","stepIndex","accessibleLabel","getStepAccessibleLabel","textVisibility","controlClassName","markerContent","textContent","jsxs","STATUS_LABELS","content","Fragment","nativeEvent","HorizontalProcessFlow","steps","selectedStepId","showDescriptions","positionedSteps","positionStep","resolvedConnections","resolveConnections","getDescriptionVisibility","flowStyle","connection","VerticalProcessFlow","ProcessFlow","connections","orientation","className","style","ariaLabel","props","hasCustomStepLayout","rowCount","columnCount","getConnectionPath"],"mappings":"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"}

package/dist/components/composed/ProcessFlow/ProcessFlow.utils.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=["pending","active","completed","error","disabled"],u={pending:"Pending",active:"Active",completed:"Completed",error:"Error",disabled:"Disabled"};function S(e){return e===!0?"visible":e===!1?"hidden":"visible"}function l(e,t){return Math.max(Math.floor(e??t),0)}function d(e){return e.disabled?"disabled":e.status??"pending"}function f(e,t,i){return e.ariaLabel?e.ariaLabel:`${typeof e.label=="string"?e.label:`Step ${i}`}, ${u[t]}`}function b(e,t,i){const r=i==="vertical"?t:0,n=i==="vertical"?0:t;return{step:e,stepIndex:t,status:d(e),row:l(e.position?.row,r),column:l(e.position?.column,n)}}function c(e,t){return e==="error"||t==="error"?"error":e==="disabled"||t==="disabled"?"disabled":e==="completed"&&(t==="completed"||t==="active")?"completed":e==="active"||t==="active"?"active":"pending"}function m(e){return e.slice(0,-1).map((t,i)=>({from:t.step.id,to:e[i+1].step.id}))}function g(e,t){const i=new Map(e.map(r=>[r.step.id,r]));return(t??m(e)).flatMap((r,n)=>{const o=i.get(r.from),a=i.get(r.to);return!o||!a?[]:[{...r,id:r.id??`${r.from}-${r.to}-${n}`,fromStep:o,toStep:a,status:r.status??c(o.status,a.status)}]})}function s(e,t,i){return{x:(e.column+.5)/i*100,y:(e.row+.5)/t*100}}function $(e,t,i){const r=s(e.fromStep,t,i),n=s(e.toStep,t,i);if(e.fromStep.row===e.toStep.row||e.fromStep.column===e.toStep.column)return`M ${r.x} ${r.y} L ${n.x} ${n.y}`;const o=(r.x+n.x)/2;return`M ${r.x} ${r.y} C ${o} ${r.y}, ${o} ${n.y}, ${n.x} ${n.y}`}function v(e){return e.some(t=>t.position)}exports.PROCESS_FLOW_STEP_STATUSES=p;exports.STATUS_LABELS=u;exports.deriveConnectionStatus=c;exports.getConnectionPath=$;exports.getDescriptionVisibility=S;exports.getPoint=s;exports.getStepAccessibleLabel=f;exports.getStepStatus=d;exports.hasCustomStepLayout=v;exports.normalizeGridIndex=l;exports.positionStep=b;exports.resolveConnections=g;
+//# sourceMappingURL=ProcessFlow.utils.cjs.map

package/dist/components/composed/ProcessFlow/ProcessFlow.utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProcessFlow.utils.cjs","sources":["../../../../src/components/composed/ProcessFlow/ProcessFlow.utils.ts"],"sourcesContent":["import type { ReactNode } from \"react\";\n\n/**\n * Runtime list of the visual states supported by ProcessFlow steps.\n * Use this for controls, schemas, and forms that need to present the same status values the component understands.\n */\nexport const PROCESS_FLOW_STEP_STATUSES = [\"pending\", \"active\", \"completed\", \"error\", \"disabled\"] as const;\n\n/**\n * Visual state for a ProcessFlow step.\n *\n * The parent application owns this state. ProcessFlow renders the provided status and does not run workflow side effects.\n */\nexport type ProcessFlowStepStatus = (typeof PROCESS_FLOW_STEP_STATUSES)[number];\nexport type ProcessStepStatus = ProcessFlowStepStatus;\n\n/** Direction for linear process flows. Branching flows are configured with step positions and connections. */\nexport type ProcessFlowOrientation = \"horizontal\" | \"vertical\";\n\n/** Visual density of the process flow. */\nexport type ProcessFlowSize = \"default\" | \"compact\";\n\nexport type ProcessFlowDescriptionVisibility = \"auto\" | \"hidden\" | \"visible\";\n\nexport interface ProcessFlowStepPosition {\n  /** Zero-based row used when rendering a simple branching/configurable flow. */\n  row?: number;\n  /** Zero-based column used when rendering a simple branching/configurable flow. */\n  column?: number;\n}\n\n/**\n * Configurable step rendered by ProcessFlow.\n *\n * Keep workflow-specific behavior in the parent. A step config should describe what to render, not what to do when a\n * workflow completes or errors.\n */\nexport interface ProcessFlowStep {\n  /** Stable identifier used for selection and connections. */\n  id: string;\n  /** Visible step label. */\n  label: ReactNode;\n  /** Optional secondary text shown under or beside the label. */\n  description?: ReactNode;\n  /** Parent-controlled visual state. Defaults to \"pending\". */\n  status?: ProcessFlowStepStatus;\n  /** Accessible label for selectable steps. */\n  ariaLabel?: string;\n  /** Forces the step into the disabled visual/non-interactive state. */\n  disabled?: boolean;\n  /** Set to false when the step should render as non-navigable even when onStepSelect is provided. */\n  selectable?: boolean;\n  /** Optional grid position for simple branching/configurable layouts. */\n  position?: ProcessFlowStepPosition;\n}\n\nexport type ProcessFlowStepConfig = ProcessFlowStep;\nexport type ProcessStep = ProcessFlowStep;\n\n/** Connection between two steps in a branching/configurable flow. Linear flows derive connections automatically. */\nexport interface ProcessFlowConnection {\n  id?: string;\n  from: string;\n  to: string;\n  status?: ProcessFlowStepStatus;\n  ariaLabel?: string;\n}\n\nexport interface PositionedStep {\n  step: ProcessFlowStep;\n  stepIndex: number;\n  status: ProcessFlowStepStatus;\n  row: number;\n  column: number;\n}\n\nexport interface ResolvedConnection extends ProcessFlowConnection {\n  id: string;\n  fromStep: PositionedStep;\n  toStep: PositionedStep;\n  status: ProcessFlowStepStatus;\n}\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport const STATUS_LABELS: Record<ProcessFlowStepStatus, string> = {\n  pending: \"Pending\",\n  active: \"Active\",\n  completed: \"Completed\",\n  error: \"Error\",\n  disabled: \"Disabled\",\n};\n\nexport function getDescriptionVisibility(showDescriptions?: boolean): ProcessFlowDescriptionVisibility {\n  if (showDescriptions === true) {\n    return \"visible\";\n  }\n\n  if (showDescriptions === false) {\n    return \"hidden\";\n  }\n\n  return \"visible\";\n}\n\nexport function normalizeGridIndex(value: number | undefined, fallback: number) {\n  return Math.max(Math.floor(value ?? fallback), 0);\n}\n\nexport function getStepStatus(step: ProcessFlowStep): ProcessFlowStepStatus {\n  if (step.disabled) {\n    return \"disabled\";\n  }\n\n  return step.status ?? \"pending\";\n}\n\nexport function getStepAccessibleLabel(step: ProcessFlowStep, status: ProcessFlowStepStatus, stepNumber: number) {\n  if (step.ariaLabel) {\n    return step.ariaLabel;\n  }\n\n  const label = typeof step.label === \"string\" ? step.label : `Step ${stepNumber}`;\n\n  return `${label}, ${STATUS_LABELS[status]}`;\n}\n\nexport function positionStep(\n  step: ProcessFlowStep,\n  index: number,\n  orientation: ProcessFlowOrientation,\n): PositionedStep {\n  const rowFallback = orientation === \"vertical\" ? index : 0;\n  const columnFallback = orientation === \"vertical\" ? 0 : index;\n\n  return {\n    step,\n    stepIndex: index,\n    status: getStepStatus(step),\n    row: normalizeGridIndex(step.position?.row, rowFallback),\n    column: normalizeGridIndex(step.position?.column, columnFallback),\n  };\n}\n\nexport function deriveConnectionStatus(\n  fromStatus: ProcessFlowStepStatus,\n  toStatus: ProcessFlowStepStatus,\n): ProcessFlowStepStatus {\n  if (fromStatus === \"error\" || toStatus === \"error\") {\n    return \"error\";\n  }\n\n  if (fromStatus === \"disabled\" || toStatus === \"disabled\") {\n    return \"disabled\";\n  }\n\n  if (fromStatus === \"completed\" && (toStatus === \"completed\" || toStatus === \"active\")) {\n    return \"completed\";\n  }\n\n  if (fromStatus === \"active\" || toStatus === \"active\") {\n    return \"active\";\n  }\n\n  return \"pending\";\n}\n\nfunction getLinearConnections(steps: PositionedStep[]): ProcessFlowConnection[] {\n  return steps.slice(0, -1).map((step, index) => ({\n    from: step.step.id,\n    to: steps[index + 1].step.id,\n  }));\n}\n\nexport function resolveConnections(steps: PositionedStep[], connections?: ProcessFlowConnection[]) {\n  const stepMap = new Map(steps.map((step) => [step.step.id, step]));\n\n  return (connections ?? getLinearConnections(steps)).flatMap((connection, index): ResolvedConnection[] => {\n    const fromStep = stepMap.get(connection.from);\n    const toStep = stepMap.get(connection.to);\n\n    if (!fromStep || !toStep) {\n      return [];\n    }\n\n    return [\n      {\n        ...connection,\n        id: connection.id ?? `${connection.from}-${connection.to}-${index}`,\n        fromStep,\n        toStep,\n        status: connection.status ?? deriveConnectionStatus(fromStep.status, toStep.status),\n      },\n    ];\n  });\n}\n\nexport function getPoint(step: PositionedStep, rowCount: number, columnCount: number): Point {\n  return {\n    x: ((step.column + 0.5) / columnCount) * 100,\n    y: ((step.row + 0.5) / rowCount) * 100,\n  };\n}\n\nexport function getConnectionPath(connection: ResolvedConnection, rowCount: number, columnCount: number) {\n  const start = getPoint(connection.fromStep, rowCount, columnCount);\n  const end = getPoint(connection.toStep, rowCount, columnCount);\n\n  if (connection.fromStep.row === connection.toStep.row || connection.fromStep.column === connection.toStep.column) {\n    return `M ${start.x} ${start.y} L ${end.x} ${end.y}`;\n  }\n\n  const midX = (start.x + end.x) / 2;\n\n  return `M ${start.x} ${start.y} C ${midX} ${start.y}, ${midX} ${end.y}, ${end.x} ${end.y}`;\n}\n\nexport function hasCustomStepLayout(steps: ProcessFlowStep[]) {\n  return steps.some((step) => step.position);\n}\n"],"names":["PROCESS_FLOW_STEP_STATUSES","STATUS_LABELS","getDescriptionVisibility","showDescriptions","normalizeGridIndex","value","fallback","getStepStatus","step","getStepAccessibleLabel","status","stepNumber","positionStep","index","orientation","rowFallback","columnFallback","deriveConnectionStatus","fromStatus","toStatus","getLinearConnections","steps","resolveConnections","connections","stepMap","connection","fromStep","toStep","getPoint","rowCount","columnCount","getConnectionPath","start","end","midX","hasCustomStepLayout"],"mappings":"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"}