@mdigital_ui/ui 0.1.0

package/dist/chunk-MLDX3Z67.js

@@ -0,0 +1,470 @@
+import { cn } from './chunk-YNNAOXU5.js';
+import { cva } from 'class-variance-authority';
+import React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var stepCircleVariants = cva(
+  "rounded-full flex items-center justify-center font-medium transition-all",
+  {
+    variants: {
+      size: {
+        xs: "w-6 h-6 text-xs",
+        sm: "w-8 h-8 text-sm",
+        md: "w-10 h-10 text-base",
+        lg: "w-12 h-12 text-lg"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var stepDotVariants = cva("rounded-full transition-all", {
+  variants: {
+    size: {
+      xs: "w-2 h-2",
+      sm: "w-3 h-3",
+      md: "w-4 h-4",
+      lg: "w-5 h-5"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var stepLabelVariants = cva("font-medium", {
+  variants: {
+    size: {
+      xs: "text-xs",
+      sm: "text-sm",
+      md: "text-base",
+      lg: "text-lg"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var stepDescriptionVariants = cva("text-text-secondary", {
+  variants: {
+    size: {
+      xs: "text-xs",
+      sm: "text-xs",
+      md: "text-sm",
+      lg: "text-sm"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var connectorVariants = cva("bg-border", {
+  variants: {
+    size: {
+      xs: "h-0.5",
+      sm: "h-0.5",
+      md: "h-1",
+      lg: "h-1"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var getStepCircleClasses = (color, variant, state) => {
+  const isError = state === "error";
+  const isWait = state === "wait";
+  if (isError) {
+    if (variant === "solid")
+      return "bg-error text-error-foreground border-2 border-error";
+    if (variant === "soft")
+      return "bg-error/10 border-2 border-error/50 text-error";
+    return "bg-error/20 border-2 border-error text-error";
+  }
+  if (isWait) {
+    if (variant === "solid") {
+      const solidWaitClasses = {
+        default: "bg-border/50 text-text-secondary",
+        primary: "bg-primary/30 text-primary-foreground/50",
+        secondary: "bg-secondary/30 text-secondary-foreground/50",
+        accent: "bg-accent/30 text-accent-foreground/50",
+        success: "bg-success/30 text-success-foreground/50",
+        error: "bg-error/30 text-error-foreground/50",
+        warning: "bg-warning/30 text-warning-foreground/50",
+        info: "bg-info/30 text-info-foreground/50"
+      };
+      return solidWaitClasses[color];
+    }
+    if (variant === "soft") {
+      const softWaitClasses = {
+        default: "bg-surface/30 border-2 border-border/30 text-text-secondary",
+        primary: "bg-primary/5 border-2 border-primary/20 text-text-secondary",
+        secondary: "bg-secondary/5 border-2 border-secondary/20 text-text-secondary",
+        accent: "bg-accent/5 border-2 border-accent/20 text-text-secondary",
+        success: "bg-success/5 border-2 border-success/20 text-text-secondary",
+        error: "bg-error/5 border-2 border-error/20 text-text-secondary",
+        warning: "bg-warning/5 border-2 border-warning/20 text-text-secondary",
+        info: "bg-info/5 border-2 border-info/20 text-text-secondary"
+      };
+      return softWaitClasses[color];
+    }
+    const defaultWaitClasses = {
+      default: "bg-surface border-2 border-border/50 text-text-secondary",
+      primary: "bg-primary/5 border-2 border-primary/30 text-text-secondary",
+      secondary: "bg-secondary/5 border-2 border-secondary/30 text-text-secondary",
+      accent: "bg-accent/5 border-2 border-accent/30 text-text-secondary",
+      success: "bg-success/5 border-2 border-success/30 text-text-secondary",
+      error: "bg-error/5 border-2 border-error/30 text-text-secondary",
+      warning: "bg-warning/5 border-2 border-warning/30 text-text-secondary",
+      info: "bg-info/5 border-2 border-info/30 text-text-secondary"
+    };
+    return defaultWaitClasses[color];
+  }
+  if (variant === "solid") {
+    const solidActiveClasses = {
+      default: "bg-border text-text-primary border-2 border-border",
+      primary: "bg-primary text-primary-foreground border-2 border-primary",
+      secondary: "bg-secondary text-secondary-foreground border-2 border-secondary",
+      accent: "bg-accent text-accent-foreground border-2 border-accent",
+      success: "bg-success text-success-foreground border-2 border-success",
+      error: "bg-error text-error-foreground border-2 border-error",
+      warning: "bg-warning text-warning-foreground border-2 border-warning",
+      info: "bg-info text-info-foreground border-2 border-info"
+    };
+    return solidActiveClasses[color];
+  }
+  if (variant === "soft") {
+    const softActiveClasses = {
+      default: "bg-surface/50 border-2 border-border text-text-primary",
+      primary: "bg-primary/10 border-2 border-primary/50 text-primary",
+      secondary: "bg-secondary/10 border-2 border-secondary/50 text-secondary",
+      accent: "bg-accent/10 border-2 border-accent/50 text-accent",
+      success: "bg-success/10 border-2 border-success/50 text-success",
+      error: "bg-error/10 border-2 border-error/50 text-error",
+      warning: "bg-warning/10 border-2 border-warning/50 text-warning",
+      info: "bg-info/10 border-2 border-info/50 text-info"
+    };
+    return softActiveClasses[color];
+  }
+  const defaultActiveClasses = {
+    default: "bg-surface border-2 border-border text-text-primary",
+    primary: "bg-primary/20 border-2 border-primary text-primary",
+    secondary: "bg-secondary/20 border-2 border-secondary text-secondary",
+    accent: "bg-accent/20 border-2 border-accent text-accent",
+    success: "bg-success/20 border-2 border-success text-success",
+    error: "bg-error/20 border-2 border-error text-error",
+    warning: "bg-warning/20 border-2 border-warning text-warning",
+    info: "bg-info/20 border-2 border-info text-info"
+  };
+  return defaultActiveClasses[color];
+};
+var getConnectorClasses = (color, variant, isFinished) => {
+  if (!isFinished) return "bg-border/50";
+  if (variant === "soft") {
+    const softConnectorClasses = {
+      default: "bg-border/50",
+      primary: "bg-primary/50",
+      secondary: "bg-secondary/50",
+      accent: "bg-accent/50",
+      success: "bg-success/50",
+      error: "bg-error/50",
+      warning: "bg-warning/50",
+      info: "bg-info/50"
+    };
+    return softConnectorClasses[color];
+  }
+  const connectorClasses = {
+    default: "bg-border",
+    primary: "bg-primary",
+    secondary: "bg-secondary",
+    accent: "bg-accent",
+    success: "bg-success",
+    error: "bg-error",
+    warning: "bg-warning",
+    info: "bg-info"
+  };
+  return connectorClasses[color];
+};
+var Stepper = React.memo(
+  ({
+    steps,
+    currentStep,
+    color = "primary",
+    size = "md",
+    variant = "default",
+    orientation = "horizontal",
+    type = "numbered",
+    status,
+    onStepClick,
+    className
+  }) => {
+    const getStepState = (index, step) => {
+      if (step.status) return step.status;
+      if (index === currentStep && status === "error") return "error";
+      if (index < currentStep) return "finish";
+      if (index === currentStep) return status || "process";
+      return "wait";
+    };
+    const handleStepClick = (index, disabled) => {
+      if (disabled) return;
+      onStepClick?.(index);
+    };
+    if (orientation === "vertical") {
+      return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", className), children: steps.map((step, index) => {
+        const state = getStepState(index, step);
+        const isClickable = !step.disabled && onStepClick;
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center mr-4", children: [
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      stepCircleVariants({ size }),
+                      getStepCircleClasses(color, variant, state),
+                      isClickable && "cursor-pointer hover:scale-105",
+                      step.disabled && "opacity-50 cursor-not-allowed"
+                    ),
+                    onClick: () => handleStepClick(index, step.disabled),
+                    children: step.icon || index + 1
+                  }
+                ),
+                index < steps.length - 1 && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "w-0.5 flex-1 my-2",
+                      getConnectorClasses(color, variant, state === "finish")
+                    )
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: cn("pb-8", index === steps.length - 1 && "pb-0"),
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: cn(
+                          stepLabelVariants({ size }),
+                          state === "wait" ? "text-text-secondary" : "text-text-primary",
+                          state === "error" && "text-error"
+                        ),
+                        children: step.label
+                      }
+                    ),
+                    step.description && /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: cn(stepDescriptionVariants({ size }), "mt-1"),
+                        children: step.description
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          },
+          index
+        );
+      }) });
+    }
+    if (type === "dots") {
+      return /* @__PURE__ */ jsx("div", { className: cn("flex items-start", className), children: steps.map((step, index) => {
+        const state = getStepState(index, step);
+        const isClickable = !step.disabled && onStepClick;
+        const prevStep = steps[index - 1];
+        const prevState = index > 0 && prevStep ? getStepState(index - 1, prevStep) : "wait";
+        return /* @__PURE__ */ jsx(React.Fragment, { children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "flex flex-col items-center flex-1",
+              index === 0 && "items-start",
+              index === steps.length - 1 && "items-end"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center w-full", children: [
+                index > 0 && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "flex-1",
+                      connectorVariants({ size }),
+                      getConnectorClasses(
+                        color,
+                        variant,
+                        prevState === "finish"
+                      )
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      stepDotVariants({ size }),
+                      getStepCircleClasses(color, variant, state),
+                      isClickable && "cursor-pointer hover:scale-105",
+                      step.disabled && "opacity-50 cursor-not-allowed",
+                      "flex-shrink-0"
+                    ),
+                    onClick: () => handleStepClick(index, step.disabled)
+                  }
+                ),
+                index < steps.length - 1 && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "flex-1",
+                      connectorVariants({ size }),
+                      getConnectorClasses(
+                        color,
+                        variant,
+                        state === "finish"
+                      )
+                    )
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: cn(
+                    "mt-2 px-2",
+                    index === 0 && "text-left",
+                    index === steps.length - 1 && "text-right",
+                    index > 0 && index < steps.length - 1 && "text-center"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: cn(
+                          stepLabelVariants({ size }),
+                          state === "wait" ? "text-text-secondary" : "text-text-primary",
+                          state === "error" && "text-error"
+                        ),
+                        children: step.label
+                      }
+                    ),
+                    step.description && /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: cn(
+                          stepDescriptionVariants({ size }),
+                          "mt-1"
+                        ),
+                        children: step.description
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ) }, index);
+      }) });
+    }
+    return /* @__PURE__ */ jsx("div", { className: cn("flex items-start", className), children: steps.map((step, index) => {
+      const state = getStepState(index, step);
+      const isClickable = !step.disabled && onStepClick;
+      const prevStep = steps[index - 1];
+      const prevState = index > 0 && prevStep ? getStepState(index - 1, prevStep) : "wait";
+      return /* @__PURE__ */ jsx(React.Fragment, { children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex flex-col items-center flex-1",
+            index === 0 && "items-start",
+            index === steps.length - 1 && "items-end"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center w-full", children: [
+              index > 0 && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex-1",
+                    connectorVariants({ size }),
+                    getConnectorClasses(
+                      color,
+                      variant,
+                      prevState === "finish"
+                    )
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    stepCircleVariants({ size }),
+                    getStepCircleClasses(color, variant, state),
+                    isClickable && "cursor-pointer hover:scale-105",
+                    step.disabled && "opacity-50 cursor-not-allowed",
+                    "flex-shrink-0"
+                  ),
+                  onClick: () => handleStepClick(index, step.disabled),
+                  children: step.icon || index + 1
+                }
+              ),
+              index < steps.length - 1 && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex-1",
+                    connectorVariants({ size }),
+                    getConnectorClasses(color, variant, state === "finish")
+                  )
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn(
+                  "mt-2 px-2",
+                  index === 0 && "text-left",
+                  index === steps.length - 1 && "text-right",
+                  index > 0 && index < steps.length - 1 && "text-center"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: cn(
+                        stepLabelVariants({ size }),
+                        state === "wait" ? "text-text-secondary" : "text-text-primary",
+                        state === "error" && "text-error"
+                      ),
+                      children: step.label
+                    }
+                  ),
+                  step.description && /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: cn(stepDescriptionVariants({ size }), "mt-1"),
+                      children: step.description
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      ) }, index);
+    }) });
+  }
+);
+Stepper.displayName = "Stepper";
+var stepper_default = Stepper;
+
+export { stepper_default };
+//# sourceMappingURL=chunk-MLDX3Z67.js.map
+//# sourceMappingURL=chunk-MLDX3Z67.js.map

