// src/utils/utils.ts
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
function cn(...inputs) {
  return twMerge(clsx(inputs));
}

// src/components/Text/Text.tsx
import { jsx } from "react/jsx-runtime";
var Text = ({
  children,
  size = "md",
  weight = "normal",
  color = "text-text-950",
  as,
  className = "",
  ...props
}) => {
  let sizeClasses;
  let weightClasses;
  const sizeClassMap = {
    "2xs": "text-2xs",
    xs: "text-xs",
    sm: "text-sm",
    md: "text-md",
    lg: "text-lg",
    xl: "text-xl",
    "2xl": "text-2xl",
    "3xl": "text-3xl",
    "4xl": "text-4xl",
    "5xl": "text-5xl",
    "6xl": "text-6xl"
  };
  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
  const weightClassMap = {
    hairline: "font-hairline",
    light: "font-light",
    normal: "font-normal",
    medium: "font-medium",
    semibold: "font-semibold",
    bold: "font-bold",
    extrabold: "font-extrabold",
    black: "font-black"
  };
  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
  const baseClasses = "font-primary";
  const Component = as ?? "p";
  return /* @__PURE__ */ jsx(
    Component,
    {
      className: cn(baseClasses, sizeClasses, weightClasses, color, className),
      ...props,
      children
    }
  );
};
var Text_default = Text;

