analytica-frontend-lib/dist/index.js

Repositório público dos componentes utilizados nas plataformas da Analytica Ensino

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/index.ts
var src_exports = {};
__export(src_exports, {
  Alert: () => Alert_default,
  Badge: () => Badge_default,
  Button: () => Button_default,
  CheckBox: () => CheckBox_default,
  Chips: () => Chips_default,
  Divider: () => Divider_default,
  DropdownMenu: () => DropdownMenu_default,
  DropdownMenuTrigger: () => DropdownMenuTrigger,
  IconButton: () => IconButton_default,
  IconRoundedButton: () => IconRoundedButton_default,
  Input: () => Input_default,
  MenuContent: () => MenuContent,
  MenuItem: () => MenuItem,
  MenuLabel: () => MenuLabel,
  MenuSeparator: () => MenuSeparator,
  NavButton: () => NavButton_default,
  ProfileMenuFooter: () => ProfileMenuFooter,
  ProfileMenuHeader: () => ProfileMenuHeader,
  ProfileMenuSection: () => ProfileMenuSection,
  ProfileMenuTrigger: () => ProfileMenuTrigger,
  ProgressBar: () => ProgressBar_default,
  ProgressCircle: () => ProgressCircle_default,
  Radio: () => Radio_default,
  Select: () => Select_default,
  SelectContent: () => SelectContent,
  SelectItem: () => SelectItem,
  SelectTrigger: () => SelectTrigger,
  SelectValue: () => SelectValue,
  SelectionButton: () => SelectionButton_default,
  Table: () => Table_default,
  Text: () => Text_default,
  TextArea: () => TextArea_default,
  Toast: () => Toast_default,
  Toaster: () => Toaster_default,
  useToastStore: () => ToastStore_default
});
module.exports = __toCommonJS(src_exports);

// src/components/Text/Text.tsx
var import_jsx_runtime = require("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__ */ (0, import_jsx_runtime.jsx)(
    Component,
    {
      className: `${baseClasses} ${sizeClasses} ${weightClasses} ${color} ${className}`,
      ...props,
      children
    }
  );
};
var Text_default = Text;

// src/components/Button/Button.tsx
var import_jsx_runtime2 = require("react/jsx-runtime");
var VARIANT_ACTION_CLASSES = {
  solid: {
    primary: "bg-primary-950 text-text border border-primary-950 hover:bg-primary-800 hover:border-primary-800 focus-visible:outline-none focus-visible:bg-primary-950 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-primary-700 active:border-primary-700 disabled:bg-primary-500 disabled:border-primary-500 disabled:opacity-40 disabled:cursor-not-allowed",
    positive: "bg-success-500 text-text border border-success-500 hover:bg-success-600 hover:border-success-600 focus-visible:outline-none focus-visible:bg-success-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-success-700 active:border-success-700 disabled:bg-success-500 disabled:border-success-500 disabled:opacity-40 disabled:cursor-not-allowed",
    negative: "bg-error-500 text-text border border-error-500 hover:bg-error-600 hover:border-error-600 focus-visible:outline-none focus-visible:bg-error-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-error-700 active:border-error-700 disabled:bg-error-500 disabled:border-error-500 disabled:opacity-40 disabled:cursor-not-allowed"
  },
  outline: {
    primary: "bg-transparent text-primary-950 border border-primary-950 hover:bg-background-50 hover:text-primary-400 hover:border-primary-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 active:border-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
    positive: "bg-transparent text-success-500 border border-success-300 hover:bg-background-50 hover:text-success-400 hover:border-success-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 active:border-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
    negative: "bg-transparent text-error-500 border border-error-300 hover:bg-background-50 hover:text-error-400 hover:border-error-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 active:border-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
  },
  link: {
    primary: "bg-transparent text-primary-950 hover:text-primary-400 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
    positive: "bg-transparent text-success-500 hover:text-success-400 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
    negative: "bg-transparent text-error-500 hover:text-error-400 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
  }
};
var SIZE_CLASSES = {
  "extra-small": "text-xs px-3.5 py-2",
  small: "text-sm px-4 py-2.5",
  medium: "text-md px-5 py-2.5",
  large: "text-lg px-6 py-3",
  "extra-large": "text-lg px-7 py-3.5"
};
var Button = ({
  children,
  iconLeft,
  iconRight,
  size = "medium",
  variant = "solid",
  action = "primary",
  className = "",
  disabled,
  type = "button",
  ...props
}) => {
  const sizeClasses = SIZE_CLASSES[size];
  const variantClasses = VARIANT_ACTION_CLASSES[variant][action];
  const baseClasses = "inline-flex items-center justify-center rounded-full cursor-pointer font-medium";
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
    "button",
    {
      className: `${baseClasses} ${variantClasses} ${sizeClasses} ${className}`,
      disabled,
      type,
      ...props,
      children: [
        iconLeft && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "mr-2 flex items-center", children: iconLeft }),
        children,
        iconRight && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "ml-2 flex items-center", children: iconRight })
      ]
    }
  );
};
var Button_default = Button;

