import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { cva } from 'class-variance-authority';
import { Check } from 'lucide-react';
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
var stepperIndicatorVariants = cva(
  "inline-flex items-center justify-center rounded-full border box-border shrink-0 font-semibold",
  {
    variants: {
      status: {
        completed: "border-transparent bg-primary text-primary-foreground",
        active: "border-2 border-primary bg-background text-primary",
        upcoming: "border-[var(--theme-stroke-default)] bg-[var(--theme-background-container)] text-[var(--theme-text-tertiary)]"
      },
      size: {
        sm: "size-6 text-xs",
        md: "size-10 text-base"
      }
    },
    defaultVariants: {
      status: "upcoming",
      size: "sm"
    }
  }
);
function StepperIndicator(_a) {
  var _b = _a, {
    className,
    status = "upcoming",
    size = "sm",
    stepNumber,
    icon
  } = _b, props = __objRest(_b, [
    "className",
    "status",
    "size",
    "stepNumber",
    "icon"
  ]);
  const iconSize = size === "sm" ? "size-3.5" : "size-5";
  return /* @__PURE__ */ jsx(
    "div",
    __spreadProps(__spreadValues({
      "data-slot": "stepper-indicator",
      "data-status": status,
      className: cn(stepperIndicatorVariants({ status, size }), className)
    }, props), {
      children: status === "completed" ? /* @__PURE__ */ jsx(Check, { className: iconSize, strokeWidth: 2.5, "aria-hidden": true }) : icon ? /* @__PURE__ */ jsx("span", { className: cn("flex items-center justify-center", iconSize), children: icon }) : /* @__PURE__ */ jsx("span", { children: stepNumber })
    })
  );
}
function StepperConnector(_a) {
  var _b = _a, {
    className,
    orientation = "vertical",
    isCompleted = false
  } = _b, props = __objRest(_b, [
    "className",
    "orientation",
    "isCompleted"
  ]);
  return /* @__PURE__ */ jsx(
    "div",
    __spreadValues({
      "data-slot": "stepper-connector",
      "data-orientation": orientation,
      "aria-hidden": "true",
      className: cn(
        "transition-colors",
        isCompleted ? "bg-primary" : "bg-[var(--theme-stroke-default)]",
        orientation === "vertical" ? "w-px flex-1 min-h-4 self-center" : "h-px flex-1 min-w-4 self-center",
        className
      )
    }, props)
  );
}
function StepperHorizontalItem(_a) {
  var _b = _a, {
    className,
    status,
    stepNumber,
    label,
    caption,
    position = "top",
    align = "left",
    icon,
    isFirst = false,
    isLast = false,
    segmentBeforeCompleted = false,
    segmentAfterCompleted = false
  } = _b, props = __objRest(_b, [
    "className",
    "status",
    "stepNumber",
    "label",
    "caption",
    "position",
    "align",
    "icon",
    "isFirst",
    "isLast",
    "segmentBeforeCompleted",
    "segmentAfterCompleted"
  ]);
  const indicatorRow = /* @__PURE__ */ jsxs(
    "div",
    {
      "data-slot": "stepper-horizontal-indicator-row",
      className: "flex w-full shrink-0 items-center",
      children: [
        align === "right" && !isFirst && /* @__PURE__ */ jsx(
          StepperConnector,
          {
            orientation: "horizontal",
            isCompleted: segmentBeforeCompleted
          }
        ),
        align === "center" && !isFirst && /* @__PURE__ */ jsx(
          StepperConnector,
          {
            orientation: "horizontal",
            isCompleted: segmentBeforeCompleted
          }
        ),
        /* @__PURE__ */ jsx(
          StepperIndicator,
          {
            status,
            stepNumber,
            icon,
            size: "sm"
          }
        ),
        align === "left" && !isLast && /* @__PURE__ */ jsx(
          StepperConnector,
          {
            orientation: "horizontal",
            isCompleted: segmentAfterCompleted
          }
        ),
        align === "center" && !isLast && /* @__PURE__ */ jsx(
          StepperConnector,
          {
            orientation: "horizontal",
            isCompleted: segmentAfterCompleted
          }
        )
      ]
    }
  );
  const textBlock = /* @__PURE__ */ jsxs(
    "div",
    {
      "data-slot": "stepper-horizontal-text",
      className: cn(
        "flex w-full flex-col gap-1",
        align === "left" && "items-start pr-4",
        align === "center" && "items-center px-2 text-center",
        align === "right" && "items-end pl-4 text-right"
      ),
      children: [
        /* @__PURE__ */ jsx("span", { className: "w-full text-base font-medium leading-6 text-[var(--theme-text-primary)]", children: label }),
        caption && /* @__PURE__ */ jsx("p", { className: "w-full text-sm leading-5 text-[var(--theme-text-secondary)]", children: caption })
      ]
    }
  );
  return /* @__PURE__ */ jsx(
    "div",
    __spreadProps(__spreadValues({
      "data-slot": "stepper-horizontal-item",
      "data-status": status,
      className: cn(
        "flex min-w-0 flex-1 flex-col gap-4",
        className
      )
    }, props), {
      children: position === "top" ? /* @__PURE__ */ jsxs(Fragment, { children: [
        indicatorRow,
        textBlock
      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
        textBlock,
        indicatorRow
      ] })
    })
  );
}
function deriveStatus(index, currentStep) {
  if (index < currentStep) return "completed";
  if (index === currentStep) return "active";
  return "upcoming";
}
function StepperHorizontal(_a) {
  var _b = _a, {
    className,
    steps,
    currentStep,
    position = "top",
    align = "left"
  } = _b, props = __objRest(_b, [
    "className",
    "steps",
    "currentStep",
    "position",
    "align"
  ]);
  return /* @__PURE__ */ jsx(
    "div",
    __spreadProps(__spreadValues({
      "data-slot": "stepper-horizontal",
      role: "list",
      "aria-label": "Progress steps",
      className: cn("flex w-full items-start", className)
    }, props), {
      children: steps.map((step, index) => /* @__PURE__ */ jsx(
        StepperHorizontalItem,
        {
          role: "listitem",
          "aria-current": index === currentStep ? "step" : void 0,
          status: deriveStatus(index, currentStep),
          stepNumber: index + 1,
          label: step.label,
          caption: step.caption,
          icon: step.icon,
          position,
          align,
          isFirst: index === 0,
          isLast: index === steps.length - 1,
          segmentBeforeCompleted: index > 0 && index <= currentStep,
          segmentAfterCompleted: index < currentStep
        },
        step.label
      ))
    })
  );
}

export { StepperHorizontal };
//# sourceMappingURL=stepper-horizontal.js.map
//# sourceMappingURL=stepper-horizontal.js.map