// src/components/Stepper/Stepper.tsx
import { Check } from "phosphor-react";
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
var SIZE_CLASSES = {
  small: {
    container: "gap-2",
    // 8px gap as specified in CSS
    stepWidth: "w-[58px]",
    // exact 58px from CSS
    stepHeight: "h-[38px]",
    // exact 38px from CSS
    indicator: "w-5 h-5",
    // 20px as specified
    progressBar: "h-0.5",
    // 2px as specified
    indicatorTextSize: "2xs",
    // 10px as specified
    labelTextSize: "xs",
    // 12px as specified
    iconSize: "w-3 h-3"
    // 12px
  },
  medium: {
    container: "gap-3",
    // 12px (8px + 4px progression)
    stepWidth: "w-[110px]",
    // 110px (increased from 90px to fit "Endereço Residencial")
    stepHeight: "h-[48px]",
    // 48px (increased from 46px for better proportion)
    indicator: "w-6 h-6",
    // 24px (20px + 4px progression)
    progressBar: "h-0.5",
    // 2px maintained for consistency
    indicatorTextSize: "2xs",
    // 10px maintained for readability
    labelTextSize: "xs",
    // 12px maintained
    iconSize: "w-3.5 h-3.5"
    // 14px
  },
  large: {
    container: "gap-4",
    // 16px (12px + 4px progression)
    stepWidth: "w-[160px]",
    // 160px (increased from 140px to fit "Endereço Residencial")
    stepHeight: "h-[58px]",
    // 58px (increased from 54px for better proportion)
    indicator: "w-7 h-7",
    // 28px (24px + 4px progression)
    progressBar: "h-1",
    // 4px (increased for better visibility)
    indicatorTextSize: "xs",
    // 12px (increased for larger size)
    labelTextSize: "sm",
    // 14px (increased for larger size)
    iconSize: "w-4 h-4"
    // 16px
  },
  extraLarge: {
    container: "gap-5",
    // 20px (16px + 4px progression)
    stepWidth: "w-[200px]",
    // 200px (increased from 180px to ensure "Endereço Residencial" fits)
    stepHeight: "h-[68px]",
    // 68px (increased from 62px for better proportion)
    indicator: "w-8 h-8",
    // 32px (28px + 4px progression)
    progressBar: "h-1",
    // 4px maintained
    indicatorTextSize: "xs",
    // 12px maintained for readability
    labelTextSize: "sm",
    // 14px maintained
    iconSize: "w-[18px] h-[18px]"
    // 18px
  }
};
var STATE_CLASSES = {
  pending: {
    progressBar: "bg-text-400",
    // #A3A3A3
    indicator: "bg-text-400",
    // #A3A3A3
    indicatorText: "text-white",
    // Branco para contraste com background cinza
    label: "text-text-400"
    // #A3A3A3
  },
  current: {
    progressBar: "bg-primary-800",
    // #1C61B2 usando classe Tailwind padrão
    indicator: "bg-primary-800",
    // #1C61B2 usando classe Tailwind padrão
    indicatorText: "text-white",
    // Branco usando classe Tailwind padrão
    label: "text-primary-800"
    // #1C61B2 usando classe Tailwind padrão
  },
  completed: {
    progressBar: "bg-primary-400",
    // #48A0E8 para barra quando checked (completed)
    indicator: "bg-primary-400",
    // #48A0E8 para corresponder à barra de progresso
    indicatorText: "text-white",
    // Branco usando classe Tailwind padrão
    label: "text-primary-400"
    // #48A0E8 para corresponder à barra de progresso
  }
};
var Step = ({
  step,
  index,
  size: _size,
  sizeClasses,
  stateClasses,
  isLast: _isLast,
  className = ""
}) => {
  const stepNumber = index + 1;
  const isCompleted = step.state === "completed";
  const getAriaLabel = () => {
    let suffix = "";
    if (step.state === "completed") {
      suffix = " (conclu\xEDdo)";
    } else if (step.state === "current") {
      suffix = " (atual)";
    }
    return `${step.label}${suffix}`;
  };
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: `
        flex flex-col justify-center items-center pb-2 gap-2
        ${sizeClasses.stepWidth} ${sizeClasses.stepHeight}
        flex-none flex-grow
        ${className}
        sm:max-w-[100px] md:max-w-[120px] lg:max-w-none xl:max-w-none
        sm:min-h-[40px] md:min-h-[45px] lg:min-h-none
        overflow-visible
      `,
      children: [
        /* @__PURE__ */ jsx2(
          "div",
          {
            className: `
          w-full ${sizeClasses.progressBar} ${stateClasses.progressBar}
          rounded-sm flex-none
        `
          }
        ),
        /* @__PURE__ */ jsxs(
          "div",
          {
            className: `
          flex flex-col sm:flex-row items-center
          gap-1 sm:gap-2 w-full sm:w-auto
          h-auto sm:h-5 flex-none
          overflow-visible
        `,
            children: [
              /* @__PURE__ */ jsx2(
                "div",
                {
                  className: `
            ${sizeClasses.indicator} ${stateClasses.indicator}
            rounded-full flex items-center justify-center relative
            flex-none transition-all duration-300 ease-out
          `,
                  "aria-label": getAriaLabel(),
                  children: isCompleted ? /* @__PURE__ */ jsx2(
                    Check,
                    {
                      weight: "bold",
                      className: `
                ${stateClasses.indicatorText}
                w-2.5 h-2.5 sm:w-3 sm:h-3 md:w-3 md:h-3 lg:w-3.5 lg:h-3.5
              `
                    }
                  ) : /* @__PURE__ */ jsx2(
                    Text_default,
                    {
                      size: sizeClasses.indicatorTextSize,
                      weight: "medium",
                      color: "",
                      className: cn(stateClasses.indicatorText, "leading-none"),
                      children: stepNumber
                    }
                  )
                }
              ),
              /* @__PURE__ */ jsx2(
                Text_default,
                {
                  size: sizeClasses.labelTextSize,
                  weight: "medium",
                  color: "",
                  className: cn(
                    stateClasses.label,
                    "leading-tight flex-none text-center sm:text-left break-words px-1 sm:px-0 max-w-full whitespace-normal"
                  ),
                  children: step.label
                }
              )
            ]
          }
        )
      ]
    }
  );
};
var calculateStepStates = (steps, currentStep) => {
  return steps.map((step, index) => {
    let stepState;
    if (index < currentStep) {
      stepState = "completed";
    } else if (index === currentStep) {
      stepState = "current";
    } else {
      stepState = "pending";
    }
    return {
      ...step,
      state: stepState
    };
  });
};
var getProgressText = (currentStep, totalSteps, customText) => {
  if (customText) return customText;
  return `Etapa ${currentStep + 1} de ${totalSteps}`;
};
var Stepper = ({
  steps: initialSteps,
  size = "medium",
  currentStep,
  className = "",
  stepClassName = "",
  showProgress = false,
  progressText,
  responsive = true
}) => {
  const sizeClasses = SIZE_CLASSES[size];
  const steps = currentStep !== void 0 ? calculateStepStates(initialSteps, currentStep) : initialSteps;
  return /* @__PURE__ */ jsxs(
    "fieldset",
    {
      className: cn(
        "flex flex-col gap-4 sm:gap-5 md:gap-6",
        className,
        "border-0 p-0 m-0"
      ),
      children: [
        /* @__PURE__ */ jsx2("legend", { className: "absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0", children: "Stepper de formul\xE1rio" }),
        showProgress && currentStep !== void 0 && /* @__PURE__ */ jsx2(
          Text_default,
          {
            size: "sm",
            weight: "medium",
            className: "text-text-600 text-center sm:text-left text-xs sm:text-sm",
            children: getProgressText(currentStep, steps.length, progressText)
          }
        ),
        /* @__PURE__ */ jsx2(
          "div",
          {
            className: cn(
              "flex items-center",
              sizeClasses.container,
              responsive ? "flex-row overflow-x-auto overflow-y-hidden scrollbar-hide justify-start sm:justify-center md:justify-center lg:justify-center" : "flex-row justify-center",
              "max-w-full min-w-0 gap-2 sm:gap-3 md:gap-4 lg:gap-4"
            ),
            role: "tablist",
            "aria-label": "Progress steps",
            children: steps.map((step, index) => {
              const stateClasses = STATE_CLASSES[step.state];
              return /* @__PURE__ */ jsx2(
                Step,
                {
                  step,
                  index,
                  size,
                  sizeClasses,
                  stateClasses,
                  isLast: index === steps.length - 1,
                  className: stepClassName
                },
                step.id
              );
            })
          }
        )
      ]
    }
  );
};
var Stepper_default = Stepper;
export {
  Step,
  Stepper_default as default
};
//# sourceMappingURL=index.mjs.map