@refinn/core-ui 0.1.3 → 0.1.5

package/dist/index.mjs

@@ -1,1540 +0,0 @@
-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;
-};
-
-// src/components/Accordion/Accordion.tsx
-import {
-  forwardRef,
-  useCallback,
-  useId,
-  useState
-} from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function ChevronIcon({ className }) {
-  return /* @__PURE__ */ jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M5 7.5L10 12.5L15 7.5",
-      stroke: "currentColor",
-      strokeWidth: "1.67",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  ) });
-}
-function AccordionItem({ item, isOpen, onToggle, generatedId }) {
-  const triggerId = `${generatedId}-trigger`;
-  const panelId = `${generatedId}-panel`;
-  const iconClasses = [
-    "shrink-0 transition-transform duration-200 text-accordion-icon h-28 w-28 p-4 my-8 mx-12 lg:h-40 lg:w-40 lg:p-8 lg:mx-12 lg:my-8",
-    isOpen ? "rotate-180" : "",
-    item.disabled ? "text-static-icon-disabled" : "text-static-icon-primary"
-  ].join(" ");
-  return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        id: triggerId,
-        type: "button",
-        "aria-expanded": isOpen,
-        "aria-controls": panelId,
-        disabled: item.disabled,
-        className: "flex flex-row items-center justify-between w-full pl-16 pr-8 py-8 lg:pl-24 lg:py-16 lg:pr-12",
-        onClick: onToggle,
-        children: [
-          /* @__PURE__ */ jsxs("span", { className: `flex flex-col`, children: [
-            /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: `
-              text-label-large
-              text-start
-              lg:text-heading-3
-              ${item.disabled ? "text-accordion-text-disabled" : "text-accordion-text-primary"}
-            `,
-                children: item.title
-              }
-            ),
-            item.subtitle && /* @__PURE__ */ jsx("span", { className: [
-              "text-body-small",
-              item.disabled ? "text-accordion-text-disabled" : "text-accordion-text-secondary"
-            ].join(" "), children: item.subtitle })
-          ] }),
-          /* @__PURE__ */ jsx(ChevronIcon, { className: iconClasses })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        id: panelId,
-        role: "region",
-        "aria-labelledby": triggerId,
-        className: "overflow-hidden transition-[grid-template-rows] duration-200",
-        style: { display: "grid", gridTemplateRows: isOpen ? "1fr" : "0fr" },
-        children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: `text-accordion-text-secondary text-body-small pt-8 pb-16 px-16 lg:text-body-regular lg:pl-24 lg:pr-64 lg:pb-24 lg:pt-12`, children: item.content }) })
-      }
-    )
-  ] });
-}
-var Accordion = forwardRef(
-  (_a, ref) => {
-    var _b = _a, {
-      items,
-      multiple = false,
-      loading = false,
-      className = ""
-    } = _b, rest = __objRest(_b, [
-      "items",
-      "multiple",
-      "loading",
-      "className"
-    ]);
-    const baseId = useId();
-    const defaultOpen = () => {
-      const set = /* @__PURE__ */ new Set();
-      items.forEach((item, i) => {
-        var _a2;
-        if (item.defaultOpen) set.add((_a2 = item.id) != null ? _a2 : String(i));
-      });
-      return set;
-    };
-    const [openItems, setOpenItems] = useState(defaultOpen);
-    const handleToggle = useCallback(
-      (itemId) => {
-        setOpenItems((prev) => {
-          const next = new Set(multiple ? prev : []);
-          if (prev.has(itemId)) {
-            next.delete(itemId);
-          } else {
-            next.add(itemId);
-          }
-          return next;
-        });
-      },
-      [multiple]
-    );
-    const containerClasses = [
-      "rounded-lg border border-accordion-border bg-accordion-bg font-sans",
-      "divide-y divide-accordion-border",
-      className
-    ].filter(Boolean).join(" ");
-    if (loading) {
-      return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ jsxs("div", { className: `flex items-center justify-between gap-8 pl-16 pr-8 py-8`, children: [
-        /* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col gap-4", children: /* @__PURE__ */ jsx("div", { className: "h-16 w-3/4 rounded bg-gray-200 animate-pulse" }) }),
-        /* @__PURE__ */ jsx(ChevronIcon, { className: `shrink-0 text-accordion-icon w-20 h-20 my-8 mx-12` })
-      ] }) }));
-    }
-    return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: items.map((item, i) => {
-      var _a2;
-      const itemId = (_a2 = item.id) != null ? _a2 : String(i);
-      return /* @__PURE__ */ jsx(
-        AccordionItem,
-        {
-          item,
-          isOpen: openItems.has(itemId),
-          onToggle: () => handleToggle(itemId),
-          generatedId: `${baseId}-${itemId}`
-        },
-        itemId
-      );
-    }) }));
-  }
-);
-Accordion.displayName = "Accordion";
-
-// src/components/AlertBanner/AlertBanner.tsx
-import { forwardRef as forwardRef2 } from "react";
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var pageClasses = {
-  info: "bg-alert-page-info-bg text-alert-text-primary-inverse",
-  success: "bg-alert-page-success-bg text-alert-text-primary-inverse",
-  warning: "bg-alert-page-warning-bg text-alert-text-primary-inverse",
-  danger: "bg-alert-page-danger-bg text-alert-text-primary-inverse",
-  none: "bg-alert-page-common-bg text-alert-text-primary-inverse"
-};
-var SectionClasses = {
-  info: "bg-alert-banner-background-info-subtle text-alert-text-primary",
-  success: "bg-alert-banner-background-success-subtle text-alert-text-primary",
-  warning: "bg-alert-banner-background-warning-subtle text-alert-text-primary",
-  danger: "bg-alert-banner-background-danger-subtle text-alert-text-primary",
-  none: "bg-alert-banner-background-common-subtle text-alert-text-primary"
-};
-var inlineClasses = {
-  info: "bg-alert-banner-background-transparent text-alert-text-primary",
-  success: "bg-alert-banner-background-transparent text-alert-text-primary",
-  warning: "bg-alert-banner-background-transparent text-alert-text-primary",
-  danger: "bg-alert-banner-background-transparent text-alert-text-primary",
-  none: "bg-alert-banner-background-transparent text-alert-text-primary"
-};
-var actionsPageClasses = {
-  info: "text-enabled-inverse",
-  success: "text-enabled-inverse",
-  warning: "text-enabled-dark",
-  danger: "text-enabled-inverse",
-  none: "text-enabled-inverse"
-};
-var inlineIconClasses = {
-  info: "text-alert-inline-info-icon",
-  success: "text-alert-inline-success-icon",
-  warning: "text-alert-inline-warning-icon",
-  danger: "text-alert-inline-danger-icon",
-  none: "text-alert-inline-common-icon"
-};
-function InfoIcon({ className }) {
-  return /* @__PURE__ */ jsx2("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx2("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM10 6h.01M9 10h1v4h1", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-function SuccessIcon({ className }) {
-  return /* @__PURE__ */ jsxs2("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx2("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z", stroke: "currentColor", strokeWidth: "1.5" }),
-    /* @__PURE__ */ jsx2("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
-  ] });
-}
-function WarningIcon({ className }) {
-  return /* @__PURE__ */ jsx2("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx2("path", { d: "M8.57 3.22 1.53 15.5a1.67 1.67 0 0 0 1.43 2.5h14.08a1.67 1.67 0 0 0 1.43-2.5L11.43 3.22a1.67 1.67 0 0 0-2.86 0ZM10 7.5v3.33M10 14.17h.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-function DangerIcon({ className }) {
-  return /* @__PURE__ */ jsx2("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx2("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM12.5 7.5l-5 5M7.5 7.5l5 5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-function NoneIcon({ className }) {
-  return /* @__PURE__ */ jsx2(Fragment, {});
-}
-function CloseIcon({ className }) {
-  return /* @__PURE__ */ jsx2("svg", { className, width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx2("path", { d: "M12 4 4 12M4 4l8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-var defaultIcons = {
-  info: InfoIcon,
-  success: SuccessIcon,
-  warning: WarningIcon,
-  danger: DangerIcon,
-  none: NoneIcon
-};
-var AlertBanner = forwardRef2(
-  (_a, ref) => {
-    var _b = _a, {
-      variant = "info",
-      mode = "inline",
-      title,
-      description,
-      action,
-      icon,
-      onClose,
-      className = "",
-      children
-    } = _b, rest = __objRest(_b, [
-      "variant",
-      "mode",
-      "title",
-      "description",
-      "action",
-      "icon",
-      "onClose",
-      "className",
-      "children"
-    ]);
-    const isPage = mode === "page";
-    const isSection = mode === "section";
-    const variantClass = isPage ? pageClasses[variant] : isSection ? SectionClasses[variant] : inlineClasses[variant];
-    const actionClass = isPage ? actionsPageClasses[variant] : "text-enabled";
-    const DefaultIcon = defaultIcons[variant];
-    const iconColorClass = isPage ? "" : inlineIconClasses[variant];
-    const descColorClass = isPage ? "text-alert-text-secondary-inverse" : "text-alert-text-secondary";
-    const closeColorClass = isPage ? "text-alert-close-inverse hover:text-alert-close-inverse-hover" : "text-alert-close hover:text-alert-close-hover";
-    const classes = [
-      "flex items-start gap-24 font-sans justify-between",
-      isPage ? "p-12" : isSection ? "p-12 rounded-md" : "p-0",
-      variantClass,
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxs2("div", __spreadProps(__spreadValues({ ref, role: "alert", className: classes }, rest), { children: [
-      /* @__PURE__ */ jsxs2("div", { className: "flex items-start gap-8", children: [
-        icon != null ? icon : /* @__PURE__ */ jsx2(DefaultIcon, { className: `h-20 w-20 ${iconColorClass}` }),
-        /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0 flex flex-col", children: [
-          title && /* @__PURE__ */ jsx2("p", { className: "text-label-medium", children: title }),
-          description && /* @__PURE__ */ jsx2("p", { className: `text-body-small ${descColorClass} ${title ? "mt-2" : ""} ${children ? "mb-8" : ""}`, children: description }),
-          children
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs2("div", { className: `flex ${children ? "items-start" : "self-center"} gap-24`, children: [
-        (action == null ? void 0 : action[0]) && /* @__PURE__ */ jsx2("a", { className: `${actionClass} underline text-sm font-medium`, href: action[1], children: action[0] }),
-        onClose && /* @__PURE__ */ jsx2(
-          "button",
-          {
-            type: "button",
-            onClick: onClose,
-            className: `shrink-0 p-2 rounded transition-colors ${closeColorClass}`,
-            "aria-label": "Close",
-            children: /* @__PURE__ */ jsx2(CloseIcon, { className: "h-16 w-16" })
-          }
-        )
-      ] })
-    ] }));
-  }
-);
-AlertBanner.displayName = "AlertBanner";
-
-// src/components/Avatar/Avatar.tsx
-import { forwardRef as forwardRef3 } from "react";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var sizeClasses = {
-  sm: { container: "h-24 w-24", text: "text-sm", status: "h-6 w-6", statusRing: "ring-1" },
-  md: { container: "h-32 w-32", text: "text-base", status: "h-8 w-8", statusRing: "ring-[1.5px]" },
-  lg: { container: "h-40 w-40", text: "text-lg", status: "h-10 w-10", statusRing: "ring-2" },
-  xl: { container: "h-48 w-48", text: "text-xl", status: "h-12 w-12", statusRing: "ring-2" }
-};
-var statusColorClasses = {
-  online: "bg-avatar-status-online",
-  offline: "bg-avatar-status-offline",
-  busy: "bg-avatar-status-busy",
-  "": ""
-};
-function getInitials(name) {
-  const parts = name.trim().split(/\s+/);
-  if (parts.length === 1) return parts[0][0].toUpperCase();
-  return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
-}
-function PersonIcon({ className }) {
-  return /* @__PURE__ */ jsx3("svg", { className, viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ jsx3("path", { d: "M10 10a3.75 3.75 0 1 0 0-7.5 3.75 3.75 0 0 0 0 7.5ZM3.75 17.5a6.25 6.25 0 0 1 12.5 0" }) });
-}
-var Avatar = forwardRef3(
-  (_a, ref) => {
-    var _b = _a, {
-      size = "md",
-      src,
-      alt = "",
-      name,
-      icon,
-      status,
-      className = ""
-    } = _b, rest = __objRest(_b, [
-      "size",
-      "src",
-      "alt",
-      "name",
-      "icon",
-      "status",
-      "className"
-    ]);
-    const sz = sizeClasses[size];
-    const containerClasses = [
-      "relative inline-flex items-center justify-center shrink-0 rounded-full",
-      "bg-avatar-bg text-avatar-text font-medium font-sans",
-      "transition-colors duration-150",
-      "select-none",
-      sz.container,
-      className
-    ].filter(Boolean).join(" ");
-    let content;
-    if (src) {
-      content = /* @__PURE__ */ jsx3(
-        "img",
-        {
-          src,
-          alt: alt || name || "",
-          className: "h-full w-full object-cover rounded-full"
-        }
-      );
-    } else if (icon) {
-      content = icon;
-    } else if (name) {
-      content = /* @__PURE__ */ jsx3("span", { className: sz.text, children: getInitials(name) });
-    } else {
-      content = /* @__PURE__ */ jsx3(PersonIcon, { className: `${sz.text} h-[60%] w-[60%]` });
-    }
-    return /* @__PURE__ */ jsxs3("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: [
-      content,
-      status && /* @__PURE__ */ jsx3(
-        "span",
-        {
-          className: [
-            "absolute bottom-0 right-0 block rounded-full",
-            "ring-avatar-status-border",
-            sz.status,
-            sz.statusRing,
-            statusColorClasses[status]
-          ].join(" ")
-        }
-      )
-    ] }));
-  }
-);
-Avatar.displayName = "Avatar";
-
-// src/components/Badge/Badge.tsx
-import { forwardRef as forwardRef4 } from "react";
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var sizeClasses2 = {
-  sm: "h-20 px-8 py-2 text-label-small gap-4",
-  md: "h-28 px-10 py-4 text-label-medium gap-4",
-  lg: "h-32 px-14 py-6 text-label-large gap-6"
-};
-var iconSizeClasses = {
-  sm: "h-16 w-16",
-  md: "h-20 w-20",
-  lg: "h-24 w-24"
-};
-var minimalClasses = {
-  common: "bg-transparent border border-badges-border-primary text-badges-text-primary",
-  success: "bg-transparent border border-badges-border-success text-badges-text-success",
-  warning: "bg-transparent border border-badges-border-warning text-badges-text-warning",
-  info: "bg-transparent border border-badges-border-info text-badges-text-info",
-  brand: "bg-transparent border border-badges-border-brand text-badges-text-brand",
-  danger: "bg-transparent border border-badges-border-danger text-badges-text-danger"
-};
-var subtleClasses = {
-  common: "bg-badges-background-common-subtle text-badges-text-primary",
-  success: "bg-badges-background-success-subtle text-badges-text-success",
-  warning: "bg-badges-background-warning-subtle text-badges-text-warning",
-  info: "bg-badges-background-info-subtle text-badges-text-info",
-  brand: "bg-badges-background-brand-subtle text-badges-text-brand",
-  danger: "bg-badges-background-danger-subtle text-badges-text-danger"
-};
-var boldClasses = {
-  common: "bg-badges-background-common text-badges-text-inverse",
-  success: "bg-badges-background-success text-badges-text-inverse",
-  warning: "bg-badges-background-warning text-badges-text-primary",
-  info: "bg-badges-background-info text-badges-text-inverse",
-  brand: "bg-badges-background-brand text-badges-text-inverse",
-  danger: "bg-badges-background-danger text-badges-text-inverse"
-};
-var styleMap = {
-  minimal: minimalClasses,
-  subtle: subtleClasses,
-  bold: boldClasses
-};
-var Badge = forwardRef4(
-  (_a, ref) => {
-    var _b = _a, {
-      status = "common",
-      badgeStyle = "subtle",
-      size = "md",
-      shape = "round",
-      icon,
-      children,
-      className = ""
-    } = _b, rest = __objRest(_b, [
-      "status",
-      "badgeStyle",
-      "size",
-      "shape",
-      "icon",
-      "children",
-      "className"
-    ]);
-    const classes = [
-      "inline-flex items-center justify-center font-medium font-sans",
-      "whitespace-nowrap select-none",
-      sizeClasses2[size],
-      shape === "round" ? "rounded-full" : `rounded-${size}`,
-      styleMap[badgeStyle][status],
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxs4("span", __spreadProps(__spreadValues({ ref, className: classes }, rest), { children: [
-      icon && /* @__PURE__ */ jsx4("span", { className: `shrink-0 ${iconSizeClasses[size]}`, children: icon }),
-      children
-    ] }));
-  }
-);
-Badge.displayName = "Badge";
-
-// src/components/Button/Button.tsx
-import { forwardRef as forwardRef6 } from "react";
-
-// src/components/Loading/Loading.tsx
-import { forwardRef as forwardRef5 } from "react";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-var Loading = forwardRef5(
-  (_a, ref) => {
-    var _b = _a, { size = "sm", isDark = false, className = "" } = _b, rest = __objRest(_b, ["size", "isDark", "className"]);
-    const containerClasses = [
-      isDark ? "text-white-100" : "text-blue-600",
-      className
-    ].filter(Boolean).join(" ");
-    return size === "sm" && !isDark ? /* @__PURE__ */ jsx5("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ jsxs5(
-      "svg",
-      {
-        className: "animate-spin",
-        xmlns: "http://www.w3.org/2000/svg",
-        width: "18",
-        height: "18",
-        viewBox: "0 0 18 18",
-        fill: "none",
-        children: [
-          /* @__PURE__ */ jsx5(
-            "path",
-            {
-              d: "M1 9C1 6.87827 1.84286 4.84344 3.34315 3.34315C4.84344 1.84285 6.87827 1 9 1C11.1217 1 13.1566 1.84286 14.6569 3.34315C16.1571 4.84344 17 6.87827 17 9C17 11.1217 16.1571 13.1566 14.6569 14.6569C13.1566 16.1571 11.1217 17 9 17C6.87827 17 4.84344 16.1571 3.34315 14.6569C1.84285 13.1566 1 11.1217 1 9L1 9Z",
-              stroke: "#F3F4F6",
-              "stroke-width": "2"
-            }
-          ),
-          /* @__PURE__ */ jsx5(
-            "path",
-            {
-              d: "M1 9C1 7.31057 1.53484 5.6645 2.52786 4.29772C3.52089 2.93094 4.92112 1.91361 6.52787 1.39155C8.13461 0.869484 9.86539 0.869484 11.4721 1.39155C13.0789 1.91361 14.4791 2.93094 15.4721 4.29772",
-              stroke: "#0193D7",
-              "stroke-width": "2"
-            }
-          )
-        ]
-      }
-    ) })) : /* @__PURE__ */ jsx5("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ jsx5(
-      "svg",
-      {
-        className: "animate-spin",
-        width: size === "sm" ? 18 : 88,
-        height: size === "sm" ? 18 : 88,
-        viewBox: "0 0 20 20",
-        fill: "none",
-        children: /* @__PURE__ */ jsx5(
-          "path",
-          {
-            d: "M10 2.5a7.5 7.5 0 1 0 7.5 7.5",
-            stroke: "currentColor",
-            strokeWidth: size === "sm" ? 2 : 1,
-            strokeLinecap: "round"
-          }
-        )
-      }
-    ) }));
-  }
-);
-Loading.displayName = "Loading";
-
-// src/components/Button/Button.tsx
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
-var variantClasses = {
-  primary: [
-    "bg-blue-600 text-white-100",
-    "hover:bg-blue-700",
-    "active:bg-blue-800",
-    "focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
-    "disabled:bg-gray-100 disabled:text-gray-400"
-  ].join(" "),
-  secondary: [
-    "bg-gray-100 text-gray-900",
-    "hover:bg-gray-200",
-    "active:bg-gray-300",
-    "focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
-    "disabled:bg-gray-100 disabled:text-gray-400"
-  ].join(" "),
-  tertiary: [
-    "bg-black-0 text-gray-900",
-    "hover:bg-gray-200",
-    "active:bg-gray-300",
-    "focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
-    "disabled:bg-gray-100 disabled:text-gray-400"
-  ].join(" "),
-  contrast: [
-    "bg-white-100 text-blue-600",
-    "hover:bg-white-90",
-    "active:bg-white-80",
-    "focus-visible:ring-2 focus-visible:ring-white-100 focus-visible:ring-offset-2",
-    "disabled:bg-gray-50 disabled:text-gray-400"
-  ].join(" "),
-  transparent: [
-    "bg-black-0 text-white-100",
-    "hover:bg-white-20",
-    "active:bg-white-30",
-    "focus-visible:ring-2 focus-visible:ring-white-100 focus-visible:bg-black-0 focus-visible:ring-offset-2",
-    "disabled:bg-black-0 disabled:text-white-40"
-  ].join(" ")
-};
-var sizeClasses3 = {
-  sm: "px-16 py-6 text-label-medium",
-  md: "px-20 py-8 text-label-large",
-  lg: "px-24 py-12 text-label-large",
-  xl: "px-32 py-16 text-label-large"
-};
-var Button = forwardRef6(
-  (_a, ref) => {
-    var _b = _a, {
-      variant = "primary",
-      size = "md",
-      rounded = false,
-      loading = false,
-      disabled = false,
-      startIcon,
-      endIcon,
-      children,
-      className = ""
-    } = _b, rest = __objRest(_b, [
-      "variant",
-      "size",
-      "rounded",
-      "loading",
-      "disabled",
-      "startIcon",
-      "endIcon",
-      "children",
-      "className"
-    ]);
-    const isDisabled = disabled;
-    const classes = [
-      "inline-flex items-center justify-center gap-8",
-      "transition-colors duration-150",
-      "outline-none",
-      "disabled:cursor-not-allowed",
-      loading ? "pointer-events-none" : "cursor-pointer",
-      sizeClasses3[size],
-      variantClasses[variant],
-      rounded ? "rounded-full" : size === "sm" ? "rounded-6" : size === "xl" ? "rounded-12" : "rounded-8",
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxs6("button", __spreadProps(__spreadValues({ ref, disabled: isDisabled, className: classes }, rest), { children: [
-      loading ? /* @__PURE__ */ jsx6(Loading, { size: "sm", isDark: variant === "primary" || variant === "transparent" }) : startIcon,
-      children,
-      !loading && endIcon
-    ] }));
-  }
-);
-Button.displayName = "Button";
-
-// src/components/BottomSheet/BottomSheet.tsx
-import React, { useEffect, useState as useState2, useCallback as useCallback2, forwardRef as forwardRef7 } from "react";
-import { createPortal } from "react-dom";
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
-var BottomSheet = forwardRef7(
-  (_a, ref) => {
-    var _b = _a, {
-      isForceOpen = false,
-      setIsForceOpen,
-      isClosedAble = true,
-      children,
-      startModalBtn,
-      stopModalBtn,
-      afterStopBtn,
-      size = "md",
-      modalTitle = "\u0E2B\u0E31\u0E27\u0E02\u0E49\u0E2D",
-      modalDesc = "\u0E04\u0E33\u0E2D\u0E18\u0E34\u0E1A\u0E32\u0E22",
-      className = ""
-    } = _b, rest = __objRest(_b, [
-      "isForceOpen",
-      "setIsForceOpen",
-      "isClosedAble",
-      "children",
-      "startModalBtn",
-      "stopModalBtn",
-      "afterStopBtn",
-      "size",
-      "modalTitle",
-      "modalDesc",
-      "className"
-    ]);
-    const [isOpen, setIsOpen] = useState2(false);
-    const [shouldRender, setShouldRender] = useState2(false);
-    const [animate, setAnimate] = useState2(false);
-    useEffect(() => {
-      if (isOpen) {
-        setShouldRender(true);
-        setTimeout(() => setAnimate(true), 10);
-      } else {
-        setAnimate(false);
-        const timer = setTimeout(() => setShouldRender(false), 300);
-        return () => clearTimeout(timer);
-      }
-    }, [isOpen]);
-    useEffect(() => {
-      if (isForceOpen) {
-        setIsOpen(true);
-      } else {
-        setIsOpen(false);
-      }
-    }, [isForceOpen]);
-    const handleStartClick = useCallback2(
-      (e) => {
-        var _a2, _b2;
-        (_b2 = startModalBtn == null ? void 0 : (_a2 = startModalBtn.props).onClick) == null ? void 0 : _b2.call(_a2, e);
-        setIsForceOpen == null ? void 0 : setIsForceOpen(true);
-        setIsOpen(true);
-      },
-      [startModalBtn]
-    );
-    const handleStopClick = useCallback2(
-      (e) => {
-        var _a2, _b2;
-        (_b2 = stopModalBtn == null ? void 0 : (_a2 = stopModalBtn.props).onClick) == null ? void 0 : _b2.call(_a2, e);
-        setIsForceOpen == null ? void 0 : setIsForceOpen(false);
-        setIsOpen(false);
-      },
-      [stopModalBtn]
-    );
-    const handleCloseClick = () => {
-      setIsForceOpen == null ? void 0 : setIsForceOpen(false);
-      setIsOpen(false);
-    };
-    return /* @__PURE__ */ jsxs7("span", { ref, style: { display: "contents" }, children: [
-      startModalBtn && React.cloneElement(startModalBtn, {
-        onClick: handleStartClick
-      }),
-      shouldRender && createPortal(
-        /* @__PURE__ */ jsxs7(
-          "div",
-          {
-            className: `fixed inset-0 z-50 flex items-end justify-center transition-opacity duration-300 ${animate ? "opacity-100" : "opacity-0"}`,
-            "aria-modal": "true",
-            role: "dialog",
-            children: [
-              /* @__PURE__ */ jsx7(
-                "div",
-                {
-                  className: "absolute inset-0 bg-black/40",
-                  onClick: () => isClosedAble ? handleCloseClick() : null,
-                  "aria-label": "Close modal"
-                }
-              ),
-              /* @__PURE__ */ jsxs7(
-                "div",
-                {
-                  className: `flex flex-col z-10 w-full rounded-t-xl bg-white pt-8 pb-16 px-16 shadow-lg transform transition-all duration-300 
-                ${size === "sm" ? "h-auto max-h-auto" : size === "md" ? "h-full max-h-[85vh]" : "h-full max-h-screen rounded-t-none!"}
-                ${animate ? "scale-100 translate-y-0" : "scale-95 translate-y-full"}`,
-                  children: [
-                    /* @__PURE__ */ jsxs7("div", { className: "w-full flex flex-row relative items-center pt-8 pb-16", children: [
-                      /* @__PURE__ */ jsxs7("div", { className: "flex flex-col px-8 max-w-225", children: [
-                        /* @__PURE__ */ jsx7("p", { className: "text-heading-3 text-button-sheet-text-primary", children: modalTitle }),
-                        /* @__PURE__ */ jsx7("p", { className: "text-body-small text-button-sheet-text-secondary", children: modalDesc })
-                      ] }),
-                      /* @__PURE__ */ jsx7(
-                        "i",
-                        {
-                          className: "fi fi-br-cross-small flex text-xl text-gray-600 w-44 h-44 absolute top-0 right-0 p-12",
-                          onClick: () => handleCloseClick()
-                        }
-                      ),
-                      /* @__PURE__ */ jsx7(
-                        "div",
-                        {
-                          className: "text-gray-600 text-xl absolute top-0 right-0 p-12",
-                          onClick: () => handleCloseClick(),
-                          children: "x"
-                        }
-                      )
-                    ] }),
-                    /* @__PURE__ */ jsxs7("div", { className: "w-full h-full grow overflow-y-auto overflow-x-visible", children: [
-                      children,
-                      stopModalBtn && React.cloneElement(stopModalBtn, {
-                        onClick: handleStopClick
-                      }),
-                      afterStopBtn && afterStopBtn
-                    ] })
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        document.body
-      )
-    ] });
-  }
-);
-BottomSheet.displayName = "BottomSheet";
-
-// src/components/Checkbox/Checkbox.tsx
-import {
-  forwardRef as forwardRef8,
-  useId as useId2,
-  useState as useState3
-} from "react";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
-function CheckIcon({ className }) {
-  return /* @__PURE__ */ jsx8(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 16 16",
-      fill: "none",
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx8(
-        "path",
-        {
-          d: "M13.333 4.667 6 12l-3.333-3.333",
-          stroke: "currentColor",
-          strokeWidth: "2",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    }
-  );
-}
-function IndeterminateIcon({ className }) {
-  return /* @__PURE__ */ jsx8(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 16 16",
-      fill: "none",
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx8(
-        "path",
-        {
-          d: "M3.333 8h9.334",
-          stroke: "currentColor",
-          strokeWidth: "2",
-          strokeLinecap: "round"
-        }
-      )
-    }
-  );
-}
-var Checkbox = forwardRef8(
-  (_a, ref) => {
-    var _b = _a, {
-      label,
-      description,
-      error = false,
-      contrast = false,
-      indeterminate = false,
-      disabled = false,
-      className = "",
-      id,
-      defaultChecked
-    } = _b, rest = __objRest(_b, [
-      "label",
-      "description",
-      "error",
-      "contrast",
-      "indeterminate",
-      "disabled",
-      "className",
-      "id",
-      "defaultChecked"
-    ]);
-    const reactId = useId2();
-    const inputId = id != null ? id : reactId;
-    const [isChecked, setIsChecked] = useState3(defaultChecked != null ? defaultChecked : false);
-    return /* @__PURE__ */ jsxs8(
-      "label",
-      {
-        htmlFor: inputId,
-        className: `flex select-none font-sans ${disabled ? "cursor-not-allowed" : "cursor-pointer"} ${className}`,
-        children: [
-          /* @__PURE__ */ jsxs8("div", { className: "relative mr-16", children: [
-            /* @__PURE__ */ jsx8(
-              "input",
-              __spreadValues({
-                ref,
-                id: inputId,
-                type: "checkbox",
-                defaultChecked,
-                onChange: (e) => {
-                  var _a2;
-                  setIsChecked(e.target.checked);
-                  (_a2 = rest.onChange) == null ? void 0 : _a2.call(rest, e);
-                },
-                disabled,
-                "aria-checked": indeterminate ? "mixed" : isChecked,
-                className: "sr-only"
-              }, rest)
-            ),
-            /* @__PURE__ */ jsx8(
-              "div",
-              {
-                className: `box m-6 flex h-20 w-20 rounded-md items-center justify-center border ${contrast ? isChecked || indeterminate ? "border-white bg-white" : "border-white" : isChecked || indeterminate ? "bg-static-icon-brand border-static-icon-brand" : "border-static-icon-primary"}`,
-                children: isChecked ? /* @__PURE__ */ jsx8(
-                  CheckIcon,
-                  {
-                    className: `h-20 ${contrast ? "text-static-icon-brand" : "text-white"}`
-                  }
-                ) : indeterminate ? /* @__PURE__ */ jsx8(
-                  IndeterminateIcon,
-                  {
-                    className: `h-20 ${contrast ? "text-static-icon-brand" : "text-white"}`
-                  }
-                ) : null
-              }
-            )
-          ] }),
-          (label || description) && /* @__PURE__ */ jsxs8("span", { className: "flex flex-col", children: [
-            label && /* @__PURE__ */ jsx8(
-              "span",
-              {
-                className: `text-label-large ${disabled ? "text-checkbox-text-disabled" : contrast ? "text-checkbox-text-primary-inverse" : "text-checkbox-text-primary"}`,
-                children: label
-              }
-            ),
-            description && /* @__PURE__ */ jsx8(
-              "span",
-              {
-                className: `text-body-small ${error ? "text-checkbox-text-danger" : disabled ? "text-checkbox-text-disabled" : contrast ? "text-checkbox-text-primary-inverse" : "text-checkbox-text-secondary"}`,
-                children: description
-              }
-            )
-          ] })
-        ]
-      }
-    );
-  }
-);
-Checkbox.displayName = "Checkbox";
-
-// src/components/Dialog/Dialog.tsx
-import React2, {
-  useEffect as useEffect2,
-  useState as useState4,
-  useCallback as useCallback3,
-  forwardRef as forwardRef9
-} from "react";
-import { createPortal as createPortal2 } from "react-dom";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
-var Dialog = forwardRef9(
-  ({
-    isForceOpen = false,
-    setIsForceOpen,
-    isClosedAble = true,
-    isCloseIcon = true,
-    children,
-    startModalBtn,
-    stopModalBtn,
-    afterStopBtn,
-    p = "20"
-  }, ref) => {
-    const [isOpen, setIsOpen] = useState4(false);
-    const [isRender, setIsRender] = useState4(false);
-    const [animate, setAnimate] = useState4(false);
-    useEffect2(() => {
-      if (isOpen) {
-        setIsRender(true);
-        setTimeout(() => setAnimate(true), 10);
-      } else {
-        setAnimate(false);
-        const timer = setTimeout(() => setIsRender(false), 300);
-        return () => clearTimeout(timer);
-      }
-    }, [isOpen]);
-    useEffect2(() => {
-      if (isForceOpen) {
-        setIsOpen(true);
-      } else {
-        setIsOpen(false);
-      }
-    }, [isForceOpen]);
-    const handleStartClick = useCallback3(
-      (e) => {
-        var _a, _b;
-        (_b = startModalBtn == null ? void 0 : (_a = startModalBtn.props).onClick) == null ? void 0 : _b.call(_a, e);
-        setIsForceOpen == null ? void 0 : setIsForceOpen(true);
-        setIsOpen(true);
-      },
-      [startModalBtn]
-    );
-    const handleStopClick = useCallback3(
-      (e) => {
-        var _a, _b;
-        (_b = stopModalBtn == null ? void 0 : (_a = stopModalBtn.props).onClick) == null ? void 0 : _b.call(_a, e);
-        setIsForceOpen == null ? void 0 : setIsForceOpen(false);
-        setIsOpen(false);
-      },
-      [stopModalBtn]
-    );
-    const handleCloseClick = () => {
-      setIsForceOpen == null ? void 0 : setIsForceOpen(false);
-      setIsOpen(false);
-    };
-    return /* @__PURE__ */ jsxs9("span", { ref, style: { display: "contents" }, children: [
-      startModalBtn && React2.cloneElement(startModalBtn, {
-        onClick: handleStartClick
-      }),
-      isRender && createPortal2(
-        /* @__PURE__ */ jsxs9(
-          "div",
-          {
-            className: `fixed inset-0 z-50 flex items-center justify-center transition-opacity duration-300 ${animate ? "opacity-100" : "opacity-0"}`,
-            "aria-modal": "true",
-            role: "dialog",
-            children: [
-              /* @__PURE__ */ jsx9(
-                "div",
-                {
-                  className: "absolute inset-0 bg-black/40",
-                  onClick: () => isClosedAble ? handleCloseClick() : null,
-                  "aria-label": "Close modal"
-                }
-              ),
-              /* @__PURE__ */ jsxs9(
-                "div",
-                {
-                  className: `relative z-10 w-[calc(100%-40px)] max-w-md rounded-xl bg-white p-${p || "20"} shadow-lg transform transition-all duration-300 ${animate ? "scale-100 opacity-100" : "scale-95 opacity-0"}`,
-                  children: [
-                    isCloseIcon && /* @__PURE__ */ jsx9(
-                      "svg",
-                      {
-                        xmlns: "http://www.w3.org/2000/svg",
-                        width: "20",
-                        height: "20",
-                        viewBox: "0 0 20 20",
-                        fill: "none",
-                        className: "text-gray-900 flex h-20 w-20 items-center justify-center absolute right-16 top-16 cursor-pointer",
-                        onMouseDown: (e) => {
-                          e.preventDefault();
-                          handleCloseClick();
-                        },
-                        children: /* @__PURE__ */ jsx9(
-                          "path",
-                          {
-                            d: "M14.7119 6.0625L10.7744 10L14.7119 13.9375L13.9375 14.7119L10 10.7744L6.0625 14.7119L5.28809 13.9375L9.22559 10L5.28809 6.0625L6.0625 5.28809L10 9.22559L13.9375 5.28809L14.7119 6.0625Z",
-                            fill: "#111827"
-                          }
-                        )
-                      }
-                    ),
-                    children,
-                    stopModalBtn && React2.cloneElement(stopModalBtn, {
-                      onClick: handleStopClick
-                    }),
-                    afterStopBtn && afterStopBtn
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        document.body
-      )
-    ] });
-  }
-);
-Dialog.displayName = "Dialog";
-
-// src/components/Icon/Icon.tsx
-import { forwardRef as forwardRef10 } from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
-var Icon = forwardRef10(
-  (_a, ref) => {
-    var _b = _a, {
-      name,
-      size = 20,
-      weight = 300,
-      fill = false,
-      grade = 0,
-      opticalSize,
-      className = "",
-      style,
-      "aria-label": ariaLabel
-    } = _b, rest = __objRest(_b, [
-      "name",
-      "size",
-      "weight",
-      "fill",
-      "grade",
-      "opticalSize",
-      "className",
-      "style",
-      "aria-label"
-    ]);
-    const opsz = opticalSize != null ? opticalSize : size === 16 ? 20 : size === 20 ? 20 : 24;
-    const classes = [
-      "material-symbols-outlined select-none shrink-0 inline-block leading-none",
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsx10(
-      "span",
-      __spreadProps(__spreadValues({
-        ref,
-        className: classes,
-        "aria-hidden": ariaLabel ? void 0 : true,
-        "aria-label": ariaLabel,
-        role: ariaLabel ? "img" : void 0,
-        style: __spreadValues({
-          fontSize: `${size}px`,
-          width: `${size}px`,
-          height: `${size}px`,
-          fontVariationSettings: `'FILL' ${fill ? 1 : 0}, 'wght' ${weight}, 'GRAD' ${grade}, 'opsz' ${opsz}`
-        }, style)
-      }, rest), {
-        children: name
-      })
-    );
-  }
-);
-Icon.displayName = "Icon";
-
-// src/components/Radio/Radio.tsx
-import {
-  forwardRef as forwardRef11,
-  useId as useId3
-} from "react";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
-var Radio = forwardRef11(
-  (_a, ref) => {
-    var _b = _a, {
-      size = "sm",
-      label,
-      description,
-      error = false,
-      checked,
-      defaultChecked,
-      disabled = false,
-      className = "",
-      id,
-      name
-    } = _b, rest = __objRest(_b, [
-      "size",
-      "label",
-      "description",
-      "error",
-      "checked",
-      "defaultChecked",
-      "disabled",
-      "className",
-      "id",
-      "name"
-    ]);
-    const reactId = useId3();
-    const inputId = id != null ? id : reactId;
-    return /* @__PURE__ */ jsx11(
-      "div",
-      {
-        className: `${disabled ? "cursor-not-allowed" : "cursor-pointer"} ${className}`,
-        children: /* @__PURE__ */ jsxs10(
-          "label",
-          {
-            htmlFor: inputId,
-            className: `flex gap-4 ${disabled ? "pointer-events-none text-gray-400" : "text-gray-900 cursor-pointer"}`,
-            children: [
-              /* @__PURE__ */ jsxs10("div", { children: [
-                /* @__PURE__ */ jsx11(
-                  "input",
-                  __spreadValues({
-                    ref,
-                    id: inputId,
-                    type: "radio",
-                    className: "sr-only peer",
-                    checked,
-                    defaultChecked,
-                    disabled,
-                    name
-                  }, rest)
-                ),
-                /* @__PURE__ */ jsx11(
-                  "div",
-                  {
-                    className: `relative box flex items-center justify-center rounded-full border-2 group bg-white 
-                ${size === "sm" ? "h-16 w-16 my-4 ml-3 mr-3" : "m-3 h-20 w-20 text-label-large"} 
-                ${error ? "border-red-500" : "border-gray-600 peer-checked:border-blue-600 peer-disabled:border-gray-400!"}
-              `,
-                    children: /* @__PURE__ */ jsx11(
-                      "span",
-                      {
-                        className: `absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 
-                  ${size === "sm" ? "h-8 w-8" : "h-10 w-10"} 
-                  rounded-full bg-white group-peer-checked:bg-blue-600 group-peer-disabled:bg-white`
-                      }
-                    )
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs10(
-                "div",
-                {
-                  className: `flex flex-col gap-1 ${size === "sm" ? "mt-2" : "mt-4"}`,
-                  children: [
-                    /* @__PURE__ */ jsx11(
-                      "p",
-                      {
-                        className: `
-                ${size === "sm" ? "text-label-medium" : "text-label-large"} 
-                ${disabled ? "text-gray-400" : "text-gray-900"}
-              `,
-                        children: label
-                      }
-                    ),
-                    /* @__PURE__ */ jsx11(
-                      "p",
-                      {
-                        className: `text-caption-caption ${disabled ? "text-gray-400" : error ? "text-red-600" : "text-gray-600"}`,
-                        children: description
-                      }
-                    )
-                  ]
-                }
-              )
-            ]
-          }
-        )
-      }
-    );
-  }
-);
-Radio.displayName = "Radio";
-
-// src/components/Slider/Slider.tsx
-import {
-  forwardRef as forwardRef12,
-  useCallback as useCallback4,
-  useId as useId4,
-  useState as useState5
-} from "react";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
-var sizeConfig = {
-  small: {
-    trackH: "h-4",
-    thumbPx: 24,
-    thumbClass: "h-24 w-24",
-    iconPx: 12,
-    containerH: "h-24",
-    label: "text-sm leading-20",
-    description: "text-xs leading-16"
-  },
-  medium: {
-    trackH: "h-6",
-    thumbPx: 28,
-    thumbClass: "h-28 w-28",
-    iconPx: 14,
-    containerH: "h-28",
-    label: "text-base leading-24",
-    description: "text-sm leading-20"
-  },
-  large: {
-    trackH: "h-8",
-    thumbPx: 32,
-    thumbClass: "h-32 w-32",
-    iconPx: 16,
-    containerH: "h-32",
-    label: "text-base leading-24",
-    description: "text-sm leading-20"
-  }
-};
-function ChevronGlyphs({ size, color }) {
-  return /* @__PURE__ */ jsxs11(
-    "svg",
-    {
-      width: size,
-      height: size,
-      viewBox: "0 0 12 12",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      "aria-hidden": "true",
-      children: [
-        /* @__PURE__ */ jsx12(
-          "path",
-          {
-            d: "M4.75 3.25L2.25 6L4.75 8.75",
-            stroke: color,
-            strokeWidth: "1.25",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        ),
-        /* @__PURE__ */ jsx12(
-          "path",
-          {
-            d: "M7.25 3.25L9.75 6L7.25 8.75",
-            stroke: color,
-            strokeWidth: "1.25",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        )
-      ]
-    }
-  );
-}
-var Slider = forwardRef12(
-  (_a, ref) => {
-    var _b = _a, {
-      size = "medium",
-      label,
-      description,
-      error = false,
-      showValue = false,
-      min = 0,
-      max = 100,
-      step = 1,
-      value: controlledValue,
-      defaultValue,
-      disabled = false,
-      className = "",
-      id,
-      onChange,
-      "aria-label": ariaLabelProp
-    } = _b, rest = __objRest(_b, [
-      "size",
-      "label",
-      "description",
-      "error",
-      "showValue",
-      "min",
-      "max",
-      "step",
-      "value",
-      "defaultValue",
-      "disabled",
-      "className",
-      "id",
-      "onChange",
-      "aria-label"
-    ]);
-    const reactId = useId4();
-    const inputId = id != null ? id : reactId;
-    const sz = sizeConfig[size];
-    const ariaLabel = ariaLabelProp != null ? ariaLabelProp : typeof label === "string" ? void 0 : "Slider";
-    const ariaDescriptionId = description ? `${inputId}-description` : void 0;
-    const isControlled = controlledValue !== void 0;
-    const [internalValue, setInternalValue] = useState5(defaultValue != null ? defaultValue : min);
-    const currentValue = isControlled ? controlledValue : internalValue;
-    const handleChange = useCallback4(
-      (e) => {
-        const val = Number(e.target.value);
-        if (!isControlled) {
-          setInternalValue(val);
-        }
-        onChange == null ? void 0 : onChange(val, e);
-      },
-      [isControlled, onChange]
-    );
-    const percent = (currentValue - min) / (max - min) * 100;
-    const trackBg = disabled ? "bg-slider-track-disabled" : "bg-slider-track";
-    const fillBg = disabled ? "bg-slider-fill-disabled" : error ? "bg-slider-fill-error" : "bg-slider-fill";
-    const thumbBorder = disabled ? "border-slider-thumb-border-disabled" : error ? "border-slider-thumb-border-error" : "border-gray-200";
-    const thumbBg = disabled ? "bg-slider-thumb-disabled" : "bg-slider-thumb";
-    const iconColor = disabled ? "var(--color-gray-400)" : "var(--color-gray-500)";
-    const labelColor = disabled ? "text-slider-label-disabled" : error ? "text-slider-label-error" : "text-slider-label";
-    const descriptionColor = disabled ? "text-slider-label-disabled" : "text-slider-description";
-    const thumbOffset = percent * sz.thumbPx / 100;
-    const fillOffset = sz.thumbPx / 2 - thumbOffset;
-    return /* @__PURE__ */ jsxs11(
-      "div",
-      {
-        className: ["flex w-full flex-col gap-8 font-sans", className].filter(Boolean).join(" "),
-        children: [
-          (label || showValue && !disabled) && /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between", children: [
-            label && /* @__PURE__ */ jsx12(
-              "label",
-              {
-                htmlFor: inputId,
-                className: [
-                  sz.label,
-                  "font-medium",
-                  labelColor,
-                  disabled ? "cursor-not-allowed" : "cursor-default"
-                ].join(" "),
-                children: label
-              }
-            ),
-            showValue && /* @__PURE__ */ jsx12(
-              "span",
-              {
-                className: [sz.description, "tabular-nums", labelColor].join(" "),
-                children: currentValue
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxs11(
-            "div",
-            {
-              className: [
-                "relative flex items-center",
-                sz.containerH,
-                disabled ? "cursor-not-allowed" : "cursor-pointer"
-              ].join(" "),
-              children: [
-                /* @__PURE__ */ jsx12(
-                  "div",
-                  {
-                    className: [
-                      "absolute inset-x-0 rounded-full",
-                      sz.trackH,
-                      trackBg
-                    ].join(" ")
-                  }
-                ),
-                /* @__PURE__ */ jsx12(
-                  "div",
-                  {
-                    className: ["absolute left-0 rounded-full", sz.trackH, fillBg].join(" "),
-                    style: { width: `calc(${percent}% + ${fillOffset}px)` }
-                  }
-                ),
-                /* @__PURE__ */ jsx12(
-                  "input",
-                  __spreadValues({
-                    ref,
-                    id: inputId,
-                    type: "range",
-                    min,
-                    max,
-                    step,
-                    value: currentValue,
-                    disabled,
-                    onChange: handleChange,
-                    "aria-label": ariaLabel,
-                    "aria-describedby": ariaDescriptionId,
-                    className: [
-                      "peer absolute inset-0 z-20 w-full appearance-none bg-transparent opacity-0",
-                      disabled ? "cursor-not-allowed" : "cursor-pointer",
-                      "focus:outline-none"
-                    ].join(" ")
-                  }, rest)
-                ),
-                /* @__PURE__ */ jsx12(
-                  "div",
-                  {
-                    className: [
-                      "pointer-events-none absolute z-10 flex items-center justify-center rounded-full border",
-                      sz.thumbClass,
-                      thumbBg,
-                      thumbBorder,
-                      disabled ? "" : "shadow-base transition-shadow duration-150",
-                      !disabled && (error ? "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-slider-ring-error" : "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-slider-ring"),
-                      !disabled && "peer-hover:shadow-medium"
-                    ].filter(Boolean).join(" "),
-                    style: { left: `calc(${percent}% - ${thumbOffset}px)` },
-                    children: /* @__PURE__ */ jsx12(ChevronGlyphs, { size: sz.iconPx, color: iconColor })
-                  }
-                )
-              ]
-            }
-          ),
-          description && /* @__PURE__ */ jsx12(
-            "span",
-            {
-              id: ariaDescriptionId,
-              className: [sz.description, descriptionColor].join(" "),
-              children: description
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Slider.displayName = "Slider";
-
-// src/components/Toast/Toast.tsx
-import { forwardRef as forwardRef13 } from "react";
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
-function CheckCircleIcon({ className }) {
-  return /* @__PURE__ */ jsxs12("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx13("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "1.5" }),
-    /* @__PURE__ */ jsx13("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
-  ] });
-}
-function ProgressIcon({ className }) {
-  return /* @__PURE__ */ jsxs12("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx13("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "1.5", opacity: "0.3" }),
-    /* @__PURE__ */ jsx13("path", { d: "M10 2a8 8 0 0 1 8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", children: /* @__PURE__ */ jsx13("animateTransform", { attributeName: "transform", type: "rotate", from: "0 10 10", to: "360 10 10", dur: "1s", repeatCount: "indefinite" }) })
-  ] });
-}
-function ErrorIcon({ className }) {
-  return /* @__PURE__ */ jsxs12("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx13("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "1.5" }),
-    /* @__PURE__ */ jsx13("path", { d: "M10 6.5v4M10 13.5h.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
-  ] });
-}
-function CloseIcon2({ className }) {
-  return /* @__PURE__ */ jsx13("svg", { className, width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx13("path", { d: "M12 4 4 12M4 4l8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-var defaultIcons2 = {
-  default: CheckCircleIcon,
-  progress: ProgressIcon,
-  error: ErrorIcon
-};
-var typeClasses = {
-  default: "bg-toast-default-bg text-toast-default-text",
-  progress: "bg-toast-progress-bg text-toast-progress-text",
-  error: "bg-toast-error-bg text-toast-error-text"
-};
-var iconColorClasses = {
-  default: "text-toast-default-icon",
-  progress: "text-toast-progress-icon",
-  error: "text-toast-error-icon"
-};
-var Toast = forwardRef13(
-  (_a, ref) => {
-    var _b = _a, {
-      type = "default",
-      icon = true,
-      actionLabel,
-      onAction,
-      onDismiss,
-      children,
-      className = ""
-    } = _b, rest = __objRest(_b, [
-      "type",
-      "icon",
-      "actionLabel",
-      "onAction",
-      "onDismiss",
-      "children",
-      "className"
-    ]);
-    const DefaultIcon = defaultIcons2[type];
-    const classes = [
-      "inline-flex items-center gap-12 font-sans",
-      "rounded-xl px-16 py-12",
-      "min-w-[320px] max-w-[480px]",
-      "shadow-large",
-      typeClasses[type],
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxs12("div", __spreadProps(__spreadValues({ ref, role: "alert", className: classes }, rest), { children: [
-      icon && /* @__PURE__ */ jsx13("span", { className: `shrink-0 ${iconColorClasses[type]}`, children: /* @__PURE__ */ jsx13(DefaultIcon, { className: "h-20 w-20" }) }),
-      /* @__PURE__ */ jsx13("span", { className: "flex-1 text-sm font-medium leading-20 truncate", children }),
-      actionLabel && onAction && /* @__PURE__ */ jsx13(
-        "button",
-        {
-          type: "button",
-          onClick: onAction,
-          className: "shrink-0 text-sm font-medium text-toast-action-text hover:bg-toast-action-bg-hover rounded-md px-8 py-4 transition-colors",
-          children: actionLabel
-        }
-      ),
-      onDismiss && /* @__PURE__ */ jsx13(
-        "button",
-        {
-          type: "button",
-          onClick: onDismiss,
-          className: "shrink-0 p-4 rounded-md text-toast-dismiss hover:text-toast-dismiss-hover transition-colors",
-          "aria-label": "Dismiss",
-          children: /* @__PURE__ */ jsx13(CloseIcon2, { className: "h-16 w-16" })
-        }
-      )
-    ] }));
-  }
-);
-Toast.displayName = "Toast";
-export {
-  Accordion,
-  AlertBanner,
-  Avatar,
-  Badge,
-  BottomSheet,
-  Button,
-  Checkbox,
-  Dialog,
-  Icon,
-  Radio,
-  Slider,
-  Toast
-};