// src/components/Badge/Badge.tsx
var import_phosphor_react = require("phosphor-react");
var import_jsx_runtime3 = require("react/jsx-runtime");
var VARIANT_ACTION_CLASSES2 = {
  solid: {
    error: "bg-error text-error-700 focus-visible:outline-none",
    warning: "bg-warning text-warning-800 focus-visible:outline-none",
    success: "bg-success text-success-800 focus-visible:outline-none",
    info: "bg-info text-info-800 focus-visible:outline-none",
    muted: "bg-background-muted text-background-800 focus-visible:outline-none"
  },
  outlined: {
    error: "bg-error text-error-700 border border-error-300 focus-visible:outline-none",
    warning: "bg-warning text-warning-800 border border-warning-300 focus-visible:outline-none",
    success: "bg-success text-success-800 border border-success-300 focus-visible:outline-none",
    info: "bg-info text-info-800 border border-info-300 focus-visible:outline-none",
    muted: "bg-background-muted text-background-800 border border-border-300 focus-visible:outline-none"
  },
  exams: {
    exam1: "bg-exam-1 text-info-700 focus-visible:outline-none",
    exam2: "bg-exam-2 text-typography-1 focus-visible:outline-none",
    exam3: "bg-exam-3 text-typography-2 focus-visible:outline-none",
    exam4: "bg-exam-4 text-success-700 focus-visible:outline-none"
  },
  resultStatus: {
    negative: "bg-error text-error-800 focus-visible:outline-none",
    positive: "bg-success text-success-800 focus-visible:outline-none"
  },
  notification: "text-primary"
};
var SIZE_CLASSES2 = {
  small: "text-2xs px-2 py-1",
  medium: "text-xs px-2 py-1",
  large: "text-sm px-2 py-1"
};
var SIZE_CLASSES_ICON = {
  small: "size-3",
  medium: "size-3.5",
  large: "size-4"
};
var Badge = ({
  children,
  iconLeft,
  iconRight,
  size = "medium",
  variant = "solid",
  action = "error",
  className = "",
  notificationActive = false,
  ...props
}) => {
  const sizeClasses = SIZE_CLASSES2[size];
  const sizeClassesIcon = SIZE_CLASSES_ICON[size];
  const variantActionMap = VARIANT_ACTION_CLASSES2[variant] || {};
  const variantClasses = typeof variantActionMap === "string" ? variantActionMap : variantActionMap[action] ?? variantActionMap.muted ?? "";
  const baseClasses = "inline-flex items-center justify-center rounded-xs font-normal gap-1 relative";
  const baseClassesIcon = "flex items-center";
  if (variant === "notification") {
    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
      "div",
      {
        className: `${baseClasses} ${variantClasses} ${sizeClasses} ${className}`,
        ...props,
        children: [
          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_phosphor_react.Bell, { size: 24, className: "text-primary-950" }),
          notificationActive && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
            "span",
            {
              "data-testid": "notification-dot",
              className: "absolute top-[5px] right-[10px] block h-2 w-2 rounded-full bg-indicator-error ring-2 ring-white"
            }
          )
        ]
      }
    );
  }
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
    "div",
    {
      className: `${baseClasses} ${variantClasses} ${sizeClasses} ${className}`,
      ...props,
      children: [
        iconLeft && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: `${baseClassesIcon} ${sizeClassesIcon}`, children: iconLeft }),
        children,
        iconRight && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: `${baseClassesIcon} ${sizeClassesIcon}`, children: iconRight })
      ]
    }
  );
};
var Badge_default = Badge;

// src/components/Alert/Alert.tsx
var import_phosphor_react2 = require("phosphor-react");
var import_jsx_runtime4 = require("react/jsx-runtime");
var VARIANT_ACTION_CLASSES3 = {
  solid: {
    default: "bg-background-50 border-transparent",
    info: "bg-info border-transparent",
    success: "bg-success border-transparent",
    warning: "bg-warning border-transparent",
    error: "bg-error border-transparent"
  },
  outline: {
    default: "bg-background border border-border-100",
    info: "bg-background border border-border-100",
    success: "bg-background border border-border-100",
    warning: "bg-background border border-border-100",
    error: "bg-background border border-border-100"
  }
};
var COLOR_CLASSES = {
  default: "text-text-950",
  info: "text-info-800",
  success: "text-success-800",
  warning: "text-warning-800",
  error: "text-error-800"
};
var ICONS = {
  default: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_phosphor_react2.CheckCircle, { size: 18 }),
  info: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_phosphor_react2.Info, { size: 18 }),
  success: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_phosphor_react2.CheckCircle, { size: 18 }),
  warning: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_phosphor_react2.WarningCircle, { size: 18 }),
  error: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_phosphor_react2.XCircle, { size: 18 })
};
var Alert = ({
  variant = "solid",
  title,
  description,
  action = "default",
  className,
  ...props
}) => {
  const baseClasses = "alert-wrapper flex items-start gap-2 w-[384px] py-3 px-4 font-inherit rounded-md";
  const variantClasses = VARIANT_ACTION_CLASSES3[variant][action];
  const variantColor = COLOR_CLASSES[action];
  const variantIcon = ICONS[action];
  const hasHeading = Boolean(title);
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
    "div",
    {
      className: `${baseClasses} ${variantClasses} ${className ?? ""}`,
      ...props,
      children: [
        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: `mt-0.5 ${variantColor}`, children: variantIcon }),
        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
          hasHeading && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
            Text_default,
            {
              size: "md",
              weight: "medium",
              color: variantColor,
              className: "mb-0.5",
              children: title
            }
          ),
          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
            Text_default,
            {
              size: hasHeading ? "sm" : "md",
              weight: "normal",
              color: !hasHeading ? variantColor : "text-text-700",
              children: description
            }
          )
        ] })
      ]
    }
  );
};
var Alert_default = Alert;

