@misael703/ui 1.0.0

package/dist/chunk-HI3JT6SI.mjs

@@ -0,0 +1,174 @@
+import { Check } from './chunk-CIBJKJV3.mjs';
+import { cx } from './chunk-IEPCH3JB.mjs';
+import * as React from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var TabsContext = React.createContext(null);
+function Tabs({ value, defaultValue, onChange, children, className }) {
+  const [internal, setInternal] = React.useState(defaultValue ?? "");
+  const v = value ?? internal;
+  const setV = (next) => {
+    if (value === void 0) setInternal(next);
+    onChange?.(next);
+  };
+  return /* @__PURE__ */ jsx(TabsContext.Provider, { value: { value: v, setValue: setV }, children: /* @__PURE__ */ jsx("div", { className: cx("tabs", className), children }) });
+}
+function TabList({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { role: "tablist", className: cx("tabs__list", className), children });
+}
+function Tab({ value, className, children, ...rest }) {
+  const ctx = React.useContext(TabsContext);
+  if (!ctx) throw new Error("<Tab> must be used inside <Tabs>");
+  const active = ctx.value === value;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      role: "tab",
+      "aria-selected": active,
+      className: cx("tabs__tab", active && "is-active", className),
+      onClick: () => ctx.setValue(value),
+      ...rest,
+      children
+    }
+  );
+}
+function TabPanel({ value, children, className }) {
+  const ctx = React.useContext(TabsContext);
+  if (!ctx) throw new Error("<TabPanel> must be used inside <Tabs>");
+  if (ctx.value !== value) return null;
+  return /* @__PURE__ */ jsx("div", { role: "tabpanel", className: cx("tabs__panel", className), children });
+}
+var Table = React.forwardRef(
+  function Table2({ className, ...rest }, ref) {
+    return /* @__PURE__ */ jsx("div", { className: "table-wrap", children: /* @__PURE__ */ jsx("table", { ref, className: cx("table", className), ...rest }) });
+  }
+);
+function Tooltip({ label, children, side = "top" }) {
+  return /* @__PURE__ */ jsxs("span", { className: cx("tooltip", `tooltip--${side}`), "data-tooltip": typeof label === "string" ? label : void 0, children: [
+    children,
+    /* @__PURE__ */ jsx("span", { className: "tooltip__bubble", role: "tooltip", children: label })
+  ] });
+}
+function Divider({ orientation = "horizontal", className, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "separator",
+      "aria-orientation": orientation,
+      className: cx("divider", orientation === "vertical" && "divider--vertical", className),
+      ...rest
+    }
+  );
+}
+var Stack = React.forwardRef(function Stack2({ direction = "column", gap = 4, align, justify, wrap, inline, className, style, ...rest }, ref) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cx("stack", className),
+      style: {
+        display: inline ? "inline-flex" : "flex",
+        flexDirection: direction,
+        gap: `var(--space-${gap})`,
+        alignItems: align,
+        justifyContent: justify,
+        flexWrap: wrap ? "wrap" : void 0,
+        ...style
+      },
+      ...rest
+    }
+  );
+});
+var HStack = React.forwardRef(
+  function HStack2(props, ref) {
+    return /* @__PURE__ */ jsx(Stack, { ref, direction: "row", align: props.align ?? "center", ...props });
+  }
+);
+var VStack = React.forwardRef(
+  function VStack2(props, ref) {
+    return /* @__PURE__ */ jsx(Stack, { ref, direction: "column", ...props });
+  }
+);
+var CONTAINER_MAX = { sm: 640, md: 768, lg: 1024, xl: 1280, full: "100%" };
+function Container({ size = "lg", className, style, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cx("container", `container--${size}`, className),
+      style: {
+        width: "100%",
+        maxWidth: CONTAINER_MAX[size],
+        marginInline: "auto",
+        paddingInline: "var(--space-4)",
+        ...style
+      },
+      ...rest
+    }
+  );
+}
+function Grid({ columns, gap = 4, minColWidth, className, style, ...rest }) {
+  const tpl = minColWidth ? `repeat(auto-fit, minmax(${typeof minColWidth === "number" ? `${minColWidth}px` : minColWidth}, 1fr))` : typeof columns === "number" ? `repeat(${columns}, minmax(0, 1fr))` : columns ?? "repeat(12, minmax(0, 1fr))";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cx("grid", className),
+      style: {
+        display: "grid",
+        gridTemplateColumns: tpl,
+        gap: `var(--space-${gap})`,
+        ...style
+      },
+      ...rest
+    }
+  );
+}
+function KeyValue({ keyWidth, className, style, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    "dl",
+    {
+      className: cx("kv", className),
+      style: keyWidth ? { gridTemplateColumns: `${typeof keyWidth === "number" ? `${keyWidth}px` : keyWidth} 1fr`, ...style } : style,
+      ...rest
+    }
+  );
+}
+function KeyValueRow({ label, children }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("dt", { className: "kv__k", children: label }),
+    /* @__PURE__ */ jsx("dd", { className: "kv__v", children })
+  ] });
+}
+var ListGroup = React.forwardRef(
+  function ListGroup2({ className, ...rest }, ref) {
+    return /* @__PURE__ */ jsx("ul", { ref, className: cx("list-group", className), ...rest });
+  }
+);
+var ListGroupItem = React.forwardRef(
+  function ListGroupItem2({ interactive, className, ...rest }, ref) {
+    return /* @__PURE__ */ jsx(
+      "li",
+      {
+        ref,
+        className: cx("list-group__item", interactive && "list-group__item--interactive", className),
+        ...rest
+      }
+    );
+  }
+);
+function Stepper({ steps, current, className }) {
+  return /* @__PURE__ */ jsx("ol", { className: cx("stepper", className), children: steps.map((s, i) => {
+    const state = i < current ? "is-done" : i === current ? "is-current" : "";
+    return /* @__PURE__ */ jsxs("li", { className: cx("stepper__item", state), children: [
+      /* @__PURE__ */ jsx("span", { className: "stepper__circle", children: i < current ? /* @__PURE__ */ jsx(Check, { size: 16 }) : i + 1 }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("div", { className: "stepper__label", children: s.label }),
+        s.description && /* @__PURE__ */ jsx("div", { className: "stepper__desc", children: s.description })
+      ] })
+    ] }, i);
+  }) });
+}
+
+export { Container, Divider, Grid, HStack, KeyValue, KeyValueRow, ListGroup, ListGroupItem, Stack, Stepper, Tab, TabList, TabPanel, Table, Tabs, Tooltip, VStack };
+//# sourceMappingURL=chunk-HI3JT6SI.mjs.map
+//# sourceMappingURL=chunk-HI3JT6SI.mjs.map

