@etus/ui 0.4.0-beta.2 → 0.4.0-beta.4

package/dist/chunk-MK6ID2HI.js

@@ -0,0 +1,532 @@
+import { cn } from './chunk-HRNDJU7D.js';
+import { Check, X } from 'lucide-react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var progressStepsVariants = cva("flex transition-all duration-200", {
+  defaultVariants: {
+    orientation: "horizontal",
+    size: "md",
+    variant: "default"
+  },
+  variants: {
+    orientation: {
+      horizontal: "flex-row items-start",
+      vertical: "flex-col"
+    },
+    size: {
+      lg: "",
+      md: "",
+      sm: ""
+    },
+    variant: {
+      bar: "",
+      default: "",
+      dot: "",
+      icon: "",
+      numbered: ""
+    }
+  }
+});
+var stepItemVariants = cva(
+  "relative flex min-w-0 transition-all duration-200",
+  {
+    compoundVariants: [
+      {
+        className: "flex-1 min-w-0",
+        orientation: "horizontal"
+      },
+      {
+        className: "w-full",
+        orientation: "vertical"
+      }
+    ],
+    defaultVariants: {
+      orientation: "horizontal",
+      size: "md"
+    },
+    variants: {
+      orientation: {
+        horizontal: "flex-col items-center",
+        vertical: "flex-row items-start gap-3"
+      },
+      size: {
+        lg: "",
+        md: "",
+        sm: ""
+      }
+    }
+  }
+);
+var stepCircleVariants = cva(
+  "relative z-10 flex shrink-0 items-center justify-center rounded-full font-medium transition-all duration-200",
+  {
+    compoundVariants: [
+      // Animated current step
+      {
+        animated: true,
+        className: "ring-4 ring-primary/20",
+        status: "current"
+      }
+    ],
+    defaultVariants: {
+      animated: false,
+      size: "md",
+      status: "upcoming",
+      variant: "default"
+    },
+    variants: {
+      animated: {
+        false: "",
+        true: ""
+      },
+      size: {
+        lg: "h-10 w-10 text-base",
+        md: "h-8 w-8 text-sm",
+        sm: "h-6 w-6 text-xs"
+      },
+      status: {
+        completed: "bg-primary text-primary-foreground",
+        current: "bg-primary text-primary-foreground",
+        error: "bg-destructive text-destructive-foreground",
+        skipped: "bg-muted text-muted-foreground line-through",
+        upcoming: "bg-muted text-muted-foreground"
+      },
+      variant: {
+        bar: "hidden",
+        default: "",
+        dot: "",
+        icon: "",
+        numbered: ""
+      }
+    }
+  }
+);
+var stepDotVariants = cva(
+  "relative z-10 shrink-0 rounded-full transition-all duration-200",
+  {
+    compoundVariants: [
+      {
+        animated: true,
+        className: "ring-4 ring-primary/20",
+        status: "current"
+      }
+    ],
+    defaultVariants: {
+      animated: false,
+      size: "md",
+      status: "upcoming"
+    },
+    variants: {
+      animated: {
+        false: "",
+        true: ""
+      },
+      size: {
+        lg: "h-4 w-4",
+        md: "h-3 w-3",
+        sm: "h-2 w-2"
+      },
+      status: {
+        completed: "bg-primary",
+        current: "bg-primary",
+        error: "bg-destructive",
+        skipped: "bg-muted",
+        upcoming: "bg-muted"
+      }
+    }
+  }
+);
+var stepConnectorHorizontalVariants = cva(
+  "absolute top-1/2 -translate-y-1/2 transition-all duration-200",
+  {
+    compoundVariants: [
+      // Dot variant connectors (thinner line)
+      {
+        className: "h-0.5",
+        variant: "dot"
+      },
+      // Bar variant uses the connector as the main element
+      {
+        className: "h-2 rounded-full",
+        variant: "bar"
+      }
+    ],
+    defaultVariants: {
+      size: "md",
+      status: "upcoming",
+      variant: "default"
+    },
+    variants: {
+      size: {
+        lg: "left-[calc(50%+var(--progress-steps-connector-offset-lg))] right-[calc(-50%+var(--progress-steps-connector-offset-lg))]",
+        md: "left-[calc(50%+var(--progress-steps-connector-offset-md))] right-[calc(-50%+var(--progress-steps-connector-offset-md))]",
+        sm: "left-[calc(50%+var(--progress-steps-connector-offset-sm))] right-[calc(-50%+var(--progress-steps-connector-offset-sm))]"
+      },
+      status: {
+        completed: "bg-primary",
+        current: "bg-primary/50",
+        error: "bg-destructive/50",
+        skipped: "bg-muted",
+        upcoming: "bg-muted"
+      },
+      variant: {
+        bar: "",
+        default: "h-0.5",
+        dot: "",
+        icon: "h-0.5",
+        numbered: "h-0.5"
+      }
+    }
+  }
+);
+var stepConnectorVerticalVariants = cva(
+  "absolute left-1/2 -translate-x-1/2 transition-all duration-200",
+  {
+    compoundVariants: [
+      // Bar variant
+      {
+        className: "w-2 rounded-full",
+        variant: "bar"
+      }
+    ],
+    defaultVariants: {
+      size: "md",
+      status: "upcoming",
+      variant: "default"
+    },
+    variants: {
+      size: {
+        lg: "left-5 top-12 h-[calc(100%-var(--progress-steps-connector-vertical-height-offset-lg))]",
+        md: "left-4 top-10 h-[calc(100%-var(--progress-steps-connector-vertical-height-offset-md))]",
+        sm: "left-3 top-8 h-[calc(100%-var(--progress-steps-connector-vertical-height-offset-sm))]"
+      },
+      status: {
+        completed: "bg-primary",
+        current: "bg-primary/50",
+        error: "bg-destructive/50",
+        skipped: "bg-muted",
+        upcoming: "bg-muted"
+      },
+      variant: {
+        bar: "",
+        default: "w-0.5",
+        dot: "w-0.5",
+        icon: "w-0.5",
+        numbered: "w-0.5"
+      }
+    }
+  }
+);
+var stepLabelVariants = cva("font-medium transition-colors", {
+  defaultVariants: {
+    size: "md",
+    status: "upcoming"
+  },
+  variants: {
+    size: {
+      lg: "text-base",
+      md: "text-sm",
+      sm: "text-xs"
+    },
+    status: {
+      completed: "text-foreground",
+      current: "text-foreground",
+      error: "text-destructive",
+      skipped: "text-muted-foreground line-through",
+      upcoming: "text-muted-foreground"
+    }
+  }
+});
+var stepDescriptionVariants = cva("transition-colors", {
+  defaultVariants: {
+    size: "md"
+  },
+  variants: {
+    size: {
+      lg: "text-sm text-muted-foreground",
+      md: "text-xs text-muted-foreground",
+      sm: "text-xs text-muted-foreground"
+    }
+  }
+});
+var stepBarSegmentVariants = cva(
+  "h-2 flex-1 rounded-full transition-all duration-200",
+  {
+    defaultVariants: {
+      status: "upcoming"
+    },
+    variants: {
+      status: {
+        completed: "bg-primary",
+        current: "bg-primary/70",
+        error: "bg-destructive",
+        skipped: "bg-muted",
+        upcoming: "bg-muted"
+      }
+    }
+  }
+);
+function computeStepStatus(step, index, currentStep) {
+  if (step.status) {
+    return step.status;
+  }
+  if (index < currentStep) {
+    return "completed";
+  }
+  if (index === currentStep) {
+    return "current";
+  }
+  return "upcoming";
+}
+function formatTimestamp(date) {
+  return date.toLocaleDateString(void 0, {
+    day: "numeric",
+    month: "short",
+    year: "numeric"
+  });
+}
+function StepMarkerContent({
+  index,
+  size = "md",
+  status,
+  step,
+  variant = "default"
+}) {
+  const iconSize = size === "sm" ? "h-3 w-3" : size === "lg" ? "h-5 w-5" : "h-4 w-4";
+  switch (variant) {
+    case "numbered":
+      if (status === "completed") {
+        return /* @__PURE__ */ jsx(Check, { className: iconSize });
+      }
+      if (status === "error") {
+        return /* @__PURE__ */ jsx(X, { className: iconSize });
+      }
+      return /* @__PURE__ */ jsx("span", { children: index + 1 });
+    case "icon":
+      if (step.icon) {
+        return /* @__PURE__ */ jsx("span", { className: cn("flex items-center justify-center", `[&>svg]:${iconSize}`), children: step.icon });
+      }
+      if (status === "completed") {
+        return /* @__PURE__ */ jsx(Check, { className: iconSize });
+      }
+      return /* @__PURE__ */ jsx("span", { children: index + 1 });
+    case "default":
+    default:
+      if (status === "completed") {
+        return /* @__PURE__ */ jsx(Check, { className: iconSize });
+      }
+      if (status === "error") {
+        return /* @__PURE__ */ jsx(X, { className: iconSize });
+      }
+      return null;
+  }
+}
+function StepItem({
+  animated = true,
+  index,
+  isLast = false,
+  orientation = "horizontal",
+  showConnector = true,
+  showDescription = false,
+  showLabel = true,
+  size = "md",
+  status,
+  step,
+  variant = "default"
+}) {
+  const isHorizontal = orientation === "horizontal";
+  const isDot = variant === "dot";
+  const isBar = variant === "bar";
+  const connectorStatus = status === "completed" ? "completed" : "upcoming";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-current": status === "current" ? "step" : void 0,
+      "aria-label": `${step.label}${status === "completed" ? " - Completed" : status === "current" ? " - Current" : status === "error" ? " - Error" : ""}`,
+      className: cn(stepItemVariants({ orientation, size })),
+      "data-slot": "progress-step",
+      "data-status": status,
+      role: "listitem",
+      children: [
+        isHorizontal && !isBar && /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-center", children: [
+          isDot ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: stepDotVariants({ animated, size, status }),
+              "data-slot": "progress-step-dot"
+            }
+          ) : /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: stepCircleVariants({ animated, size, status, variant }),
+              "data-slot": "progress-step-circle",
+              children: /* @__PURE__ */ jsx(
+                StepMarkerContent,
+                {
+                  index,
+                  size,
+                  status,
+                  step,
+                  variant
+                }
+              )
+            }
+          ),
+          showConnector && !isLast && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: stepConnectorHorizontalVariants({
+                size,
+                status: connectorStatus,
+                variant
+              }),
+              "aria-hidden": "true",
+              "data-slot": "progress-step-connector"
+            }
+          )
+        ] }),
+        !isHorizontal && !isBar && /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col items-center", children: [
+          isDot ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: stepDotVariants({ animated, size, status }),
+              "data-slot": "progress-step-dot"
+            }
+          ) : /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: stepCircleVariants({ animated, size, status, variant }),
+              "data-slot": "progress-step-circle",
+              children: /* @__PURE__ */ jsx(
+                StepMarkerContent,
+                {
+                  index,
+                  size,
+                  status,
+                  step,
+                  variant
+                }
+              )
+            }
+          ),
+          showConnector && !isLast && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                stepConnectorVerticalVariants({
+                  size,
+                  status: connectorStatus,
+                  variant
+                }),
+                "min-h-8"
+              ),
+              "aria-hidden": "true",
+              "data-slot": "progress-step-connector"
+            }
+          )
+        ] }),
+        isBar && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: stepBarSegmentVariants({ status }),
+            "data-slot": "progress-step-bar"
+          }
+        ),
+        (showLabel || showDescription) && !isBar && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "flex min-w-0 flex-col",
+              isHorizontal ? "mt-2 items-center text-center" : "flex-1"
+            ),
+            "data-slot": "progress-step-content",
+            children: [
+              showLabel && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(stepLabelVariants({ size, status }), "max-w-full truncate"),
+                  "data-slot": "progress-step-label",
+                  children: step.label
+                }
+              ),
+              showDescription && step.description && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: stepDescriptionVariants({ size }),
+                  "data-slot": "progress-step-description",
+                  children: step.description
+                }
+              ),
+              showDescription && step.timestamp && /* @__PURE__ */ jsx(
+                "time",
+                {
+                  className: cn(stepDescriptionVariants({ size }), "mt-0.5"),
+                  "data-slot": "progress-step-timestamp",
+                  dateTime: step.timestamp.toISOString(),
+                  children: formatTimestamp(step.timestamp)
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function ProgressSteps({
+  animated = true,
+  className,
+  currentStep = 0,
+  orientation = "horizontal",
+  showConnectors = true,
+  showDescriptions = false,
+  showLabels = true,
+  size = "md",
+  steps,
+  variant = "default",
+  ...props
+}) {
+  const isBar = variant === "bar";
+  const gapClass = orientation === "horizontal" ? size === "sm" ? "gap-2" : size === "lg" ? "gap-4" : "gap-3" : size === "sm" ? "gap-4" : size === "lg" ? "gap-8" : "gap-6";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        progressStepsVariants({ orientation, size, variant }),
+        isBar && "gap-1",
+        !isBar && gapClass,
+        className
+      ),
+      "aria-label": "Progress Steps",
+      "data-slot": "progress-steps",
+      "data-variant": variant,
+      role: "list",
+      ...props,
+      children: steps.map((step, index) => {
+        const status = computeStepStatus(step, index, currentStep);
+        return /* @__PURE__ */ jsx(
+          StepItem,
+          {
+            animated,
+            index,
+            isLast: index === steps.length - 1,
+            orientation,
+            showConnector: showConnectors,
+            showDescription: showDescriptions,
+            showLabel: showLabels,
+            size,
+            status,
+            step,
+            variant
+          },
+          step.id
+        );
+      })
+    }
+  );
+}
+
+export { ProgressSteps, progressStepsVariants, stepBarSegmentVariants, stepCircleVariants, stepConnectorHorizontalVariants, stepConnectorVerticalVariants, stepDescriptionVariants, stepDotVariants, stepItemVariants, stepLabelVariants };
+//# sourceMappingURL=chunk-MK6ID2HI.js.map
+//# sourceMappingURL=chunk-MK6ID2HI.js.map