// src/components/IconButton/IconButton.tsx
var import_react = require("react");
var import_jsx_runtime5 = require("react/jsx-runtime");
var IconButton = (0, import_react.forwardRef)(
  ({ icon, size = "md", active = false, className = "", disabled, ...props }, ref) => {
    const baseClasses = [
      "inline-flex",
      "items-center",
      "justify-center",
      "rounded-lg",
      "font-medium",
      "bg-transparent",
      "text-text-950",
      "cursor-pointer",
      "hover:bg-primary-600",
      "hover:text-text",
      "focus-visible:outline-none",
      "focus-visible:ring-2",
      "focus-visible:ring-offset-0",
      "focus-visible:ring-indicator-info",
      "disabled:opacity-50",
      "disabled:cursor-not-allowed",
      "disabled:pointer-events-none"
    ];
    const sizeClasses = {
      sm: ["w-6", "h-6", "text-sm"],
      md: ["w-10", "h-10", "text-base"]
    };
    const activeClasses = active ? ["!bg-primary-50", "!text-primary-950", "hover:!bg-primary-100"] : [];
    const allClasses = [
      ...baseClasses,
      ...sizeClasses[size],
      ...activeClasses
    ].join(" ");
    const ariaLabel = props["aria-label"] ?? "Bot\xE3o de a\xE7\xE3o";
    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
      "button",
      {
        ref,
        type: "button",
        className: `${allClasses} ${className}`,
        disabled,
        "aria-pressed": active,
        "aria-label": ariaLabel,
        ...props,
        children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "flex items-center justify-center", children: icon })
      }
    );
  }
);
IconButton.displayName = "IconButton";
var IconButton_default = IconButton;

// src/components/IconRoundedButton/IconRoundedButton.tsx
var import_jsx_runtime6 = require("react/jsx-runtime");
var IconRoundedButton = ({
  icon,
  className = "",
  disabled,
  ...props
}) => {
  const baseClasses = [
    "inline-flex",
    "items-center",
    "justify-center",
    "w-8",
    "h-8",
    "rounded-full",
    "cursor-pointer",
    "border",
    "border-background-200",
    "bg-background",
    "text-text-950",
    "hover:shadow-hard-shadow-1",
    "focus-visible:outline-none",
    "focus-visible:shadow-hard-shadow-1",
    "focus-visible:ring-2",
    "focus-visible:ring-indicator-info",
    "focus-visible:ring-offset-0",
    "disabled:opacity-50",
    "disabled:cursor-not-allowed"
  ].join(" ");
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
    "button",
    {
      type: "button",
      className: `${baseClasses} ${className}`,
      disabled,
      ...props,
      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "flex items-center justify-center w-5 h-5", children: icon })
    }
  );
};
var IconRoundedButton_default = IconRoundedButton;

// src/components/NavButton/NavButton.tsx
var import_react2 = require("react");
var import_jsx_runtime7 = require("react/jsx-runtime");
var NavButton = (0, import_react2.forwardRef)(
  ({ icon, label, selected = false, className = "", disabled, ...props }, ref) => {
    const baseClasses = [
      "flex",
      "flex-col",
      "items-center",
      "justify-center",
      "gap-0.5",
      "px-12",
      "py-1",
      "rounded-sm",
      "cursor-pointer",
      "text-text-950",
      "text-xs",
      "font-medium",
      "hover:text-text",
      "hover:bg-primary-600",
      "focus-visible:outline-none",
      "focus-visible:ring-2",
      "focus-visible:ring-offset-0",
      "focus-visible:ring-indicator-info",
      "disabled:opacity-50",
      "disabled:cursor-not-allowed",
      "disabled:pointer-events-none"
    ];
    const stateClasses = selected ? ["bg-primary-50", "text-primary-950"] : [];
    const allClasses = [...baseClasses, ...stateClasses].join(" ");
    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
      "button",
      {
        ref,
        type: "button",
        className: `${allClasses} ${className}`,
        disabled,
        "aria-pressed": selected,
        ...props,
        children: [
          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "flex items-center justify-center w-5 h-5", children: icon }),
          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "whitespace-nowrap", children: label })
        ]
      }
    );
  }
);
NavButton.displayName = "NavButton";
var NavButton_default = NavButton;

// src/components/SelectionButton/SelectionButton.tsx
var import_react3 = require("react");
var import_jsx_runtime8 = require("react/jsx-runtime");
var SelectionButton = (0, import_react3.forwardRef)(
  ({ icon, label, selected = false, className = "", disabled, ...props }, ref) => {
    const baseClasses = [
      "inline-flex",
      "items-center",
      "justify-start",
      "gap-2",
      "p-4",
      "rounded-xl",
      "cursor-pointer",
      "border",
      "border-border-50",
      "bg-background",
      "text-sm",
      "text-text-700",
      "font-bold",
      "shadow-soft-shadow-1",
      "hover:bg-background-100",
      "focus-visible:outline-none",
      "focus-visible:ring-2",
      "focus-visible:ring-indicator-info",
      "focus-visible:ring-offset-0",
      "focus-visible:shadow-none",
      "active:ring-2",
      "active:ring-primary-950",
      "active:ring-offset-0",
      "active:shadow-none",
      "disabled:opacity-50",
      "disabled:cursor-not-allowed"
    ];
    const stateClasses = selected ? ["ring-primary-950", "ring-2", "ring-offset-0", "shadow-none"] : [];
    const allClasses = [...baseClasses, ...stateClasses].join(" ");
    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
      "button",
      {
        ref,
        type: "button",
        className: `${allClasses} ${className}`,
        disabled,
        "aria-pressed": selected,
        ...props,
        children: [
          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "flex items-center justify-center w-6 h-6", children: icon }),
          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: label })
        ]
      }
    );
  }
);
SelectionButton.displayName = "SelectionButton";
var SelectionButton_default = SelectionButton;