package/dist/chunk-HI3JT6SI.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Layout.tsx"],"names":["Table","Stack","HStack","VStack","ListGroup","ListGroupItem"],"mappings":"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","file":"chunk-HI3JT6SI.mjs","sourcesContent":["'use client';\nimport * as React from 'react';\nimport { cx } from '../utils/cx';\nimport { Check } from './Icons';\n\n// ---------- Tabs ---------------------------------------------------------\ninterface TabsContextValue {\n  value: string;\n  setValue: (v: string) => void;\n}\nconst TabsContext = React.createContext<TabsContextValue | null>(null);\n\nexport interface TabsProps {\n  value?: string;\n  defaultValue?: string;\n  onChange?: (v: string) => void;\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport function Tabs({ value, defaultValue, onChange, children, className }: TabsProps) {\n  const [internal, setInternal] = React.useState(defaultValue ?? '');\n  const v = value ?? internal;\n  const setV = (next: string) => {\n    if (value === undefined) setInternal(next);\n    onChange?.(next);\n  };\n  return (\n    <TabsContext.Provider value={{ value: v, setValue: setV }}>\n      <div className={cx('tabs', className)}>{children}</div>\n    </TabsContext.Provider>\n  );\n}\n\nexport function TabList({ children, className }: { children: React.ReactNode; className?: string }) {\n  return <div role=\"tablist\" className={cx('tabs__list', className)}>{children}</div>;\n}\n\nexport interface TabProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  value: string;\n}\n\nexport function Tab({ value, className, children, ...rest }: TabProps) {\n  const ctx = React.useContext(TabsContext);\n  if (!ctx) throw new Error('<Tab> must be used inside <Tabs>');\n  const active = ctx.value === value;\n  return (\n    <button\n      type=\"button\"\n      role=\"tab\"\n      aria-selected={active}\n      className={cx('tabs__tab', active && 'is-active', className)}\n      onClick={() => ctx.setValue(value)}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n}\n\nexport function TabPanel({ value, children, className }: { value: string; children: React.ReactNode; className?: string }) {\n  const ctx = React.useContext(TabsContext);\n  if (!ctx) throw new Error('<TabPanel> must be used inside <Tabs>');\n  if (ctx.value !== value) return null;\n  return <div role=\"tabpanel\" className={cx('tabs__panel', className)}>{children}</div>;\n}\n\n// ---------- Table --------------------------------------------------------\nexport const Table = React.forwardRef<HTMLTableElement, React.TableHTMLAttributes<HTMLTableElement>>(\n  function Table({ className, ...rest }, ref) {\n    return (\n      <div className=\"table-wrap\">\n        <table ref={ref} className={cx('table', className)} {...rest} />\n      </div>\n    );\n  }\n);\n\n// ---------- Tooltip (CSS hover) ------------------------------------------\nexport interface TooltipProps {\n  label: React.ReactNode;\n  children: React.ReactElement;\n  side?: 'top' | 'bottom' | 'left' | 'right';\n}\n\nexport function Tooltip({ label, children, side = 'top' }: TooltipProps) {\n  return (\n    <span className={cx('tooltip', `tooltip--${side}`)} data-tooltip={typeof label === 'string' ? label : undefined}>\n      {children}\n      <span className=\"tooltip__bubble\" role=\"tooltip\">{label}</span>\n    </span>\n  );\n}\n\n// ---------- Divider ------------------------------------------------------\nexport interface DividerProps extends React.HTMLAttributes<HTMLDivElement> {\n  orientation?: 'horizontal' | 'vertical';\n}\n\nexport function Divider({ orientation = 'horizontal', className, ...rest }: DividerProps) {\n  return (\n    <div\n      role=\"separator\"\n      aria-orientation={orientation}\n      className={cx('divider', orientation === 'vertical' && 'divider--vertical', className)}\n      {...rest}\n    />\n  );\n}\n\n// ---------- Stack / HStack / VStack -------------------------------------\ntype SpaceToken = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16 | 20 | 24;\n\nexport interface StackProps extends React.HTMLAttributes<HTMLDivElement> {\n  direction?: 'row' | 'column';\n  gap?: SpaceToken;\n  align?: React.CSSProperties['alignItems'];\n  justify?: React.CSSProperties['justifyContent'];\n  wrap?: boolean;\n  inline?: boolean;\n}\n\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(function Stack(\n  { direction = 'column', gap = 4, align, justify, wrap, inline, className, style, ...rest },\n  ref\n) {\n  return (\n    <div\n      ref={ref}\n      className={cx('stack', className)}\n      style={{\n        display: inline ? 'inline-flex' : 'flex',\n        flexDirection: direction,\n        gap: `var(--space-${gap})`,\n        alignItems: align,\n        justifyContent: justify,\n        flexWrap: wrap ? 'wrap' : undefined,\n        ...style,\n      }}\n      {...rest}\n    />\n  );\n});\n\nexport const HStack = React.forwardRef<HTMLDivElement, Omit<StackProps, 'direction'>>(\n  function HStack(props, ref) {\n    return <Stack ref={ref} direction=\"row\" align={props.align ?? 'center'} {...props} />;\n  }\n);\n\nexport const VStack = React.forwardRef<HTMLDivElement, Omit<StackProps, 'direction'>>(\n  function VStack(props, ref) {\n    return <Stack ref={ref} direction=\"column\" {...props} />;\n  }\n);\n\n// ---------- Container ----------------------------------------------------\nexport interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {\n  size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';\n}\n\nconst CONTAINER_MAX = { sm: 640, md: 768, lg: 1024, xl: 1280, full: '100%' };\n\nexport function Container({ size = 'lg', className, style, ...rest }: ContainerProps) {\n  return (\n    <div\n      className={cx('container', `container--${size}`, className)}\n      style={{\n        width: '100%',\n        maxWidth: CONTAINER_MAX[size],\n        marginInline: 'auto',\n        paddingInline: 'var(--space-4)',\n        ...style,\n      }}\n      {...rest}\n    />\n  );\n}\n\n// ---------- Grid ---------------------------------------------------------\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\n  columns?: number | string;\n  gap?: SpaceToken;\n  minColWidth?: number | string;\n}\n\nexport function Grid({ columns, gap = 4, minColWidth, className, style, ...rest }: GridProps) {\n  const tpl = minColWidth\n    ? `repeat(auto-fit, minmax(${typeof minColWidth === 'number' ? `${minColWidth}px` : minColWidth}, 1fr))`\n    : typeof columns === 'number'\n      ? `repeat(${columns}, minmax(0, 1fr))`\n      : columns ?? 'repeat(12, minmax(0, 1fr))';\n  return (\n    <div\n      className={cx('grid', className)}\n      style={{\n        display: 'grid',\n        gridTemplateColumns: tpl,\n        gap: `var(--space-${gap})`,\n        ...style,\n      }}\n      {...rest}\n    />\n  );\n}\n\n// ---------- KeyValue ----------------------------------------------------\nexport interface KeyValueProps extends React.HTMLAttributes<HTMLDListElement> {\n  /** Override del ancho de la columna de keys (default 200px) */\n  keyWidth?: number | string;\n}\n\nexport function KeyValue({ keyWidth, className, style, ...rest }: KeyValueProps) {\n  return (\n    <dl\n      className={cx('kv', className)}\n      style={keyWidth ? { gridTemplateColumns: `${typeof keyWidth === 'number' ? `${keyWidth}px` : keyWidth} 1fr`, ...style } : style}\n      {...rest}\n    />\n  );\n}\n\nexport interface KeyValueRowProps {\n  label: React.ReactNode;\n  children: React.ReactNode;\n}\n\nexport function KeyValueRow({ label, children }: KeyValueRowProps) {\n  return (\n    <>\n      <dt className=\"kv__k\">{label}</dt>\n      <dd className=\"kv__v\">{children}</dd>\n    </>\n  );\n}\n\n// ---------- ListGroup ---------------------------------------------------\nexport const ListGroup = React.forwardRef<HTMLUListElement, React.HTMLAttributes<HTMLUListElement>>(\n  function ListGroup({ className, ...rest }, ref) {\n    return <ul ref={ref} className={cx('list-group', className)} {...rest} />;\n  }\n);\n\nexport interface ListGroupItemProps extends React.LiHTMLAttributes<HTMLLIElement> {\n  interactive?: boolean;\n}\n\nexport const ListGroupItem = React.forwardRef<HTMLLIElement, ListGroupItemProps>(\n  function ListGroupItem({ interactive, className, ...rest }, ref) {\n    return (\n      <li\n        ref={ref}\n        className={cx('list-group__item', interactive && 'list-group__item--interactive', className)}\n        {...rest}\n      />\n    );\n  }\n);\n\n// ---------- Stepper ------------------------------------------------------\nexport interface StepperProps {\n  steps: Array<{ label: string; description?: string }>;\n  current: number;\n  className?: string;\n}\n\nexport function Stepper({ steps, current, className }: StepperProps) {\n  return (\n    <ol className={cx('stepper', className)}>\n      {steps.map((s, i) => {\n        const state = i < current ? 'is-done' : i === current ? 'is-current' : '';\n        return (\n          <li key={i} className={cx('stepper__item', state)}>\n            <span className=\"stepper__circle\">{i < current ? <Check size={16} /> : i + 1}</span>\n            <div>\n              <div className=\"stepper__label\">{s.label}</div>\n              {s.description && <div className=\"stepper__desc\">{s.description}</div>}\n            </div>\n          </li>\n        );\n      })}\n    </ol>\n  );\n}\n"]}

