@khipu/design-system 0.2.0-alpha.44 → 0.2.0-alpha.45

package/dist/index.mjs

@@ -1205,27 +1205,72 @@ var KdsSecureLoader = forwardRef6(
 );
 KdsSecureLoader.displayName = "KdsSecureLoader";
 
-// src/components/core/KdsLinearProgress/KdsLinearProgress.tsx
+// src/components/core/KdsCopyButton/KdsCopyButton.tsx
 import { forwardRef as forwardRef7 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var KdsLinearProgress = forwardRef7(
-  ({ value, max = 100, className, ...props }, ref) => /* @__PURE__ */ jsx8("progress", { ref, className: clsx("kds-progress", className), value, max, ...props })
+
+// src/components/core/hooks/useCopyToClipboard.ts
+import { useState, useCallback } from "react";
+function useCopyToClipboard(resetMs = 1200) {
+  const [copied, setCopied] = useState(false);
+  const copy = useCallback(
+    async (text) => {
+      try {
+        await navigator.clipboard.writeText(text);
+        setCopied(true);
+        setTimeout(() => setCopied(false), resetMs);
+      } catch {
+      }
+    },
+    [resetMs]
+  );
+  return { copied, copy };
+}
+
+// src/components/core/KdsCopyButton/KdsCopyButton.tsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+var KdsCopyButton = forwardRef7(
+  ({ value, copiedText = "Copiado", className, ...props }, ref) => {
+    const { copied, copy } = useCopyToClipboard();
+    return /* @__PURE__ */ jsxs6(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: clsx("kds-copy-button", copied && "copied", className),
+        onClick: () => copy(value),
+        "aria-label": `Copiar: ${value}`,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx8("span", { className: "kds-copy-button-value", children: copied ? copiedText : value }),
+          /* @__PURE__ */ jsx8("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: copied ? "check" : "content_copy" })
+        ]
+      }
+    );
+  }
+);
+KdsCopyButton.displayName = "KdsCopyButton";
+
+// src/components/core/KdsLinearProgress/KdsLinearProgress.tsx
+import { forwardRef as forwardRef8 } from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var KdsLinearProgress = forwardRef8(
+  ({ value, max = 100, className, ...props }, ref) => /* @__PURE__ */ jsx9("progress", { ref, className: clsx("kds-progress", className), value, max, ...props })
 );
 KdsLinearProgress.displayName = "KdsLinearProgress";
 
 // src/components/core/KdsAlert/KdsAlert.tsx
-import { forwardRef as forwardRef8 } from "react";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
+import { forwardRef as forwardRef9 } from "react";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 var DEFAULT_ICONS = {
   success: "check_circle",
   info: "info",
   warning: "warning",
   error: "error"
 };