// src/components/Table/Table.tsx
var import_react4 = require("react");
var import_jsx_runtime9 = require("react/jsx-runtime");
var Table = (0, import_react4.forwardRef)(
  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "border border-border-200 rounded-xl relative w-full overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
    "table",
    {
      ref,
      className: `w-full caption-bottom text-sm ${className ?? ""}`,
      ...props,
      children: [
        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("caption", { className: "sr-only", children: "My Table" }),
        children
      ]
    }
  ) })
);
Table.displayName = "Table";
var TableHeader = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
  "thead",
  {
    ref,
    className: `[&_tr:first-child]:border-0 ${className}`,
    ...props
  }
));
TableHeader.displayName = "TableHeader";
var TableBody = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
  "tbody",
  {
    ref,
    className: `[&_tr:last-child]:border-0 border-t border-border-200 ${className}`,
    ...props
  }
));
TableBody.displayName = "TableBody";
var TableFooter = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
  "tfoot",
  {
    ref,
    className: `border-t bg-background-50 border-border-200 font-medium [&>tr]:last:border-b-0 px-6 py-3.5 ${className}`,
    ...props
  }
));
TableFooter.displayName = "TableFooter";
var VARIANT_STATES_ROW = {
  default: "border-b border-border-200",
  selected: "border-b-2 border-indicator-primary",
  invalid: "border-b-2 border-indicator-error",
  disabled: "border-b border-border-100 bg-background-50 opacity-50 cursor-not-allowed"
};
var TableRow = (0, import_react4.forwardRef)(
  ({ state = "default", className, ...props }, ref) => {
    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
      "tr",
      {
        ref,
        className: `
        transition-colors
        ${state !== "disabled" ? "hover:bg-muted/50" : ""}
        ${VARIANT_STATES_ROW[state]}
        ${className}
      `,
        "aria-disabled": state === "disabled",
        ...props
      }
    );
  }
);
TableRow.displayName = "TableRow";
var TableHead = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
  "th",
  {
    ref,
    className: `h-10 px-6 py-3.5 bg-bg-secondary bg-muted/50 text-left align-middle font-bold text-text-800 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] ${className}`,
    ...props
  }
));
TableHead.displayName = "TableHead";
var TableCell = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
  "td",
  {
    ref,
    className: `p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] text-md text-text-800 px-6 py-3.5 ${className}`,
    ...props
  }
));
TableCell.displayName = "TableCell";
var TableCaption = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
  "caption",
  {
    ref,
    className: `border-t border-border-200 text-sm text-text-800 px-6 py-3.5 ${className}`,
    ...props
  }
));
TableCaption.displayName = "TableCaption";
var Table_default = Table;