package/dist/chunk-HPFJ2A24.js

@@ -0,0 +1,125 @@
+'use strict';
+
+var chunkPASF6T4H_js = require('./chunk-PASF6T4H.js');
+var React = require('react');
+var reactDom = require('react-dom');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+function Popover({
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  trigger,
+  children,
+  placement = "bottom",
+  align = "center",
+  offset = 8,
+  closeOnOutsideClick = true,
+  closeOnEscape = true,
+  className,
+  contentClassName,
+  ariaLabel
+}) {
+  const [internalOpen, setInternalOpen] = React__namespace.useState(defaultOpen);
+  const isControlled = controlledOpen !== void 0;
+  const open = isControlled ? controlledOpen : internalOpen;
+  const triggerRef = React__namespace.useRef(null);
+  const contentRef = React__namespace.useRef(null);
+  const [coords, setCoords] = React__namespace.useState(null);
+  const setOpen = (next) => {
+    if (!isControlled) setInternalOpen(next);
+    onOpenChange?.(next);
+  };
+  React__namespace.useEffect(() => {
+    if (!open || !triggerRef.current || !contentRef.current) return;
+    const t = triggerRef.current.getBoundingClientRect();
+    const c = contentRef.current.getBoundingClientRect();
+    let top = 0;
+    let left = 0;
+    if (placement === "bottom") {
+      top = t.bottom + offset;
+      left = align === "start" ? t.left : align === "end" ? t.right - c.width : t.left + (t.width - c.width) / 2;
+    } else if (placement === "top") {
+      top = t.top - c.height - offset;
+      left = align === "start" ? t.left : align === "end" ? t.right - c.width : t.left + (t.width - c.width) / 2;
+    } else if (placement === "right") {
+      left = t.right + offset;
+      top = align === "start" ? t.top : align === "end" ? t.bottom - c.height : t.top + (t.height - c.height) / 2;
+    } else {
+      left = t.left - c.width - offset;
+      top = align === "start" ? t.top : align === "end" ? t.bottom - c.height : t.top + (t.height - c.height) / 2;
+    }
+    const vw = window.innerWidth;
+    const vh = window.innerHeight;
+    left = Math.max(8, Math.min(left, vw - c.width - 8));
+    top = Math.max(8, Math.min(top, vh - c.height - 8));
+    setCoords({ top: top + window.scrollY, left: left + window.scrollX });
+  }, [open, placement, align, offset]);
+  React__namespace.useEffect(() => {
+    if (!open) return;
+    const onClick = (e) => {
+      if (!closeOnOutsideClick) return;
+      const target = e.target;
+      if (triggerRef.current?.contains(target) || contentRef.current?.contains(target)) return;
+      setOpen(false);
+    };
+    const onKey = (e) => {
+      if (closeOnEscape && e.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("mousedown", onClick);
+    document.addEventListener("keydown", onKey);
+    return () => {
+      document.removeEventListener("mousedown", onClick);
+      document.removeEventListener("keydown", onKey);
+    };
+  }, [open, closeOnOutsideClick, closeOnEscape]);
+  const panel = open && /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref: contentRef,
+      role: "dialog",
+      "aria-label": ariaLabel,
+      className: chunkPASF6T4H_js.cx("popover__content", contentClassName),
+      style: coords ? { position: "absolute", top: coords.top, left: coords.left } : { position: "absolute", visibility: "hidden" },
+      children
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: chunkPASF6T4H_js.cx("popover", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        ref: triggerRef,
+        className: "popover__trigger",
+        onClick: () => setOpen(!open),
+        "aria-haspopup": "dialog",
+        "aria-expanded": open,
+        children: trigger
+      }
+    ),
+    panel && typeof document !== "undefined" && reactDom.createPortal(panel, document.body)
+  ] });
+}
+
+exports.Popover = Popover;
+//# sourceMappingURL=chunk-HPFJ2A24.js.map
+//# sourceMappingURL=chunk-HPFJ2A24.js.map