package/dist/chunk-MK6ID2HI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/workflow/ProgressSteps/ProgressSteps.variants.ts","../src/components/workflow/ProgressSteps/ProgressSteps.tsx"],"names":[],"mappings":";;;;;AAMO,IAAM,qBAAA,GAAwB,IAAI,kCAAA,EAAoC;AAAA,EAC3E,eAAA,EAAiB;AAAA,IACf,WAAA,EAAa,YAAA;AAAA,IACb,IAAA,EAAM,IAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAAA,EACA,QAAA,EAAU;AAAA,IACR,WAAA,EAAa;AAAA,MACX,UAAA,EAAY,sBAAA;AAAA,MACZ,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,EAAA;AAAA,MACJ,EAAA,EAAI,EAAA;AAAA,MACJ,EAAA,EAAI;AAAA,KACN;AAAA,IACA,OAAA,EAAS;AAAA,MACP,GAAA,EAAK,EAAA;AAAA,MACL,OAAA,EAAS,EAAA;AAAA,MACT,GAAA,EAAK,EAAA;AAAA,MACL,IAAA,EAAM,EAAA;AAAA,MACN,QAAA,EAAU;AAAA;AACZ;AAEJ,CAAC;AAKM,IAAM,gBAAA,GAAmB,GAAA;AAAA,EAC9B,mDAAA;AAAA,EACA;AAAA,IACE,gBAAA,EAAkB;AAAA,MAChB;AAAA,QACE,SAAA,EAAW,gBAAA;AAAA,QACX,WAAA,EAAa;AAAA,OACf;AAAA,MACA;AAAA,QACE,SAAA,EAAW,QAAA;AAAA,QACX,WAAA,EAAa;AAAA;AACf,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,WAAA,EAAa,YAAA;AAAA,MACb,IAAA,EAAM;AAAA,KACR;AAAA,IACA,QAAA,EAAU;AAAA,MACR,WAAA,EAAa;AAAA,QACX,UAAA,EAAY,uBAAA;AAAA,QACZ,QAAA,EAAU;AAAA,OACZ;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,EAAA;AAAA,QACJ,EAAA,EAAI,EAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN;AACF;AAEJ;AAKO,IAAM,kBAAA,GAAqB,GAAA;AAAA,EAChC,8GAAA;AAAA,EACA;AAAA,IACE,gBAAA,EAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,QAAA,EAAU,IAAA;AAAA,QACV,SAAA,EAAW,wBAAA;AAAA,QACX,MAAA,EAAQ;AAAA;AACV,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,QAAA,EAAU,KAAA;AAAA,MACV,IAAA,EAAM,IAAA;AAAA,MACN,MAAA,EAAQ,UAAA;AAAA,MACR,OAAA,EAAS;AAAA,KACX;AAAA,IACA,QAAA,EAAU;AAAA,MACR,QAAA,EAAU;AAAA,QACR,KAAA,EAAO,EAAA;AAAA,QACP,IAAA,EAAM;AAAA,OACR;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,qBAAA;AAAA,QACJ,EAAA,EAAI,iBAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,SAAA,EAAW,oCAAA;AAAA,QACX,OAAA,EAAS,oCAAA;AAAA,QACT,KAAA,EAAO,4CAAA;AAAA,QACP,OAAA,EAAS,6CAAA;AAAA,QACT,QAAA,EAAU;AAAA,OACZ;AAAA,MACA,OAAA,EAAS;AAAA,QACP,GAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAS,EAAA;AAAA,QACT,GAAA,EAAK,EAAA;AAAA,QACL,IAAA,EAAM,EAAA;AAAA,QACN,QAAA,EAAU;AAAA;AACZ;AACF;AAEJ;AAKO,IAAM,eAAA,GAAkB,GAAA;AAAA,EAC7B,iEAAA;AAAA,EACA;AAAA,IACE,gBAAA,EAAkB;AAAA,MAChB;AAAA,QACE,QAAA,EAAU,IAAA;AAAA,QACV,SAAA,EAAW,wBAAA;AAAA,QACX,MAAA,EAAQ;AAAA;AACV,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,QAAA,EAAU,KAAA;AAAA,MACV,IAAA,EAAM,IAAA;AAAA,MACN,MAAA,EAAQ;AAAA,KACV;AAAA,IACA,QAAA,EAAU;AAAA,MACR,QAAA,EAAU;AAAA,QACR,KAAA,EAAO,EAAA;AAAA,QACP,IAAA,EAAM;AAAA,OACR;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,SAAA;AAAA,QACJ,EAAA,EAAI,SAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,SAAA,EAAW,YAAA;AAAA,QACX,OAAA,EAAS,YAAA;AAAA,QACT,KAAA,EAAO,gBAAA;AAAA,QACP,OAAA,EAAS,UAAA;AAAA,QACT,QAAA,EAAU;AAAA;AACZ;AACF;AAEJ;AAKO,IAAM,+BAAA,GAAkC,GAAA;AAAA,EAC7C,+DAAA;AAAA,EACA;AAAA,IACE,gBAAA,EAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,SAAA,EAAW,OAAA;AAAA,QACX,OAAA,EAAS;AAAA,OACX;AAAA;AAAA,MAEA;AAAA,QACE,SAAA,EAAW,kBAAA;AAAA,QACX,OAAA,EAAS;AAAA;AACX,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM,IAAA;AAAA,MACN,MAAA,EAAQ,UAAA;AAAA,MACR,OAAA,EAAS;AAAA,KACX;AAAA,IACA,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,yHAAA;AAAA,QACJ,EAAA,EAAI,yHAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,SAAA,EAAW,YAAA;AAAA,QACX,OAAA,EAAS,eAAA;AAAA,QACT,KAAA,EAAO,mBAAA;AAAA,QACP,OAAA,EAAS,UAAA;AAAA,QACT,QAAA,EAAU;AAAA,OACZ;AAAA,MACA,OAAA,EAAS;AAAA,QACP,GAAA,EAAK,EAAA;AAAA,QACL,OAAA,EAAS,OAAA;AAAA,QACT,GAAA,EAAK,EAAA;AAAA,QACL,IAAA,EAAM,OAAA;AAAA,QACN,QAAA,EAAU;AAAA;AACZ;AACF;AAEJ;AAKO,IAAM,6BAAA,GAAgC,GAAA;AAAA,EAC3C,gEAAA;AAAA,EACA;AAAA,IACE,gBAAA,EAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,SAAA,EAAW,kBAAA;AAAA,QACX,OAAA,EAAS;AAAA;AACX,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM,IAAA;AAAA,MACN,MAAA,EAAQ,UAAA;AAAA,MACR,OAAA,EAAS;AAAA,KACX;AAAA,IACA,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,wFAAA;AAAA,QACJ,EAAA,EAAI,wFAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,SAAA,EAAW,YAAA;AAAA,QACX,OAAA,EAAS,eAAA;AAAA,QACT,KAAA,EAAO,mBAAA;AAAA,QACP,OAAA,EAAS,UAAA;AAAA,QACT,QAAA,EAAU;AAAA,OACZ;AAAA,MACA,OAAA,EAAS;AAAA,QACP,GAAA,EAAK,EAAA;AAAA,QACL,OAAA,EAAS,OAAA;AAAA,QACT,GAAA,EAAK,OAAA;AAAA,QACL,IAAA,EAAM,OAAA;AAAA,QACN,QAAA,EAAU;AAAA;AACZ;AACF;AAEJ;AAKO,IAAM,iBAAA,GAAoB,IAAI,+BAAA,EAAiC;AAAA,EACpE,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM,IAAA;AAAA,IACN,MAAA,EAAQ;AAAA,GACV;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,WAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI;AAAA,KACN;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,SAAA,EAAW,iBAAA;AAAA,MACX,OAAA,EAAS,iBAAA;AAAA,MACT,KAAA,EAAO,kBAAA;AAAA,MACP,OAAA,EAAS,oCAAA;AAAA,MACT,QAAA,EAAU;AAAA;AACZ;AAEJ,CAAC;AAKM,IAAM,uBAAA,GAA0B,IAAI,mBAAA,EAAqB;AAAA,EAC9D,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,+BAAA;AAAA,MACJ,EAAA,EAAI,+BAAA;AAAA,MACJ,EAAA,EAAI;AAAA;AACN;AAEJ,CAAC;AAKM,IAAM,sBAAA,GAAyB,GAAA;AAAA,EACpC,qDAAA;AAAA,EACA;AAAA,IACE,eAAA,EAAiB;AAAA,MACf,MAAA,EAAQ;AAAA,KACV;AAAA,IACA,QAAA,EAAU;AAAA,MACR,MAAA,EAAQ;AAAA,QACN,SAAA,EAAW,YAAA;AAAA,QACX,OAAA,EAAS,eAAA;AAAA,QACT,KAAA,EAAO,gBAAA;AAAA,QACP,OAAA,EAAS,UAAA;AAAA,QACT,QAAA,EAAU;AAAA;AACZ;AACF;AAEJ;ACzRA,SAAS,iBAAA,CACP,IAAA,EACA,KAAA,EACA,WAAA,EAC4D;AAE5D,EAAA,IAAI,KAAK,MAAA,EAAQ;AACf,IAAA,OAAO,IAAA,CAAK,MAAA;AAAA,EACd;AAGA,EAAA,IAAI,QAAQ,WAAA,EAAa;AACvB,IAAA,OAAO,WAAA;AAAA,EACT;AACA,EAAA,IAAI,UAAU,WAAA,EAAa;AACzB,IAAA,OAAO,SAAA;AAAA,EACT;AACA,EAAA,OAAO,UAAA;AACT;AAKA,SAAS,gBAAgB,IAAA,EAAoB;AAC3C,EAAA,OAAO,IAAA,CAAK,mBAAmB,MAAA,EAAW;AAAA,IACxC,GAAA,EAAK,SAAA;AAAA,IACL,KAAA,EAAO,OAAA;AAAA,IACP,IAAA,EAAM;AAAA,GACP,CAAA;AACH;AAKA,SAAS,iBAAA,CAAkB;AAAA,EACzB,KAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,MAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA,GAAU;AACZ,CAAA,EAMG;AACD,EAAA,MAAM,WAAW,IAAA,KAAS,IAAA,GAAO,SAAA,GAAY,IAAA,KAAS,OAAO,SAAA,GAAY,SAAA;AAEzE,EAAA,QAAQ,OAAA;AAAS,IACf,KAAK,UAAA;AACH,MAAA,IAAI,WAAW,WAAA,EAAa;AAC1B,QAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,QAAA,EAAU,CAAA;AAAA,MACrC;AACA,MAAA,IAAI,WAAW,OAAA,EAAS;AACtB,QAAA,uBAAO,GAAA,CAAC,CAAA,EAAA,EAAE,SAAA,EAAW,QAAA,EAAU,CAAA;AAAA,MACjC;AACA,MAAA,uBAAO,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,KAAA,GAAQ,CAAA,EAAE,CAAA;AAAA,IAE1B,KAAK,MAAA;AACH,MAAA,IAAI,KAAK,IAAA,EAAM;AACb,QAAA,uBACE,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,EAAA,CAAG,kCAAA,EAAoC,WAAW,QAAQ,CAAA,CAAE,CAAA,EAC1E,QAAA,EAAA,IAAA,CAAK,IAAA,EACR,CAAA;AAAA,MAEJ;AAEA,MAAA,IAAI,WAAW,WAAA,EAAa;AAC1B,QAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,QAAA,EAAU,CAAA;AAAA,MACrC;AACA,MAAA,uBAAO,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,KAAA,GAAQ,CAAA,EAAE,CAAA;AAAA,IAE1B,KAAK,SAAA;AAAA,IACL;AAEE,MAAA,IAAI,WAAW,WAAA,EAAa;AAC1B,QAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,QAAA,EAAU,CAAA;AAAA,MACrC;AACA,MAAA,IAAI,WAAW,OAAA,EAAS;AACtB,QAAA,uBAAO,GAAA,CAAC,CAAA,EAAA,EAAE,SAAA,EAAW,QAAA,EAAU,CAAA;AAAA,MACjC;AACA,MAAA,OAAO,IAAA;AAAA;AAEb;AAKA,SAAS,QAAA,CAAS;AAAA,EAChB,QAAA,GAAW,IAAA;AAAA,EACX,KAAA;AAAA,EACA,MAAA,GAAS,KAAA;AAAA,EACT,WAAA,GAAc,YAAA;AAAA,EACd,aAAA,GAAgB,IAAA;AAAA,EAChB,eAAA,GAAkB,KAAA;AAAA,EAClB,SAAA,GAAY,IAAA;AAAA,EACZ,IAAA,GAAO,IAAA;AAAA,EACP,MAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA,GAAU;AACZ,CAAA,EAAkB;AAChB,EAAA,MAAM,eAAe,WAAA,KAAgB,YAAA;AACrC,EAAA,MAAM,QAAQ,OAAA,KAAY,KAAA;AAC1B,EAAA,MAAM,QAAQ,OAAA,KAAY,KAAA;AAG1B,EAAA,MAAM,eAAA,GAAkB,MAAA,KAAW,WAAA,GAAc,WAAA,GAAc,UAAA;AAE/D,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,cAAA,EAAc,MAAA,KAAW,SAAA,GAAY,MAAA,GAAS,MAAA;AAAA,MAC9C,YAAA,EAAY,CAAA,EAAG,IAAA,CAAK,KAAK,GAAG,MAAA,KAAW,WAAA,GAAc,cAAA,GAAiB,MAAA,KAAW,SAAA,GAAY,YAAA,GAAe,MAAA,KAAW,OAAA,GAAU,aAAa,EAAE,CAAA,CAAA;AAAA,MAChJ,WAAW,EAAA,CAAG,gBAAA,CAAiB,EAAE,WAAA,EAAa,IAAA,EAAM,CAAC,CAAA;AAAA,MACrD,WAAA,EAAU,eAAA;AAAA,MACV,aAAA,EAAa,MAAA;AAAA,MACb,IAAA,EAAK,UAAA;AAAA,MAGJ,QAAA,EAAA;AAAA,QAAA,YAAA,IAAgB,CAAC,KAAA,oBAChB,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,2CAAA,EAEZ,QAAA,EAAA;AAAA,UAAA,KAAA,mBACC,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAW,eAAA,CAAgB,EAAE,QAAA,EAAU,IAAA,EAAM,QAAQ,CAAA;AAAA,cACrD,WAAA,EAAU;AAAA;AAAA,WACZ,mBAEA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAW,kBAAA,CAAmB,EAAE,UAAU,IAAA,EAAM,MAAA,EAAQ,SAAS,CAAA;AAAA,cACjE,WAAA,EAAU,sBAAA;AAAA,cAEV,QAAA,kBAAA,GAAA;AAAA,gBAAC,iBAAA;AAAA,gBAAA;AAAA,kBACC,KAAA;AAAA,kBACA,IAAA;AAAA,kBACA,MAAA;AAAA,kBACA,IAAA;AAAA,kBACA;AAAA;AAAA;AACF;AAAA,WACF;AAAA,UAID,aAAA,IAAiB,CAAC,MAAA,oBACjB,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAW,+BAAA,CAAgC;AAAA,gBACzC,IAAA;AAAA,gBACA,MAAA,EAAQ,eAAA;AAAA,gBACR;AAAA,eACD,CAAA;AAAA,cACD,aAAA,EAAY,MAAA;AAAA,cACZ,WAAA,EAAU;AAAA;AAAA;AACZ,SAAA,EAEJ,CAAA;AAAA,QAID,CAAC,YAAA,IAAgB,CAAC,yBACjB,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,qCAAA,EAEZ,QAAA,EAAA;AAAA,UAAA,KAAA,mBACC,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAW,eAAA,CAAgB,EAAE,QAAA,EAAU,IAAA,EAAM,QAAQ,CAAA;AAAA,cACrD,WAAA,EAAU;AAAA;AAAA,WACZ,mBAEA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAW,kBAAA,CAAmB,EAAE,UAAU,IAAA,EAAM,MAAA,EAAQ,SAAS,CAAA;AAAA,cACjE,WAAA,EAAU,sBAAA;AAAA,cAEV,QAAA,kBAAA,GAAA;AAAA,gBAAC,iBAAA;AAAA,gBAAA;AAAA,kBACC,KAAA;AAAA,kBACA,IAAA;AAAA,kBACA,MAAA;AAAA,kBACA,IAAA;AAAA,kBACA;AAAA;AAAA;AACF;AAAA,WACF;AAAA,UAID,aAAA,IAAiB,CAAC,MAAA,oBACjB,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,6BAAA,CAA8B;AAAA,kBAC5B,IAAA;AAAA,kBACA,MAAA,EAAQ,eAAA;AAAA,kBACR;AAAA,iBACD,CAAA;AAAA,gBACD;AAAA,eACF;AAAA,cACA,aAAA,EAAY,MAAA;AAAA,cACZ,WAAA,EAAU;AAAA;AAAA;AACZ,SAAA,EAEJ,CAAA;AAAA,QAID,KAAA,oBACC,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,sBAAA,CAAuB,EAAE,MAAA,EAAQ,CAAA;AAAA,YAC5C,WAAA,EAAU;AAAA;AAAA,SACZ;AAAA,QAAA,CAIA,SAAA,IAAa,eAAA,KAAoB,CAAC,KAAA,oBAClC,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,EAAA;AAAA,cACT,uBAAA;AAAA,cACA,eAAe,+BAAA,GAAkC;AAAA,aACnD;AAAA,YACA,WAAA,EAAU,uBAAA;AAAA,YAET,QAAA,EAAA;AAAA,cAAA,SAAA,oBACC,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,SAAA,EAAW,GAAG,iBAAA,CAAkB,EAAE,MAAM,MAAA,EAAQ,GAAG,qBAAqB,CAAA;AAAA,kBACxE,WAAA,EAAU,qBAAA;AAAA,kBAET,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA,eACR;AAAA,cAED,eAAA,IAAmB,KAAK,WAAA,oBACvB,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,SAAA,EAAW,uBAAA,CAAwB,EAAE,IAAA,EAAM,CAAA;AAAA,kBAC3C,WAAA,EAAU,2BAAA;AAAA,kBAET,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA,eACR;AAAA,cAED,eAAA,IAAmB,KAAK,SAAA,oBACvB,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,WAAW,EAAA,CAAG,uBAAA,CAAwB,EAAE,IAAA,EAAM,GAAG,QAAQ,CAAA;AAAA,kBACzD,WAAA,EAAU,yBAAA;AAAA,kBACV,QAAA,EAAU,IAAA,CAAK,SAAA,CAAU,WAAA,EAAY;AAAA,kBAEpC,QAAA,EAAA,eAAA,CAAgB,KAAK,SAAS;AAAA;AAAA;AACjC;AAAA;AAAA;AAEJ;AAAA;AAAA,GAEJ;AAEJ;AAiBA,SAAS,aAAA,CAAc;AAAA,EACrB,QAAA,GAAW,IAAA;AAAA,EACX,SAAA;AAAA,EACA,WAAA,GAAc,CAAA;AAAA,EACd,WAAA,GAAc,YAAA;AAAA,EACd,cAAA,GAAiB,IAAA;AAAA,EACjB,gBAAA,GAAmB,KAAA;AAAA,EACnB,UAAA,GAAa,IAAA;AAAA,EACb,IAAA,GAAO,IAAA;AAAA,EACP,KAAA;AAAA,EACA,OAAA,GAAU,SAAA;AAAA,EACV,GAAG;AACL,CAAA,EAAuB;AACrB,EAAA,MAAM,QAAQ,OAAA,KAAY,KAAA;AAG1B,EAAA,MAAM,QAAA,GAAW,WAAA,KAAgB,YAAA,GAC7B,IAAA,KAAS,OACP,OAAA,GACA,IAAA,KAAS,IAAA,GACP,OAAA,GACA,UACJ,IAAA,KAAS,IAAA,GACP,OAAA,GACA,IAAA,KAAS,OACP,OAAA,GACA,OAAA;AAER,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,qBAAA,CAAsB,EAAE,WAAA,EAAa,IAAA,EAAM,SAAS,CAAA;AAAA,QACpD,KAAA,IAAS,OAAA;AAAA,QACT,CAAC,KAAA,IAAS,QAAA;AAAA,QACV;AAAA,OACF;AAAA,MACA,YAAA,EAAW,gBAAA;AAAA,MACX,WAAA,EAAU,gBAAA;AAAA,MACV,cAAA,EAAc,OAAA;AAAA,MACd,IAAA,EAAK,MAAA;AAAA,MACJ,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,KAAA,KAAU;AAC1B,QAAA,MAAM,MAAA,GAAS,iBAAA,CAAkB,IAAA,EAAM,KAAA,EAAO,WAAW,CAAA;AAEzD,QAAA,uBACE,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YAEC,QAAA;AAAA,YACA,KAAA;AAAA,YACA,MAAA,EAAQ,KAAA,KAAU,KAAA,CAAM,MAAA,GAAS,CAAA;AAAA,YACjC,WAAA;AAAA,YACA,aAAA,EAAe,cAAA;AAAA,YACf,eAAA,EAAiB,gBAAA;AAAA,YACjB,SAAA,EAAW,UAAA;AAAA,YACX,IAAA;AAAA,YACA,MAAA;AAAA,YACA,IAAA;AAAA,YACA;AAAA,WAAA;AAAA,UAXK,IAAA,CAAK;AAAA,SAYZ;AAAA,MAEJ,CAAC;AAAA;AAAA,GACH;AAEJ","file":"chunk-MK6ID2HI.js","sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string -- Tailwind classes are intentionally duplicated across variants */\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\n/**\n * ProgressSteps container variants\n */\nexport const progressStepsVariants = cva(\"flex transition-all duration-200\", {\n  defaultVariants: {\n    orientation: \"horizontal\",\n    size: \"md\",\n    variant: \"default\",\n  },\n  variants: {\n    orientation: {\n      horizontal: \"flex-row items-start\",\n      vertical: \"flex-col\",\n    },\n    size: {\n      lg: \"\",\n      md: \"\",\n      sm: \"\",\n    },\n    variant: {\n      bar: \"\",\n      default: \"\",\n      dot: \"\",\n      icon: \"\",\n      numbered: \"\",\n    },\n  },\n})\n\n/**\n * Step item container variants\n */\nexport const stepItemVariants = cva(\n  \"relative flex min-w-0 transition-all duration-200\",\n  {\n    compoundVariants: [\n      {\n        className: \"flex-1 min-w-0\",\n        orientation: \"horizontal\",\n      },\n      {\n        className: \"w-full\",\n        orientation: \"vertical\",\n      },\n    ],\n    defaultVariants: {\n      orientation: \"horizontal\",\n      size: \"md\",\n    },\n    variants: {\n      orientation: {\n        horizontal: \"flex-col items-center\",\n        vertical: \"flex-row items-start gap-3\",\n      },\n      size: {\n        lg: \"\",\n        md: \"\",\n        sm: \"\",\n      },\n    },\n  }\n)\n\n/**\n * Step circle/marker variants\n */\nexport const stepCircleVariants = cva(\n  \"relative z-10 flex shrink-0 items-center justify-center rounded-full font-medium transition-all duration-200\",\n  {\n    compoundVariants: [\n      // Animated current step\n      {\n        animated: true,\n        className: \"ring-4 ring-primary/20\",\n        status: \"current\",\n      },\n    ],\n    defaultVariants: {\n      animated: false,\n      size: \"md\",\n      status: \"upcoming\",\n      variant: \"default\",\n    },\n    variants: {\n      animated: {\n        false: \"\",\n        true: \"\",\n      },\n      size: {\n        lg: \"h-10 w-10 text-base\",\n        md: \"h-8 w-8 text-sm\",\n        sm: \"h-6 w-6 text-xs\",\n      },\n      status: {\n        completed: \"bg-primary text-primary-foreground\",\n        current: \"bg-primary text-primary-foreground\",\n        error: \"bg-destructive text-destructive-foreground\",\n        skipped: \"bg-muted text-muted-foreground line-through\",\n        upcoming: \"bg-muted text-muted-foreground\",\n      },\n      variant: {\n        bar: \"hidden\",\n        default: \"\",\n        dot: \"\",\n        icon: \"\",\n        numbered: \"\",\n      },\n    },\n  }\n)\n\n/**\n * Dot variant circle (smaller)\n */\nexport const stepDotVariants = cva(\n  \"relative z-10 shrink-0 rounded-full transition-all duration-200\",\n  {\n    compoundVariants: [\n      {\n        animated: true,\n        className: \"ring-4 ring-primary/20\",\n        status: \"current\",\n      },\n    ],\n    defaultVariants: {\n      animated: false,\n      size: \"md\",\n      status: \"upcoming\",\n    },\n    variants: {\n      animated: {\n        false: \"\",\n        true: \"\",\n      },\n      size: {\n        lg: \"h-4 w-4\",\n        md: \"h-3 w-3\",\n        sm: \"h-2 w-2\",\n      },\n      status: {\n        completed: \"bg-primary\",\n        current: \"bg-primary\",\n        error: \"bg-destructive\",\n        skipped: \"bg-muted\",\n        upcoming: \"bg-muted\",\n      },\n    },\n  }\n)\n\n/**\n * Connector line variants (horizontal)\n */\nexport const stepConnectorHorizontalVariants = cva(\n  \"absolute top-1/2 -translate-y-1/2 transition-all duration-200\",\n  {\n    compoundVariants: [\n      // Dot variant connectors (thinner line)\n      {\n        className: \"h-0.5\",\n        variant: \"dot\",\n      },\n      // Bar variant uses the connector as the main element\n      {\n        className: \"h-2 rounded-full\",\n        variant: \"bar\",\n      },\n    ],\n    defaultVariants: {\n      size: \"md\",\n      status: \"upcoming\",\n      variant: \"default\",\n    },\n    variants: {\n      size: {\n        lg: \"left-[calc(50%+var(--progress-steps-connector-offset-lg))] right-[calc(-50%+var(--progress-steps-connector-offset-lg))]\",\n        md: \"left-[calc(50%+var(--progress-steps-connector-offset-md))] right-[calc(-50%+var(--progress-steps-connector-offset-md))]\",\n        sm: \"left-[calc(50%+var(--progress-steps-connector-offset-sm))] right-[calc(-50%+var(--progress-steps-connector-offset-sm))]\",\n      },\n      status: {\n        completed: \"bg-primary\",\n        current: \"bg-primary/50\",\n        error: \"bg-destructive/50\",\n        skipped: \"bg-muted\",\n        upcoming: \"bg-muted\",\n      },\n      variant: {\n        bar: \"\",\n        default: \"h-0.5\",\n        dot: \"\",\n        icon: \"h-0.5\",\n        numbered: \"h-0.5\",\n      },\n    },\n  }\n)\n\n/**\n * Connector line variants (vertical)\n */\nexport const stepConnectorVerticalVariants = cva(\n  \"absolute left-1/2 -translate-x-1/2 transition-all duration-200\",\n  {\n    compoundVariants: [\n      // Bar variant\n      {\n        className: \"w-2 rounded-full\",\n        variant: \"bar\",\n      },\n    ],\n    defaultVariants: {\n      size: \"md\",\n      status: \"upcoming\",\n      variant: \"default\",\n    },\n    variants: {\n      size: {\n        lg: \"left-5 top-12 h-[calc(100%-var(--progress-steps-connector-vertical-height-offset-lg))]\",\n        md: \"left-4 top-10 h-[calc(100%-var(--progress-steps-connector-vertical-height-offset-md))]\",\n        sm: \"left-3 top-8 h-[calc(100%-var(--progress-steps-connector-vertical-height-offset-sm))]\",\n      },\n      status: {\n        completed: \"bg-primary\",\n        current: \"bg-primary/50\",\n        error: \"bg-destructive/50\",\n        skipped: \"bg-muted\",\n        upcoming: \"bg-muted\",\n      },\n      variant: {\n        bar: \"\",\n        default: \"w-0.5\",\n        dot: \"w-0.5\",\n        icon: \"w-0.5\",\n        numbered: \"w-0.5\",\n      },\n    },\n  }\n)\n\n/**\n * Step label variants\n */\nexport const stepLabelVariants = cva(\"font-medium transition-colors\", {\n  defaultVariants: {\n    size: \"md\",\n    status: \"upcoming\",\n  },\n  variants: {\n    size: {\n      lg: \"text-base\",\n      md: \"text-sm\",\n      sm: \"text-xs\",\n    },\n    status: {\n      completed: \"text-foreground\",\n      current: \"text-foreground\",\n      error: \"text-destructive\",\n      skipped: \"text-muted-foreground line-through\",\n      upcoming: \"text-muted-foreground\",\n    },\n  },\n})\n\n/**\n * Step description variants\n */\nexport const stepDescriptionVariants = cva(\"transition-colors\", {\n  defaultVariants: {\n    size: \"md\",\n  },\n  variants: {\n    size: {\n      lg: \"text-sm text-muted-foreground\",\n      md: \"text-xs text-muted-foreground\",\n      sm: \"text-xs text-muted-foreground\",\n    },\n  },\n})\n\n/**\n * Bar segment variants (for bar variant)\n */\nexport const stepBarSegmentVariants = cva(\n  \"h-2 flex-1 rounded-full transition-all duration-200\",\n  {\n    defaultVariants: {\n      status: \"upcoming\",\n    },\n    variants: {\n      status: {\n        completed: \"bg-primary\",\n        current: \"bg-primary/70\",\n        error: \"bg-destructive\",\n        skipped: \"bg-muted\",\n        upcoming: \"bg-muted\",\n      },\n    },\n  }\n)\n\n// Export variant prop types\nexport type ProgressStepsVariantProps = VariantProps<\n  typeof progressStepsVariants\n>\nexport type StepItemVariantProps = VariantProps<typeof stepItemVariants>\nexport type StepCircleVariantProps = VariantProps<typeof stepCircleVariants>\nexport type StepConnectorHorizontalVariantProps = VariantProps<\n  typeof stepConnectorHorizontalVariants\n>\nexport type StepConnectorVerticalVariantProps = VariantProps<\n  typeof stepConnectorVerticalVariants\n>\n","import type { ProgressStepsProps, Step, StepItemProps } from \"./ProgressSteps.types\"\n\nimport { Check, X } from \"lucide-react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  progressStepsVariants,\n  stepBarSegmentVariants,\n  stepCircleVariants,\n  stepConnectorHorizontalVariants,\n  stepConnectorVerticalVariants,\n  stepDescriptionVariants,\n  stepDotVariants,\n  stepItemVariants,\n  stepLabelVariants,\n} from \"./ProgressSteps.variants\"\n\n/**\n * Compute the status of a step based on its index and current step\n */\nfunction computeStepStatus(\n  step: Step,\n  index: number,\n  currentStep: number\n): \"completed\" | \"current\" | \"error\" | \"skipped\" | \"upcoming\" {\n  // If step has explicit status, use it\n  if (step.status) {\n    return step.status\n  }\n\n  // Auto-compute based on currentStep\n  if (index < currentStep) {\n    return \"completed\"\n  }\n  if (index === currentStep) {\n    return \"current\"\n  }\n  return \"upcoming\"\n}\n\n/**\n * Format a date to a human-readable string\n */\nfunction formatTimestamp(date: Date): string {\n  return date.toLocaleDateString(undefined, {\n    day: \"numeric\",\n    month: \"short\",\n    year: \"numeric\",\n  })\n}\n\n/**\n * Render the step marker content based on variant\n */\nfunction StepMarkerContent({\n  index,\n  size = \"md\",\n  status,\n  step,\n  variant = \"default\",\n}: {\n  index: number\n  size?: \"lg\" | \"md\" | \"sm\"\n  status: \"completed\" | \"current\" | \"error\" | \"skipped\" | \"upcoming\"\n  step: Step\n  variant?: \"bar\" | \"default\" | \"dot\" | \"icon\" | \"numbered\"\n}) {\n  const iconSize = size === \"sm\" ? \"h-3 w-3\" : size === \"lg\" ? \"h-5 w-5\" : \"h-4 w-4\"\n\n  switch (variant) {\n    case \"numbered\":\n      if (status === \"completed\") {\n        return <Check className={iconSize} />\n      }\n      if (status === \"error\") {\n        return <X className={iconSize} />\n      }\n      return <span>{index + 1}</span>\n\n    case \"icon\":\n      if (step.icon) {\n        return (\n          <span className={cn(\"flex items-center justify-center\", `[&>svg]:${iconSize}`)}>\n            {step.icon}\n          </span>\n        )\n      }\n      // Fallback to checkmark for completed, number otherwise\n      if (status === \"completed\") {\n        return <Check className={iconSize} />\n      }\n      return <span>{index + 1}</span>\n\n    case \"default\":\n    default:\n      // Default shows checkmark for completed, nothing otherwise\n      if (status === \"completed\") {\n        return <Check className={iconSize} />\n      }\n      if (status === \"error\") {\n        return <X className={iconSize} />\n      }\n      return null\n  }\n}\n\n/**\n * Single step item component\n */\nfunction StepItem({\n  animated = true,\n  index,\n  isLast = false,\n  orientation = \"horizontal\",\n  showConnector = true,\n  showDescription = false,\n  showLabel = true,\n  size = \"md\",\n  status,\n  step,\n  variant = \"default\",\n}: StepItemProps) {\n  const isHorizontal = orientation === \"horizontal\"\n  const isDot = variant === \"dot\"\n  const isBar = variant === \"bar\"\n\n  // Get the connector status (next step's status affects connector appearance)\n  const connectorStatus = status === \"completed\" ? \"completed\" : \"upcoming\"\n\n  return (\n    <div\n      aria-current={status === \"current\" ? \"step\" : undefined}\n      aria-label={`${step.label}${status === \"completed\" ? \" - Completed\" : status === \"current\" ? \" - Current\" : status === \"error\" ? \" - Error\" : \"\"}`}\n      className={cn(stepItemVariants({ orientation, size }))}\n      data-slot=\"progress-step\"\n      data-status={status}\n      role=\"listitem\"\n    >\n      {/* Circle/Marker wrapper for horizontal orientation */}\n      {isHorizontal && !isBar && (\n        <div className=\"relative flex items-center justify-center\">\n          {/* Circle or Dot */}\n          {isDot ? (\n            <div\n              className={stepDotVariants({ animated, size, status })}\n              data-slot=\"progress-step-dot\"\n            />\n          ) : (\n            <div\n              className={stepCircleVariants({ animated, size, status, variant })}\n              data-slot=\"progress-step-circle\"\n            >\n              <StepMarkerContent\n                index={index}\n                size={size}\n                status={status}\n                step={step}\n                variant={variant}\n              />\n            </div>\n          )}\n\n          {/* Horizontal Connector */}\n          {showConnector && !isLast && (\n            <div\n              className={stepConnectorHorizontalVariants({\n                size,\n                status: connectorStatus,\n                variant,\n              })}\n              aria-hidden=\"true\"\n              data-slot=\"progress-step-connector\"\n            />\n          )}\n        </div>\n      )}\n\n      {/* Vertical layout marker */}\n      {!isHorizontal && !isBar && (\n        <div className=\"relative flex flex-col items-center\">\n          {/* Circle or Dot */}\n          {isDot ? (\n            <div\n              className={stepDotVariants({ animated, size, status })}\n              data-slot=\"progress-step-dot\"\n            />\n          ) : (\n            <div\n              className={stepCircleVariants({ animated, size, status, variant })}\n              data-slot=\"progress-step-circle\"\n            >\n              <StepMarkerContent\n                index={index}\n                size={size}\n                status={status}\n                step={step}\n                variant={variant}\n              />\n            </div>\n          )}\n\n          {/* Vertical Connector */}\n          {showConnector && !isLast && (\n            <div\n              className={cn(\n                stepConnectorVerticalVariants({\n                  size,\n                  status: connectorStatus,\n                  variant,\n                }),\n                \"min-h-8\"\n              )}\n              aria-hidden=\"true\"\n              data-slot=\"progress-step-connector\"\n            />\n          )}\n        </div>\n      )}\n\n      {/* Bar variant segment */}\n      {isBar && (\n        <div\n          className={stepBarSegmentVariants({ status })}\n          data-slot=\"progress-step-bar\"\n        />\n      )}\n\n      {/* Labels and Description */}\n      {(showLabel || showDescription) && !isBar && (\n        <div\n          className={cn(\n            \"flex min-w-0 flex-col\",\n            isHorizontal ? \"mt-2 items-center text-center\" : \"flex-1\"\n          )}\n          data-slot=\"progress-step-content\"\n        >\n          {showLabel && (\n            <span\n              className={cn(stepLabelVariants({ size, status }), \"max-w-full truncate\")}\n              data-slot=\"progress-step-label\"\n            >\n              {step.label}\n            </span>\n          )}\n          {showDescription && step.description && (\n            <span\n              className={stepDescriptionVariants({ size })}\n              data-slot=\"progress-step-description\"\n            >\n              {step.description}\n            </span>\n          )}\n          {showDescription && step.timestamp && (\n            <time\n              className={cn(stepDescriptionVariants({ size }), \"mt-0.5\")}\n              data-slot=\"progress-step-timestamp\"\n              dateTime={step.timestamp.toISOString()}\n            >\n              {formatTimestamp(step.timestamp)}\n            </time>\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n\n/**\n * ProgressSteps component displays a sequence of steps in a process.\n *\n * @example\n * ```tsx\n * const steps = [\n *   { id: \"1\", label: \"Order Received\" },\n *   { id: \"2\", label: \"In Preparation\" },\n *   { id: \"3\", label: \"Shipped\" },\n *   { id: \"4\", label: \"Delivered\" },\n * ]\n *\n * <ProgressSteps steps={steps} currentStep={1} />\n * ```\n */\nfunction ProgressSteps({\n  animated = true,\n  className,\n  currentStep = 0,\n  orientation = \"horizontal\",\n  showConnectors = true,\n  showDescriptions = false,\n  showLabels = true,\n  size = \"md\",\n  steps,\n  variant = \"default\",\n  ...props\n}: ProgressStepsProps) {\n  const isBar = variant === \"bar\"\n\n  // Compute gap based on size and orientation\n  const gapClass = orientation === \"horizontal\"\n    ? size === \"sm\"\n      ? \"gap-2\"\n      : size === \"lg\"\n        ? \"gap-4\"\n        : \"gap-3\"\n    : size === \"sm\"\n      ? \"gap-4\"\n      : size === \"lg\"\n        ? \"gap-8\"\n        : \"gap-6\"\n\n  return (\n    <div\n      className={cn(\n        progressStepsVariants({ orientation, size, variant }),\n        isBar && \"gap-1\",\n        !isBar && gapClass,\n        className\n      )}\n      aria-label=\"Progress Steps\"\n      data-slot=\"progress-steps\"\n      data-variant={variant}\n      role=\"list\"\n      {...props}\n    >\n      {steps.map((step, index) => {\n        const status = computeStepStatus(step, index, currentStep)\n\n        return (\n          <StepItem\n            key={step.id}\n            animated={animated}\n            index={index}\n            isLast={index === steps.length - 1}\n            orientation={orientation}\n            showConnector={showConnectors}\n            showDescription={showDescriptions}\n            showLabel={showLabels}\n            size={size}\n            status={status}\n            step={step}\n            variant={variant}\n          />\n        )\n      })}\n    </div>\n  )\n}\n\nexport { ProgressSteps }\nexport type { ProgressStepsProps, Step }\n"]}