// src/components/CheckBox/CheckBox.tsx
var import_react5 = require("react");
var import_phosphor_react3 = require("phosphor-react");
var import_jsx_runtime10 = require("react/jsx-runtime");
var SIZE_CLASSES3 = {
  small: {
    checkbox: "w-4 h-4",
    // 16px x 16px
    textSize: "sm",
    spacing: "gap-1.5",
    // 6px
    borderWidth: "border-2",
    iconSize: 14,
    // pixels for Phosphor icons
    labelHeight: "h-[21px]"
  },
  medium: {
    checkbox: "w-5 h-5",
    // 20px x 20px
    textSize: "md",
    spacing: "gap-2",
    // 8px
    borderWidth: "border-2",
    iconSize: 16,
    // pixels for Phosphor icons
    labelHeight: "h-6"
  },
  large: {
    checkbox: "w-6 h-6",
    // 24px x 24px
    textSize: "lg",
    spacing: "gap-2",
    // 8px
    borderWidth: "border-[3px]",
    // 3px border
    iconSize: 20,
    // pixels for Phosphor icons
    labelHeight: "h-[27px]"
  }
};
var BASE_CHECKBOX_CLASSES = "rounded border cursor-pointer transition-all duration-200 flex items-center justify-center focus:outline-none";
var STATE_CLASSES = {
  default: {
    unchecked: "border-border-400 bg-background hover:border-border-500",
    checked: "border-primary-950 bg-primary-950 text-text hover:border-primary-800 hover:bg-primary-800"
  },
  hovered: {
    unchecked: "border-border-500 bg-background",
    checked: "border-primary-800 bg-primary-800 text-text"
  },
  focused: {
    unchecked: "border-indicator-info bg-background ring-2 ring-indicator-info/20",
    checked: "border-indicator-info bg-primary-950 text-text ring-2 ring-indicator-info/20"
  },
  invalid: {
    unchecked: "border-error-700 bg-background hover:border-error-600",
    checked: "border-error-700 bg-primary-950 text-text"
  },
  disabled: {
    unchecked: "border-border-400 bg-background cursor-not-allowed opacity-40",
    checked: "border-primary-600 bg-primary-600 text-text cursor-not-allowed opacity-40"
  }
};
var CheckBox = (0, import_react5.forwardRef)(
  ({
    label,
    size = "medium",
    state = "default",
    indeterminate = false,
    errorMessage,
    helperText,
    className = "",
    labelClassName = "",
    checked: checkedProp,
    disabled,
    id,
    onChange,
    ...props
  }, ref) => {
    const generatedId = (0, import_react5.useId)();
    const inputId = id ?? `checkbox-${generatedId}`;
    const [internalChecked, setInternalChecked] = (0, import_react5.useState)(false);
    const isControlled = checkedProp !== void 0;
    const checked = isControlled ? checkedProp : internalChecked;
    const handleChange = (event) => {
      if (!isControlled) {
        setInternalChecked(event.target.checked);
      }
      onChange?.(event);
    };
    const currentState = disabled ? "disabled" : state;
    const sizeClasses = SIZE_CLASSES3[size];
    const checkVariant = checked || indeterminate ? "checked" : "unchecked";
    const stylingClasses = STATE_CLASSES[currentState][checkVariant];
    const borderWidthClass = state === "focused" || state === "hovered" && size === "large" ? "border-[3px]" : sizeClasses.borderWidth;
    const checkboxClasses = `${BASE_CHECKBOX_CLASSES} ${sizeClasses.checkbox} ${borderWidthClass} ${stylingClasses} ${className}`;
    const renderIcon = () => {
      if (indeterminate) {
        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
          import_phosphor_react3.Minus,
          {
            size: sizeClasses.iconSize,
            weight: "bold",
            color: "currentColor"
          }
        );
      }
      if (checked) {
        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
          import_phosphor_react3.Check,
          {
            size: sizeClasses.iconSize,
            weight: "bold",
            color: "currentColor"
          }
        );
      }
      return null;
    };
    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col", children: [
      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
        "div",
        {
          className: `flex flex-row items-center ${sizeClasses.spacing} ${disabled ? "opacity-40" : ""}`,
          children: [
            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
              "input",
              {
                ref,
                type: "checkbox",
                id: inputId,
                checked,
                disabled,
                onChange: handleChange,
                className: "sr-only",
                ...props
              }
            ),
            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("label", { htmlFor: inputId, className: checkboxClasses, children: renderIcon() }),
            label && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
              "div",
              {
                className: `flex flex-row items-center ${sizeClasses.labelHeight}`,
                children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                  Text_default,
                  {
                    as: "label",
                    htmlFor: inputId,
                    size: sizeClasses.textSize,
                    weight: "normal",
                    className: `cursor-pointer select-none leading-[150%] flex items-center font-roboto ${labelClassName}`,
                    children: label
                  }
                )
              }
            )
          ]
        }
      ),
      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
        Text_default,
        {
          size: "sm",
          weight: "normal",
          className: "mt-1.5",
          color: "text-error-600",
          children: errorMessage
        }
      ),
      helperText && !errorMessage && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
        Text_default,
        {
          size: "sm",
          weight: "normal",
          className: "mt-1.5",
          color: "text-text-500",
          children: helperText
        }
      )
    ] });
  }
);
CheckBox.displayName = "CheckBox";
var CheckBox_default = CheckBox;