package/dist/chunk-HPFJ2A24.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Popover.tsx"],"names":["React","jsx","cx","createPortal"],"mappings":"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","file":"chunk-HPFJ2A24.js","sourcesContent":["'use client';\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cx } from '../utils/cx';\n\nexport type PopoverPlacement = 'top' | 'bottom' | 'left' | 'right';\nexport type PopoverAlign = 'start' | 'center' | 'end';\n\nexport interface PopoverProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  trigger: React.ReactNode;\n  children: React.ReactNode;\n  placement?: PopoverPlacement;\n  align?: PopoverAlign;\n  offset?: number;\n  closeOnOutsideClick?: boolean;\n  closeOnEscape?: boolean;\n  className?: string;\n  contentClassName?: string;\n  ariaLabel?: string;\n}\n\nexport function Popover({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  trigger,\n  children,\n  placement = 'bottom',\n  align = 'center',\n  offset = 8,\n  closeOnOutsideClick = true,\n  closeOnEscape = true,\n  className,\n  contentClassName,\n  ariaLabel,\n}: PopoverProps) {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n\n  const triggerRef = React.useRef<HTMLDivElement>(null);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n  const [coords, setCoords] = React.useState<{ top: number; left: number } | null>(null);\n\n  const setOpen = (next: boolean) => {\n    if (!isControlled) setInternalOpen(next);\n    onOpenChange?.(next);\n  };\n\n  React.useEffect(() => {\n    if (!open || !triggerRef.current || !contentRef.current) return;\n    const t = triggerRef.current.getBoundingClientRect();\n    const c = contentRef.current.getBoundingClientRect();\n\n    let top = 0;\n    let left = 0;\n    if (placement === 'bottom') {\n      top = t.bottom + offset;\n      left = align === 'start' ? t.left : align === 'end' ? t.right - c.width : t.left + (t.width - c.width) / 2;\n    } else if (placement === 'top') {\n      top = t.top - c.height - offset;\n      left = align === 'start' ? t.left : align === 'end' ? t.right - c.width : t.left + (t.width - c.width) / 2;\n    } else if (placement === 'right') {\n      left = t.right + offset;\n      top = align === 'start' ? t.top : align === 'end' ? t.bottom - c.height : t.top + (t.height - c.height) / 2;\n    } else {\n      left = t.left - c.width - offset;\n      top = align === 'start' ? t.top : align === 'end' ? t.bottom - c.height : t.top + (t.height - c.height) / 2;\n    }\n\n    const vw = window.innerWidth;\n    const vh = window.innerHeight;\n    left = Math.max(8, Math.min(left, vw - c.width - 8));\n    top = Math.max(8, Math.min(top, vh - c.height - 8));\n\n    setCoords({ top: top + window.scrollY, left: left + window.scrollX });\n  }, [open, placement, align, offset]);\n\n  React.useEffect(() => {\n    if (!open) return;\n    const onClick = (e: MouseEvent) => {\n      if (!closeOnOutsideClick) return;\n      const target = e.target as Node;\n      if (triggerRef.current?.contains(target) || contentRef.current?.contains(target)) return;\n      setOpen(false);\n    };\n    const onKey = (e: KeyboardEvent) => {\n      if (closeOnEscape && e.key === 'Escape') setOpen(false);\n    };\n    document.addEventListener('mousedown', onClick);\n    document.addEventListener('keydown', onKey);\n    return () => {\n      document.removeEventListener('mousedown', onClick);\n      document.removeEventListener('keydown', onKey);\n    };\n  }, [open, closeOnOutsideClick, closeOnEscape]);\n\n  const panel = open && (\n    <div\n      ref={contentRef}\n      role=\"dialog\"\n      aria-label={ariaLabel}\n      className={cx('popover__content', contentClassName)}\n      style={coords ? { position: 'absolute', top: coords.top, left: coords.left } : { position: 'absolute', visibility: 'hidden' }}\n    >\n      {children}\n    </div>\n  );\n\n  return (\n    <span className={cx('popover', className)}>\n      <span\n        ref={triggerRef as any}\n        className=\"popover__trigger\"\n        onClick={() => setOpen(!open)}\n        aria-haspopup=\"dialog\"\n        aria-expanded={open}\n      >\n        {trigger}\n      </span>\n      {/* Portal to body so absolute coords (document-relative) match the\n          positioning origin and overflow:hidden ancestors don't clip. */}\n      {panel && typeof document !== 'undefined' && createPortal(panel, document.body)}\n    </span>\n  );\n}\n"]}