-var KdsAlert = forwardRef8(
+var KdsAlert = forwardRef9(
   ({ severity, title, icon, inline, onClose, children, className, ...props }, ref) => {
     const resolvedIcon = icon === false ? null : typeof icon === "string" ? icon : DEFAULT_ICONS[severity];
-    return /* @__PURE__ */ jsxs6(
+    return /* @__PURE__ */ jsxs7(
       "div",
       {
         ref,
@@ -1233,19 +1278,19 @@ var KdsAlert = forwardRef8(
         className: clsx("kds-alert", `kds-${severity}`, inline && "kds-alert-inline", className),
         ...props,
         children: [
-          resolvedIcon && /* @__PURE__ */ jsx9("div", { className: "kds-alert-icon", children: /* @__PURE__ */ jsx9("i", { className: "material-symbols-outlined", children: resolvedIcon }) }),
-          /* @__PURE__ */ jsxs6("div", { className: "kds-alert-content", children: [
-            title && /* @__PURE__ */ jsx9("p", { className: "kds-alert-title", children: title }),
-            /* @__PURE__ */ jsx9("p", { className: "kds-alert-description", children })
+          resolvedIcon && /* @__PURE__ */ jsx10("div", { className: "kds-alert-icon", children: /* @__PURE__ */ jsx10("i", { className: "material-symbols-outlined", children: resolvedIcon }) }),
+          /* @__PURE__ */ jsxs7("div", { className: "kds-alert-content", children: [
+            title && /* @__PURE__ */ jsx10("p", { className: "kds-alert-title", children: title }),
+            /* @__PURE__ */ jsx10("p", { className: "kds-alert-description", children })
           ] }),
-          onClose && /* @__PURE__ */ jsx9(
+          onClose && /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
               className: "kds-alert-close",
               onClick: onClose,
               "aria-label": "Cerrar",
-              children: /* @__PURE__ */ jsx9("i", { className: "material-symbols-outlined", children: "close" })
+              children: /* @__PURE__ */ jsx10("i", { className: "material-symbols-outlined", children: "close" })
             }
           )
         ]
@@ -1256,8 +1301,8 @@ var KdsAlert = forwardRef8(
 KdsAlert.displayName = "KdsAlert";
 
 // src/components/core/KdsTypography/KdsTypography.tsx
-import { forwardRef as forwardRef9 } from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { forwardRef as forwardRef10 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var variantTag = {
   display1: "h1",
   display2: "h2",
@@ -1272,10 +1317,10 @@ var variantTag = {
   muted: "p",
   link: "span"
 };
-var KdsTypography = forwardRef9(
+var KdsTypography = forwardRef10(
   ({ variant = "body", color, as, children, className, ...props }, ref) => {
     const Tag = as || variantTag[variant];
-    return /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsx11(
       Tag,
       {
         ref,
@@ -1293,12 +1338,12 @@ var KdsTypography = forwardRef9(
 KdsTypography.displayName = "KdsTypography";
 
 // src/components/core/KdsTabs/KdsTabs.tsx
-import React10, { forwardRef as forwardRef10, Children, useMemo } from "react";
+import React11, { forwardRef as forwardRef11, Children, useMemo } from "react";
 
 // src/components/core/hooks/useTabsKeyboard.ts
-import { useCallback } from "react";
+import { useCallback as useCallback2 } from "react";
 function useTabsKeyboard(tabCount, activeIndex, onChange) {
-  const onKeyDown = useCallback(
+  const onKeyDown = useCallback2(
     (e) => {
       let next = activeIndex;
       if (e.key === "ArrowRight") next = (activeIndex + 1) % tabCount;
@@ -1318,8 +1363,8 @@ function useTabsKeyboard(tabCount, activeIndex, onChange) {
 }
 
 // src/components/core/KdsTabs/KdsTabs.tsx
-import { jsx as jsx11 } from "react/jsx-runtime";
-var KdsTabs = forwardRef10(
+import { jsx as jsx12 } from "react/jsx-runtime";
+var KdsTabs = forwardRef11(
   ({ activeIndex, onChange, children, className, style, ...props }, ref) => {
     const tabCount = Children.count(children);
     const { onKeyDown } = useTabsKeyboard(tabCount, activeIndex, onChange);
@@ -1331,7 +1376,7 @@ var KdsTabs = forwardRef10(
       }),
       [tabCount, activeIndex, style]
     );
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx12(
       "div",
       {
         ref,
@@ -1341,8 +1386,8 @@ var KdsTabs = forwardRef10(
         onKeyDown,
         ...props,
         children: Children.map(children, (child, i) => {
-          if (!React10.isValidElement(child)) return child;
-          return React10.cloneElement(child, {
+          if (!React11.isValidElement(child)) return child;
+          return React11.cloneElement(child, {
             _active: i === activeIndex,
             _onClick: () => onChange(i)
           });
@@ -1352,8 +1397,8 @@ var KdsTabs = forwardRef10(
   }
 );
 KdsTabs.displayName = "KdsTabs";
-var KdsTab = forwardRef10(
-  ({ _active, _onClick, children, className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var KdsTab = forwardRef11(
+  ({ _active, _onClick, children, className, ...props }, ref) => /* @__PURE__ */ jsx12(
     "button",
     {
       ref,
@@ -1369,8 +1414,8 @@ var KdsTab = forwardRef10(
   )
 );
 KdsTab.displayName = "KdsTab";
-var KdsTabPanel = forwardRef10(
-  ({ active, children, className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var KdsTabPanel = forwardRef11(
+  ({ active, children, className, ...props }, ref) => /* @__PURE__ */ jsx12(
     "div",
     {
       ref,
@@ -1385,13 +1430,13 @@ var KdsTabPanel = forwardRef10(
 KdsTabPanel.displayName = "KdsTabPanel";
 
 // src/components/core/KdsRadioGroup/KdsRadioGroup.tsx
-import { forwardRef as forwardRef11 } from "react";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
-var KdsRadioGroup = forwardRef11(
-  ({ label, name, options, value, onChange, size, className, ...props }, ref) => /* @__PURE__ */ jsxs7("fieldset", { ref, className: clsx("kds-radio-group", className), ...props, children: [
-    label && /* @__PURE__ */ jsx12("legend", { children: label }),
-    options.map((opt) => /* @__PURE__ */ jsxs7("label", { className: clsx("radio", size), children: [
-      /* @__PURE__ */ jsx12(
+import { forwardRef as forwardRef12 } from "react";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+var KdsRadioGroup = forwardRef12(
+  ({ label, name, options, value, onChange, size, className, ...props }, ref) => /* @__PURE__ */ jsxs8("fieldset", { ref, className: clsx("kds-radio-group", className), ...props, children: [
+    label && /* @__PURE__ */ jsx13("legend", { children: label }),
+    options.map((opt) => /* @__PURE__ */ jsxs8("label", { className: clsx("radio", size), children: [
+      /* @__PURE__ */ jsx13(
         "input",
         {
           type: "radio",
@@ -1402,16 +1447,16 @@ var KdsRadioGroup = forwardRef11(
           onChange: () => onChange?.(opt.value)
         }
       ),
-      /* @__PURE__ */ jsx12("span", { children: opt.label })
+      /* @__PURE__ */ jsx13("span", { children: opt.label })
     ] }, opt.value))
   ] })
 );
 KdsRadioGroup.displayName = "KdsRadioGroup";
 
 // src/components/core/KdsSelect/KdsSelect.tsx
-import { forwardRef as forwardRef12 } from "react";
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
-var KdsSelect = forwardRef12(
+import { forwardRef as forwardRef13 } from "react";
+import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+var KdsSelect = forwardRef13(
   ({
     label,
     options,
@@ -1427,7 +1472,7 @@ var KdsSelect = forwardRef12(
     ...props
   }, ref) => {
     const fieldId = id || `kds-select-${label.toLowerCase().replace(/\s+/g, "-")}`;
-    return /* @__PURE__ */ jsxs8(
+    return /* @__PURE__ */ jsxs9(
       "div",
       {
         className: clsx(
@@ -1440,8 +1485,8 @@ var KdsSelect = forwardRef12(
           className
         ),
         children: [
-          prefixIcon && /* @__PURE__ */ jsx13("i", { className: "material-symbols-outlined", children: prefixIcon }),
-          /* @__PURE__ */ jsxs8(
+          prefixIcon && /* @__PURE__ */ jsx14("i", { className: "material-symbols-outlined", children: prefixIcon }),
+          /* @__PURE__ */ jsxs9(
             "select",
             {
               ref,
@@ -1450,16 +1495,16 @@ var KdsSelect = forwardRef12(
               required,
               ...props,
               children: [
-                placeholder !== void 0 && /* @__PURE__ */ jsx13("option", { value: "", children: placeholder }),
-                options.map((opt) => /* @__PURE__ */ jsx13("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value))
+                placeholder !== void 0 && /* @__PURE__ */ jsx14("option", { value: "", children: placeholder }),
+                options.map((opt) => /* @__PURE__ */ jsx14("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value))
               ]
             }
           ),
-          /* @__PURE__ */ jsxs8("label", { htmlFor: fieldId, children: [
+          /* @__PURE__ */ jsxs9("label", { htmlFor: fieldId, children: [
             label,
             required && " *"
           ] }),
-          helperText && /* @__PURE__ */ jsx13("span", { className: "helper", children: helperText })
+          helperText && /* @__PURE__ */ jsx14("span", { className: "helper", children: helperText })
         ]
       }
     );
@@ -1468,13 +1513,13 @@ var KdsSelect = forwardRef12(
 KdsSelect.displayName = "KdsSelect";
 
 // src/components/core/KdsChip/KdsChip.tsx
-import { forwardRef as forwardRef13 } from "react";
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
-var KdsChip = forwardRef13(
-  ({ color, icon, onDelete, children, className, ...props }, ref) => /* @__PURE__ */ jsxs9("span", { ref, className: clsx("kds-badge", color, className), ...props, children: [
-    icon && /* @__PURE__ */ jsx14("i", { className: "material-symbols-outlined", children: icon }),
-    /* @__PURE__ */ jsx14("span", { children }),
-    onDelete && /* @__PURE__ */ jsx14(
+import { forwardRef as forwardRef14 } from "react";
+import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+var KdsChip = forwardRef14(
+  ({ color, icon, onDelete, children, className, ...props }, ref) => /* @__PURE__ */ jsxs10("span", { ref, className: clsx("kds-badge", color, className), ...props, children: [
+    icon && /* @__PURE__ */ jsx15("i", { className: "material-symbols-outlined", children: icon }),
+    /* @__PURE__ */ jsx15("span", { children }),
+    onDelete && /* @__PURE__ */ jsx15(
       "button",
       {
         type: "button",
@@ -1484,7 +1529,7 @@ var KdsChip = forwardRef13(
           onDelete();
         },
         "aria-label": "Eliminar",
-        children: /* @__PURE__ */ jsx14("i", { className: "material-symbols-outlined", children: "close" })
+        children: /* @__PURE__ */ jsx15("i", { className: "material-symbols-outlined", children: "close" })
       }
     )
   ] })
@@ -1492,12 +1537,12 @@ var KdsChip = forwardRef13(
 KdsChip.displayName = "KdsChip";
 
 // src/components/core/KdsSnackbar/KdsSnackbar.tsx
-import { forwardRef as forwardRef14 } from "react";
+import { forwardRef as forwardRef15 } from "react";
 
 // src/components/core/hooks/useAutoHide.ts
-import { useState, useEffect, useRef } from "react";
+import { useState as useState2, useEffect, useRef } from "react";
 function useAutoHide(durationMs, onHide) {
-  const [visible, setVisible] = useState(true);
+  const [visible, setVisible] = useState2(true);
   const onHideRef = useRef(onHide);
   onHideRef.current = onHide;
   useEffect(() => {
@@ -1512,13 +1557,13 @@ function useAutoHide(durationMs, onHide) {
 }
 
 // src/components/core/KdsSnackbar/KdsSnackbar.tsx
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 var DEFAULT_ICONS2 = {
   info: "info",
   success: "check_circle",
   error: "error"
 };
-var KdsSnackbar = forwardRef14(
+var KdsSnackbar = forwardRef15(
   ({
     message,
     type = "info",
@@ -1535,7 +1580,7 @@ var KdsSnackbar = forwardRef14(
     if (!open || !visible) return null;
     const resolvedIcon = icon === false ? null : icon ?? DEFAULT_ICONS2[type];
     const mergedStyle = autoDismiss ? { ...style, ["--kds-snackbar-duration"]: `${duration}ms` } : style ?? {};
-    return /* @__PURE__ */ jsxs10(
+    return /* @__PURE__ */ jsxs11(
       "div",
       {
         ref,
@@ -1545,16 +1590,16 @@ var KdsSnackbar = forwardRef14(
         style: mergedStyle,
         ...props,
         children: [
-          resolvedIcon && /* @__PURE__ */ jsx15("i", { className: "material-symbols-outlined", children: resolvedIcon }),
-          /* @__PURE__ */ jsx15("span", { className: "max", children: message }),
-          onClose && /* @__PURE__ */ jsx15(
+          resolvedIcon && /* @__PURE__ */ jsx16("i", { className: "material-symbols-outlined", children: resolvedIcon }),
+          /* @__PURE__ */ jsx16("span", { className: "max", children: message }),
+          onClose && /* @__PURE__ */ jsx16(
             "button",
             {
               type: "button",
               className: "kds-snackbar-close",
               onClick: onClose,
               "aria-label": "Cerrar",
-              children: /* @__PURE__ */ jsx15("i", { className: "material-symbols-outlined", children: "close" })
+              children: /* @__PURE__ */ jsx16("i", { className: "material-symbols-outlined", children: "close" })
             }
           )
         ]
@@ -1566,7 +1611,7 @@ KdsSnackbar.displayName = "KdsSnackbar";
 
 // src/components/core/KdsTooltip/KdsTooltip.tsx
 import * as Tooltip from "@radix-ui/react-tooltip";
-import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 function KdsTooltip({
   content,
   children,
@@ -1577,9 +1622,9 @@ function KdsTooltip({
   onOpenChange,
   delayDuration = 300
 }) {
-  return /* @__PURE__ */ jsx16(Tooltip.Provider, { delayDuration, children: /* @__PURE__ */ jsxs11(Tooltip.Root, { open, defaultOpen, onOpenChange, children: [
-    /* @__PURE__ */ jsx16(Tooltip.Trigger, { asChild: true, children }),
-    /* @__PURE__ */ jsx16(Tooltip.Portal, { children: /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsx17(Tooltip.Provider, { delayDuration, children: /* @__PURE__ */ jsxs12(Tooltip.Root, { open, defaultOpen, onOpenChange, children: [
+    /* @__PURE__ */ jsx17(Tooltip.Trigger, { asChild: true, children }),
+    /* @__PURE__ */ jsx17(Tooltip.Portal, { children: /* @__PURE__ */ jsxs12(
       Tooltip.Content,
       {
         className: clsx("kds-tooltip", className),
@@ -1588,7 +1633,7 @@ function KdsTooltip({
         collisionPadding: 8,
         children: [
           content,
-          /* @__PURE__ */ jsx16(Tooltip.Arrow, { className: "kds-tooltip-arrow", width: 10, height: 5 })
+          /* @__PURE__ */ jsx17(Tooltip.Arrow, { className: "kds-tooltip-arrow", width: 10, height: 5 })
         ]
       }
     ) })
@@ -1596,68 +1641,68 @@ function KdsTooltip({
 }
 
 // src/components/core/KdsAccordion/KdsAccordion.tsx
-import { forwardRef as forwardRef15 } from "react";
-import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
-var KdsAccordion = forwardRef15(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx17("details", { ref, className: clsx("kds-accordion", className), ...props, children })
+import { forwardRef as forwardRef16 } from "react";
+import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+var KdsAccordion = forwardRef16(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx18("details", { ref, className: clsx("kds-accordion", className), ...props, children })
 );
 KdsAccordion.displayName = "KdsAccordion";
-var KdsAccordionSummary = forwardRef15(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsxs12("summary", { ref, className: clsx("kds-accordion-summary", className), ...props, children: [
+var KdsAccordionSummary = forwardRef16(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsxs13("summary", { ref, className: clsx("kds-accordion-summary", className), ...props, children: [
     children,
-    /* @__PURE__ */ jsx17("i", { className: "material-symbols-outlined", children: "expand_more" })
+    /* @__PURE__ */ jsx18("i", { className: "material-symbols-outlined", children: "expand_more" })
   ] })
 );
 KdsAccordionSummary.displayName = "KdsAccordionSummary";
-var KdsAccordionDetails = forwardRef15(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx17("div", { ref, className: clsx("kds-accordion-details", className), ...props, children })
+var KdsAccordionDetails = forwardRef16(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx18("div", { ref, className: clsx("kds-accordion-details", className), ...props, children })
 );
 KdsAccordionDetails.displayName = "KdsAccordionDetails";
 
 // src/components/core/KdsDivider/KdsDivider.tsx
-import { forwardRef as forwardRef16 } from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
-var KdsDivider = forwardRef16(
-  ({ dashed, className, ...props }, ref) => /* @__PURE__ */ jsx18("hr", { ref, className: clsx(dashed ? "kds-hr-dashed" : "kds-hr", className), ...props })
+import { forwardRef as forwardRef17 } from "react";
+import { jsx as jsx19 } from "react/jsx-runtime";
+var KdsDivider = forwardRef17(
+  ({ dashed, className, ...props }, ref) => /* @__PURE__ */ jsx19("hr", { ref, className: clsx(dashed ? "kds-hr-dashed" : "kds-hr", className), ...props })
 );
 KdsDivider.displayName = "KdsDivider";
 
 // src/components/core/KdsSectionNote/KdsSectionNote.tsx
-import { forwardRef as forwardRef17 } from "react";
-import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
-var KdsSectionNote = forwardRef17(
-  ({ icon = "info", children, className, ...props }, ref) => /* @__PURE__ */ jsxs13("p", { ref, className: clsx("kds-section-note", className), ...props, children: [
-    /* @__PURE__ */ jsx19("i", { className: "material-symbols-outlined", children: icon }),
-    /* @__PURE__ */ jsx19("span", { children })
+import { forwardRef as forwardRef18 } from "react";
+import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
+var KdsSectionNote = forwardRef18(
+  ({ icon = "info", children, className, ...props }, ref) => /* @__PURE__ */ jsxs14("p", { ref, className: clsx("kds-section-note", className), ...props, children: [
+    /* @__PURE__ */ jsx20("i", { className: "material-symbols-outlined", children: icon }),
+    /* @__PURE__ */ jsx20("span", { children })
   ] })
 );
 KdsSectionNote.displayName = "KdsSectionNote";
 
 // src/components/core/KdsStatusBlock/KdsStatusBlock.tsx
-import { forwardRef as forwardRef18 } from "react";
-import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
-var KdsStatusBlock = forwardRef18(
-  ({ status, icon, title, description, inline, className, ...props }, ref) => /* @__PURE__ */ jsxs14("div", { ref, className: clsx("kds-status-block", inline && "inline", className), "data-status": status, ...props, children: [
-    /* @__PURE__ */ jsx20("div", { className: "kds-status-block-icon", children: icon && /* @__PURE__ */ jsx20("i", { className: "material-symbols-outlined", children: icon }) }),
-    /* @__PURE__ */ jsxs14("div", { children: [
-      /* @__PURE__ */ jsx20("h2", { className: "kds-status-block-title", children: title }),
-      description && /* @__PURE__ */ jsx20("p", { className: "kds-status-block-description", children: description })
+import { forwardRef as forwardRef19 } from "react";
+import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
+var KdsStatusBlock = forwardRef19(
+  ({ status, icon, title, description, inline, className, ...props }, ref) => /* @__PURE__ */ jsxs15("div", { ref, className: clsx("kds-status-block", inline && "inline", className), "data-status": status, ...props, children: [
+    /* @__PURE__ */ jsx21("div", { className: "kds-status-block-icon", children: icon && /* @__PURE__ */ jsx21("i", { className: "material-symbols-outlined", children: icon }) }),
+    /* @__PURE__ */ jsxs15("div", { children: [
+      /* @__PURE__ */ jsx21("h2", { className: "kds-status-block-title", children: title }),
+      description && /* @__PURE__ */ jsx21("p", { className: "kds-status-block-description", children: description })
     ] })
   ] })
 );
 KdsStatusBlock.displayName = "KdsStatusBlock";
 
 // src/components/core/KdsStepper/KdsStepper.tsx
-import { forwardRef as forwardRef19 } from "react";
-import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
-var KdsStepper = forwardRef19(
-  ({ steps, current, className, ...props }, ref) => /* @__PURE__ */ jsx21("div", { ref, className: clsx("kds-stepper", className), ...props, children: steps.map((label, i) => /* @__PURE__ */ jsxs15(
+import { forwardRef as forwardRef20 } from "react";
+import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
+var KdsStepper = forwardRef20(
+  ({ steps, current, className, ...props }, ref) => /* @__PURE__ */ jsx22("div", { ref, className: clsx("kds-stepper", className), ...props, children: steps.map((label, i) => /* @__PURE__ */ jsxs16(
     "div",
     {
       className: clsx("kds-step", i < current && "completed", i === current && "current"),
       children: [
-        /* @__PURE__ */ jsx21("div", { className: "kds-step-indicator" }),
-        /* @__PURE__ */ jsx21("div", { className: "kds-step-label", children: label })
+        /* @__PURE__ */ jsx22("div", { className: "kds-step-indicator" }),
+        /* @__PURE__ */ jsx22("div", { className: "kds-step-label", children: label })
       ]
     },
     `${i}-${label}`
@@ -1666,32 +1711,12 @@ var KdsStepper = forwardRef19(
 KdsStepper.displayName = "KdsStepper";
 
 // src/components/core/KdsCopyRow/KdsCopyRow.tsx
-import { forwardRef as forwardRef20 } from "react";
-
-// src/components/core/hooks/useCopyToClipboard.ts
-import { useState as useState2, useCallback as useCallback2 } from "react";
-function useCopyToClipboard(resetMs = 1200) {
-  const [copied, setCopied] = useState2(false);
-  const copy = useCallback2(
-    async (text) => {
-      try {
-        await navigator.clipboard.writeText(text);
-        setCopied(true);
-        setTimeout(() => setCopied(false), resetMs);
-      } catch {
-      }
-    },
-    [resetMs]
-  );
-  return { copied, copy };
-}
-
-// src/components/core/KdsCopyRow/KdsCopyRow.tsx
-import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
-var KdsCopyRow = forwardRef20(
+import { forwardRef as forwardRef21 } from "react";
+import { jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
+var KdsCopyRow = forwardRef21(
   ({ label, value, copiedText = "Copiado", className, ...props }, ref) => {
     const { copied, copy } = useCopyToClipboard();
-    return /* @__PURE__ */ jsxs16(
+    return /* @__PURE__ */ jsxs17(
       "button",
       {
         ref,
@@ -1702,13 +1727,13 @@ var KdsCopyRow = forwardRef20(
         "aria-label": `Copiar ${label}: ${value}`,
         ...props,
         children: [
-          /* @__PURE__ */ jsx22("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "content_copy" }),
-          /* @__PURE__ */ jsxs16("div", { children: [
-            /* @__PURE__ */ jsx22("span", { className: "kds-copy-row-label", children: label }),
-            /* @__PURE__ */ jsx22("span", { className: "kds-copy-row-value", children: value })
+          /* @__PURE__ */ jsx23("i", { className: "material-symbols-outlined", "aria-hidden": "true", children: "content_copy" }),
+          /* @__PURE__ */ jsxs17("div", { children: [
+            /* @__PURE__ */ jsx23("span", { className: "kds-copy-row-label", children: label }),
+            /* @__PURE__ */ jsx23("span", { className: "kds-copy-row-value", children: value })
           ] }),
-          /* @__PURE__ */ jsxs16("span", { className: "kds-copy-toast", "aria-hidden": "true", children: [
-            /* @__PURE__ */ jsx22("i", { className: "material-symbols-outlined", children: "check_circle" }),
+          /* @__PURE__ */ jsxs17("span", { className: "kds-copy-toast", "aria-hidden": "true", children: [
+            /* @__PURE__ */ jsx23("i", { className: "material-symbols-outlined", children: "check_circle" }),
             " ",
             copiedText
           ] })
@@ -1720,8 +1745,8 @@ var KdsCopyRow = forwardRef20(
 KdsCopyRow.displayName = "KdsCopyRow";
 
 // src/components/core/KdsCopyableTable/KdsCopyableTable.tsx
-import { forwardRef as forwardRef21, useState as useState3, useRef as useRef2, useCallback as useCallback3 } from "react";
-import { Fragment as Fragment2, jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
+import { forwardRef as forwardRef22, useState as useState3, useRef as useRef2, useCallback as useCallback3 } from "react";
+import { Fragment as Fragment2, jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 async function copyToClipboard(text) {
   try {
     if (navigator.clipboard?.writeText) {
@@ -1746,7 +1771,7 @@ async function copyToClipboard(text) {
   }
 }
 var TRANSITION_MS = 300;
-var KdsCopyableTable = forwardRef21(
+var KdsCopyableTable = forwardRef22(
   ({
     rows,
     copyAllLabel = "Copiar todos los datos",
@@ -1819,8 +1844,8 @@ var KdsCopyableTable = forwardRef21(
         setTimeout(() => setAllCopied(false), 2e3);
       }
     };
-    return /* @__PURE__ */ jsxs17(Fragment2, { children: [
-      /* @__PURE__ */ jsx23("div", { ref, className: clsx("kds-copyable-table", className), ...props, children: rows.map((row, i) => /* @__PURE__ */ jsxs17(
+    return /* @__PURE__ */ jsxs18(Fragment2, { children: [
+      /* @__PURE__ */ jsx24("div", { ref, className: clsx("kds-copyable-table", className), ...props, children: rows.map((row, i) => /* @__PURE__ */ jsxs18(
         "div",
         {
           className: clsx(
@@ -1839,13 +1864,13 @@ var KdsCopyableTable = forwardRef21(
           },
           "aria-label": `Copiar ${row.label}: ${row.value}`,
           children: [
-            /* @__PURE__ */ jsx23("span", { className: "kds-key", children: row.label }),
-            /* @__PURE__ */ jsx23("span", { className: "kds-value", children: row.value })
+            /* @__PURE__ */ jsx24("span", { className: "kds-key", children: row.label }),
+            /* @__PURE__ */ jsx24("span", { className: "kds-value", children: row.value })
           ]
         },
         `${row.label}-${i}`
       )) }),
-      showCopyAll && /* @__PURE__ */ jsxs17(
+      showCopyAll && /* @__PURE__ */ jsxs18(
         "button",
         {
           type: "button",
@@ -1859,8 +1884,8 @@ var KdsCopyableTable = forwardRef21(
           onClick: handleCopyAll,
           "aria-label": allCopied ? copiedAllLabel : copyAllLabel,
           children: [
-            /* @__PURE__ */ jsx23("span", { className: "kds-icon", children: /* @__PURE__ */ jsx23("i", { className: "material-symbols-outlined", children: allCopied ? "check" : "content_copy" }) }),
-            /* @__PURE__ */ jsx23("span", { children: allCopied ? copiedAllLabel : copyAllLabel })
+            /* @__PURE__ */ jsx24("span", { className: "kds-icon", children: /* @__PURE__ */ jsx24("i", { className: "material-symbols-outlined", children: allCopied ? "check" : "content_copy" }) }),
+            /* @__PURE__ */ jsx24("span", { children: allCopied ? copiedAllLabel : copyAllLabel })
           ]
         }
       )
@@ -1870,32 +1895,32 @@ var KdsCopyableTable = forwardRef21(
 KdsCopyableTable.displayName = "KdsCopyableTable";
 
 // src/components/core/KdsExpandPanel/KdsExpandPanel.tsx
-import { forwardRef as forwardRef22, useState as useState4 } from "react";
-import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
-var KdsExpandPanel = forwardRef22(
+import { forwardRef as forwardRef23, useState as useState4 } from "react";
+import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
+var KdsExpandPanel = forwardRef23(
   ({ label, defaultExpanded = false, children, className, ...props }, ref) => {
     const [expanded, setExpanded] = useState4(defaultExpanded);
-    return /* @__PURE__ */ jsxs18("div", { ref, className, ...props, children: [
-      /* @__PURE__ */ jsxs18(
+    return /* @__PURE__ */ jsxs19("div", { ref, className, ...props, children: [
+      /* @__PURE__ */ jsxs19(
         "button",
         {
           className: "kds-expand-toggle",
           onClick: () => setExpanded((v) => !v),
           "aria-expanded": expanded,
           children: [
-            /* @__PURE__ */ jsx24("span", { children: label }),
-            /* @__PURE__ */ jsx24("i", { className: "material-symbols-outlined", children: expanded ? "expand_less" : "expand_more" })
+            /* @__PURE__ */ jsx25("span", { children: label }),
+            /* @__PURE__ */ jsx25("i", { className: "material-symbols-outlined", children: expanded ? "expand_less" : "expand_more" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx24("div", { className: clsx("kds-expand-panel", expanded && "open"), hidden: !expanded, children })
+      /* @__PURE__ */ jsx25("div", { className: clsx("kds-expand-panel", expanded && "open"), hidden: !expanded, children })
     ] });
   }
 );
 KdsExpandPanel.displayName = "KdsExpandPanel";
 
 // src/components/core/KdsCountdown/KdsCountdown.tsx
-import { forwardRef as forwardRef23, useEffect as useEffect3, useRef as useRef3 } from "react";
+import { forwardRef as forwardRef24, useEffect as useEffect3, useRef as useRef3 } from "react";
 
 // src/components/core/hooks/useCountdown.ts
 import { useState as useState5, useEffect as useEffect2 } from "react";
@@ -1921,8 +1946,8 @@ function useCountdown(deadline) {
 }
 
 // src/components/core/KdsCountdown/KdsCountdown.tsx
-import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
-var KdsCountdown = forwardRef23(
+import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
+var KdsCountdown = forwardRef24(
   ({ deadline, label, onExpire, className, ...props }, ref) => {
     const { hours, minutes, seconds, expired, urgent } = useCountdown(deadline);
     const onExpireRef = useRef3(onExpire);
@@ -1936,9 +1961,9 @@ var KdsCountdown = forwardRef23(
       return null;
     }
     const pad = (n) => String(n).padStart(2, "0");
-    return /* @__PURE__ */ jsxs19("div", { ref, className: clsx("kds-countdown", urgent && "urgent", className), ...props, children: [
-      label && /* @__PURE__ */ jsx25("span", { className: "kds-countdown-label", children: label }),
-      /* @__PURE__ */ jsxs19("span", { className: "kds-countdown-value", children: [
+    return /* @__PURE__ */ jsxs20("div", { ref, className: clsx("kds-countdown", urgent && "urgent", className), ...props, children: [
+      label && /* @__PURE__ */ jsx26("span", { className: "kds-countdown-label", children: label }),
+      /* @__PURE__ */ jsxs20("span", { className: "kds-countdown-value", children: [
         pad(hours),
         ":",
         pad(minutes),
@@ -1951,18 +1976,18 @@ var KdsCountdown = forwardRef23(
 KdsCountdown.displayName = "KdsCountdown";
 
 // src/components/core/KdsSegmentedTabs/KdsSegmentedTabs.tsx
-import { forwardRef as forwardRef24 } from "react";
-import { jsx as jsx26 } from "react/jsx-runtime";
-var KdsSegmentedTabs = forwardRef24(
-  (props, ref) => /* @__PURE__ */ jsx26(KdsTabs, { ref, ...props })
+import { forwardRef as forwardRef25 } from "react";
+import { jsx as jsx27 } from "react/jsx-runtime";
+var KdsSegmentedTabs = forwardRef25(
+  (props, ref) => /* @__PURE__ */ jsx27(KdsTabs, { ref, ...props })
 );
 KdsSegmentedTabs.displayName = "KdsSegmentedTabs";
 
 // src/components/domain/KdsBankRow/KdsBankRow.tsx
-import { forwardRef as forwardRef25 } from "react";
-import { jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
-var KdsBankRow = forwardRef25(
-  ({ name, logoUrl, selected, className, ...props }, ref) => /* @__PURE__ */ jsxs20(
+import { forwardRef as forwardRef26 } from "react";
+import { jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
+var KdsBankRow = forwardRef26(
+  ({ name, logoUrl, selected, className, ...props }, ref) => /* @__PURE__ */ jsxs21(
     "button",
     {
       ref,
@@ -1970,9 +1995,9 @@ var KdsBankRow = forwardRef25(
       className: clsx("kds-bank-row", selected && "selected", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx27("span", { className: "kds-bank-row-logo", children: logoUrl ? /* @__PURE__ */ jsx27("img", { src: logoUrl, alt: name }) : /* @__PURE__ */ jsx27("span", { className: "initials", children: name.charAt(0) }) }),
-        /* @__PURE__ */ jsx27("span", { className: "kds-bank-row-name", children: name }),
-        /* @__PURE__ */ jsx27("i", { className: "material-symbols-outlined", children: selected ? "check_circle" : "chevron_right" })
+        /* @__PURE__ */ jsx28("span", { className: "kds-bank-row-logo", children: logoUrl ? /* @__PURE__ */ jsx28("img", { src: logoUrl, alt: name }) : /* @__PURE__ */ jsx28("span", { className: "initials", children: name.charAt(0) }) }),
+        /* @__PURE__ */ jsx28("span", { className: "kds-bank-row-name", children: name }),
+        /* @__PURE__ */ jsx28("i", { className: "material-symbols-outlined", children: selected ? "check_circle" : "chevron_right" })
       ]
     }
   )
@@ -1980,32 +2005,32 @@ var KdsBankRow = forwardRef25(
 KdsBankRow.displayName = "KdsBankRow";
 
 // src/components/domain/KdsBankList/KdsBankList.tsx
-import { forwardRef as forwardRef26 } from "react";
-import { jsx as jsx28 } from "react/jsx-runtime";
-var KdsBankList = forwardRef26(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx28("div", { ref, className: clsx("kds-bank-list", className), role: "list", ...props, children })
+import { forwardRef as forwardRef27 } from "react";
+import { jsx as jsx29 } from "react/jsx-runtime";
+var KdsBankList = forwardRef27(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx29("div", { ref, className: clsx("kds-bank-list", className), role: "list", ...props, children })
 );
 KdsBankList.displayName = "KdsBankList";
 
 // src/components/domain/KdsBankModal/KdsBankModal.tsx
-import { forwardRef as forwardRef27, useState as useState6 } from "react";
+import { forwardRef as forwardRef28, useState as useState6 } from "react";
 import * as Dialog from "@radix-ui/react-dialog";
-import { jsx as jsx29, jsxs as jsxs21 } from "react/jsx-runtime";
-var KdsBankModal = forwardRef27(
+import { jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
+var KdsBankModal = forwardRef28(
   ({ open, onClose, title = "Selecciona tu banco", searchPlaceholder = "Buscar banco...", onSearch, children, className, container }, ref) => {
     const [query, setQuery] = useState6("");
     const handleSearch = (value) => {
       setQuery(value);
       onSearch?.(value);
     };
-    return /* @__PURE__ */ jsx29(Dialog.Root, { open, onOpenChange: (o) => {
+    return /* @__PURE__ */ jsx30(Dialog.Root, { open, onOpenChange: (o) => {
       if (!o) onClose();
-    }, children: /* @__PURE__ */ jsx29(Dialog.Portal, { container, children: /* @__PURE__ */ jsx29(Dialog.Overlay, { className: "kds-bank-modal-scrim open", children: /* @__PURE__ */ jsxs21(Dialog.Content, { ref, className: clsx("kds-bank-modal", className), children: [
-      /* @__PURE__ */ jsxs21("div", { className: "kds-bank-modal-header", children: [
-        /* @__PURE__ */ jsx29(Dialog.Title, { asChild: true, children: /* @__PURE__ */ jsx29("h3", { children: title }) }),
-        /* @__PURE__ */ jsx29(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx29("button", { className: "kds-bank-modal-close", "aria-label": "Cerrar", children: /* @__PURE__ */ jsx29("i", { className: "material-symbols-outlined", children: "close" }) }) })
+    }, children: /* @__PURE__ */ jsx30(Dialog.Portal, { container, children: /* @__PURE__ */ jsx30(Dialog.Overlay, { className: "kds-bank-modal-scrim open", children: /* @__PURE__ */ jsxs22(Dialog.Content, { ref, className: clsx("kds-bank-modal", className), children: [
+      /* @__PURE__ */ jsxs22("div", { className: "kds-bank-modal-header", children: [
+        /* @__PURE__ */ jsx30(Dialog.Title, { asChild: true, children: /* @__PURE__ */ jsx30("h3", { children: title }) }),
+        /* @__PURE__ */ jsx30(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx30("button", { className: "kds-bank-modal-close", "aria-label": "Cerrar", children: /* @__PURE__ */ jsx30("i", { className: "material-symbols-outlined", children: "close" }) }) })
       ] }),
-      /* @__PURE__ */ jsx29("div", { className: "kds-bank-modal-search", children: /* @__PURE__ */ jsx29(
+      /* @__PURE__ */ jsx30("div", { className: "kds-bank-modal-search", children: /* @__PURE__ */ jsx30(
         "input",
         {
           type: "text",
@@ -2014,33 +2039,33 @@ var KdsBankModal = forwardRef27(
           onChange: (e) => handleSearch(e.target.value)
         }
       ) }),
-      /* @__PURE__ */ jsx29("div", { className: "kds-bank-modal-body", children })
+      /* @__PURE__ */ jsx30("div", { className: "kds-bank-modal-body", children })
     ] }) }) }) });
   }
 );
 KdsBankModal.displayName = "KdsBankModal";
 
 // src/components/domain/KdsQrRow/KdsQrRow.tsx
-import { forwardRef as forwardRef28 } from "react";
-import { jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
-var KdsQrRow = forwardRef28(
-  ({ name, description, badge, icon = "qr_code_2", className, ...props }, ref) => /* @__PURE__ */ jsxs22("button", { ref, type: "button", className: clsx("kds-qr-row", className), ...props, children: [
-    /* @__PURE__ */ jsx30("span", { className: "kds-qr-avatar", "aria-hidden": "true", children: /* @__PURE__ */ jsx30("i", { className: "material-symbols-outlined", children: icon }) }),
-    /* @__PURE__ */ jsxs22("span", { className: "kds-qr-text", children: [
-      /* @__PURE__ */ jsx30("span", { className: "kds-qr-title", children: name }),
-      description && /* @__PURE__ */ jsx30("span", { className: "kds-qr-subtitle", children: description })
+import { forwardRef as forwardRef29 } from "react";
+import { jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
+var KdsQrRow = forwardRef29(
+  ({ name, description, badge, icon = "qr_code_2", className, ...props }, ref) => /* @__PURE__ */ jsxs23("button", { ref, type: "button", className: clsx("kds-qr-row", className), ...props, children: [
+    /* @__PURE__ */ jsx31("span", { className: "kds-qr-avatar", "aria-hidden": "true", children: /* @__PURE__ */ jsx31("i", { className: "material-symbols-outlined", children: icon }) }),
+    /* @__PURE__ */ jsxs23("span", { className: "kds-qr-text", children: [
+      /* @__PURE__ */ jsx31("span", { className: "kds-qr-title", children: name }),
+      description && /* @__PURE__ */ jsx31("span", { className: "kds-qr-subtitle", children: description })
     ] }),
-    badge && /* @__PURE__ */ jsx30("span", { className: "kds-qr-badge", children: badge }),
-    /* @__PURE__ */ jsx30("i", { className: "material-symbols-outlined", children: "chevron_right" })
+    badge && /* @__PURE__ */ jsx31("span", { className: "kds-qr-badge", children: badge }),
+    /* @__PURE__ */ jsx31("i", { className: "material-symbols-outlined", children: "chevron_right" })
   ] })
 );
 KdsQrRow.displayName = "KdsQrRow";
 
 // src/components/domain/KdsCardSelector/KdsCardSelector.tsx
-import { forwardRef as forwardRef29 } from "react";
-import { jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
-var KdsCardSelector = forwardRef29(
-  ({ icon, title, description, selected, className, ...props }, ref) => /* @__PURE__ */ jsxs23(
+import { forwardRef as forwardRef30 } from "react";
+import { jsx as jsx32, jsxs as jsxs24 } from "react/jsx-runtime";
+var KdsCardSelector = forwardRef30(
+  ({ icon, title, description, selected, className, ...props }, ref) => /* @__PURE__ */ jsxs24(
     "button",
     {
       ref,
@@ -2048,9 +2073,9 @@ var KdsCardSelector = forwardRef29(
       className: clsx("kds-card-selector", selected && "selected", className),
       ...props,
       children: [
-        icon && /* @__PURE__ */ jsx31("span", { className: "kds-card-selector-icon", children: /* @__PURE__ */ jsx31("i", { className: "material-symbols-outlined", children: icon }) }),
-        /* @__PURE__ */ jsx31("span", { className: "kds-card-selector-title", children: title }),
-        description && /* @__PURE__ */ jsx31("span", { className: "kds-card-selector-description", children: description })
+        icon && /* @__PURE__ */ jsx32("span", { className: "kds-card-selector-icon", children: /* @__PURE__ */ jsx32("i", { className: "material-symbols-outlined", children: icon }) }),
+        /* @__PURE__ */ jsx32("span", { className: "kds-card-selector-title", children: title }),
+        description && /* @__PURE__ */ jsx32("span", { className: "kds-card-selector-description", children: description })
       ]
     }
   )
@@ -2058,26 +2083,26 @@ var KdsCardSelector = forwardRef29(
 KdsCardSelector.displayName = "KdsCardSelector";
 
 // src/components/domain/KdsCardPlan/KdsCardPlan.tsx
-import { forwardRef as forwardRef30 } from "react";
-import { jsx as jsx32, jsxs as jsxs24 } from "react/jsx-runtime";
-var KdsCardPlan = forwardRef30(
-  ({ title, price, period, features, recommended, badgeText, action, className, ...props }, ref) => /* @__PURE__ */ jsxs24(
+import { forwardRef as forwardRef31 } from "react";
+import { jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
+var KdsCardPlan = forwardRef31(
+  ({ title, price, period, features, recommended, badgeText, action, className, ...props }, ref) => /* @__PURE__ */ jsxs25(
     "div",
     {
       ref,
       className: clsx("kds-card-plan", recommended && "recommended", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx32("div", { className: "kds-card-plan-header", children: /* @__PURE__ */ jsx32("h3", { children: title }) }),
-        /* @__PURE__ */ jsxs24("div", { className: "kds-card-plan-price", children: [
-          /* @__PURE__ */ jsx32("span", { className: "kds-price", children: price }),
-          period && /* @__PURE__ */ jsxs24("span", { className: "kds-price-period", children: [
+        /* @__PURE__ */ jsx33("div", { className: "kds-card-plan-header", children: /* @__PURE__ */ jsx33("h3", { children: title }) }),
+        /* @__PURE__ */ jsxs25("div", { className: "kds-card-plan-price", children: [
+          /* @__PURE__ */ jsx33("span", { className: "kds-price", children: price }),
+          period && /* @__PURE__ */ jsxs25("span", { className: "kds-price-period", children: [
             "/",
             period
           ] })
         ] }),
-        badgeText && /* @__PURE__ */ jsx32("span", { className: "kds-card-plan-badge", children: badgeText }),
-        features && features.length > 0 && /* @__PURE__ */ jsx32("ul", { className: "kds-card-plan-features", children: features.map((f, i) => /* @__PURE__ */ jsx32("li", { children: f }, i)) }),
+        badgeText && /* @__PURE__ */ jsx33("span", { className: "kds-card-plan-badge", children: badgeText }),
+        features && features.length > 0 && /* @__PURE__ */ jsx33("ul", { className: "kds-card-plan-features", children: features.map((f, i) => /* @__PURE__ */ jsx33("li", { children: f }, i)) }),
         action
       ]
     }
@@ -2086,18 +2111,18 @@ var KdsCardPlan = forwardRef30(
 KdsCardPlan.displayName = "KdsCardPlan";
 
 // src/components/domain/KdsInvoiceSticky/KdsInvoiceSticky.tsx
-import { forwardRef as forwardRef31 } from "react";
-import { jsx as jsx33 } from "react/jsx-runtime";
-var KdsInvoiceSticky = forwardRef31(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx33("div", { ref, className: clsx("kds-card-elevated", "kds-invoice-sticky", className), ...props, children })
+import { forwardRef as forwardRef32 } from "react";
+import { jsx as jsx34 } from "react/jsx-runtime";
+var KdsInvoiceSticky = forwardRef32(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx34("div", { ref, className: clsx("kds-card-elevated", "kds-invoice-sticky", className), ...props, children })
 );
 KdsInvoiceSticky.displayName = "KdsInvoiceSticky";
 
 // src/components/domain/KdsBottomSheet/KdsBottomSheet.tsx
-import { forwardRef as forwardRef32 } from "react";
+import { forwardRef as forwardRef33 } from "react";
 import * as Dialog2 from "@radix-ui/react-dialog";
-import { jsx as jsx34, jsxs as jsxs25 } from "react/jsx-runtime";
-var KdsBottomSheet = forwardRef32(
+import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
+var KdsBottomSheet = forwardRef33(
   ({
     open,
     onClose,
@@ -2109,14 +2134,14 @@ var KdsBottomSheet = forwardRef32(
     showCloseButton = false,
     container,
     className
-  }, ref) => /* @__PURE__ */ jsx34(
+  }, ref) => /* @__PURE__ */ jsx35(
     Dialog2.Root,
     {
       open,
       onOpenChange: (o) => {
         if (!o) onClose();
       },
-      children: /* @__PURE__ */ jsx34(Dialog2.Portal, { container, children: /* @__PURE__ */ jsx34(Dialog2.Overlay, { className: "kds-bottom-sheet-scrim open", children: /* @__PURE__ */ jsxs25(
+      children: /* @__PURE__ */ jsx35(Dialog2.Portal, { container, children: /* @__PURE__ */ jsx35(Dialog2.Overlay, { className: "kds-bottom-sheet-scrim open", children: /* @__PURE__ */ jsxs26(
         Dialog2.Content,
         {
           ref,
@@ -2126,20 +2151,20 @@ var KdsBottomSheet = forwardRef32(
             if (target.closest(".kds-bottom-sheet")) e.preventDefault();
           },
           children: [
-            showGrabber && /* @__PURE__ */ jsx34("div", { className: "kds-bottom-sheet-grabber", "aria-hidden": "true" }),
-            showCloseButton && /* @__PURE__ */ jsx34(Dialog2.Close, { asChild: true, children: /* @__PURE__ */ jsx34(
+            showGrabber && /* @__PURE__ */ jsx35("div", { className: "kds-bottom-sheet-grabber", "aria-hidden": "true" }),
+            showCloseButton && /* @__PURE__ */ jsx35(Dialog2.Close, { asChild: true, children: /* @__PURE__ */ jsx35(
               "button",
               {
                 type: "button",
                 className: "kds-bottom-sheet-close",
                 "aria-label": "Cerrar",
-                children: /* @__PURE__ */ jsx34("i", { className: "material-symbols-outlined", children: "close" })
+                children: /* @__PURE__ */ jsx35("i", { className: "material-symbols-outlined", children: "close" })
               }
             ) }),
-            title && /* @__PURE__ */ jsx34(Dialog2.Title, { className: "kds-bottom-sheet-title", children: title }),
-            description && /* @__PURE__ */ jsx34(Dialog2.Description, { className: "kds-bottom-sheet-description", children: description }),
-            /* @__PURE__ */ jsx34("div", { className: "kds-bottom-sheet-body", children }),
-            actions && /* @__PURE__ */ jsx34("div", { className: "kds-bottom-sheet-actions", children: actions })
+            title && /* @__PURE__ */ jsx35(Dialog2.Title, { className: "kds-bottom-sheet-title", children: title }),
+            description && /* @__PURE__ */ jsx35(Dialog2.Description, { className: "kds-bottom-sheet-description", children: description }),
+            /* @__PURE__ */ jsx35("div", { className: "kds-bottom-sheet-body", children }),
+            actions && /* @__PURE__ */ jsx35("div", { className: "kds-bottom-sheet-actions", children: actions })
           ]
         }
       ) }) })
@@ -2149,55 +2174,55 @@ var KdsBottomSheet = forwardRef32(
 KdsBottomSheet.displayName = "KdsBottomSheet";
 
 // src/components/domain/KdsSecureFooter/KdsSecureFooter.tsx
-import { forwardRef as forwardRef33 } from "react";
-import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
-var KdsSecureFooter = forwardRef33(
-  ({ variant = "default", children, className, ...props }, ref) => /* @__PURE__ */ jsxs26("footer", { ref, className: clsx("kds-secure-footer", variant === "inside" && "inside", className), ...props, children: [
-    /* @__PURE__ */ jsx35("i", { className: "material-symbols-outlined", children: "lock" }),
-    children || /* @__PURE__ */ jsx35("span", { children: "Pago seguro con Khipu" })
+import { forwardRef as forwardRef34 } from "react";
+import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
+var KdsSecureFooter = forwardRef34(
+  ({ variant = "default", children, className, ...props }, ref) => /* @__PURE__ */ jsxs27("footer", { ref, className: clsx("kds-secure-footer", variant === "inside" && "inside", className), ...props, children: [
+    /* @__PURE__ */ jsx36("i", { className: "material-symbols-outlined", children: "lock" }),
+    children || /* @__PURE__ */ jsx36("span", { children: "Pago seguro con Khipu" })
   ] })
 );
 KdsSecureFooter.displayName = "KdsSecureFooter";
 
 // src/components/domain/KdsRecapList/KdsRecapList.tsx
-import { forwardRef as forwardRef34 } from "react";
-import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
-var KdsRecapList = forwardRef34(
-  ({ items, className, ...props }, ref) => /* @__PURE__ */ jsx36("ul", { ref, className: clsx("kds-recap-list", className), ...props, children: items.map((item, i) => /* @__PURE__ */ jsxs27("li", { children: [
-    /* @__PURE__ */ jsx36("span", { className: "kds-key", children: item.label }),
-    /* @__PURE__ */ jsx36("span", { className: clsx("kds-value", !item.value && item.placeholder && "placeholder"), children: item.value || item.placeholder || "-" })
+import { forwardRef as forwardRef35 } from "react";
+import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
+var KdsRecapList = forwardRef35(
+  ({ items, className, ...props }, ref) => /* @__PURE__ */ jsx37("ul", { ref, className: clsx("kds-recap-list", className), ...props, children: items.map((item, i) => /* @__PURE__ */ jsxs28("li", { children: [
+    /* @__PURE__ */ jsx37("span", { className: "kds-key", children: item.label }),
+    /* @__PURE__ */ jsx37("span", { className: clsx("kds-value", !item.value && item.placeholder && "placeholder"), children: item.value || item.placeholder || "-" })
   ] }, i)) })
 );
 KdsRecapList.displayName = "KdsRecapList";
 
 // src/components/domain/KdsMontoRow/KdsMontoRow.tsx
-import { forwardRef as forwardRef35 } from "react";
-import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
-var KdsMontoRow = forwardRef35(
-  ({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ jsxs28("div", { ref, className: clsx("kds-monto-row", className), ...props, children: [
-    /* @__PURE__ */ jsxs28("div", { children: [
-      /* @__PURE__ */ jsx37("div", { className: "kds-monto-row-title", children: title }),
-      deadline && /* @__PURE__ */ jsx37("div", { className: "kds-monto-row-deadline", children: deadline })
+import { forwardRef as forwardRef36 } from "react";
+import { jsx as jsx38, jsxs as jsxs29 } from "react/jsx-runtime";
+var KdsMontoRow = forwardRef36(
+  ({ title, value, deadline, className, ...props }, ref) => /* @__PURE__ */ jsxs29("div", { ref, className: clsx("kds-monto-row", className), ...props, children: [
+    /* @__PURE__ */ jsxs29("div", { children: [
+      /* @__PURE__ */ jsx38("div", { className: "kds-monto-row-title", children: title }),
+      deadline && /* @__PURE__ */ jsx38("div", { className: "kds-monto-row-deadline", children: deadline })
     ] }),
-    /* @__PURE__ */ jsx37("div", { className: "kds-monto-row-value", children: value })
+    /* @__PURE__ */ jsx38("div", { className: "kds-monto-row-value", children: value })
   ] })
 );
 KdsMontoRow.displayName = "KdsMontoRow";
 
 // src/components/domain/KdsMerchantTile/KdsMerchantTile.tsx
-import { forwardRef as forwardRef36 } from "react";
-import { jsx as jsx38 } from "react/jsx-runtime";
-var KdsMerchantTile = forwardRef36(
+import { forwardRef as forwardRef37 } from "react";
+import { jsx as jsx39 } from "react/jsx-runtime";
+var KdsMerchantTile = forwardRef37(
   ({ name, logoUrl, initials, compact, className, ...props }, ref) => {
     const displayInitials = (initials ?? name.slice(0, 2)).toUpperCase();
-    return /* @__PURE__ */ jsx38(
+    return /* @__PURE__ */ jsx39(
       "div",
       {
         ref,
         className: clsx("kds-merchant-tile", logoUrl && "logo", compact && "compact", className),
         "aria-label": name,
         ...props,
-        children: logoUrl ? /* @__PURE__ */ jsx38("img", { src: logoUrl, alt: name }) : displayInitials
+        children: logoUrl ? /* @__PURE__ */ jsx39("img", { src: logoUrl, alt: name }) : displayInitials
       }
     );
   }
@@ -2205,9 +2230,9 @@ var KdsMerchantTile = forwardRef36(
 KdsMerchantTile.displayName = "KdsMerchantTile";
 
 // src/components/domain/KdsPaymentTotal/KdsPaymentTotal.tsx
-import { forwardRef as forwardRef37 } from "react";
-import { jsx as jsx39, jsxs as jsxs29 } from "react/jsx-runtime";
-var KdsPaymentTotal = forwardRef37(
+import { forwardRef as forwardRef38 } from "react";
+import { jsx as jsx40, jsxs as jsxs30 } from "react/jsx-runtime";
+var KdsPaymentTotal = forwardRef38(
   ({
     variant = "default",
     tone = "brand",
@@ -2225,7 +2250,7 @@ var KdsPaymentTotal = forwardRef37(
     const { integer, fraction } = formatAmount(amount, decimals, locale);
     const isEmail = variant === "email";
     const isInfoTone = tone === "info";
-    return /* @__PURE__ */ jsxs29(
+    return /* @__PURE__ */ jsxs30(
       "div",
       {
         ref,
@@ -2238,14 +2263,14 @@ var KdsPaymentTotal = forwardRef37(
         ),
         ...props,
         children: [
-          !isEmail && title != null && /* @__PURE__ */ jsx39("h5", { className: "kds-payment-total-title", children: title }),
-          !isEmail && titleMobile != null && /* @__PURE__ */ jsx39("h5", { className: "kds-payment-total-title-mobile", children: titleMobile }),
-          label != null && /* @__PURE__ */ jsx39("h6", { className: "kds-payment-label", children: label }),
-          /* @__PURE__ */ jsxs29("h5", { className: "kds-payment-amount", children: [
+          !isEmail && title != null && /* @__PURE__ */ jsx40("h5", { className: "kds-payment-total-title", children: title }),
+          !isEmail && titleMobile != null && /* @__PURE__ */ jsx40("h5", { className: "kds-payment-total-title-mobile", children: titleMobile }),
+          label != null && /* @__PURE__ */ jsx40("h6", { className: "kds-payment-label", children: label }),
+          /* @__PURE__ */ jsxs30("h5", { className: "kds-payment-amount", children: [
             currency,
             " ",
             integer,
-            fraction !== null && /* @__PURE__ */ jsx39("sup", { className: "kds-payment-total-decimal-sup", children: fraction })
+            fraction !== null && /* @__PURE__ */ jsx40("sup", { className: "kds-payment-total-decimal-sup", children: fraction })
           ] })
         ]
       }
@@ -2281,10 +2306,10 @@ function formatAmount(amount, decimals, locale) {
 }
 
 // src/components/domain/KdsBillAttachment/KdsBillAttachment.tsx
-import { forwardRef as forwardRef38 } from "react";
-import { jsx as jsx40, jsxs as jsxs30 } from "react/jsx-runtime";
-var KdsBillAttachment = forwardRef38(
-  ({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ jsxs30(
+import { forwardRef as forwardRef39 } from "react";
+import { jsx as jsx41, jsxs as jsxs31 } from "react/jsx-runtime";
+var KdsBillAttachment = forwardRef39(
+  ({ filename, href, icon = "attach_file", className, ...props }, ref) => /* @__PURE__ */ jsxs31(
     "a",
     {
       ref,
@@ -2294,15 +2319,15 @@ var KdsBillAttachment = forwardRef38(
       className: clsx("kds-bill-attachment", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx40("i", { className: "material-symbols-outlined", children: icon }),
-        /* @__PURE__ */ jsx40("span", { children: filename })
+        /* @__PURE__ */ jsx41("i", { className: "material-symbols-outlined", children: icon }),
+        /* @__PURE__ */ jsx41("span", { children: filename })
       ]
     }
   )
 );
 KdsBillAttachment.displayName = "KdsBillAttachment";
-var KdsBillAttachments = forwardRef38(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx40("div", { ref, className: clsx("kds-bill-attachments", className), ...props, children })
+var KdsBillAttachments = forwardRef39(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx41("div", { ref, className: clsx("kds-bill-attachments", className), ...props, children })
 );
 KdsBillAttachments.displayName = "KdsBillAttachments";
 export {
@@ -2325,6 +2350,7 @@ export {
   KdsCardSelector,
   KdsCheckbox,
   KdsChip,
+  KdsCopyButton,
   KdsCopyRow,
   KdsCopyableTable,
   KdsCountdown,