// src/components/Radio/Radio.tsx
var import_react6 = require("react");
var import_jsx_runtime11 = require("react/jsx-runtime");
var SIZE_CLASSES4 = {
  small: {
    radio: "w-5 h-5",
    // 20px x 20px
    textSize: "sm",
    spacing: "gap-1.5",
    // 6px
    borderWidth: "border-2",
    dotSize: "w-1.5 h-1.5",
    // 6px inner dot
    labelHeight: "h-5"
  },
  medium: {
    radio: "w-6 h-6",
    // 24px x 24px
    textSize: "md",
    spacing: "gap-2",
    // 8px
    borderWidth: "border-2",
    dotSize: "w-2 h-2",
    // 8px inner dot
    labelHeight: "h-6"
  },
  large: {
    radio: "w-7 h-7",
    // 28px x 28px
    textSize: "lg",
    spacing: "gap-2",
    // 8px
    borderWidth: "border-2",
    // 2px border (consistent with others)
    dotSize: "w-2.5 h-2.5",
    // 10px inner dot
    labelHeight: "h-7"
  },
  extraLarge: {
    radio: "w-8 h-8",
    // 32px x 32px (larger than large)
    textSize: "xl",
    spacing: "gap-3",
    // 12px
    borderWidth: "border-2",
    // 2px border (consistent with others)
    dotSize: "w-3 h-3",
    // 12px inner dot
    labelHeight: "h-8"
  }
};
var BASE_RADIO_CLASSES = "rounded-full border cursor-pointer transition-all duration-200 flex items-center justify-center focus:outline-none";
var STATE_CLASSES2 = {
  default: {
    unchecked: "border-border-400 bg-background hover:border-border-500",
    checked: "border-primary-950 bg-background hover:border-primary-800"
  },
  hovered: {
    unchecked: "border-border-500 bg-background",
    // #8C8D8D hover state for unchecked
    checked: "border-info-700 bg-background"
    // Adjust checked border for hover
  },
  focused: {
    unchecked: "border-border-400 bg-background",
    // #A5A3A3 for unchecked radio
    checked: "border-primary-950 bg-background"
    // #124393 for checked radio
  },
  invalid: {
    unchecked: "border-border-400 bg-background",
    // #A5A3A3 for unchecked radio
    checked: "border-primary-950 bg-background"
    // #124393 for checked radio
  },
  disabled: {
    unchecked: "border-border-400 bg-background cursor-not-allowed",
    // #A5A3A3 for unchecked radio
    checked: "border-primary-950 bg-background cursor-not-allowed"
    // #124393 for checked radio
  }
};
var DOT_CLASSES = {
  default: "bg-primary-950",
  hovered: "bg-info-700",
  // #1C61B2 hover state for checked dot
  focused: "bg-primary-950",
  // #124393 for focused checked dot
  invalid: "bg-primary-950",
  // #124393 for invalid checked dot
  disabled: "bg-primary-950"
  // #124393 for disabled checked dot
};
var Radio = (0, import_react6.forwardRef)(
  ({
    label,
    size = "medium",
    state = "default",
    errorMessage,
    helperText,
    className = "",
    labelClassName = "",
    checked: checkedProp,
    defaultChecked = false,
    disabled,
    id,
    name,
    value,
    onChange,
    ...props
  }, ref) => {
    const generatedId = (0, import_react6.useId)();
    const inputId = id ?? `radio-${generatedId}`;
    const [internalChecked, setInternalChecked] = (0, import_react6.useState)(defaultChecked);
    const isControlled = checkedProp !== void 0;
    const checked = isControlled ? checkedProp : internalChecked;
    const handleChange = (event) => {
      const newChecked = event.target.checked;
      if (!isControlled) {
        setInternalChecked(newChecked);
      }
      onChange?.(event);
    };
    const currentState = disabled ? "disabled" : state;
    const sizeClasses = SIZE_CLASSES4[size];
    const actualRadioSize = sizeClasses.radio;
    const actualDotSize = sizeClasses.dotSize;
    const radioVariant = checked ? "checked" : "unchecked";
    const stylingClasses = STATE_CLASSES2[currentState][radioVariant];
    const getBorderWidth = () => {
      if (currentState === "focused") {
        return "border-2";
      }
      return sizeClasses.borderWidth;
    };
    const borderWidthClass = getBorderWidth();
    const radioClasses = `${BASE_RADIO_CLASSES} ${actualRadioSize} ${borderWidthClass} ${stylingClasses} ${className}`;
    const dotClasses = `${actualDotSize} rounded-full ${DOT_CLASSES[currentState]} transition-all duration-200`;
    const isWrapperNeeded = currentState === "focused" || currentState === "invalid";
    const wrapperBorderColor = currentState === "focused" ? "border-indicator-info" : "border-indicator-error";
    const getTextColor = () => {
      if (currentState === "disabled") {
        return checked ? "text-text-900" : "text-text-600";
      }
      if (currentState === "focused") {
        return "text-text-900";
      }
      return checked ? "text-text-900" : "text-text-600";
    };
    const getCursorClass = () => {
      return currentState === "disabled" ? "cursor-not-allowed" : "cursor-pointer";
    };
    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col", children: [
      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
        "div",
        {
          className: `flex flex-row items-center ${isWrapperNeeded ? `p-1 border-2 ${wrapperBorderColor} rounded-lg gap-1.5` : sizeClasses.spacing} ${disabled ? "opacity-40" : ""}`,
          children: [
            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
              "input",
              {
                ref,
                type: "radio",
                id: inputId,
                checked,
                disabled,
                name,
                value,
                onChange: handleChange,
                className: "sr-only",
                ...props
              }
            ),
            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("label", { htmlFor: inputId, className: radioClasses, children: checked && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: dotClasses }) }),
            label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
              "div",
              {
                className: `flex flex-row items-center ${sizeClasses.labelHeight}`,
                children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
                  Text_default,
                  {
                    as: "label",
                    htmlFor: inputId,
                    size: sizeClasses.textSize,
                    weight: "normal",
                    className: `${getCursorClass()} select-none leading-normal flex items-center font-roboto ${labelClassName}`,
                    color: getTextColor(),
                    children: label
                  }
                )
              }
            )
          ]
        }
      ),
      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
        Text_default,
        {
          size: "sm",
          weight: "normal",
          className: "mt-1.5",
          color: "text-error-600",
          children: errorMessage
        }
      ),
      helperText && !errorMessage && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
        Text_default,
        {
          size: "sm",
          weight: "normal",
          className: "mt-1.5",
          color: "text-text-500",
          children: helperText
        }
      )
    ] });
  }
);
Radio.displayName = "Radio";
var Radio_default = Radio;