package/dist/chunk-HVUNNL3A.mjs

@@ -0,0 +1,244 @@
+import { format } from './chunk-KKOJI25C.mjs';
+import { getBrand } from './chunk-5GEWIK4T.mjs';
+import { useLocale } from './chunk-ZRFSTYRL.mjs';
+import { X } from './chunk-CIBJKJV3.mjs';
+import { cx } from './chunk-IEPCH3JB.mjs';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Slider = React.forwardRef(function Slider2({ value, onChange, min = 0, max = 100, step = 1, showValue, formatValue, className, ...rest }, ref) {
+  const pct = (value - min) / (max - min) * 100;
+  return /* @__PURE__ */ jsxs("div", { className: cx("slider", className), children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref,
+        type: "range",
+        className: "slider__input",
+        value,
+        min,
+        max,
+        step,
+        onChange: (e) => onChange(Number(e.target.value)),
+        style: { "--pct": `${pct}%` },
+        ...rest
+      }
+    ),
+    showValue && /* @__PURE__ */ jsx("span", { className: "slider__value", children: formatValue ? formatValue(value) : value })
+  ] });
+});
+function Progress({ value, variant = "blue", showLabel, size = "md", className }) {
+  const v = Math.max(0, Math.min(100, value));
+  return /* @__PURE__ */ jsxs("div", { className: cx("progress", size === "sm" && "progress--sm", className), children: [
+    /* @__PURE__ */ jsx("div", { className: cx("progress__bar", `progress__bar--${variant}`), style: { width: `${v}%` }, role: "progressbar", "aria-valuenow": v, "aria-valuemin": 0, "aria-valuemax": 100 }),
+    showLabel && /* @__PURE__ */ jsxs("span", { className: "progress__label", children: [
+      Math.round(v),
+      "%"
+    ] })
+  ] });
+}
+function ProgressCircle({ value, size = 64, stroke = 6, variant = "blue", showLabel = true, className }) {
+  const v = Math.max(0, Math.min(100, value));
+  const r = (size - stroke) / 2;
+  const c = 2 * Math.PI * r;
+  const off = c - v / 100 * c;
+  const colorVar = {
+    blue: "var(--color-primary)",
+    orange: "var(--color-secondary)",
+    success: "var(--color-success)",
+    warning: "var(--color-warning)",
+    danger: "var(--color-danger)"
+  }[variant];
+  return /* @__PURE__ */ jsxs("div", { className: cx("progress-circle", className), style: { width: size, height: size }, role: "progressbar", "aria-valuenow": v, "aria-valuemin": 0, "aria-valuemax": 100, children: [
+    /* @__PURE__ */ jsxs("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, children: [
+      /* @__PURE__ */ jsx("circle", { cx: size / 2, cy: size / 2, r, stroke: "var(--bg-subtle)", strokeWidth: stroke, fill: "none" }),
+      /* @__PURE__ */ jsx(
+        "circle",
+        {
+          cx: size / 2,
+          cy: size / 2,
+          r,
+          stroke: colorVar,
+          strokeWidth: stroke,
+          fill: "none",
+          strokeDasharray: c,
+          strokeDashoffset: off,
+          strokeLinecap: "round",
+          style: { transform: "rotate(-90deg)", transformOrigin: "50% 50%", transition: "stroke-dashoffset 320ms var(--ease-standard, ease-out)" }
+        }
+      )
+    ] }),
+    showLabel && /* @__PURE__ */ jsxs("span", { className: "progress-circle__label", children: [
+      Math.round(v),
+      "%"
+    ] })
+  ] });
+}
+function TagInput({
+  value,
+  onChange,
+  placeholder,
+  separator = /[,\s]+/,
+  maxTags,
+  validate,
+  disabled,
+  className,
+  id
+}) {
+  const [draft, setDraft] = React.useState("");
+  const locale = useLocale();
+  const ph = placeholder ?? locale["tagsInput.placeholder"];
+  const addTags = (raw) => {
+    const next = raw.split(separator).map((t) => t.trim()).filter(Boolean);
+    if (next.length === 0) return;
+    let merged = [...value];
+    for (const t of next) {
+      if (validate && !validate(t)) continue;
+      if (merged.includes(t)) continue;
+      if (maxTags && merged.length >= maxTags) break;
+      merged.push(t);
+    }
+    onChange(merged);
+    setDraft("");
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cx("tag-input", disabled && "is-disabled", className), onClick: (e) => {
+    const input = e.currentTarget.querySelector("input");
+    input?.focus();
+  }, children: [
+    value.map((t, i) => /* @__PURE__ */ jsxs("span", { className: "tag-input__tag", children: [
+      t,
+      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": format(locale["tagsInput.remove"], { tag: t }), onClick: () => onChange(value.filter((_, idx) => idx !== i)), children: /* @__PURE__ */ jsx(X, { size: 12 }) })
+    ] }, `${t}-${i}`)),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        id,
+        className: "tag-input__field",
+        value: draft,
+        disabled,
+        placeholder: value.length === 0 ? ph : "",
+        onChange: (e) => {
+          const v = e.target.value;
+          if (separator.test(v)) addTags(v);
+          else setDraft(v);
+        },
+        onKeyDown: (e) => {
+          if (e.key === "Enter" && draft.trim()) {
+            e.preventDefault();
+            addTags(draft);
+          } else if (e.key === "Backspace" && !draft && value.length) {
+            onChange(value.slice(0, -1));
+          }
+        },
+        onBlur: () => draft.trim() && addTags(draft)
+      }
+    )
+  ] });
+}
+var MoneyInput = React.forwardRef(function MoneyInput2({ value, onChange, currency, locale, invalid, className, disabled, ...rest }, ref) {
+  const brand = getBrand();
+  const resolvedCurrency = currency ?? brand.currency;
+  const resolvedLocale = locale ?? brand.locale;
+  const [focus, setFocus] = React.useState(false);
+  const display = value == null ? "" : focus ? String(value) : new Intl.NumberFormat(resolvedLocale, { style: "currency", currency: resolvedCurrency, maximumFractionDigits: 0 }).format(value);
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      ref,
+      type: "text",
+      inputMode: "numeric",
+      className: cx("input", invalid && "is-invalid", className),
+      value: display,
+      disabled,
+      onFocus: () => setFocus(true),
+      onBlur: () => setFocus(false),
+      onChange: (e) => {
+        const cleaned = e.target.value.replace(/[^\d-]/g, "");
+        if (!cleaned || cleaned === "-") return onChange(null);
+        const n = Number(cleaned);
+        onChange(Number.isFinite(n) ? n : null);
+      },
+      "aria-invalid": invalid || void 0,
+      ...rest
+    }
+  );
+});
+function PhoneInput({ value, onChange, prefix, invalid, disabled, className, id, placeholder = "9 1234 5678" }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx("phone-input", invalid && "is-invalid", disabled && "is-disabled", className), children: [
+    prefix && /* @__PURE__ */ jsx("span", { className: "phone-input__prefix", children: prefix }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        id,
+        type: "tel",
+        inputMode: "tel",
+        placeholder,
+        className: "phone-input__field",
+        value,
+        disabled,
+        onChange: (e) => onChange(e.target.value.replace(/[^\d ]/g, "")),
+        "aria-invalid": invalid || void 0
+      }
+    )
+  ] });
+}
+function TimePicker({ value, onChange, step = 15, invalid, disabled, className, id }) {
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      id,
+      type: "time",
+      step: step * 60,
+      className: cx("input", invalid && "is-invalid", className),
+      value,
+      disabled,
+      onChange: (e) => onChange(e.target.value),
+      "aria-invalid": invalid || void 0
+    }
+  );
+}
+function RadioGroup({ value, onChange, options, name, orientation = "vertical", label, className }) {
+  return /* @__PURE__ */ jsx("div", { role: "radiogroup", "aria-label": label, className: cx("option-group", `option-group--${orientation}`, className), children: options.map((o) => /* @__PURE__ */ jsxs("label", { className: cx("option-row", o.disabled && "is-disabled"), children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "radio",
+        className: "radio",
+        name,
+        checked: o.value === value,
+        disabled: o.disabled,
+        onChange: () => onChange(o.value)
+      }
+    ),
+    /* @__PURE__ */ jsxs("span", { className: "option-row__body", children: [
+      /* @__PURE__ */ jsx("span", { className: "option-row__label", children: o.label }),
+      o.description && /* @__PURE__ */ jsx("span", { className: "option-row__desc", children: o.description })
+    ] })
+  ] }, String(o.value))) });
+}
+function CheckboxGroup({ value, onChange, options, orientation = "vertical", className }) {
+  const set = new Set(value);
+  return /* @__PURE__ */ jsx("div", { role: "group", className: cx("option-group", `option-group--${orientation}`, className), children: options.map((o) => /* @__PURE__ */ jsxs("label", { className: cx("option-row", o.disabled && "is-disabled"), children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "checkbox",
+        className: "checkbox",
+        checked: set.has(o.value),
+        disabled: o.disabled,
+        onChange: () => {
+          if (set.has(o.value)) onChange(value.filter((v) => v !== o.value));
+          else onChange([...value, o.value]);
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxs("span", { className: "option-row__body", children: [
+      /* @__PURE__ */ jsx("span", { className: "option-row__label", children: o.label }),
+      o.description && /* @__PURE__ */ jsx("span", { className: "option-row__desc", children: o.description })
+    ] })
+  ] }, String(o.value))) });
+}
+
+export { CheckboxGroup, MoneyInput, PhoneInput, Progress, ProgressCircle, RadioGroup, Slider, TagInput, TimePicker };
+//# sourceMappingURL=chunk-HVUNNL3A.mjs.map
+//# sourceMappingURL=chunk-HVUNNL3A.mjs.map