package/dist/chunk-MLDX3Z67.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/stepper/index.tsx"],"names":[],"mappings":"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","file":"chunk-MLDX3Z67.js","sourcesContent":["import { cva } from 'class-variance-authority'\nimport React from 'react'\n\nimport { cn } from '../utils'\nimport type {\n  StepItem,\n  StepperColor,\n  StepperProps,\n  StepperVariant,\n} from './types'\n\nconst stepCircleVariants = cva(\n  'rounded-full flex items-center justify-center font-medium transition-all',\n  {\n    variants: {\n      size: {\n        xs: 'w-6 h-6 text-xs',\n        sm: 'w-8 h-8 text-sm',\n        md: 'w-10 h-10 text-base',\n        lg: 'w-12 h-12 text-lg',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n)\n\nconst stepDotVariants = cva('rounded-full transition-all', {\n  variants: {\n    size: {\n      xs: 'w-2 h-2',\n      sm: 'w-3 h-3',\n      md: 'w-4 h-4',\n      lg: 'w-5 h-5',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst stepLabelVariants = cva('font-medium', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst stepDescriptionVariants = cva('text-text-secondary', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-xs',\n      md: 'text-sm',\n      lg: 'text-sm',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst connectorVariants = cva('bg-border', {\n  variants: {\n    size: {\n      xs: 'h-0.5',\n      sm: 'h-0.5',\n      md: 'h-1',\n      lg: 'h-1',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst getStepCircleClasses = (\n  color: StepperColor,\n  variant: StepperVariant,\n  state: 'wait' | 'process' | 'finish' | 'error',\n) => {\n  const isError = state === 'error'\n  const isWait = state === 'wait'\n\n  if (isError) {\n    if (variant === 'solid')\n      return 'bg-error text-error-foreground border-2 border-error'\n    if (variant === 'soft')\n      return 'bg-error/10 border-2 border-error/50 text-error'\n    return 'bg-error/20 border-2 border-error text-error'\n  }\n\n  if (isWait) {\n    if (variant === 'solid') {\n      const solidWaitClasses = {\n        default: 'bg-border/50 text-text-secondary',\n        primary: 'bg-primary/30 text-primary-foreground/50',\n        secondary: 'bg-secondary/30 text-secondary-foreground/50',\n        accent: 'bg-accent/30 text-accent-foreground/50',\n        success: 'bg-success/30 text-success-foreground/50',\n        error: 'bg-error/30 text-error-foreground/50',\n        warning: 'bg-warning/30 text-warning-foreground/50',\n        info: 'bg-info/30 text-info-foreground/50',\n      }\n      return solidWaitClasses[color]\n    }\n    if (variant === 'soft') {\n      const softWaitClasses = {\n        default: 'bg-surface/30 border-2 border-border/30 text-text-secondary',\n        primary: 'bg-primary/5 border-2 border-primary/20 text-text-secondary',\n        secondary:\n          'bg-secondary/5 border-2 border-secondary/20 text-text-secondary',\n        accent: 'bg-accent/5 border-2 border-accent/20 text-text-secondary',\n        success: 'bg-success/5 border-2 border-success/20 text-text-secondary',\n        error: 'bg-error/5 border-2 border-error/20 text-text-secondary',\n        warning: 'bg-warning/5 border-2 border-warning/20 text-text-secondary',\n        info: 'bg-info/5 border-2 border-info/20 text-text-secondary',\n      }\n      return softWaitClasses[color]\n    }\n    const defaultWaitClasses = {\n      default: 'bg-surface border-2 border-border/50 text-text-secondary',\n      primary: 'bg-primary/5 border-2 border-primary/30 text-text-secondary',\n      secondary:\n        'bg-secondary/5 border-2 border-secondary/30 text-text-secondary',\n      accent: 'bg-accent/5 border-2 border-accent/30 text-text-secondary',\n      success: 'bg-success/5 border-2 border-success/30 text-text-secondary',\n      error: 'bg-error/5 border-2 border-error/30 text-text-secondary',\n      warning: 'bg-warning/5 border-2 border-warning/30 text-text-secondary',\n      info: 'bg-info/5 border-2 border-info/30 text-text-secondary',\n    }\n    return defaultWaitClasses[color]\n  }\n\n  // process or finish states\n  if (variant === 'solid') {\n    const solidActiveClasses = {\n      default: 'bg-border text-text-primary border-2 border-border',\n      primary: 'bg-primary text-primary-foreground border-2 border-primary',\n      secondary:\n        'bg-secondary text-secondary-foreground border-2 border-secondary',\n      accent: 'bg-accent text-accent-foreground border-2 border-accent',\n      success: 'bg-success text-success-foreground border-2 border-success',\n      error: 'bg-error text-error-foreground border-2 border-error',\n      warning: 'bg-warning text-warning-foreground border-2 border-warning',\n      info: 'bg-info text-info-foreground border-2 border-info',\n    }\n    return solidActiveClasses[color]\n  }\n  if (variant === 'soft') {\n    const softActiveClasses = {\n      default: 'bg-surface/50 border-2 border-border text-text-primary',\n      primary: 'bg-primary/10 border-2 border-primary/50 text-primary',\n      secondary: 'bg-secondary/10 border-2 border-secondary/50 text-secondary',\n      accent: 'bg-accent/10 border-2 border-accent/50 text-accent',\n      success: 'bg-success/10 border-2 border-success/50 text-success',\n      error: 'bg-error/10 border-2 border-error/50 text-error',\n      warning: 'bg-warning/10 border-2 border-warning/50 text-warning',\n      info: 'bg-info/10 border-2 border-info/50 text-info',\n    }\n    return softActiveClasses[color]\n  }\n  const defaultActiveClasses = {\n    default: 'bg-surface border-2 border-border text-text-primary',\n    primary: 'bg-primary/20 border-2 border-primary text-primary',\n    secondary: 'bg-secondary/20 border-2 border-secondary text-secondary',\n    accent: 'bg-accent/20 border-2 border-accent text-accent',\n    success: 'bg-success/20 border-2 border-success text-success',\n    error: 'bg-error/20 border-2 border-error text-error',\n    warning: 'bg-warning/20 border-2 border-warning text-warning',\n    info: 'bg-info/20 border-2 border-info text-info',\n  }\n  return defaultActiveClasses[color]\n}\n\nconst getConnectorClasses = (\n  color: StepperColor,\n  variant: StepperVariant,\n  isFinished: boolean,\n) => {\n  if (!isFinished) return 'bg-border/50'\n\n  if (variant === 'soft') {\n    const softConnectorClasses = {\n      default: 'bg-border/50',\n      primary: 'bg-primary/50',\n      secondary: 'bg-secondary/50',\n      accent: 'bg-accent/50',\n      success: 'bg-success/50',\n      error: 'bg-error/50',\n      warning: 'bg-warning/50',\n      info: 'bg-info/50',\n    }\n    return softConnectorClasses[color]\n  }\n  const connectorClasses = {\n    default: 'bg-border',\n    primary: 'bg-primary',\n    secondary: 'bg-secondary',\n    accent: 'bg-accent',\n    success: 'bg-success',\n    error: 'bg-error',\n    warning: 'bg-warning',\n    info: 'bg-info',\n  }\n  return connectorClasses[color]\n}\n\nconst Stepper = React.memo<StepperProps>(\n  ({\n    steps,\n    currentStep,\n    color = 'primary',\n    size = 'md',\n    variant = 'default',\n    orientation = 'horizontal',\n    type = 'numbered',\n    status,\n    onStepClick,\n    className,\n  }) => {\n    const getStepState = (\n      index: number,\n      step: StepItem,\n    ): 'wait' | 'process' | 'finish' | 'error' => {\n      if (step.status) return step.status\n      if (index === currentStep && status === 'error') return 'error'\n      if (index < currentStep) return 'finish'\n      if (index === currentStep) return status || 'process'\n      return 'wait'\n    }\n\n    const handleStepClick = (index: number, disabled?: boolean) => {\n      if (disabled) return\n      onStepClick?.(index)\n    }\n\n    if (orientation === 'vertical') {\n      return (\n        <div className={cn('flex flex-col', className)}>\n          {steps.map((step, index) => {\n            const state = getStepState(index, step)\n            const isClickable = !step.disabled && onStepClick\n\n            return (\n              <div\n                key={index}\n                className=\"flex\"\n              >\n                <div className=\"flex flex-col items-center mr-4\">\n                  <div\n                    className={cn(\n                      stepCircleVariants({ size }),\n                      getStepCircleClasses(color, variant, state),\n                      isClickable && 'cursor-pointer hover:scale-105',\n                      step.disabled && 'opacity-50 cursor-not-allowed',\n                    )}\n                    onClick={() => handleStepClick(index, step.disabled)}\n                  >\n                    {step.icon || index + 1}\n                  </div>\n                  {index < steps.length - 1 && (\n                    <div\n                      className={cn(\n                        'w-0.5 flex-1 my-2',\n                        getConnectorClasses(color, variant, state === 'finish'),\n                      )}\n                    />\n                  )}\n                </div>\n                <div\n                  className={cn('pb-8', index === steps.length - 1 && 'pb-0')}\n                >\n                  <div\n                    className={cn(\n                      stepLabelVariants({ size }),\n                      state === 'wait'\n                        ? 'text-text-secondary'\n                        : 'text-text-primary',\n                      state === 'error' && 'text-error',\n                    )}\n                  >\n                    {step.label}\n                  </div>\n                  {step.description && (\n                    <div\n                      className={cn(stepDescriptionVariants({ size }), 'mt-1')}\n                    >\n                      {step.description}\n                    </div>\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      )\n    }\n\n    if (type === 'dots') {\n      return (\n        <div className={cn('flex items-start', className)}>\n          {steps.map((step, index) => {\n            const state = getStepState(index, step)\n            const isClickable = !step.disabled && onStepClick\n            const prevStep = steps[index - 1]\n            const prevState =\n              index > 0 && prevStep ? getStepState(index - 1, prevStep) : 'wait'\n\n            return (\n              <React.Fragment key={index}>\n                <div\n                  className={cn(\n                    'flex flex-col items-center flex-1',\n                    index === 0 && 'items-start',\n                    index === steps.length - 1 && 'items-end',\n                  )}\n                >\n                  <div className=\"flex items-center w-full\">\n                    {index > 0 && (\n                      <div\n                        className={cn(\n                          'flex-1',\n                          connectorVariants({ size }),\n                          getConnectorClasses(\n                            color,\n                            variant,\n                            prevState === 'finish',\n                          ),\n                        )}\n                      />\n                    )}\n                    <div\n                      className={cn(\n                        stepDotVariants({ size }),\n                        getStepCircleClasses(color, variant, state),\n                        isClickable && 'cursor-pointer hover:scale-105',\n                        step.disabled && 'opacity-50 cursor-not-allowed',\n                        'flex-shrink-0',\n                      )}\n                      onClick={() => handleStepClick(index, step.disabled)}\n                    />\n                    {index < steps.length - 1 && (\n                      <div\n                        className={cn(\n                          'flex-1',\n                          connectorVariants({ size }),\n                          getConnectorClasses(\n                            color,\n                            variant,\n                            state === 'finish',\n                          ),\n                        )}\n                      />\n                    )}\n                  </div>\n                  <div\n                    className={cn(\n                      'mt-2 px-2',\n                      index === 0 && 'text-left',\n                      index === steps.length - 1 && 'text-right',\n                      index > 0 && index < steps.length - 1 && 'text-center',\n                    )}\n                  >\n                    <div\n                      className={cn(\n                        stepLabelVariants({ size }),\n                        state === 'wait'\n                          ? 'text-text-secondary'\n                          : 'text-text-primary',\n                        state === 'error' && 'text-error',\n                      )}\n                    >\n                      {step.label}\n                    </div>\n                    {step.description && (\n                      <div\n                        className={cn(\n                          stepDescriptionVariants({ size }),\n                          'mt-1',\n                        )}\n                      >\n                        {step.description}\n                      </div>\n                    )}\n                  </div>\n                </div>\n              </React.Fragment>\n            )\n          })}\n        </div>\n      )\n    }\n\n    return (\n      <div className={cn('flex items-start', className)}>\n        {steps.map((step, index) => {\n          const state = getStepState(index, step)\n          const isClickable = !step.disabled && onStepClick\n          const prevStep = steps[index - 1]\n          const prevState =\n            index > 0 && prevStep ? getStepState(index - 1, prevStep) : 'wait'\n\n          return (\n            <React.Fragment key={index}>\n              <div\n                className={cn(\n                  'flex flex-col items-center flex-1',\n                  index === 0 && 'items-start',\n                  index === steps.length - 1 && 'items-end',\n                )}\n              >\n                <div className=\"flex items-center w-full\">\n                  {index > 0 && (\n                    <div\n                      className={cn(\n                        'flex-1',\n                        connectorVariants({ size }),\n                        getConnectorClasses(\n                          color,\n                          variant,\n                          prevState === 'finish',\n                        ),\n                      )}\n                    />\n                  )}\n                  <div\n                    className={cn(\n                      stepCircleVariants({ size }),\n                      getStepCircleClasses(color, variant, state),\n                      isClickable && 'cursor-pointer hover:scale-105',\n                      step.disabled && 'opacity-50 cursor-not-allowed',\n                      'flex-shrink-0',\n                    )}\n                    onClick={() => handleStepClick(index, step.disabled)}\n                  >\n                    {step.icon || index + 1}\n                  </div>\n                  {index < steps.length - 1 && (\n                    <div\n                      className={cn(\n                        'flex-1',\n                        connectorVariants({ size }),\n                        getConnectorClasses(color, variant, state === 'finish'),\n                      )}\n                    />\n                  )}\n                </div>\n                <div\n                  className={cn(\n                    'mt-2 px-2',\n                    index === 0 && 'text-left',\n                    index === steps.length - 1 && 'text-right',\n                    index > 0 && index < steps.length - 1 && 'text-center',\n                  )}\n                >\n                  <div\n                    className={cn(\n                      stepLabelVariants({ size }),\n                      state === 'wait'\n                        ? 'text-text-secondary'\n                        : 'text-text-primary',\n                      state === 'error' && 'text-error',\n                    )}\n                  >\n                    {step.label}\n                  </div>\n                  {step.description && (\n                    <div\n                      className={cn(stepDescriptionVariants({ size }), 'mt-1')}\n                    >\n                      {step.description}\n                    </div>\n                  )}\n                </div>\n              </div>\n            </React.Fragment>\n          )\n        })}\n      </div>\n    )\n  },\n)\n\nStepper.displayName = 'Stepper'\n\nexport type * from './types'\nexport default Stepper\n"]}