// src/components/TextArea/TextArea.tsx
var import_react7 = require("react");
var import_jsx_runtime12 = require("react/jsx-runtime");
var SIZE_CLASSES5 = {
  small: {
    container: "w-72",
    // 288px width
    textarea: "h-24 text-sm",
    // 96px height, 14px font
    textSize: "sm"
  },
  medium: {
    container: "w-72",
    // 288px width
    textarea: "h-24 text-base",
    // 96px height, 16px font
    textSize: "md"
  },
  large: {
    container: "w-72",
    // 288px width
    textarea: "h-24 text-lg",
    // 96px height, 18px font
    textSize: "lg"
  },
  extraLarge: {
    container: "w-72",
    // 288px width
    textarea: "h-24 text-xl",
    // 96px height, 20px font
    textSize: "xl"
  }
};
var BASE_TEXTAREA_CLASSES = "w-full box-border p-3 bg-background border border-solid rounded-[4px] resize-none focus:outline-none font-roboto font-normal leading-[150%] placeholder:text-text-600 transition-all duration-200";
var STATE_CLASSES3 = {
  default: {
    base: "border-border-300 bg-background text-text-600",
    hover: "hover:border-border-400",
    focus: "focus:border-border-500"
  },
  hovered: {
    base: "border-border-400 bg-background text-text-600",
    hover: "",
    focus: "focus:border-border-500"
  },
  focused: {
    base: "border-2 border-primary-950 bg-background text-text-900",
    hover: "",
    focus: ""
  },
  invalid: {
    base: "border-2 border-red-700 bg-white text-gray-800",
    hover: "hover:border-red-700",
    focus: "focus:border-red-700"
  },
  disabled: {
    base: "border-border-300 bg-background text-text-600 cursor-not-allowed opacity-40",
    hover: "",
    focus: ""
  }
};
var TextArea = (0, import_react7.forwardRef)(
  ({
    label,
    size = "medium",
    state = "default",
    errorMessage,
    helperMessage,
    className = "",
    labelClassName = "",
    disabled,
    id,
    onChange,
    placeholder,
    ...props
  }, ref) => {
    const generatedId = (0, import_react7.useId)();
    const inputId = id ?? `textarea-${generatedId}`;
    const [isFocused, setIsFocused] = (0, import_react7.useState)(false);
    const handleChange = (event) => {
      onChange?.(event);
    };
    const handleFocus = (event) => {
      setIsFocused(true);
      props.onFocus?.(event);
    };
    const handleBlur = (event) => {
      setIsFocused(false);
      props.onBlur?.(event);
    };
    let currentState = disabled ? "disabled" : state;
    if (isFocused && currentState !== "invalid" && currentState !== "disabled") {
      currentState = "focused";
    }
    const sizeClasses = SIZE_CLASSES5[size];
    const stateClasses = STATE_CLASSES3[currentState];
    const textareaClasses = `${BASE_TEXTAREA_CLASSES} ${sizeClasses.textarea} ${stateClasses.base} ${stateClasses.hover} ${stateClasses.focus} ${className}`;
    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: `flex flex-col ${sizeClasses.container}`, children: [
      label && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
        Text_default,
        {
          as: "label",
          htmlFor: inputId,
          size: sizeClasses.textSize,
          weight: "medium",
          color: "text-text-950",
          className: `mb-1.5 ${labelClassName}`,
          children: label
        }
      ),
      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
        "textarea",
        {
          ref,
          id: inputId,
          disabled,
          onChange: handleChange,
          onFocus: handleFocus,
          onBlur: handleBlur,
          className: textareaClasses,
          placeholder,
          ...props
        }
      ),
      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text_default, { size: "sm", weight: "normal", className: "mt-1.5 text-error-600", children: errorMessage }),
      helperMessage && !errorMessage && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text_default, { size: "sm", weight: "normal", className: "mt-1.5 text-text-500", children: helperMessage })
    ] });
  }
);
TextArea.displayName = "TextArea";
var TextArea_default = TextArea;

// src/components/Toast/Toast.tsx
var import_phosphor_react4 = require("phosphor-react");
var import_jsx_runtime13 = require("react/jsx-runtime");
var VARIANT_ACTION_CLASSES4 = {
  solid: {
    warning: "bg-warning text-warning-600 border-none focus-visible:outline-none",
    success: "bg-success text-success-800 border-none focus-visible:outline-none",
    info: "bg-info text-info-600 border-none focus-visible:outline-none"
  },
  outlined: {
    warning: "bg-warning text-warning-600 border border-warning-300 focus-visible:outline-none",
    success: "bg-success text-success-800 border border-success-200 focus-visible:outline-none",
    info: "bg-info text-info-600 border border-info-600 focus-visible:outline-none"
  }
};
var iconMap = {
  success: import_phosphor_react4.CheckCircle,
  info: import_phosphor_react4.Info,
  warning: import_phosphor_react4.WarningCircle
};
var Toast = ({
  variant = "outlined",
  action = "success",
  className = "",
  onClose,
  title,
  description,
  position = "default",
  ...props
}) => {
  const variantClasses = VARIANT_ACTION_CLASSES4[variant][action];
  const positionClasses = {
    "top-left": "fixed top-4 left-4",
    "top-center": "fixed top-4 left-1/2 transform -translate-x-1/2",
    "top-right": "fixed top-4 right-4",
    "bottom-left": "fixed bottom-4 left-4",
    "bottom-center": "fixed bottom-4 left-1/2 transform -translate-x-1/2",
    "bottom-right": "fixed bottom-4 right-4",
    default: ""
  };
  const IconAction = iconMap[action] || iconMap["success"];
  const baseClasses = "max-w-[390px] w-full flex flex-row items-start justify-between shadow-lg rounded-lg border p-4 gap-6 group";
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
    "div",
    {
      role: "alert",
      "aria-live": "assertive",
      "aria-atomic": "true",
      className: `${baseClasses} ${positionClasses[position]} ${variantClasses} ${className}`,
      ...props,
      children: [
        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-row items-start gap-3", children: [
          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "mt-1", "data-testid": `toast-icon-${action}`, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconAction, {}) }),
          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col items-start justify-start", children: [
            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "font-semibold text-md", children: title }),
            description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-md text-text-900", children: description })
          ] })
        ] }),
        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
          "button",
          {
            onClick: onClose,
            "aria-label": "Dismiss notification",
            className: "text-background-500 cursor-pointer opacity-0 group-hover:opacity-100 transition-opacity",
            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_phosphor_react4.X, {})
          }
        )
      ]
    }
  );
};
var Toast_default = Toast;