package/dist/chunk-HVUNNL3A.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/InputsExtra.tsx"],"names":["Slider","MoneyInput"],"mappings":"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","file":"chunk-HVUNNL3A.mjs","sourcesContent":["'use client';\nimport * as React from 'react';\nimport { cx } from '../utils/cx';\nimport { X } from './Icons';\nimport { getBrand } from '../brand';\nimport { useLocale } from '../locale/LocaleProvider';\nimport { format } from '../locale/messages';\n\n// ---------- Slider ------------------------------------------------------\nexport interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value' | 'type'> {\n  value: number;\n  onChange: (v: number) => void;\n  min?: number;\n  max?: number;\n  step?: number;\n  showValue?: boolean;\n  formatValue?: (v: number) => string;\n}\n\nexport const Slider = React.forwardRef<HTMLInputElement, SliderProps>(function Slider(\n  { value, onChange, min = 0, max = 100, step = 1, showValue, formatValue, className, ...rest },\n  ref\n) {\n  const pct = ((value - min) / (max - min)) * 100;\n  return (\n    <div className={cx('slider', className)}>\n      <input\n        ref={ref}\n        type=\"range\"\n        className=\"slider__input\"\n        value={value}\n        min={min}\n        max={max}\n        step={step}\n        onChange={(e) => onChange(Number(e.target.value))}\n        style={{ '--pct': `${pct}%` } as React.CSSProperties}\n        {...rest}\n      />\n      {showValue && (\n        <span className=\"slider__value\">{formatValue ? formatValue(value) : value}</span>\n      )}\n    </div>\n  );\n});\n\n// ---------- Progress (linear + circular) --------------------------------\nexport interface ProgressProps {\n  value: number;       // 0–100\n  variant?: 'blue' | 'orange' | 'success' | 'warning' | 'danger';\n  showLabel?: boolean;\n  size?: 'sm' | 'md';\n  className?: string;\n}\n\nexport function Progress({ value, variant = 'blue', showLabel, size = 'md', className }: ProgressProps) {\n  const v = Math.max(0, Math.min(100, value));\n  return (\n    <div className={cx('progress', size === 'sm' && 'progress--sm', className)}>\n      <div className={cx('progress__bar', `progress__bar--${variant}`)} style={{ width: `${v}%` }} role=\"progressbar\" aria-valuenow={v} aria-valuemin={0} aria-valuemax={100} />\n      {showLabel && <span className=\"progress__label\">{Math.round(v)}%</span>}\n    </div>\n  );\n}\n\nexport interface ProgressCircleProps {\n  value: number;\n  size?: number;\n  stroke?: number;\n  variant?: 'blue' | 'orange' | 'success' | 'warning' | 'danger';\n  showLabel?: boolean;\n  className?: string;\n}\n\nexport function ProgressCircle({ value, size = 64, stroke = 6, variant = 'blue', showLabel = true, className }: ProgressCircleProps) {\n  const v = Math.max(0, Math.min(100, value));\n  const r = (size - stroke) / 2;\n  const c = 2 * Math.PI * r;\n  const off = c - (v / 100) * c;\n  const colorVar = {\n    blue: 'var(--color-primary)',\n    orange: 'var(--color-secondary)',\n    success: 'var(--color-success)',\n    warning: 'var(--color-warning)',\n    danger: 'var(--color-danger)',\n  }[variant];\n  return (\n    <div className={cx('progress-circle', className)} style={{ width: size, height: size }} role=\"progressbar\" aria-valuenow={v} aria-valuemin={0} aria-valuemax={100}>\n      <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`}>\n        <circle cx={size/2} cy={size/2} r={r} stroke=\"var(--bg-subtle)\" strokeWidth={stroke} fill=\"none\" />\n        <circle\n          cx={size/2} cy={size/2} r={r}\n          stroke={colorVar} strokeWidth={stroke} fill=\"none\"\n          strokeDasharray={c} strokeDashoffset={off} strokeLinecap=\"round\"\n          style={{ transform: 'rotate(-90deg)', transformOrigin: '50% 50%', transition: 'stroke-dashoffset 320ms var(--ease-standard, ease-out)' }}\n        />\n      </svg>\n      {showLabel && <span className=\"progress-circle__label\">{Math.round(v)}%</span>}\n    </div>\n  );\n}\n\n// ---------- Tag input ---------------------------------------------------\nexport interface TagInputProps {\n  value: string[];\n  onChange: (tags: string[]) => void;\n  placeholder?: string;\n  separator?: RegExp;\n  maxTags?: number;\n  validate?: (tag: string) => boolean;\n  disabled?: boolean;\n  className?: string;\n  id?: string;\n}\n\nexport function TagInput({\n  value, onChange, placeholder,\n  separator = /[,\\s]+/, maxTags, validate, disabled, className, id,\n}: TagInputProps) {\n  const [draft, setDraft] = React.useState('');\n  const locale = useLocale();\n  const ph = placeholder ?? locale['tagsInput.placeholder'];\n\n  const addTags = (raw: string) => {\n    const next = raw.split(separator).map((t) => t.trim()).filter(Boolean);\n    if (next.length === 0) return;\n    let merged = [...value];\n    for (const t of next) {\n      if (validate && !validate(t)) continue;\n      if (merged.includes(t)) continue;\n      if (maxTags && merged.length >= maxTags) break;\n      merged.push(t);\n    }\n    onChange(merged);\n    setDraft('');\n  };\n\n  return (\n    <div className={cx('tag-input', disabled && 'is-disabled', className)} onClick={(e) => {\n      const input = (e.currentTarget.querySelector('input') as HTMLInputElement);\n      input?.focus();\n    }}>\n      {value.map((t, i) => (\n        <span key={`${t}-${i}`} className=\"tag-input__tag\">\n          {t}\n          <button type=\"button\" aria-label={format(locale['tagsInput.remove'], { tag: t })} onClick={() => onChange(value.filter((_, idx) => idx !== i))}><X size={12} /></button>\n        </span>\n      ))}\n      <input\n        id={id}\n        className=\"tag-input__field\"\n        value={draft}\n        disabled={disabled}\n        placeholder={value.length === 0 ? ph : ''}\n        onChange={(e) => {\n          const v = e.target.value;\n          if (separator.test(v)) addTags(v);\n          else setDraft(v);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter' && draft.trim()) {\n            e.preventDefault();\n            addTags(draft);\n          } else if (e.key === 'Backspace' && !draft && value.length) {\n            onChange(value.slice(0, -1));\n          }\n        }}\n        onBlur={() => draft.trim() && addTags(draft)}\n      />\n    </div>\n  );\n}\n\n// ---------- MoneyInput (CLP-friendly, but accepts any locale) -----------\nexport interface MoneyInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value' | 'type'> {\n  value: number | null;\n  onChange: (v: number | null) => void;\n  currency?: string;          // 'CLP' | 'USD' | 'EUR' | …\n  locale?: string;            // 'es-CL' | …\n  invalid?: boolean;\n}\n\nexport const MoneyInput = React.forwardRef<HTMLInputElement, MoneyInputProps>(function MoneyInput(\n  { value, onChange, currency, locale, invalid, className, disabled, ...rest },\n  ref\n) {\n  const brand = getBrand();\n  const resolvedCurrency = currency ?? brand.currency;\n  const resolvedLocale = locale ?? brand.locale;\n  const [focus, setFocus] = React.useState(false);\n  const display = value == null\n    ? ''\n    : focus\n      ? String(value)\n      : new Intl.NumberFormat(resolvedLocale, { style: 'currency', currency: resolvedCurrency, maximumFractionDigits: 0 }).format(value);\n  return (\n    <input\n      ref={ref}\n      type=\"text\"\n      inputMode=\"numeric\"\n      className={cx('input', invalid && 'is-invalid', className)}\n      value={display}\n      disabled={disabled}\n      onFocus={() => setFocus(true)}\n      onBlur={() => setFocus(false)}\n      onChange={(e) => {\n        const cleaned = e.target.value.replace(/[^\\d-]/g, '');\n        if (!cleaned || cleaned === '-') return onChange(null);\n        const n = Number(cleaned);\n        onChange(Number.isFinite(n) ? n : null);\n      }}\n      aria-invalid={invalid || undefined}\n      {...rest}\n    />\n  );\n});\n\n// ---------- PhoneInput (CL default, prefix + digits) --------------------\nexport interface PhoneInputProps {\n  value: string;\n  onChange: (v: string) => void;\n  prefix?: string;\n  invalid?: boolean;\n  disabled?: boolean;\n  className?: string;\n  id?: string;\n  placeholder?: string;\n}\n\nexport function PhoneInput({ value, onChange, prefix, invalid, disabled, className, id, placeholder = '9 1234 5678' }: PhoneInputProps) {\n  return (\n    <div className={cx('phone-input', invalid && 'is-invalid', disabled && 'is-disabled', className)}>\n      {prefix && <span className=\"phone-input__prefix\">{prefix}</span>}\n      <input\n        id={id}\n        type=\"tel\"\n        inputMode=\"tel\"\n        placeholder={placeholder}\n        className=\"phone-input__field\"\n        value={value}\n        disabled={disabled}\n        onChange={(e) => onChange(e.target.value.replace(/[^\\d ]/g, ''))}\n        aria-invalid={invalid || undefined}\n      />\n    </div>\n  );\n}\n\n// ---------- TimePicker (HH:mm) ------------------------------------------\nexport interface TimePickerProps {\n  value: string;            // 'HH:mm'\n  onChange: (v: string) => void;\n  step?: number;            // minutes\n  invalid?: boolean;\n  disabled?: boolean;\n  className?: string;\n  id?: string;\n}\n\nexport function TimePicker({ value, onChange, step = 15, invalid, disabled, className, id }: TimePickerProps) {\n  return (\n    <input\n      id={id}\n      type=\"time\"\n      step={step * 60}\n      className={cx('input', invalid && 'is-invalid', className)}\n      value={value}\n      disabled={disabled}\n      onChange={(e) => onChange(e.target.value)}\n      aria-invalid={invalid || undefined}\n    />\n  );\n}\n\n// ---------- RadioGroup / CheckboxGroup ---------------------------------\nexport interface OptionItem<T = string> { value: T; label: React.ReactNode; description?: React.ReactNode; disabled?: boolean }\n\nexport interface RadioGroupProps<T = string> {\n  value: T | null;\n  onChange: (v: T) => void;\n  options: OptionItem<T>[];\n  name: string;\n  orientation?: 'vertical' | 'horizontal';\n  /** Accessible name for the group (announced as \"<label>, radio group\" by screen readers). */\n  label?: string;\n  className?: string;\n}\n\nexport function RadioGroup<T = string>({ value, onChange, options, name, orientation = 'vertical', label, className }: RadioGroupProps<T>) {\n  return (\n    <div role=\"radiogroup\" aria-label={label} className={cx('option-group', `option-group--${orientation}`, className)}>\n      {options.map((o) => (\n        <label key={String(o.value)} className={cx('option-row', o.disabled && 'is-disabled')}>\n          <input\n            type=\"radio\"\n            className=\"radio\"\n            name={name}\n            checked={o.value === value}\n            disabled={o.disabled}\n            onChange={() => onChange(o.value)}\n          />\n          <span className=\"option-row__body\">\n            <span className=\"option-row__label\">{o.label}</span>\n            {o.description && <span className=\"option-row__desc\">{o.description}</span>}\n          </span>\n        </label>\n      ))}\n    </div>\n  );\n}\n\nexport interface CheckboxGroupProps<T = string> {\n  value: T[];\n  onChange: (v: T[]) => void;\n  options: OptionItem<T>[];\n  orientation?: 'vertical' | 'horizontal';\n  className?: string;\n}\n\nexport function CheckboxGroup<T = string>({ value, onChange, options, orientation = 'vertical', className }: CheckboxGroupProps<T>) {\n  const set = new Set(value);\n  return (\n    <div role=\"group\" className={cx('option-group', `option-group--${orientation}`, className)}>\n      {options.map((o) => (\n        <label key={String(o.value)} className={cx('option-row', o.disabled && 'is-disabled')}>\n          <input\n            type=\"checkbox\"\n            className=\"checkbox\"\n            checked={set.has(o.value)}\n            disabled={o.disabled}\n            onChange={() => {\n              if (set.has(o.value)) onChange(value.filter((v) => v !== o.value));\n              else onChange([...value, o.value]);\n            }}\n          />\n          <span className=\"option-row__body\">\n            <span className=\"option-row__label\">{o.label}</span>\n            {o.description && <span className=\"option-row__desc\">{o.description}</span>}\n          </span>\n        </label>\n      ))}\n    </div>\n  );\n}\n"]}