// src/components/Toast/utils/ToastStore.ts
var import_zustand = require("zustand");
var useToastStore = (0, import_zustand.create)((set) => ({
  toasts: [],
  addToast: (toast) => {
    const id = crypto.randomUUID();
    set((state) => ({
      toasts: [...state.toasts, { id, ...toast }]
    }));
  },
  removeToast: (id) => {
    set((state) => ({
      toasts: state.toasts.filter((t) => t.id !== id)
    }));
  }
}));
var ToastStore_default = useToastStore;

// src/components/Toast/utils/Toaster.tsx
var import_jsx_runtime14 = require("react/jsx-runtime");
var Toaster = () => {
  const toasts = ToastStore_default((state) => state.toasts);
  const removeToast = ToastStore_default((state) => state.removeToast);
  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_jsx_runtime14.Fragment, { children: toasts.map((toast) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
    Toast_default,
    {
      title: toast.title,
      description: toast.description,
      variant: toast.variant,
      action: toast.action,
      position: toast.position,
      onClose: () => removeToast(toast.id)
    },
    toast.id
  )) });
};
var Toaster_default = Toaster;

// src/components/Divider/Divider.tsx
var import_jsx_runtime15 = require("react/jsx-runtime");
var Divider = ({
  orientation = "horizontal",
  className = "",
  ...props
}) => {
  const baseClasses = "bg-border-200 border-0";
  const orientationClasses = {
    horizontal: "w-full h-px",
    vertical: "h-full w-px"
  };
  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
    "hr",
    {
      className: `${baseClasses} ${orientationClasses[orientation]} ${className}`,
      "aria-orientation": orientation,
      ...props
    }
  );
};
var Divider_default = Divider;

// src/components/Input/Input.tsx
var import_phosphor_react5 = require("phosphor-react");
var import_react8 = require("react");
var import_jsx_runtime16 = require("react/jsx-runtime");
var SIZE_CLASSES6 = {
  small: "text-sm",
  medium: "text-md",
  large: "text-lg",
  "extra-large": "text-xl"
};
var STATE_CLASSES4 = {
  default: "border-border-300 placeholder:text-text-600 hover:border-border-400",
  error: "border-2 border-indicator-error placeholder:text-text-600",
  disabled: "border-border-300 placeholder:text-text-600 cursor-not-allowed opacity-40",
  "read-only": "border-border-300 !text-text-600 cursor-default focus:outline-none bg-background-50"
};
var VARIANT_CLASSES = {
  outlined: "border rounded-lg",
  underlined: "border-0 border-b rounded-none bg-transparent focus:outline-none focus:border-primary-950 focus:border-b-2",
  rounded: "border rounded-full"
};
var getActualState = (disabled, readOnly, errorMessage, state) => {
  if (disabled) return "disabled";
  if (readOnly) return "read-only";
  if (errorMessage) return "error";
  return state || "default";
};
var getIconSize = (size) => {
  const iconSizeClasses = {
    small: "w-4 h-4",
    medium: "w-5 h-5",
    large: "w-6 h-6",
    "extra-large": "w-7 h-7"
  };
  return iconSizeClasses[size] || iconSizeClasses.medium;
};
var getPasswordToggleConfig = (type, disabled, readOnly, showPassword, iconRight) => {
  const isPasswordType = type === "password";
  const shouldShowPasswordToggle = isPasswordType && !disabled && !readOnly;
  let actualIconRight = iconRight;
  let ariaLabel;
  if (shouldShowPasswordToggle) {
    actualIconRight = showPassword ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react5.EyeSlash, {}) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react5.Eye, {});
    ariaLabel = showPassword ? "Ocultar senha" : "Mostrar senha";
  }
  return { shouldShowPasswordToggle, actualIconRight, ariaLabel };
};
var getCombinedClasses = (actualState, variant) => {
  const stateClasses = STATE_CLASSES4[actualState];
  const variantClasses = VARIANT_CLASSES[variant];
  if (actualState === "error" && variant === "underlined") {
    return "border-0 border-b-2 border-indicator-error rounded-none bg-transparent focus:outline-none focus:border-primary-950 placeholder:text-text-600";
  }
  return `${stateClasses} ${variantClasses}`;
};
var Input = (0, import_react8.forwardRef)(
  ({
    label,
    helperText,
    errorMessage,
    size = "medium",
    variant = "outlined",
    state = "default",
    iconLeft,
    iconRight,
    className = "",
    containerClassName = "",
    disabled,
    readOnly,
    id,
    type = "text",
    ...props
  }, ref) => {
    const [showPassword, setShowPassword] = (0, import_react8.useState)(false);
    const isPasswordType = type === "password";
    const actualType = isPasswordType && showPassword ? "text" : type;
    const actualState = getActualState(disabled, readOnly, errorMessage, state);
    const sizeClasses = SIZE_CLASSES6[size];
    const combinedClasses = (0, import_react8.useMemo)(
      () => getCombinedClasses(actualState, variant),
      [actualState, variant]
    );
    const iconSize = getIconSize(size);
    const baseClasses = "bg-background w-full py-2 px-3 font-normal text-text-900 focus:outline-primary-950";
    const generatedId = (0, import_react8.useId)();
    const inputId = id ?? `input-${generatedId}`;
    const togglePasswordVisibility = () => setShowPassword(!showPassword);
    const { shouldShowPasswordToggle, actualIconRight, ariaLabel } = getPasswordToggleConfig(
      type,
      disabled,
      readOnly,
      showPassword,
      iconRight
    );
    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: `${containerClassName}`, children: [