@techzyapp/ui-library 1.0.19 → 1.0.21

package/dist/{Card-DGTGdaTZ.cjs.map → Card-BYFuYD-a.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-DGTGdaTZ.cjs","sources":["../src/components/Card/Card.tsx"],"sourcesContent":["import { forwardRef, useId, useState, type HTMLAttributes, type ReactNode } from 'react'\nimport { clsx } from 'clsx'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport styles from './Card.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'color'> {\n  /** Header title (left, next to the icon). */\n  title?: ReactNode\n  /** Secondary muted line shown under the `title` (e.g. a short description). */\n  subtitle?: ReactNode\n  /** Leading header icon — a known `IconName` or any node. */\n  icon?: IconName | ReactNode\n  /** Theme color that tints the leading icon box. Defaults to `accent`. */\n  color?: ThemeColor\n  /** Marks the card flat (used by `PageLayout`). Cards are shadowless, so this currently adds no visual difference — it's a styling hook, not a distinct look. */\n  flat?: boolean\n  /** Header actions, placed at the end of the header row (before the collapse toggle). */\n  actions?: ReactNode\n  /** Footer content (e.g. actions), pinned to the **right** of the footer row. */\n  footer?: ReactNode\n  /** Footer content pinned to the **left** of the footer row (opposite `footer`). */\n  footerStart?: ReactNode\n  /** Adds a collapse/expand toggle to the header that folds the body + footer. */\n  collapsible?: boolean\n  /** Controlled collapsed state. */\n  collapsed?: boolean\n  /** Initial collapsed state for uncontrolled use. Defaults to `false`. */\n  defaultCollapsed?: boolean\n  /** Fires with the next collapsed state when the toggle is clicked. */\n  onCollapsedChange?: (collapsed: boolean) => void\n  /** Card body. */\n  children?: ReactNode\n}\n\n/**\n * A surface card with an optional header (icon + title + actions), a body, and a footer for actions.\n * `collapsible` adds a chevron that smoothly folds the body + footer (controlled via `collapsed`/\n * `onCollapsedChange`, or uncontrolled via `defaultCollapsed`). Token-only styling.\n */\nexport const Card = forwardRef<HTMLDivElement, CardProps>(function Card(\n  {\n    title,\n    subtitle,\n    icon,\n    color = 'accent',\n    flat = false,\n    actions,\n    footer,\n    footerStart,\n    collapsible = false,\n    collapsed,\n    defaultCollapsed = false,\n    onCollapsedChange,\n    className,\n    children,\n    ...props\n  },\n  ref,\n) {\n  const isControlled = collapsed !== undefined\n  const [internal, setInternal] = useState(defaultCollapsed)\n  const isCollapsed = collapsible && (isControlled ? collapsed! : internal)\n  const collapsibleId = useId() // ties the toggle to the fold region via aria-controls\n\n  const toggle = () => {\n    const next = !isCollapsed\n    if (!isControlled) setInternal(next)\n    onCollapsedChange?.(next)\n  }\n\n  const renderedIcon =\n    icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n      <Icon name={icon as IconName} />\n    ) : (\n      icon\n    )\n\n  const hasHeader =\n    title != null || subtitle != null || renderedIcon != null || actions != null || collapsible\n  const hasBody = children != null && children !== ''\n  const hasFooter = footer != null || footerStart != null\n  const hasCollapsibleContent = hasBody || hasFooter\n  // The header is separated by a divider only while content is visible beneath it.\n  const headerDivided = hasCollapsibleContent && !isCollapsed\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(styles.card, flat && styles.flat, isCollapsed && styles.collapsed, className)}\n      {...props}\n    >\n      {hasHeader && (\n        <div className={clsx(styles.header, headerDivided && styles.headerDivided)}>\n          <div className={styles.headerMain}>\n            {renderedIcon != null && (\n              <IconButton\n                variant=\"filled\"\n                size=\"sm\"\n                color={color}\n                nonClickable\n                aria-hidden\n                className={styles.icon}\n              >\n                {renderedIcon}\n              </IconButton>\n            )}\n            {(title != null || subtitle != null) && (\n              <div className={styles.headerText}>\n                {title != null && <div className={styles.title}>{title}</div>}\n                {subtitle != null && <div className={styles.subtitle}>{subtitle}</div>}\n              </div>\n            )}\n          </div>\n          {(actions != null || collapsible) && (\n            <div className={styles.actions}>\n              {!isCollapsed && actions}\n              {collapsible && (\n                <IconButton\n                  variant=\"text\"\n                  size=\"sm\"\n                  aria-label={isCollapsed ? 'Expand' : 'Collapse'}\n                  aria-expanded={!isCollapsed}\n                  aria-controls={collapsibleId}\n                  onClick={toggle}\n                >\n                  <Icon\n                    name=\"ArrowUp3\"\n                    className={styles.chevron}\n                    data-collapsed={isCollapsed ? 'true' : 'false'}\n                  />\n                </IconButton>\n              )}\n            </div>\n          )}\n        </div>\n      )}\n      {hasCollapsibleContent && (\n        <div\n          id={collapsibleId}\n          className={clsx(styles.collapsible, collapsible && styles.foldable)}\n        >\n          <div className={styles.collapsibleInner}>\n            {hasBody && <div className={styles.body}>{children}</div>}\n            {hasFooter && (\n              <div className={styles.footer}>\n                <div className={styles.footerStart}>{footerStart}</div>\n                <div className={styles.footerEnd}>{footer}</div>\n              </div>\n            )}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n"],"names":["ICON_NAME_SET","ICON_NAMES","Card","forwardRef","title","subtitle","icon","color","flat","actions","footer","footerStart","collapsible","collapsed","defaultCollapsed","onCollapsedChange","className","children","props","ref","isControlled","internal","setInternal","useState","isCollapsed","collapsibleId","useId","toggle","next","renderedIcon","jsx","Icon","hasHeader","hasBody","hasFooter","hasCollapsibleContent","headerDivided","jsxs","clsx","styles","IconButton"],"mappings":"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"}
+{"version":3,"file":"Card-BYFuYD-a.cjs","sources":["../src/components/Card/Card.tsx"],"sourcesContent":["import { forwardRef, useId, useState, type HTMLAttributes, type ReactNode } from 'react'\nimport { clsx } from 'clsx'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport styles from './Card.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'color'> {\n  /** Header title (left, next to the icon). */\n  title?: ReactNode\n  /** Secondary muted line shown under the `title` (e.g. a short description). */\n  subtitle?: ReactNode\n  /** Leading header icon — a known `IconName` or any node. */\n  icon?: IconName | ReactNode\n  /** Theme color that tints the leading icon box. Defaults to `accent`. */\n  color?: ThemeColor\n  /** Marks the card flat (used by `PageLayout`). Cards are shadowless, so this currently adds no visual difference — it's a styling hook, not a distinct look. */\n  flat?: boolean\n  /** Header actions, placed at the end of the header row (before the collapse toggle). */\n  actions?: ReactNode\n  /** Footer content (e.g. actions), pinned to the **right** of the footer row. */\n  footer?: ReactNode\n  /** Footer content pinned to the **left** of the footer row (opposite `footer`). */\n  footerStart?: ReactNode\n  /** Adds a collapse/expand toggle to the header that folds the body + footer. */\n  collapsible?: boolean\n  /** Controlled collapsed state. */\n  collapsed?: boolean\n  /** Initial collapsed state for uncontrolled use. Defaults to `false`. */\n  defaultCollapsed?: boolean\n  /** Fires with the next collapsed state when the toggle is clicked. */\n  onCollapsedChange?: (collapsed: boolean) => void\n  /** Card body. */\n  children?: ReactNode\n}\n\n/**\n * A surface card with an optional header (icon + title + actions), a body, and a footer for actions.\n * `collapsible` adds a chevron that smoothly folds the body + footer (controlled via `collapsed`/\n * `onCollapsedChange`, or uncontrolled via `defaultCollapsed`). Token-only styling.\n */\nexport const Card = forwardRef<HTMLDivElement, CardProps>(function Card(\n  {\n    title,\n    subtitle,\n    icon,\n    color = 'accent',\n    flat = false,\n    actions,\n    footer,\n    footerStart,\n    collapsible = false,\n    collapsed,\n    defaultCollapsed = false,\n    onCollapsedChange,\n    className,\n    children,\n    ...props\n  },\n  ref,\n) {\n  const isControlled = collapsed !== undefined\n  const [internal, setInternal] = useState(defaultCollapsed)\n  const isCollapsed = collapsible && (isControlled ? collapsed! : internal)\n  const collapsibleId = useId() // ties the toggle to the fold region via aria-controls\n\n  const toggle = () => {\n    const next = !isCollapsed\n    if (!isControlled) setInternal(next)\n    onCollapsedChange?.(next)\n  }\n\n  const renderedIcon =\n    icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n      <Icon name={icon as IconName} />\n    ) : (\n      icon\n    )\n\n  const hasHeader =\n    title != null || subtitle != null || renderedIcon != null || actions != null || collapsible\n  const hasBody = children != null && children !== ''\n  const hasFooter = footer != null || footerStart != null\n  const hasCollapsibleContent = hasBody || hasFooter\n  // The header is separated by a divider only while content is visible beneath it.\n  const headerDivided = hasCollapsibleContent && !isCollapsed\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(styles.card, flat && styles.flat, isCollapsed && styles.collapsed, className)}\n      {...props}\n    >\n      {hasHeader && (\n        <div className={clsx(styles.header, headerDivided && styles.headerDivided)}>\n          <div className={styles.headerMain}>\n            {renderedIcon != null && (\n              <IconButton\n                variant=\"filled\"\n                size=\"sm\"\n                color={color}\n                nonClickable\n                aria-hidden\n                className={styles.icon}\n              >\n                {renderedIcon}\n              </IconButton>\n            )}\n            {(title != null || subtitle != null) && (\n              <div className={styles.headerText}>\n                {title != null && <div className={styles.title}>{title}</div>}\n                {subtitle != null && <div className={styles.subtitle}>{subtitle}</div>}\n              </div>\n            )}\n          </div>\n          {(actions != null || collapsible) && (\n            <div className={styles.actions}>\n              {!isCollapsed && actions}\n              {collapsible && (\n                <IconButton\n                  variant=\"text\"\n                  size=\"sm\"\n                  aria-label={isCollapsed ? 'Expand' : 'Collapse'}\n                  aria-expanded={!isCollapsed}\n                  aria-controls={collapsibleId}\n                  onClick={toggle}\n                >\n                  <Icon\n                    name=\"ArrowUp3\"\n                    className={styles.chevron}\n                    data-collapsed={isCollapsed ? 'true' : 'false'}\n                  />\n                </IconButton>\n              )}\n            </div>\n          )}\n        </div>\n      )}\n      {hasCollapsibleContent && (\n        <div\n          id={collapsibleId}\n          className={clsx(styles.collapsible, collapsible && styles.foldable)}\n        >\n          <div className={styles.collapsibleInner}>\n            {hasBody && <div className={styles.body}>{children}</div>}\n            {hasFooter && (\n              <div className={styles.footer}>\n                <div className={styles.footerStart}>{footerStart}</div>\n                <div className={styles.footerEnd}>{footer}</div>\n              </div>\n            )}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n"],"names":["ICON_NAME_SET","ICON_NAMES","Card","forwardRef","title","subtitle","icon","color","flat","actions","footer","footerStart","collapsible","collapsed","defaultCollapsed","onCollapsedChange","className","children","props","ref","isControlled","internal","setInternal","useState","isCollapsed","collapsibleId","useId","toggle","next","renderedIcon","jsx","Icon","hasHeader","hasBody","hasFooter","hasCollapsibleContent","headerDivided","jsxs","clsx","styles","IconButton"],"mappings":"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"}

package/dist/Checkbox-ZYOSBYRt.js

@@ -0,0 +1,98 @@
+import { jsx as n, jsxs as f } from "react/jsx-runtime";
+import { forwardRef as A, useId as D, useRef as G, useCallback as H, useLayoutEffect as J, useState as K } from "react";
+import { clsx as N } from "clsx";
+import { u as M } from "./formContext-B7ln1Miy.js";
+const O = "_field_mfk7r_1", P = "_row_mfk7r_9", Q = "_disabled_mfk7r_17", T = "_input_mfk7r_23", U = "_box_mfk7r_37", W = "_check_mfk7r_64", X = "_dash_mfk7r_79", Y = "_error_mfk7r_101", Z = "_label_mfk7r_105", ee = "_required_mfk7r_110", se = "_sm_mfk7r_116", re = "_md_mfk7r_121", te = "_lg_mfk7r_126", e = {
+  field: O,
+  row: P,
+  disabled: Q,
+  input: T,
+  box: U,
+  check: W,
+  dash: X,
+  error: Y,
+  label: Z,
+  required: ee,
+  sm: se,
+  md: re,
+  lg: te
+}, ie = A(function({
+  label: _,
+  color: m = "accent",
+  size: C = "md",
+  error: w,
+  required: y = !1,
+  indeterminate: u = !1,
+  checked: k,
+  defaultChecked: g = !1,
+  onChange: l,
+  name: r,
+  onBlur: a,
+  disabled: h = !1,
+  id: q,
+  className: z,
+  style: R,
+  ...I
+}, c) {
+  const j = D(), B = q ?? j, i = G(null), E = H(
+    (s) => {
+      i.current = s, typeof c == "function" ? c(s) : c && (c.current = s);
+    },
+    [c]
+  );
+  J(() => {
+    i.current && (i.current.indeterminate = u);
+  }, [u]);
+  const o = M(), p = !!(o && r), t = o && r ? o.field(r) : void 0, b = k !== void 0 ? k : p ? !!o.values[r] : void 0, x = b !== void 0, [F, $] = K(g), L = x ? b : F, v = w ?? (t == null ? void 0 : t.error) ?? !1, S = (s) => {
+    const d = s.target.checked;
+    x || $(d), p && o.setValue(r, d), l == null || l(d);
+  }, V = (s) => {
+    t == null || t.onBlur(s), a == null || a(s);
+  };
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: N(
+        e.field,
+        v && e.error,
+        h && e.disabled,
+        z
+      ),
+      style: {
+        "--tz-btn-rgb": `var(--tz-color-${m}-rgb)`,
+        "--tz-btn-on": `var(--tz-color-${m}-contrast, #fff)`,
+        ...R
+      },
+      children: /* @__PURE__ */ f("label", { className: N(e.row, e[C]), children: [
+        /* @__PURE__ */ n(
+          "input",
+          {
+            ref: E,
+            id: B,
+            name: r,
+            type: "checkbox",
+            className: e.input,
+            checked: L,
+            onChange: S,
+            onBlur: V,
+            disabled: h,
+            "aria-invalid": v || void 0,
+            ...I
+          }
+        ),
+        /* @__PURE__ */ f("span", { className: e.box, "aria-hidden": "true", children: [
+          /* @__PURE__ */ n("span", { className: e.check }),
+          /* @__PURE__ */ n("span", { className: e.dash })
+        ] }),
+        _ != null && /* @__PURE__ */ f("span", { className: e.label, children: [
+          _,
+          y && /* @__PURE__ */ n("span", { className: e.required, "aria-hidden": "true", children: "*" })
+        ] })
+      ] })
+    }
+  );
+});
+export {
+  ie as C
+};
+//# sourceMappingURL=Checkbox-ZYOSBYRt.js.map

package/dist/Checkbox-ZYOSBYRt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox-ZYOSBYRt.js","sources":["../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type CSSProperties,\n  type FocusEvent,\n  type InputHTMLAttributes,\n  type MutableRefObject,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useFormContext } from '../../form/formContext'\nimport type { ThemeColor } from '../../theme'\nimport styles from './Checkbox.module.css'\n\nexport type CheckboxSize = 'sm' | 'md' | 'lg'\n\nexport interface CheckboxProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'color' | 'type' | 'onChange'\n> {\n  /** Text shown to the right of the box. */\n  label?: ReactNode\n  /** Theme palette token used for the checked fill. Defaults to `accent`. */\n  color?: ThemeColor\n  /** Preset size — box dimensions and label font. */\n  size?: CheckboxSize\n  /** Marks the field invalid — reddens the box only (no helper text). */\n  error?: boolean\n  /** Adds a red asterisk after the label. */\n  required?: boolean\n  /**\n   * Shows the **indeterminate** (mixed) dash instead of a check — for a \"select all\" that's only\n   * partially selected. Sets the native `indeterminate` property (announced as \"mixed\"), and takes\n   * visual precedence over `checked`. Purely a display/a11y state — clicking still toggles `checked`,\n   * so the consumer clears it (e.g. once all/none are selected).\n   */\n  indeterminate?: boolean\n  /** Controlled checked state. */\n  checked?: boolean\n  /** Initial checked state for uncontrolled use. Defaults to `false`. */\n  defaultChecked?: boolean\n  /** Fires with the next checked state. */\n  onChange?: (checked: boolean) => void\n}\n\n/**\n * A checkbox with a label. The native `<input type=\"checkbox\">` is visually hidden but fully\n * accessible (keyboard + screen reader); a styled box shows the state, filled with `color` and a\n * CSS checkmark when checked. Controlled (`checked` + `onChange`) or uncontrolled (`defaultChecked`),\n * and — like the other fields — binds to a surrounding `<Form>` by `name` (its form value is a\n * `boolean`). `error` reddens the box (no message text). Styling uses `--tz-*` tokens only.\n */\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(function Checkbox(\n  {\n    label,\n    color = 'accent',\n    size = 'md',\n    error,\n    required = false,\n    indeterminate = false,\n    checked,\n    defaultChecked = false,\n    onChange,\n    name,\n    onBlur,\n    disabled = false,\n    id: idProp,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const reactId = useId()\n  const id = idProp ?? reactId\n\n  // `indeterminate` is a DOM property (not an attribute), so set it on the node — and merge our internal\n  // ref with the forwarded one so both see the same input. The `:indeterminate` pseudo drives the styling.\n  const innerRef = useRef<HTMLInputElement | null>(null)\n  const setRef = useCallback(\n    (node: HTMLInputElement | null) => {\n      innerRef.current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as MutableRefObject<HTMLInputElement | null>).current = node\n    },\n    [ref],\n  )\n  useLayoutEffect(() => {\n    if (innerRef.current) innerRef.current.indeterminate = indeterminate\n  }, [indeterminate])\n\n  // Auto-bind to a surrounding <Form> by `name` — the form value is a boolean.\n  const form = useFormContext()\n  const isFormBound = Boolean(form && name)\n  const bound = form && name ? form.field(name) : undefined\n\n  const externalChecked: boolean | undefined =\n    checked !== undefined ? checked : isFormBound ? Boolean(form!.values[name!]) : undefined\n  const isControlled = externalChecked !== undefined\n  const [internal, setInternal] = useState<boolean>(defaultChecked)\n  const isChecked = isControlled ? externalChecked! : internal\n\n  const resolvedError = error ?? bound?.error ?? false\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const next = event.target.checked\n    if (!isControlled) setInternal(next)\n    if (isFormBound) form!.setValue(name!, next)\n    onChange?.(next)\n  }\n\n  const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n    bound?.onBlur(event)\n    onBlur?.(event)\n  }\n\n  return (\n    <div\n      className={clsx(\n        styles.field,\n        resolvedError && styles.error,\n        disabled && styles.disabled,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n    >\n      <label className={clsx(styles.row, styles[size])}>\n        <input\n          ref={setRef}\n          id={id}\n          name={name}\n          type=\"checkbox\"\n          className={styles.input}\n          checked={isChecked}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          disabled={disabled}\n          aria-invalid={resolvedError || undefined}\n          {...props}\n        />\n        <span className={styles.box} aria-hidden=\"true\">\n          <span className={styles.check} />\n          <span className={styles.dash} />\n        </span>\n        {label != null && (\n          <span className={styles.label}>\n            {label}\n            {required && (\n              <span className={styles.required} aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </span>\n        )}\n      </label>\n    </div>\n  )\n})\n"],"names":["Checkbox","forwardRef","label","color","size","error","required","indeterminate","checked","defaultChecked","onChange","name","onBlur","disabled","idProp","className","style","props","ref","reactId","useId","id","innerRef","useRef","setRef","useCallback","node","useLayoutEffect","form","useFormContext","isFormBound","bound","externalChecked","isControlled","internal","setInternal","useState","isChecked","resolvedError","handleChange","event","next","handleBlur","jsx","clsx","styles","jsxs"],"mappings":"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"}

package/dist/Checkbox-fzJCwe0j.cjs

@@ -0,0 +1,2 @@
+"use strict";const r=require("react/jsx-runtime"),o=require("react"),j=require("clsx"),A=require("./formContext-bTWrqdEV.cjs"),D="_field_mfk7r_1",G="_row_mfk7r_9",H="_disabled_mfk7r_17",J="_input_mfk7r_23",K="_box_mfk7r_37",M="_check_mfk7r_64",O="_dash_mfk7r_79",P="_error_mfk7r_101",Q="_label_mfk7r_105",T="_required_mfk7r_110",U="_sm_mfk7r_116",W="_md_mfk7r_121",X="_lg_mfk7r_126",s={field:D,row:G,disabled:H,input:J,box:K,check:M,dash:O,error:P,label:Q,required:T,sm:U,md:W,lg:X},Y=o.forwardRef(function({label:_,color:u="accent",size:q="md",error:N,required:C=!1,indeterminate:m=!1,checked:k,defaultChecked:w=!1,onChange:a,name:t,onBlur:i,disabled:x=!1,id:y,className:R,style:g,...z},n){const I=o.useId(),B=y??I,d=o.useRef(null),E=o.useCallback(e=>{d.current=e,typeof n=="function"?n(e):n&&(n.current=e)},[n]);o.useLayoutEffect(()=>{d.current&&(d.current.indeterminate=m)},[m]);const l=A.useFormContext(),h=!!(l&&t),c=l&&t?l.field(t):void 0,b=k!==void 0?k:h?!!l.values[t]:void 0,p=b!==void 0,[F,$]=o.useState(w),L=p?b:F,v=N??(c==null?void 0:c.error)??!1,S=e=>{const f=e.target.checked;p||$(f),h&&l.setValue(t,f),a==null||a(f)},V=e=>{c==null||c.onBlur(e),i==null||i(e)};return r.jsx("div",{className:j.clsx(s.field,v&&s.error,x&&s.disabled,R),style:{"--tz-btn-rgb":`var(--tz-color-${u}-rgb)`,"--tz-btn-on":`var(--tz-color-${u}-contrast, #fff)`,...g},children:r.jsxs("label",{className:j.clsx(s.row,s[q]),children:[r.jsx("input",{ref:E,id:B,name:t,type:"checkbox",className:s.input,checked:L,onChange:S,onBlur:V,disabled:x,"aria-invalid":v||void 0,...z}),r.jsxs("span",{className:s.box,"aria-hidden":"true",children:[r.jsx("span",{className:s.check}),r.jsx("span",{className:s.dash})]}),_!=null&&r.jsxs("span",{className:s.label,children:[_,C&&r.jsx("span",{className:s.required,"aria-hidden":"true",children:"*"})]})]})})});exports.Checkbox=Y;
+//# sourceMappingURL=Checkbox-fzJCwe0j.cjs.map

package/dist/Checkbox-fzJCwe0j.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox-fzJCwe0j.cjs","sources":["../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type CSSProperties,\n  type FocusEvent,\n  type InputHTMLAttributes,\n  type MutableRefObject,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useFormContext } from '../../form/formContext'\nimport type { ThemeColor } from '../../theme'\nimport styles from './Checkbox.module.css'\n\nexport type CheckboxSize = 'sm' | 'md' | 'lg'\n\nexport interface CheckboxProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'color' | 'type' | 'onChange'\n> {\n  /** Text shown to the right of the box. */\n  label?: ReactNode\n  /** Theme palette token used for the checked fill. Defaults to `accent`. */\n  color?: ThemeColor\n  /** Preset size — box dimensions and label font. */\n  size?: CheckboxSize\n  /** Marks the field invalid — reddens the box only (no helper text). */\n  error?: boolean\n  /** Adds a red asterisk after the label. */\n  required?: boolean\n  /**\n   * Shows the **indeterminate** (mixed) dash instead of a check — for a \"select all\" that's only\n   * partially selected. Sets the native `indeterminate` property (announced as \"mixed\"), and takes\n   * visual precedence over `checked`. Purely a display/a11y state — clicking still toggles `checked`,\n   * so the consumer clears it (e.g. once all/none are selected).\n   */\n  indeterminate?: boolean\n  /** Controlled checked state. */\n  checked?: boolean\n  /** Initial checked state for uncontrolled use. Defaults to `false`. */\n  defaultChecked?: boolean\n  /** Fires with the next checked state. */\n  onChange?: (checked: boolean) => void\n}\n\n/**\n * A checkbox with a label. The native `<input type=\"checkbox\">` is visually hidden but fully\n * accessible (keyboard + screen reader); a styled box shows the state, filled with `color` and a\n * CSS checkmark when checked. Controlled (`checked` + `onChange`) or uncontrolled (`defaultChecked`),\n * and — like the other fields — binds to a surrounding `<Form>` by `name` (its form value is a\n * `boolean`). `error` reddens the box (no message text). Styling uses `--tz-*` tokens only.\n */\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(function Checkbox(\n  {\n    label,\n    color = 'accent',\n    size = 'md',\n    error,\n    required = false,\n    indeterminate = false,\n    checked,\n    defaultChecked = false,\n    onChange,\n    name,\n    onBlur,\n    disabled = false,\n    id: idProp,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const reactId = useId()\n  const id = idProp ?? reactId\n\n  // `indeterminate` is a DOM property (not an attribute), so set it on the node — and merge our internal\n  // ref with the forwarded one so both see the same input. The `:indeterminate` pseudo drives the styling.\n  const innerRef = useRef<HTMLInputElement | null>(null)\n  const setRef = useCallback(\n    (node: HTMLInputElement | null) => {\n      innerRef.current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as MutableRefObject<HTMLInputElement | null>).current = node\n    },\n    [ref],\n  )\n  useLayoutEffect(() => {\n    if (innerRef.current) innerRef.current.indeterminate = indeterminate\n  }, [indeterminate])\n\n  // Auto-bind to a surrounding <Form> by `name` — the form value is a boolean.\n  const form = useFormContext()\n  const isFormBound = Boolean(form && name)\n  const bound = form && name ? form.field(name) : undefined\n\n  const externalChecked: boolean | undefined =\n    checked !== undefined ? checked : isFormBound ? Boolean(form!.values[name!]) : undefined\n  const isControlled = externalChecked !== undefined\n  const [internal, setInternal] = useState<boolean>(defaultChecked)\n  const isChecked = isControlled ? externalChecked! : internal\n\n  const resolvedError = error ?? bound?.error ?? false\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const next = event.target.checked\n    if (!isControlled) setInternal(next)\n    if (isFormBound) form!.setValue(name!, next)\n    onChange?.(next)\n  }\n\n  const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n    bound?.onBlur(event)\n    onBlur?.(event)\n  }\n\n  return (\n    <div\n      className={clsx(\n        styles.field,\n        resolvedError && styles.error,\n        disabled && styles.disabled,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n    >\n      <label className={clsx(styles.row, styles[size])}>\n        <input\n          ref={setRef}\n          id={id}\n          name={name}\n          type=\"checkbox\"\n          className={styles.input}\n          checked={isChecked}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          disabled={disabled}\n          aria-invalid={resolvedError || undefined}\n          {...props}\n        />\n        <span className={styles.box} aria-hidden=\"true\">\n          <span className={styles.check} />\n          <span className={styles.dash} />\n        </span>\n        {label != null && (\n          <span className={styles.label}>\n            {label}\n            {required && (\n              <span className={styles.required} aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </span>\n        )}\n      </label>\n    </div>\n  )\n})\n"],"names":["Checkbox","forwardRef","label","color","size","error","required","indeterminate","checked","defaultChecked","onChange","name","onBlur","disabled","idProp","className","style","props","ref","reactId","useId","id","innerRef","useRef","setRef","useCallback","node","useLayoutEffect","form","useFormContext","isFormBound","bound","externalChecked","isControlled","internal","setInternal","useState","isChecked","resolvedError","handleChange","event","next","handleBlur","jsx","clsx","styles","jsxs"],"mappings":"meAyDaA,EAAWC,EAAAA,WAA4C,SAClE,CACE,MAAAC,EACA,MAAAC,EAAQ,SACR,KAAAC,EAAO,KACP,MAAAC,EACA,SAAAC,EAAW,GACX,cAAAC,EAAgB,GAChB,QAAAC,EACA,eAAAC,EAAiB,GACjB,SAAAC,EACA,KAAAC,EACA,OAAAC,EACA,SAAAC,EAAW,GACX,GAAIC,EACJ,UAAAC,EACA,MAAAC,EACA,GAAGC,CACL,EACAC,EACA,CACA,MAAMC,EAAUC,EAAAA,MAAA,EACVC,EAAKP,GAAUK,EAIfG,EAAWC,EAAAA,OAAgC,IAAI,EAC/CC,EAASC,EAAAA,YACZC,GAAkC,CACjCJ,EAAS,QAAUI,EACf,OAAOR,GAAQ,WAAYA,EAAIQ,CAAI,EAC9BR,IAAMA,EAAkD,QAAUQ,EAC7E,EACA,CAACR,CAAG,CAAA,EAENS,EAAAA,gBAAgB,IAAM,CAChBL,EAAS,UAASA,EAAS,QAAQ,cAAgBf,EACzD,EAAG,CAACA,CAAa,CAAC,EAGlB,MAAMqB,EAAOC,EAAAA,eAAA,EACPC,EAAc,GAAQF,GAAQjB,GAC9BoB,EAAQH,GAAQjB,EAAOiB,EAAK,MAAMjB,CAAI,EAAI,OAE1CqB,EACJxB,IAAY,OAAYA,EAAUsB,EAAc,EAAQF,EAAM,OAAOjB,CAAK,EAAK,OAC3EsB,EAAeD,IAAoB,OACnC,CAACE,EAAUC,CAAW,EAAIC,EAAAA,SAAkB3B,CAAc,EAC1D4B,EAAYJ,EAAeD,EAAmBE,EAE9CI,EAAgBjC,IAAS0B,GAAA,YAAAA,EAAO,QAAS,GAEzCQ,EAAgBC,GAAyC,CAC7D,MAAMC,EAAOD,EAAM,OAAO,QACrBP,GAAcE,EAAYM,CAAI,EAC/BX,GAAaF,EAAM,SAASjB,EAAO8B,CAAI,EAC3C/B,GAAA,MAAAA,EAAW+B,EACb,EAEMC,EAAcF,GAAwC,CAC1DT,GAAA,MAAAA,EAAO,OAAOS,GACd5B,GAAA,MAAAA,EAAS4B,EACX,EAEA,OACEG,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,KACTC,EAAO,MACPP,GAAiBO,EAAO,MACxBhC,GAAYgC,EAAO,SACnB9B,CAAA,EAEF,MACE,CACE,eAAgB,kBAAkBZ,CAAK,QACvC,cAAe,kBAAkBA,CAAK,mBACtC,GAAGa,CAAA,EAIP,SAAA8B,EAAAA,KAAC,SAAM,UAAWF,EAAAA,KAAKC,EAAO,IAAKA,EAAOzC,CAAI,CAAC,EAC7C,SAAA,CAAAuC,EAAAA,IAAC,QAAA,CACC,IAAKnB,EACL,GAAAH,EACA,KAAAV,EACA,KAAK,WACL,UAAWkC,EAAO,MAClB,QAASR,EACT,SAAUE,EACV,OAAQG,EACR,SAAA7B,EACA,eAAcyB,GAAiB,OAC9B,GAAGrB,CAAA,CAAA,SAEL,OAAA,CAAK,UAAW4B,EAAO,IAAK,cAAY,OACvC,SAAA,CAAAF,EAAAA,IAAC,OAAA,CAAK,UAAWE,EAAO,KAAA,CAAO,EAC/BF,EAAAA,IAAC,OAAA,CAAK,UAAWE,EAAO,IAAA,CAAM,CAAA,EAChC,EACC3C,GAAS,MACR4C,EAAAA,KAAC,OAAA,CAAK,UAAWD,EAAO,MACrB,SAAA,CAAA3C,EACAI,SACE,OAAA,CAAK,UAAWuC,EAAO,SAAU,cAAY,OAAO,SAAA,GAAA,CAErD,CAAA,CAAA,CAEJ,CAAA,CAAA,CAEJ,CAAA,CAAA,CAGN,CAAC"}

package/dist/{Chip-D83svOCW.js → Chip-BiqfnRUi.js}

@@ -1,8 +1,8 @@
 import { jsxs as w, jsx as n } from "react/jsx-runtime";
 import { forwardRef as I } from "react";
 import { clsx as C } from "clsx";
-import { I as A } from "./Icon-CophpkHo.js";
-import { a as B } from "./ConfigProvider-DDuIJSM7.js";
+import { I as A } from "./Icon-DaTvzLBu.js";
+import { a as B } from "./ConfigProvider-DT0yrgmd.js";
 const N = "_chip_1yjgf_3", z = "_sm_1yjgf_20", T = "_md_1yjgf_25", $ = "_lg_1yjgf_30", E = "_contained_1yjgf_37", M = "_filled_1yjgf_42", P = "_outlined_1yjgf_46", R = "_text_1yjgf_51", q = "_clickable_1yjgf_57", D = "_disabled_1yjgf_82", F = "_startIcon_1yjgf_89", G = "_avatar_1yjgf_95", H = "_withAvatar_1yjgf_102", J = "_withDelete_1yjgf_106", L = "_deleteBtn_1yjgf_127", t = {
   chip: N,
   sm: z,
@@ -89,4 +89,4 @@ const N = "_chip_1yjgf_3", z = "_sm_1yjgf_20", T = "_md_1yjgf_25", $ = "_lg_1yjg
 export {
   X as C
 };
-//# sourceMappingURL=Chip-D83svOCW.js.map
+//# sourceMappingURL=Chip-BiqfnRUi.js.map

package/dist/{Chip-D83svOCW.js.map → Chip-BiqfnRUi.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Chip-D83svOCW.js","sources":["../src/components/Chip/Chip.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type CSSProperties,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport styles from './Chip.module.css'\n\nexport type ChipVariant = 'contained' | 'filled' | 'outlined' | 'text'\nexport type ChipSize = 'sm' | 'md' | 'lg'\n\nexport interface ChipProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {\n  /** Visual style. Defaults to `filled` (a soft tinted chip). */\n  variant?: ChipVariant\n  /** Theme palette token that tints the chip. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Preset size — height + font. Defaults to `md`. */\n  size?: ChipSize\n  /** Makes the chip interactive (hover, pointer, keyboard, `onClick`). Off by default (a static tag). */\n  clickable?: boolean\n  /** Dims the chip and disables all interaction. */\n  disabled?: boolean\n  /** Leading icon (e.g. an `<Icon />`). Ignored when `avatar` is set. */\n  startIcon?: ReactNode\n  /** Leading avatar (e.g. an `<Avatar />`), sized to the chip and flush to the left. */\n  avatar?: ReactNode\n  /** When provided, shows a trailing delete button that calls this (its click won't trigger `onClick`). */\n  onDelete?: () => void\n  /** Custom delete icon. Defaults to a `CloseCircle`. */\n  deleteIcon?: ReactNode\n  /** Accessible label for the delete button. Defaults to `\"Remove\"`. */\n  deleteLabel?: string\n  /** Tab index for the delete button — pass `-1` when the chip lives inside a composite widget (e.g. a multi-select) that owns keyboard focus. */\n  deleteTabIndex?: number\n  /** Chip label. */\n  children?: ReactNode\n}\n\n/**\n * A compact tag/token. Static by default; `clickable` makes it an interactive `role=\"button\"`\n * (hover + Enter/Space). Supports a leading `startIcon` or `avatar` and a trailing delete button via\n * `onDelete`. Tinted by `color` through the shared `--tz-btn-rgb` / `--tz-btn-on` pattern across the\n * four standard variants. Token-only styling.\n */\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(function Chip(\n  {\n    variant = 'filled',\n    color = 'primary',\n    size = 'md',\n    clickable = false,\n    disabled = false,\n    startIcon,\n    avatar,\n    onDelete,\n    deleteIcon,\n    deleteLabel,\n    deleteTabIndex,\n    className,\n    style,\n    children,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const t = useT()\n  const interactive = clickable && !disabled\n\n  const handleDelete = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation()\n    if (!disabled) onDelete?.()\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (interactive && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault()\n      event.currentTarget.click()\n    }\n    onKeyDown?.(event)\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(\n        styles.chip,\n        styles[variant],\n        styles[size],\n        interactive && styles.clickable,\n        disabled && styles.disabled,\n        avatar && styles.withAvatar,\n        onDelete && styles.withDelete,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n      role={interactive ? 'button' : undefined}\n      tabIndex={interactive ? 0 : undefined}\n      aria-disabled={disabled || undefined}\n      onKeyDown={handleKeyDown}\n      {...props}\n    >\n      {avatar ? (\n        <span className={styles.avatar}>{avatar}</span>\n      ) : startIcon ? (\n        <span className={styles.startIcon}>{startIcon}</span>\n      ) : null}\n      {children != null && children !== '' ? <span>{children}</span> : null}\n      {onDelete ? (\n        <button\n          type=\"button\"\n          className={styles.deleteBtn}\n          onClick={handleDelete}\n          onMouseDown={(event) => event.preventDefault()}\n          aria-label={deleteLabel ?? t('common.remove')}\n          tabIndex={deleteTabIndex}\n          disabled={disabled}\n        >\n          {deleteIcon ?? <Icon name=\"CloseCircle\" size={size} />}\n        </button>\n      ) : null}\n    </div>\n  )\n})\n"],"names":["Chip","forwardRef","variant","color","size","clickable","disabled","startIcon","avatar","onDelete","deleteIcon","deleteLabel","deleteTabIndex","className","style","children","onKeyDown","props","ref","t","useT","interactive","handleDelete","event","handleKeyDown","jsxs","clsx","styles","jsx","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;GAiDaA,IAAOC,EAAsC,SACxD;AAAA,EACE,SAAAC,IAAU;AAAA,EACV,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAIC,EAAA,GACJC,IAAchB,KAAa,CAACC,GAE5BgB,IAAe,CAACC,MAAyC;AAC7D,IAAAA,EAAM,gBAAA,GACDjB,KAAUG,KAAA,QAAAA;AAAA,EACjB,GAEMe,IAAgB,CAACD,MAAyC;AAC9D,IAAIF,MAAgBE,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACzDA,EAAM,eAAA,GACNA,EAAM,cAAc,MAAA,IAEtBP,KAAA,QAAAA,EAAYO;AAAA,EACd;AAEA,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAP;AAAA,MACA,WAAWQ;AAAA,QACTC,EAAO;AAAA,QACPA,EAAOzB,CAAO;AAAA,QACdyB,EAAOvB,CAAI;AAAA,QACXiB,KAAeM,EAAO;AAAA,QACtBrB,KAAYqB,EAAO;AAAA,QACnBnB,KAAUmB,EAAO;AAAA,QACjBlB,KAAYkB,EAAO;AAAA,QACnBd;AAAA,MAAA;AAAA,MAEF,OACE;AAAA,QACE,gBAAgB,kBAAkBV,CAAK;AAAA,QACvC,eAAe,kBAAkBA,CAAK;AAAA,QACtC,GAAGW;AAAA,MAAA;AAAA,MAGP,MAAMO,IAAc,WAAW;AAAA,MAC/B,UAAUA,IAAc,IAAI;AAAA,MAC5B,iBAAef,KAAY;AAAA,MAC3B,WAAWkB;AAAA,MACV,GAAGP;AAAA,MAEH,UAAA;AAAA,QAAAT,IACC,gBAAAoB,EAAC,QAAA,EAAK,WAAWD,EAAO,QAAS,UAAAnB,GAAO,IACtCD,IACF,gBAAAqB,EAAC,QAAA,EAAK,WAAWD,EAAO,WAAY,aAAU,IAC5C;AAAA,QACHZ,KAAY,QAAQA,MAAa,KAAK,gBAAAa,EAAC,QAAA,EAAM,UAAAb,GAAS,IAAU;AAAA,QAChEN,IACC,gBAAAmB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAWD,EAAO;AAAA,YAClB,SAASL;AAAA,YACT,aAAa,CAACC,MAAUA,EAAM,eAAA;AAAA,YAC9B,cAAYZ,KAAeQ,EAAE,eAAe;AAAA,YAC5C,UAAUP;AAAA,YACV,UAAAN;AAAA,YAEC,UAAAI,KAAc,gBAAAkB,EAACC,GAAA,EAAK,MAAK,eAAc,MAAAzB,EAAA,CAAY;AAAA,UAAA;AAAA,QAAA,IAEpD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
+{"version":3,"file":"Chip-BiqfnRUi.js","sources":["../src/components/Chip/Chip.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type CSSProperties,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport styles from './Chip.module.css'\n\nexport type ChipVariant = 'contained' | 'filled' | 'outlined' | 'text'\nexport type ChipSize = 'sm' | 'md' | 'lg'\n\nexport interface ChipProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {\n  /** Visual style. Defaults to `filled` (a soft tinted chip). */\n  variant?: ChipVariant\n  /** Theme palette token that tints the chip. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Preset size — height + font. Defaults to `md`. */\n  size?: ChipSize\n  /** Makes the chip interactive (hover, pointer, keyboard, `onClick`). Off by default (a static tag). */\n  clickable?: boolean\n  /** Dims the chip and disables all interaction. */\n  disabled?: boolean\n  /** Leading icon (e.g. an `<Icon />`). Ignored when `avatar` is set. */\n  startIcon?: ReactNode\n  /** Leading avatar (e.g. an `<Avatar />`), sized to the chip and flush to the left. */\n  avatar?: ReactNode\n  /** When provided, shows a trailing delete button that calls this (its click won't trigger `onClick`). */\n  onDelete?: () => void\n  /** Custom delete icon. Defaults to a `CloseCircle`. */\n  deleteIcon?: ReactNode\n  /** Accessible label for the delete button. Defaults to `\"Remove\"`. */\n  deleteLabel?: string\n  /** Tab index for the delete button — pass `-1` when the chip lives inside a composite widget (e.g. a multi-select) that owns keyboard focus. */\n  deleteTabIndex?: number\n  /** Chip label. */\n  children?: ReactNode\n}\n\n/**\n * A compact tag/token. Static by default; `clickable` makes it an interactive `role=\"button\"`\n * (hover + Enter/Space). Supports a leading `startIcon` or `avatar` and a trailing delete button via\n * `onDelete`. Tinted by `color` through the shared `--tz-btn-rgb` / `--tz-btn-on` pattern across the\n * four standard variants. Token-only styling.\n */\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(function Chip(\n  {\n    variant = 'filled',\n    color = 'primary',\n    size = 'md',\n    clickable = false,\n    disabled = false,\n    startIcon,\n    avatar,\n    onDelete,\n    deleteIcon,\n    deleteLabel,\n    deleteTabIndex,\n    className,\n    style,\n    children,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const t = useT()\n  const interactive = clickable && !disabled\n\n  const handleDelete = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation()\n    if (!disabled) onDelete?.()\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (interactive && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault()\n      event.currentTarget.click()\n    }\n    onKeyDown?.(event)\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(\n        styles.chip,\n        styles[variant],\n        styles[size],\n        interactive && styles.clickable,\n        disabled && styles.disabled,\n        avatar && styles.withAvatar,\n        onDelete && styles.withDelete,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n      role={interactive ? 'button' : undefined}\n      tabIndex={interactive ? 0 : undefined}\n      aria-disabled={disabled || undefined}\n      onKeyDown={handleKeyDown}\n      {...props}\n    >\n      {avatar ? (\n        <span className={styles.avatar}>{avatar}</span>\n      ) : startIcon ? (\n        <span className={styles.startIcon}>{startIcon}</span>\n      ) : null}\n      {children != null && children !== '' ? <span>{children}</span> : null}\n      {onDelete ? (\n        <button\n          type=\"button\"\n          className={styles.deleteBtn}\n          onClick={handleDelete}\n          onMouseDown={(event) => event.preventDefault()}\n          aria-label={deleteLabel ?? t('common.remove')}\n          tabIndex={deleteTabIndex}\n          disabled={disabled}\n        >\n          {deleteIcon ?? <Icon name=\"CloseCircle\" size={size} />}\n        </button>\n      ) : null}\n    </div>\n  )\n})\n"],"names":["Chip","forwardRef","variant","color","size","clickable","disabled","startIcon","avatar","onDelete","deleteIcon","deleteLabel","deleteTabIndex","className","style","children","onKeyDown","props","ref","t","useT","interactive","handleDelete","event","handleKeyDown","jsxs","clsx","styles","jsx","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;GAiDaA,IAAOC,EAAsC,SACxD;AAAA,EACE,SAAAC,IAAU;AAAA,EACV,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAIC,EAAA,GACJC,IAAchB,KAAa,CAACC,GAE5BgB,IAAe,CAACC,MAAyC;AAC7D,IAAAA,EAAM,gBAAA,GACDjB,KAAUG,KAAA,QAAAA;AAAA,EACjB,GAEMe,IAAgB,CAACD,MAAyC;AAC9D,IAAIF,MAAgBE,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACzDA,EAAM,eAAA,GACNA,EAAM,cAAc,MAAA,IAEtBP,KAAA,QAAAA,EAAYO;AAAA,EACd;AAEA,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAP;AAAA,MACA,WAAWQ;AAAA,QACTC,EAAO;AAAA,QACPA,EAAOzB,CAAO;AAAA,QACdyB,EAAOvB,CAAI;AAAA,QACXiB,KAAeM,EAAO;AAAA,QACtBrB,KAAYqB,EAAO;AAAA,QACnBnB,KAAUmB,EAAO;AAAA,QACjBlB,KAAYkB,EAAO;AAAA,QACnBd;AAAA,MAAA;AAAA,MAEF,OACE;AAAA,QACE,gBAAgB,kBAAkBV,CAAK;AAAA,QACvC,eAAe,kBAAkBA,CAAK;AAAA,QACtC,GAAGW;AAAA,MAAA;AAAA,MAGP,MAAMO,IAAc,WAAW;AAAA,MAC/B,UAAUA,IAAc,IAAI;AAAA,MAC5B,iBAAef,KAAY;AAAA,MAC3B,WAAWkB;AAAA,MACV,GAAGP;AAAA,MAEH,UAAA;AAAA,QAAAT,IACC,gBAAAoB,EAAC,QAAA,EAAK,WAAWD,EAAO,QAAS,UAAAnB,GAAO,IACtCD,IACF,gBAAAqB,EAAC,QAAA,EAAK,WAAWD,EAAO,WAAY,aAAU,IAC5C;AAAA,QACHZ,KAAY,QAAQA,MAAa,KAAK,gBAAAa,EAAC,QAAA,EAAM,UAAAb,GAAS,IAAU;AAAA,QAChEN,IACC,gBAAAmB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAWD,EAAO;AAAA,YAClB,SAASL;AAAA,YACT,aAAa,CAACC,MAAUA,EAAM,eAAA;AAAA,YAC9B,cAAYZ,KAAeQ,EAAE,eAAe;AAAA,YAC5C,UAAUP;AAAA,YACV,UAAAN;AAAA,YAEC,UAAAI,KAAc,gBAAAkB,EAACC,GAAA,EAAK,MAAK,eAAc,MAAAzB,EAAA,CAAY;AAAA,UAAA;AAAA,QAAA,IAEpD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}

package/dist/{Chip-CJuAvgst.cjs → Chip-CdKUtUGE.cjs}

@@ -1,2 +1,2 @@
-"use strict";const c=require("react/jsx-runtime"),w=require("react"),C=require("clsx"),I=require("./Icon-CXTl_QAP.cjs"),q=require("./ConfigProvider-h1WoGC3R.cjs"),A="_chip_1yjgf_3",B="_sm_1yjgf_20",N="_md_1yjgf_25",z="_lg_1yjgf_30",P="_contained_1yjgf_37",R="_filled_1yjgf_42",T="_outlined_1yjgf_46",$="_text_1yjgf_51",E="_clickable_1yjgf_57",M="_disabled_1yjgf_82",D="_startIcon_1yjgf_89",F="_avatar_1yjgf_95",G="_withAvatar_1yjgf_102",H="_withDelete_1yjgf_106",J="_deleteBtn_1yjgf_127",t={chip:A,sm:B,md:N,lg:z,contained:P,filled:R,outlined:T,text:$,clickable:E,disabled:M,startIcon:D,avatar:F,withAvatar:G,withDelete:H,deleteBtn:J},L=w.forwardRef(function({variant:f="filled",color:r="primary",size:_="md",clickable:u=!1,disabled:n=!1,startIcon:d,avatar:l,onDelete:s,deleteIcon:g,deleteLabel:j,deleteTabIndex:h,className:y,style:m,children:i,onKeyDown:o,...p},b){const x=q.useT(),a=u&&!n,v=e=>{e.stopPropagation(),n||s==null||s()},k=e=>{a&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),e.currentTarget.click()),o==null||o(e)};return c.jsxs("div",{ref:b,className:C.clsx(t.chip,t[f],t[_],a&&t.clickable,n&&t.disabled,l&&t.withAvatar,s&&t.withDelete,y),style:{"--tz-btn-rgb":`var(--tz-color-${r}-rgb)`,"--tz-btn-on":`var(--tz-color-${r}-contrast, #fff)`,...m},role:a?"button":void 0,tabIndex:a?0:void 0,"aria-disabled":n||void 0,onKeyDown:k,...p,children:[l?c.jsx("span",{className:t.avatar,children:l}):d?c.jsx("span",{className:t.startIcon,children:d}):null,i!=null&&i!==""?c.jsx("span",{children:i}):null,s?c.jsx("button",{type:"button",className:t.deleteBtn,onClick:v,onMouseDown:e=>e.preventDefault(),"aria-label":j??x("common.remove"),tabIndex:h,disabled:n,children:g??c.jsx(I.Icon,{name:"CloseCircle",size:_})}):null]})});exports.Chip=L;
-//# sourceMappingURL=Chip-CJuAvgst.cjs.map
+"use strict";const c=require("react/jsx-runtime"),w=require("react"),C=require("clsx"),I=require("./Icon-BVULqOJD.cjs"),q=require("./ConfigProvider-C7DUWHrb.cjs"),A="_chip_1yjgf_3",B="_sm_1yjgf_20",N="_md_1yjgf_25",z="_lg_1yjgf_30",P="_contained_1yjgf_37",R="_filled_1yjgf_42",T="_outlined_1yjgf_46",$="_text_1yjgf_51",E="_clickable_1yjgf_57",M="_disabled_1yjgf_82",D="_startIcon_1yjgf_89",F="_avatar_1yjgf_95",G="_withAvatar_1yjgf_102",H="_withDelete_1yjgf_106",J="_deleteBtn_1yjgf_127",t={chip:A,sm:B,md:N,lg:z,contained:P,filled:R,outlined:T,text:$,clickable:E,disabled:M,startIcon:D,avatar:F,withAvatar:G,withDelete:H,deleteBtn:J},L=w.forwardRef(function({variant:f="filled",color:r="primary",size:_="md",clickable:u=!1,disabled:n=!1,startIcon:d,avatar:l,onDelete:s,deleteIcon:g,deleteLabel:j,deleteTabIndex:h,className:y,style:m,children:i,onKeyDown:o,...p},b){const x=q.useT(),a=u&&!n,v=e=>{e.stopPropagation(),n||s==null||s()},k=e=>{a&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),e.currentTarget.click()),o==null||o(e)};return c.jsxs("div",{ref:b,className:C.clsx(t.chip,t[f],t[_],a&&t.clickable,n&&t.disabled,l&&t.withAvatar,s&&t.withDelete,y),style:{"--tz-btn-rgb":`var(--tz-color-${r}-rgb)`,"--tz-btn-on":`var(--tz-color-${r}-contrast, #fff)`,...m},role:a?"button":void 0,tabIndex:a?0:void 0,"aria-disabled":n||void 0,onKeyDown:k,...p,children:[l?c.jsx("span",{className:t.avatar,children:l}):d?c.jsx("span",{className:t.startIcon,children:d}):null,i!=null&&i!==""?c.jsx("span",{children:i}):null,s?c.jsx("button",{type:"button",className:t.deleteBtn,onClick:v,onMouseDown:e=>e.preventDefault(),"aria-label":j??x("common.remove"),tabIndex:h,disabled:n,children:g??c.jsx(I.Icon,{name:"CloseCircle",size:_})}):null]})});exports.Chip=L;
+//# sourceMappingURL=Chip-CdKUtUGE.cjs.map

package/dist/{Chip-CJuAvgst.cjs.map → Chip-CdKUtUGE.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Chip-CJuAvgst.cjs","sources":["../src/components/Chip/Chip.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type CSSProperties,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport styles from './Chip.module.css'\n\nexport type ChipVariant = 'contained' | 'filled' | 'outlined' | 'text'\nexport type ChipSize = 'sm' | 'md' | 'lg'\n\nexport interface ChipProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {\n  /** Visual style. Defaults to `filled` (a soft tinted chip). */\n  variant?: ChipVariant\n  /** Theme palette token that tints the chip. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Preset size — height + font. Defaults to `md`. */\n  size?: ChipSize\n  /** Makes the chip interactive (hover, pointer, keyboard, `onClick`). Off by default (a static tag). */\n  clickable?: boolean\n  /** Dims the chip and disables all interaction. */\n  disabled?: boolean\n  /** Leading icon (e.g. an `<Icon />`). Ignored when `avatar` is set. */\n  startIcon?: ReactNode\n  /** Leading avatar (e.g. an `<Avatar />`), sized to the chip and flush to the left. */\n  avatar?: ReactNode\n  /** When provided, shows a trailing delete button that calls this (its click won't trigger `onClick`). */\n  onDelete?: () => void\n  /** Custom delete icon. Defaults to a `CloseCircle`. */\n  deleteIcon?: ReactNode\n  /** Accessible label for the delete button. Defaults to `\"Remove\"`. */\n  deleteLabel?: string\n  /** Tab index for the delete button — pass `-1` when the chip lives inside a composite widget (e.g. a multi-select) that owns keyboard focus. */\n  deleteTabIndex?: number\n  /** Chip label. */\n  children?: ReactNode\n}\n\n/**\n * A compact tag/token. Static by default; `clickable` makes it an interactive `role=\"button\"`\n * (hover + Enter/Space). Supports a leading `startIcon` or `avatar` and a trailing delete button via\n * `onDelete`. Tinted by `color` through the shared `--tz-btn-rgb` / `--tz-btn-on` pattern across the\n * four standard variants. Token-only styling.\n */\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(function Chip(\n  {\n    variant = 'filled',\n    color = 'primary',\n    size = 'md',\n    clickable = false,\n    disabled = false,\n    startIcon,\n    avatar,\n    onDelete,\n    deleteIcon,\n    deleteLabel,\n    deleteTabIndex,\n    className,\n    style,\n    children,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const t = useT()\n  const interactive = clickable && !disabled\n\n  const handleDelete = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation()\n    if (!disabled) onDelete?.()\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (interactive && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault()\n      event.currentTarget.click()\n    }\n    onKeyDown?.(event)\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(\n        styles.chip,\n        styles[variant],\n        styles[size],\n        interactive && styles.clickable,\n        disabled && styles.disabled,\n        avatar && styles.withAvatar,\n        onDelete && styles.withDelete,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n      role={interactive ? 'button' : undefined}\n      tabIndex={interactive ? 0 : undefined}\n      aria-disabled={disabled || undefined}\n      onKeyDown={handleKeyDown}\n      {...props}\n    >\n      {avatar ? (\n        <span className={styles.avatar}>{avatar}</span>\n      ) : startIcon ? (\n        <span className={styles.startIcon}>{startIcon}</span>\n      ) : null}\n      {children != null && children !== '' ? <span>{children}</span> : null}\n      {onDelete ? (\n        <button\n          type=\"button\"\n          className={styles.deleteBtn}\n          onClick={handleDelete}\n          onMouseDown={(event) => event.preventDefault()}\n          aria-label={deleteLabel ?? t('common.remove')}\n          tabIndex={deleteTabIndex}\n          disabled={disabled}\n        >\n          {deleteIcon ?? <Icon name=\"CloseCircle\" size={size} />}\n        </button>\n      ) : null}\n    </div>\n  )\n})\n"],"names":["Chip","forwardRef","variant","color","size","clickable","disabled","startIcon","avatar","onDelete","deleteIcon","deleteLabel","deleteTabIndex","className","style","children","onKeyDown","props","ref","t","useT","interactive","handleDelete","event","handleKeyDown","jsxs","clsx","styles","jsx","Icon"],"mappings":"2nBAiDaA,EAAOC,EAAAA,WAAsC,SACxD,CACE,QAAAC,EAAU,SACV,MAAAC,EAAQ,UACR,KAAAC,EAAO,KACP,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,UAAAC,EACA,OAAAC,EACA,SAAAC,EACA,WAAAC,EACA,YAAAC,EACA,eAAAC,EACA,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,GAAGC,CACL,EACAC,EACA,CACA,MAAMC,EAAIC,EAAAA,KAAA,EACJC,EAAchB,GAAa,CAACC,EAE5BgB,EAAgBC,GAAyC,CAC7DA,EAAM,gBAAA,EACDjB,GAAUG,GAAA,MAAAA,GACjB,EAEMe,EAAiBD,GAAyC,CAC1DF,IAAgBE,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OACzDA,EAAM,eAAA,EACNA,EAAM,cAAc,MAAA,GAEtBP,GAAA,MAAAA,EAAYO,EACd,EAEA,OACEE,EAAAA,KAAC,MAAA,CACC,IAAAP,EACA,UAAWQ,EAAAA,KACTC,EAAO,KACPA,EAAOzB,CAAO,EACdyB,EAAOvB,CAAI,EACXiB,GAAeM,EAAO,UACtBrB,GAAYqB,EAAO,SACnBnB,GAAUmB,EAAO,WACjBlB,GAAYkB,EAAO,WACnBd,CAAA,EAEF,MACE,CACE,eAAgB,kBAAkBV,CAAK,QACvC,cAAe,kBAAkBA,CAAK,mBACtC,GAAGW,CAAA,EAGP,KAAMO,EAAc,SAAW,OAC/B,SAAUA,EAAc,EAAI,OAC5B,gBAAef,GAAY,OAC3B,UAAWkB,EACV,GAAGP,EAEH,SAAA,CAAAT,EACCoB,EAAAA,IAAC,OAAA,CAAK,UAAWD,EAAO,OAAS,SAAAnB,EAAO,EACtCD,EACFqB,MAAC,OAAA,CAAK,UAAWD,EAAO,UAAY,WAAU,EAC5C,KACHZ,GAAY,MAAQA,IAAa,GAAKa,EAAAA,IAAC,OAAA,CAAM,SAAAb,EAAS,EAAU,KAChEN,EACCmB,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAWD,EAAO,UAClB,QAASL,EACT,YAAcC,GAAUA,EAAM,eAAA,EAC9B,aAAYZ,GAAeQ,EAAE,eAAe,EAC5C,SAAUP,EACV,SAAAN,EAEC,SAAAI,GAAckB,MAACC,EAAAA,KAAA,CAAK,KAAK,cAAc,KAAAzB,CAAA,CAAY,CAAA,CAAA,EAEpD,IAAA,CAAA,CAAA,CAGV,CAAC"}
+{"version":3,"file":"Chip-CdKUtUGE.cjs","sources":["../src/components/Chip/Chip.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type CSSProperties,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport styles from './Chip.module.css'\n\nexport type ChipVariant = 'contained' | 'filled' | 'outlined' | 'text'\nexport type ChipSize = 'sm' | 'md' | 'lg'\n\nexport interface ChipProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {\n  /** Visual style. Defaults to `filled` (a soft tinted chip). */\n  variant?: ChipVariant\n  /** Theme palette token that tints the chip. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Preset size — height + font. Defaults to `md`. */\n  size?: ChipSize\n  /** Makes the chip interactive (hover, pointer, keyboard, `onClick`). Off by default (a static tag). */\n  clickable?: boolean\n  /** Dims the chip and disables all interaction. */\n  disabled?: boolean\n  /** Leading icon (e.g. an `<Icon />`). Ignored when `avatar` is set. */\n  startIcon?: ReactNode\n  /** Leading avatar (e.g. an `<Avatar />`), sized to the chip and flush to the left. */\n  avatar?: ReactNode\n  /** When provided, shows a trailing delete button that calls this (its click won't trigger `onClick`). */\n  onDelete?: () => void\n  /** Custom delete icon. Defaults to a `CloseCircle`. */\n  deleteIcon?: ReactNode\n  /** Accessible label for the delete button. Defaults to `\"Remove\"`. */\n  deleteLabel?: string\n  /** Tab index for the delete button — pass `-1` when the chip lives inside a composite widget (e.g. a multi-select) that owns keyboard focus. */\n  deleteTabIndex?: number\n  /** Chip label. */\n  children?: ReactNode\n}\n\n/**\n * A compact tag/token. Static by default; `clickable` makes it an interactive `role=\"button\"`\n * (hover + Enter/Space). Supports a leading `startIcon` or `avatar` and a trailing delete button via\n * `onDelete`. Tinted by `color` through the shared `--tz-btn-rgb` / `--tz-btn-on` pattern across the\n * four standard variants. Token-only styling.\n */\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(function Chip(\n  {\n    variant = 'filled',\n    color = 'primary',\n    size = 'md',\n    clickable = false,\n    disabled = false,\n    startIcon,\n    avatar,\n    onDelete,\n    deleteIcon,\n    deleteLabel,\n    deleteTabIndex,\n    className,\n    style,\n    children,\n    onKeyDown,\n    ...props\n  },\n  ref,\n) {\n  const t = useT()\n  const interactive = clickable && !disabled\n\n  const handleDelete = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation()\n    if (!disabled) onDelete?.()\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (interactive && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault()\n      event.currentTarget.click()\n    }\n    onKeyDown?.(event)\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(\n        styles.chip,\n        styles[variant],\n        styles[size],\n        interactive && styles.clickable,\n        disabled && styles.disabled,\n        avatar && styles.withAvatar,\n        onDelete && styles.withDelete,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n      role={interactive ? 'button' : undefined}\n      tabIndex={interactive ? 0 : undefined}\n      aria-disabled={disabled || undefined}\n      onKeyDown={handleKeyDown}\n      {...props}\n    >\n      {avatar ? (\n        <span className={styles.avatar}>{avatar}</span>\n      ) : startIcon ? (\n        <span className={styles.startIcon}>{startIcon}</span>\n      ) : null}\n      {children != null && children !== '' ? <span>{children}</span> : null}\n      {onDelete ? (\n        <button\n          type=\"button\"\n          className={styles.deleteBtn}\n          onClick={handleDelete}\n          onMouseDown={(event) => event.preventDefault()}\n          aria-label={deleteLabel ?? t('common.remove')}\n          tabIndex={deleteTabIndex}\n          disabled={disabled}\n        >\n          {deleteIcon ?? <Icon name=\"CloseCircle\" size={size} />}\n        </button>\n      ) : null}\n    </div>\n  )\n})\n"],"names":["Chip","forwardRef","variant","color","size","clickable","disabled","startIcon","avatar","onDelete","deleteIcon","deleteLabel","deleteTabIndex","className","style","children","onKeyDown","props","ref","t","useT","interactive","handleDelete","event","handleKeyDown","jsxs","clsx","styles","jsx","Icon"],"mappings":"2nBAiDaA,EAAOC,EAAAA,WAAsC,SACxD,CACE,QAAAC,EAAU,SACV,MAAAC,EAAQ,UACR,KAAAC,EAAO,KACP,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,UAAAC,EACA,OAAAC,EACA,SAAAC,EACA,WAAAC,EACA,YAAAC,EACA,eAAAC,EACA,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,GAAGC,CACL,EACAC,EACA,CACA,MAAMC,EAAIC,EAAAA,KAAA,EACJC,EAAchB,GAAa,CAACC,EAE5BgB,EAAgBC,GAAyC,CAC7DA,EAAM,gBAAA,EACDjB,GAAUG,GAAA,MAAAA,GACjB,EAEMe,EAAiBD,GAAyC,CAC1DF,IAAgBE,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OACzDA,EAAM,eAAA,EACNA,EAAM,cAAc,MAAA,GAEtBP,GAAA,MAAAA,EAAYO,EACd,EAEA,OACEE,EAAAA,KAAC,MAAA,CACC,IAAAP,EACA,UAAWQ,EAAAA,KACTC,EAAO,KACPA,EAAOzB,CAAO,EACdyB,EAAOvB,CAAI,EACXiB,GAAeM,EAAO,UACtBrB,GAAYqB,EAAO,SACnBnB,GAAUmB,EAAO,WACjBlB,GAAYkB,EAAO,WACnBd,CAAA,EAEF,MACE,CACE,eAAgB,kBAAkBV,CAAK,QACvC,cAAe,kBAAkBA,CAAK,mBACtC,GAAGW,CAAA,EAGP,KAAMO,EAAc,SAAW,OAC/B,SAAUA,EAAc,EAAI,OAC5B,gBAAef,GAAY,OAC3B,UAAWkB,EACV,GAAGP,EAEH,SAAA,CAAAT,EACCoB,EAAAA,IAAC,OAAA,CAAK,UAAWD,EAAO,OAAS,SAAAnB,EAAO,EACtCD,EACFqB,MAAC,OAAA,CAAK,UAAWD,EAAO,UAAY,WAAU,EAC5C,KACHZ,GAAY,MAAQA,IAAa,GAAKa,EAAAA,IAAC,OAAA,CAAM,SAAAb,EAAS,EAAU,KAChEN,EACCmB,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAWD,EAAO,UAClB,QAASL,EACT,YAAcC,GAAUA,EAAM,eAAA,EAC9B,aAAYZ,GAAeQ,EAAE,eAAe,EAC5C,SAAUP,EACV,SAAAN,EAEC,SAAAI,GAAckB,MAACC,EAAAA,KAAA,CAAK,KAAK,cAAc,KAAAzB,CAAA,CAAY,CAAA,CAAA,EAEpD,IAAA,CAAA,CAAA,CAGV,CAAC"}

package/dist/{ChoiceCardGroup-CvFzZlgI.js → ChoiceCardGroup-DBohUnRj.js}

@@ -3,8 +3,8 @@ import { useContext as P, createContext as R, forwardRef as j, useState as w, us
 import { clsx as k } from "clsx";
 import { u as J } from "./formContext-B7ln1Miy.js";
 import { T as K } from "./Typography-Cta6Rg4L.js";
-import { a as Q } from "./names-D8ABK2Wk.js";
-import { I as U } from "./Icon-CophpkHo.js";
+import { a as Q } from "./names-r21QPjcU.js";
+import { I as U } from "./Icon-DaTvzLBu.js";
 const F = R(null);
 function W() {
   return P(F);
@@ -178,4 +178,4 @@ export {
   he as C,
   Ae as a
 };
-//# sourceMappingURL=ChoiceCardGroup-CvFzZlgI.js.map
+//# sourceMappingURL=ChoiceCardGroup-DBohUnRj.js.map

package/dist/{ChoiceCardGroup-CvFzZlgI.js.map → ChoiceCardGroup-DBohUnRj.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ChoiceCardGroup-CvFzZlgI.js","sources":["../src/components/ChoiceCard/choiceCardContext.ts","../src/components/ChoiceCard/ChoiceCard.tsx","../src/components/ChoiceCard/ChoiceCardGroup.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport type { ThemeColor } from '../../theme'\nimport type { ChoiceCardAlign, ChoiceCardSize } from './ChoiceCard'\n\n/** Shared state a `<ChoiceCardGroup>` hands down to its `<ChoiceCard>` children via context. */\nexport interface ChoiceCardGroupContextValue {\n  /** Shared input `name` — in `exclusive` mode the cards are native radios and must share one. */\n  name?: string\n  /** Single-selection (radio semantics) vs multiple (checkbox semantics). */\n  exclusive: boolean\n  /** Whether a card's value is currently selected. */\n  isSelected: (value: string) => boolean\n  /** Select / toggle a value — called by a child `<ChoiceCard>` on change. */\n  toggle: (value: string) => void\n  size?: ChoiceCardSize\n  align?: ChoiceCardAlign\n  color?: ThemeColor\n  disabled?: boolean\n  error?: boolean\n}\n\nexport const ChoiceCardGroupContext = createContext<ChoiceCardGroupContextValue | null>(null)\n\n/** Read the surrounding `<ChoiceCardGroup>` so a `<ChoiceCard>` can wire itself in (or `null` when standalone). */\nexport function useChoiceCardGroupContext(): ChoiceCardGroupContextValue | null {\n  return useContext(ChoiceCardGroupContext)\n}\n","import {\n  forwardRef,\n  useState,\n  type ChangeEvent,\n  type CSSProperties,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { Icon } from '../Icon'\nimport { useChoiceCardGroupContext } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport type ChoiceCardSize = 'sm' | 'md' | 'lg'\nexport type ChoiceCardAlign = 'left' | 'center'\n\nexport interface ChoiceCardProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'color' | 'type' | 'onChange' | 'value'\n> {\n  /** This card's value — selected when the surrounding `ChoiceCardGroup`'s value holds it. */\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. Optional. */\n  icon?: IconName | ReactNode\n  /**\n   * Content alignment. `center` centers the icon + text stack; `left` anchors the same stack to the\n   * left edge (icon above left-aligned text). Defaults to the group's `align`, else `center` with an\n   * icon and `left` without one.\n   */\n  align?: ChoiceCardAlign\n  /** Theme palette token for the selected tint. Defaults to `primary` (inherits the group's `color`). */\n  color?: ThemeColor\n  /** Preset size — padding, icon circle and fonts. Inherits the group's `size` when omitted. */\n  size?: ChoiceCardSize\n  /** Marks the card invalid — reddens the border + indicator. Inherits the group's `error`. */\n  error?: boolean\n  /** Controlled selected state for standalone use (inside a `ChoiceCardGroup` the group drives this). */\n  checked?: boolean\n  /** Fires with the next selected state (standalone use). */\n  onChange?: (checked: boolean) => void\n}\n\n/**\n * A selectable card — a rich checkbox/radio with an icon, title and description. The native input is\n * visually hidden but fully accessible (Space toggles; in an `exclusive` group the cards are real\n * radios, so Arrow keys rove between them); the card shows the state with a accent border + soft halo,\n * a top-right tick indicator, and an icon circle that fills with the color while selected. Designed to\n * live inside a `<ChoiceCardGroup>` (which supplies the selection, `exclusive` mode and\n * `size`/`color`/`disabled`/`error` via context), but also works standalone as a single fancy checkbox\n * (`checked` + `onChange`). Styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCard = forwardRef<HTMLInputElement, ChoiceCardProps>(function ChoiceCard(\n  {\n    value,\n    label,\n    description,\n    icon,\n    align,\n    color,\n    size,\n    error,\n    checked,\n    onChange,\n    name,\n    disabled,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const group = useChoiceCardGroupContext()\n\n  const resolvedColor = color ?? group?.color ?? 'primary'\n  const resolvedSize = size ?? group?.size ?? 'md'\n  const resolvedError = error ?? group?.error ?? false\n  const resolvedDisabled = disabled ?? group?.disabled ?? false\n  const resolvedName = name ?? group?.name\n  // explicit prop → group's align → smart default (an icon centers the card, no icon reads as a row)\n  const resolvedAlign = align ?? group?.align ?? (icon == null ? 'left' : 'center')\n\n  // In a group the selection comes from context; standalone it's controlled (`checked`) or local.\n  const [internal, setInternal] = useState(false)\n  const isChecked = group ? group.isSelected(value) : checked !== undefined ? checked : internal\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    if (resolvedDisabled) return\n    if (group) {\n      group.toggle(value)\n      return\n    }\n    if (checked === undefined) setInternal(event.target.checked)\n    onChange?.(event.target.checked)\n  }\n\n  const iconNode =\n    typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n      <Icon name={icon as IconName} size={resolvedSize} />\n    ) : (\n      icon\n    )\n\n  return (\n    <label\n      className={clsx(\n        styles.card,\n        styles[resolvedSize],\n        resolvedAlign === 'left' && styles.left,\n        isChecked && styles.selected,\n        resolvedError && styles.error,\n        resolvedDisabled && styles.disabled,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${resolvedColor}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${resolvedColor}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n    >\n      <input\n        ref={ref}\n        type={group?.exclusive ? 'radio' : 'checkbox'}\n        className={styles.input}\n        name={resolvedName}\n        value={value}\n        checked={isChecked}\n        onChange={handleChange}\n        disabled={resolvedDisabled}\n        aria-invalid={resolvedError || undefined}\n        {...props}\n      />\n      {/* top-right selection indicator — radio-style ring + dot in exclusive groups (mirrors Radio),\n          else a circle that fills with the theme color + a CSS tick (checkbox semantics) */}\n      <span\n        className={clsx(styles.indicator, group?.exclusive && styles.radioDot)}\n        aria-hidden=\"true\"\n      />\n      {icon != null && (\n        <span className={styles.iconBox} aria-hidden=\"true\">\n          {iconNode}\n        </span>\n      )}\n      {(label != null || description != null) && (\n        <span className={styles.text}>\n          {label != null && <span className={styles.label}>{label}</span>}\n          {description != null && <span className={styles.description}>{description}</span>}\n        </span>\n      )}\n    </label>\n  )\n})\n","import {\n  forwardRef,\n  useId,\n  useState,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useFormContext } from '../../form/formContext'\nimport type { ThemeColor } from '../../theme'\nimport type { IconName } from '../../icons/names'\nimport { Typography } from '../Typography'\nimport { ChoiceCard, type ChoiceCardAlign, type ChoiceCardSize } from './ChoiceCard'\nimport { ChoiceCardGroupContext, type ChoiceCardGroupContextValue } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\n/** A single card for the data-driven `options` prop. */\nexport interface ChoiceCardOption {\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. */\n  icon?: IconName | ReactNode\n  disabled?: boolean\n}\n\nexport interface ChoiceCardGroupProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'color' | 'onChange' | 'defaultValue'\n> {\n  /**\n   * Single-selection (radio semantics — the cards are native radios, `value` is a `string | null`,\n   * clicking the selected card keeps it selected) vs multiple (checkbox semantics — `value` is a\n   * `string[]`). Defaults to `false` (multiple).\n   */\n  exclusive?: boolean\n  /** Controlled value — a `string | null` when `exclusive`, else a `string[]`. */\n  value?: string | string[] | null\n  /** Initial value for uncontrolled use (same shape as `value`). */\n  defaultValue?: string | string[] | null\n  /** Fires with the next value (matches the `exclusive` shape). */\n  onChange?: (value: string | string[] | null) => void\n  /**\n   * Input `name` — shared by the radios in `exclusive` mode, and the `<Form>` binding key (form value:\n   * `string` when `exclusive`, else `string[]`). Auto-generated when omitted.\n   */\n  name?: string\n  /** Data-driven cards — an alternative to passing `<ChoiceCard>` children. */\n  options?: ChoiceCardOption[]\n  /** Group label rendered above the cards. */\n  label?: ReactNode\n  /** Minimum card width in px — the grid fits as many per row as this allows. Defaults to `160`. */\n  minCardWidth?: number\n  /**\n   * Content alignment for every card. `center` centers the icon + text stack; `left` anchors the same\n   * stack to the left edge (icon above left-aligned text). Omit for the smart default — cards with an\n   * icon center, icon-less cards left-align. A card's own `align` wins.\n   */\n  align?: ChoiceCardAlign\n  /** Preset size for every card. Defaults to `md`. */\n  size?: ChoiceCardSize\n  /** Theme palette token for the selected tint. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Marks the group invalid — reddens the card borders (no message text, like `RadioGroup`). */\n  error?: boolean\n  /** Adds a red asterisk after the label. */\n  required?: boolean\n  /** Disables every card in the group. */\n  disabled?: boolean\n  /** `<ChoiceCard>` children (used when `options` is not given). */\n  children?: ReactNode\n}\n\n/**\n * A group of selectable cards — rich checkboxes/radios with icons, titles and descriptions (role\n * pickers, plan choices, permission sets). **`exclusive`** picks single-selection (radio semantics —\n * `value` is a `string | null` and Arrow keys rove between the cards) vs multiple (checkbox semantics —\n * `value` is a `string[]`); defaults to `false` (multiple). Controlled (`value` + `onChange`) or\n * uncontrolled (`defaultValue`); supply the cards via the data-driven `options` prop (`{ value, label,\n * description?, icon?, disabled? }[]`) or as `<ChoiceCard>` children. The cards lay out on a\n * **responsive grid** (`minCardWidth`, default `160` — as many per row as fit, wrapping below). Binds\n * to a surrounding `<Form>` by **`name`** — the form value is a `string` when `exclusive` (validate\n * with e.g. `z.string().min(1)`), else a `string[]` (`z.array(z.string()).min(1)`); the form's `error`\n * reddens the card borders (no message text, like `RadioGroup`). `role=\"radiogroup\"` / `\"group\"`;\n * styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCardGroup = forwardRef<HTMLDivElement, ChoiceCardGroupProps>(\n  function ChoiceCardGroup(\n    {\n      exclusive = false,\n      value,\n      defaultValue,\n      onChange,\n      name,\n      options,\n      label,\n      minCardWidth = 160,\n      align,\n      size = 'md',\n      color = 'primary',\n      error,\n      required = false,\n      disabled = false,\n      children,\n      className,\n      style,\n      ...props\n    },\n    ref,\n  ) {\n    // exclusive cards are native radios — they need a shared input name even without a form\n    const reactId = useId()\n    const resolvedName = name ?? `choice-${reactId}`\n\n    // Auto-bind to a surrounding <Form> by `name` — the form value mirrors the `exclusive` shape.\n    const form = useFormContext()\n    const isFormBound = Boolean(form && name)\n    const bound = form && name ? form.field(name) : undefined\n\n    const externalValue: string | string[] | null | undefined =\n      value !== undefined\n        ? value\n        : isFormBound\n          ? (form!.values[name!] as string | string[] | null | undefined)\n          : undefined\n    const isControlled = externalValue !== undefined\n    const [internal, setInternal] = useState<string | string[] | null | undefined>(defaultValue)\n    const current = isControlled ? externalValue : internal\n\n    const resolvedError = error ?? bound?.error ?? false\n\n    const isSelected = (v: string) =>\n      exclusive ? current === v : Array.isArray(current) && current.includes(v)\n\n    const toggle = (v: string) => {\n      let next: string | string[] | null\n      if (exclusive) {\n        next = v // radio semantics — selecting again keeps it selected\n      } else {\n        const arr = Array.isArray(current) ? current : []\n        next = arr.includes(v) ? arr.filter((x) => x !== v) : [...arr, v]\n      }\n      if (!isControlled) setInternal(next)\n      if (isFormBound) form!.setValue(name!, next)\n      onChange?.(next)\n    }\n\n    const ctx: ChoiceCardGroupContextValue = {\n      name: resolvedName,\n      exclusive,\n      isSelected,\n      toggle,\n      size,\n      align,\n      color,\n      disabled,\n      error: resolvedError,\n    }\n\n    return (\n      <div\n        ref={ref}\n        role={exclusive ? 'radiogroup' : 'group'}\n        aria-invalid={resolvedError || undefined}\n        className={clsx(styles.group, className)}\n        style={style as CSSProperties}\n        {...props}\n      >\n        {label != null && (\n          <span className={styles.groupLabel}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {label}\n            </Typography>\n            {required && (\n              <span className={styles.required} aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </span>\n        )}\n\n        <div className={styles.grid} style={{ '--cc-min': `${minCardWidth}px` } as CSSProperties}>\n          <ChoiceCardGroupContext.Provider value={ctx}>\n            {options\n              ? options.map((option) => (\n                  <ChoiceCard\n                    key={option.value}\n                    value={option.value}\n                    label={option.label}\n                    description={option.description}\n                    icon={option.icon}\n                    disabled={option.disabled}\n                  />\n                ))\n              : children}\n          </ChoiceCardGroupContext.Provider>\n        </div>\n      </div>\n    )\n  },\n)\n"],"names":["ChoiceCardGroupContext","createContext","useChoiceCardGroupContext","useContext","ICON_NAME_SET","ICON_NAMES","ChoiceCard","forwardRef","value","label","description","icon","align","color","size","error","checked","onChange","name","disabled","className","style","props","ref","group","resolvedColor","resolvedSize","resolvedError","resolvedDisabled","resolvedName","resolvedAlign","internal","setInternal","useState","isChecked","handleChange","event","iconNode","jsx","Icon","jsxs","clsx","styles","ChoiceCardGroup","exclusive","defaultValue","options","minCardWidth","required","children","reactId","useId","form","useFormContext","isFormBound","bound","externalValue","isControlled","current","ctx","v","next","arr","x","Typography","option"],"mappings":";;;;;;;AAqBO,MAAMA,IAAyBC,EAAkD,IAAI;AAGrF,SAASC,IAAgE;AAC9E,SAAOC,EAAWH,CAAsB;AAC1C;;;;;;;;;;;;;;;;;;;;;GCXMI,KAAgB,IAAI,IAAYC,CAAU,GA4CnCC,KAAaC,EAA8C,SACtE;AAAA,EACE,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAQtB,EAAA,GAERuB,IAAgBZ,MAASW,KAAA,gBAAAA,EAAO,UAAS,WACzCE,IAAeZ,MAAQU,KAAA,gBAAAA,EAAO,SAAQ,MACtCG,IAAgBZ,MAASS,KAAA,gBAAAA,EAAO,UAAS,IACzCI,IAAmBT,MAAYK,KAAA,gBAAAA,EAAO,aAAY,IAClDK,IAAeX,MAAQM,KAAA,gBAAAA,EAAO,OAE9BM,IAAgBlB,MAASY,KAAA,gBAAAA,EAAO,WAAUb,KAAQ,OAAO,SAAS,WAGlE,CAACoB,GAAUC,CAAW,IAAIC,EAAS,EAAK,GACxCC,IAAYV,IAAQA,EAAM,WAAWhB,CAAK,IAAIQ,MAAY,SAAYA,IAAUe,GAEhFI,IAAe,CAACC,MAAyC;AAC7D,QAAI,CAAAR,GACJ;AAAA,UAAIJ,GAAO;AACT,QAAAA,EAAM,OAAOhB,CAAK;AAClB;AAAA,MACF;AACA,MAAIQ,MAAY,UAAWgB,EAAYI,EAAM,OAAO,OAAO,GAC3DnB,KAAA,QAAAA,EAAWmB,EAAM,OAAO;AAAA;AAAA,EAC1B,GAEMC,IACJ,OAAO1B,KAAS,YAAYP,GAAc,IAAIO,CAAI,IAChD,gBAAA2B,EAACC,GAAA,EAAK,MAAM5B,GAAkB,MAAMe,GAAc,IAElDf;AAGJ,SACE,gBAAA6B;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTC,EAAO;AAAA,QACPA,EAAOhB,CAAY;AAAA,QACnBI,MAAkB,UAAUY,EAAO;AAAA,QACnCR,KAAaQ,EAAO;AAAA,QACpBf,KAAiBe,EAAO;AAAA,QACxBd,KAAoBc,EAAO;AAAA,QAC3BtB;AAAA,MAAA;AAAA,MAEF,OACE;AAAA,QACE,gBAAgB,kBAAkBK,CAAa;AAAA,QAC/C,eAAe,kBAAkBA,CAAa;AAAA,QAC9C,GAAGJ;AAAA,MAAA;AAAA,MAIP,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAAf;AAAA,YACA,MAAMC,KAAA,QAAAA,EAAO,YAAY,UAAU;AAAA,YACnC,WAAWkB,EAAO;AAAA,YAClB,MAAMb;AAAA,YACN,OAAArB;AAAA,YACA,SAAS0B;AAAA,YACT,UAAUC;AAAA,YACV,UAAUP;AAAA,YACV,gBAAcD,KAAiB;AAAA,YAC9B,GAAGL;AAAA,UAAA;AAAA,QAAA;AAAA,QAIN,gBAAAgB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWG,EAAKC,EAAO,YAAWlB,KAAA,gBAAAA,EAAO,cAAakB,EAAO,QAAQ;AAAA,YACrE,eAAY;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb/B,KAAQ,QACP,gBAAA2B,EAAC,QAAA,EAAK,WAAWI,EAAO,SAAS,eAAY,QAC1C,UAAAL,EAAA,CACH;AAAA,SAEA5B,KAAS,QAAQC,KAAe,2BAC/B,QAAA,EAAK,WAAWgC,EAAO,MACrB,UAAA;AAAA,UAAAjC,KAAS,QAAQ,gBAAA6B,EAAC,QAAA,EAAK,WAAWI,EAAO,OAAQ,UAAAjC,GAAM;AAAA,UACvDC,KAAe,QAAQ,gBAAA4B,EAAC,UAAK,WAAWI,EAAO,aAAc,UAAAhC,EAAA,CAAY;AAAA,QAAA,EAAA,CAC5E;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC,GCvEYiC,KAAkBpC;AAAA,EAC7B,SACE;AAAA,IACE,WAAAqC,IAAY;AAAA,IACZ,OAAApC;AAAA,IACA,cAAAqC;AAAA,IACA,UAAA5B;AAAA,IACA,MAAAC;AAAA,IACA,SAAA4B;AAAA,IACA,OAAArC;AAAA,IACA,cAAAsC,IAAe;AAAA,IACf,OAAAnC;AAAA,IACA,MAAAE,IAAO;AAAA,IACP,OAAAD,IAAQ;AAAA,IACR,OAAAE;AAAA,IACA,UAAAiC,IAAW;AAAA,IACX,UAAA7B,IAAW;AAAA,IACX,UAAA8B;AAAA,IACA,WAAA7B;AAAA,IACA,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,GACA;AAEA,UAAM2B,IAAUC,EAAA,GACVtB,IAAeX,KAAQ,UAAUgC,CAAO,IAGxCE,IAAOC,EAAA,GACPC,IAAc,GAAQF,KAAQlC,IAC9BqC,IAAQH,KAAQlC,IAAOkC,EAAK,MAAMlC,CAAI,IAAI,QAE1CsC,IACJhD,MAAU,SACNA,IACA8C,IACGF,EAAM,OAAOlC,CAAK,IACnB,QACFuC,IAAeD,MAAkB,QACjC,CAACzB,GAAUC,CAAW,IAAIC,EAA+CY,CAAY,GACrFa,IAAUD,IAAeD,IAAgBzB,GAEzCJ,IAAgBZ,MAASwC,KAAA,gBAAAA,EAAO,UAAS,IAkBzCI,IAAmC;AAAA,MACvC,MAAM9B;AAAA,MACN,WAAAe;AAAA,MACA,YAnBiB,CAACgB,MAClBhB,IAAYc,MAAYE,IAAI,MAAM,QAAQF,CAAO,KAAKA,EAAQ,SAASE,CAAC;AAAA,MAmBxE,QAjBa,CAACA,MAAc;AAC5B,YAAIC;AACJ,YAAIjB;AACF,UAAAiB,IAAOD;AAAA,aACF;AACL,gBAAME,IAAM,MAAM,QAAQJ,CAAO,IAAIA,IAAU,CAAA;AAC/C,UAAAG,IAAOC,EAAI,SAASF,CAAC,IAAIE,EAAI,OAAO,CAACC,MAAMA,MAAMH,CAAC,IAAI,CAAC,GAAGE,GAAKF,CAAC;AAAA,QAClE;AACA,QAAKH,KAAczB,EAAY6B,CAAI,GAC/BP,KAAaF,EAAM,SAASlC,GAAO2C,CAAI,GAC3C5C,KAAA,QAAAA,EAAW4C;AAAA,MACb;AAAA,MAOE,MAAA/C;AAAA,MACA,OAAAF;AAAA,MACA,OAAAC;AAAA,MACA,UAAAM;AAAA,MACA,OAAOQ;AAAA,IAAA;AAGT,WACE,gBAAAa;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAjB;AAAA,QACA,MAAMqB,IAAY,eAAe;AAAA,QACjC,gBAAcjB,KAAiB;AAAA,QAC/B,WAAWc,EAAKC,EAAO,OAAOtB,CAAS;AAAA,QACvC,OAAAC;AAAA,QACC,GAAGC;AAAA,QAEH,UAAA;AAAA,UAAAb,KAAS,QACR,gBAAA+B,EAAC,QAAA,EAAK,WAAWE,EAAO,YACtB,UAAA;AAAA,YAAA,gBAAAJ,EAAC0B,KAAW,IAAG,QAAO,SAAQ,aAAY,OAAM,SAC7C,UAAAvD,EAAA,CACH;AAAA,YACCuC,uBACE,QAAA,EAAK,WAAWN,EAAO,UAAU,eAAY,QAAO,UAAA,IAAA,CAErD;AAAA,UAAA,GAEJ;AAAA,UAGF,gBAAAJ,EAAC,SAAI,WAAWI,EAAO,MAAM,OAAO,EAAE,YAAY,GAAGK,CAAY,KAAA,GAC/D,UAAA,gBAAAT,EAACtC,EAAuB,UAAvB,EAAgC,OAAO2D,GACrC,UAAAb,IACGA,EAAQ,IAAI,CAACmB,MACX,gBAAA3B;AAAA,YAAChC;AAAA,YAAA;AAAA,cAEC,OAAO2D,EAAO;AAAA,cACd,OAAOA,EAAO;AAAA,cACd,aAAaA,EAAO;AAAA,cACpB,MAAMA,EAAO;AAAA,cACb,UAAUA,EAAO;AAAA,YAAA;AAAA,YALZA,EAAO;AAAA,UAAA,CAOf,IACDhB,EAAA,CACN,EAAA,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}
+{"version":3,"file":"ChoiceCardGroup-DBohUnRj.js","sources":["../src/components/ChoiceCard/choiceCardContext.ts","../src/components/ChoiceCard/ChoiceCard.tsx","../src/components/ChoiceCard/ChoiceCardGroup.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport type { ThemeColor } from '../../theme'\nimport type { ChoiceCardAlign, ChoiceCardSize } from './ChoiceCard'\n\n/** Shared state a `<ChoiceCardGroup>` hands down to its `<ChoiceCard>` children via context. */\nexport interface ChoiceCardGroupContextValue {\n  /** Shared input `name` — in `exclusive` mode the cards are native radios and must share one. */\n  name?: string\n  /** Single-selection (radio semantics) vs multiple (checkbox semantics). */\n  exclusive: boolean\n  /** Whether a card's value is currently selected. */\n  isSelected: (value: string) => boolean\n  /** Select / toggle a value — called by a child `<ChoiceCard>` on change. */\n  toggle: (value: string) => void\n  size?: ChoiceCardSize\n  align?: ChoiceCardAlign\n  color?: ThemeColor\n  disabled?: boolean\n  error?: boolean\n}\n\nexport const ChoiceCardGroupContext = createContext<ChoiceCardGroupContextValue | null>(null)\n\n/** Read the surrounding `<ChoiceCardGroup>` so a `<ChoiceCard>` can wire itself in (or `null` when standalone). */\nexport function useChoiceCardGroupContext(): ChoiceCardGroupContextValue | null {\n  return useContext(ChoiceCardGroupContext)\n}\n","import {\n  forwardRef,\n  useState,\n  type ChangeEvent,\n  type CSSProperties,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { Icon } from '../Icon'\nimport { useChoiceCardGroupContext } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport type ChoiceCardSize = 'sm' | 'md' | 'lg'\nexport type ChoiceCardAlign = 'left' | 'center'\n\nexport interface ChoiceCardProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'color' | 'type' | 'onChange' | 'value'\n> {\n  /** This card's value — selected when the surrounding `ChoiceCardGroup`'s value holds it. */\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. Optional. */\n  icon?: IconName | ReactNode\n  /**\n   * Content alignment. `center` centers the icon + text stack; `left` anchors the same stack to the\n   * left edge (icon above left-aligned text). Defaults to the group's `align`, else `center` with an\n   * icon and `left` without one.\n   */\n  align?: ChoiceCardAlign\n  /** Theme palette token for the selected tint. Defaults to `primary` (inherits the group's `color`). */\n  color?: ThemeColor\n  /** Preset size — padding, icon circle and fonts. Inherits the group's `size` when omitted. */\n  size?: ChoiceCardSize\n  /** Marks the card invalid — reddens the border + indicator. Inherits the group's `error`. */\n  error?: boolean\n  /** Controlled selected state for standalone use (inside a `ChoiceCardGroup` the group drives this). */\n  checked?: boolean\n  /** Fires with the next selected state (standalone use). */\n  onChange?: (checked: boolean) => void\n}\n\n/**\n * A selectable card — a rich checkbox/radio with an icon, title and description. The native input is\n * visually hidden but fully accessible (Space toggles; in an `exclusive` group the cards are real\n * radios, so Arrow keys rove between them); the card shows the state with a accent border + soft halo,\n * a top-right tick indicator, and an icon circle that fills with the color while selected. Designed to\n * live inside a `<ChoiceCardGroup>` (which supplies the selection, `exclusive` mode and\n * `size`/`color`/`disabled`/`error` via context), but also works standalone as a single fancy checkbox\n * (`checked` + `onChange`). Styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCard = forwardRef<HTMLInputElement, ChoiceCardProps>(function ChoiceCard(\n  {\n    value,\n    label,\n    description,\n    icon,\n    align,\n    color,\n    size,\n    error,\n    checked,\n    onChange,\n    name,\n    disabled,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const group = useChoiceCardGroupContext()\n\n  const resolvedColor = color ?? group?.color ?? 'primary'\n  const resolvedSize = size ?? group?.size ?? 'md'\n  const resolvedError = error ?? group?.error ?? false\n  const resolvedDisabled = disabled ?? group?.disabled ?? false\n  const resolvedName = name ?? group?.name\n  // explicit prop → group's align → smart default (an icon centers the card, no icon reads as a row)\n  const resolvedAlign = align ?? group?.align ?? (icon == null ? 'left' : 'center')\n\n  // In a group the selection comes from context; standalone it's controlled (`checked`) or local.\n  const [internal, setInternal] = useState(false)\n  const isChecked = group ? group.isSelected(value) : checked !== undefined ? checked : internal\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    if (resolvedDisabled) return\n    if (group) {\n      group.toggle(value)\n      return\n    }\n    if (checked === undefined) setInternal(event.target.checked)\n    onChange?.(event.target.checked)\n  }\n\n  const iconNode =\n    typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n      <Icon name={icon as IconName} size={resolvedSize} />\n    ) : (\n      icon\n    )\n\n  return (\n    <label\n      className={clsx(\n        styles.card,\n        styles[resolvedSize],\n        resolvedAlign === 'left' && styles.left,\n        isChecked && styles.selected,\n        resolvedError && styles.error,\n        resolvedDisabled && styles.disabled,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${resolvedColor}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${resolvedColor}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n    >\n      <input\n        ref={ref}\n        type={group?.exclusive ? 'radio' : 'checkbox'}\n        className={styles.input}\n        name={resolvedName}\n        value={value}\n        checked={isChecked}\n        onChange={handleChange}\n        disabled={resolvedDisabled}\n        aria-invalid={resolvedError || undefined}\n        {...props}\n      />\n      {/* top-right selection indicator — radio-style ring + dot in exclusive groups (mirrors Radio),\n          else a circle that fills with the theme color + a CSS tick (checkbox semantics) */}\n      <span\n        className={clsx(styles.indicator, group?.exclusive && styles.radioDot)}\n        aria-hidden=\"true\"\n      />\n      {icon != null && (\n        <span className={styles.iconBox} aria-hidden=\"true\">\n          {iconNode}\n        </span>\n      )}\n      {(label != null || description != null) && (\n        <span className={styles.text}>\n          {label != null && <span className={styles.label}>{label}</span>}\n          {description != null && <span className={styles.description}>{description}</span>}\n        </span>\n      )}\n    </label>\n  )\n})\n","import {\n  forwardRef,\n  useId,\n  useState,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useFormContext } from '../../form/formContext'\nimport type { ThemeColor } from '../../theme'\nimport type { IconName } from '../../icons/names'\nimport { Typography } from '../Typography'\nimport { ChoiceCard, type ChoiceCardAlign, type ChoiceCardSize } from './ChoiceCard'\nimport { ChoiceCardGroupContext, type ChoiceCardGroupContextValue } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\n/** A single card for the data-driven `options` prop. */\nexport interface ChoiceCardOption {\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. */\n  icon?: IconName | ReactNode\n  disabled?: boolean\n}\n\nexport interface ChoiceCardGroupProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'color' | 'onChange' | 'defaultValue'\n> {\n  /**\n   * Single-selection (radio semantics — the cards are native radios, `value` is a `string | null`,\n   * clicking the selected card keeps it selected) vs multiple (checkbox semantics — `value` is a\n   * `string[]`). Defaults to `false` (multiple).\n   */\n  exclusive?: boolean\n  /** Controlled value — a `string | null` when `exclusive`, else a `string[]`. */\n  value?: string | string[] | null\n  /** Initial value for uncontrolled use (same shape as `value`). */\n  defaultValue?: string | string[] | null\n  /** Fires with the next value (matches the `exclusive` shape). */\n  onChange?: (value: string | string[] | null) => void\n  /**\n   * Input `name` — shared by the radios in `exclusive` mode, and the `<Form>` binding key (form value:\n   * `string` when `exclusive`, else `string[]`). Auto-generated when omitted.\n   */\n  name?: string\n  /** Data-driven cards — an alternative to passing `<ChoiceCard>` children. */\n  options?: ChoiceCardOption[]\n  /** Group label rendered above the cards. */\n  label?: ReactNode\n  /** Minimum card width in px — the grid fits as many per row as this allows. Defaults to `160`. */\n  minCardWidth?: number\n  /**\n   * Content alignment for every card. `center` centers the icon + text stack; `left` anchors the same\n   * stack to the left edge (icon above left-aligned text). Omit for the smart default — cards with an\n   * icon center, icon-less cards left-align. A card's own `align` wins.\n   */\n  align?: ChoiceCardAlign\n  /** Preset size for every card. Defaults to `md`. */\n  size?: ChoiceCardSize\n  /** Theme palette token for the selected tint. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Marks the group invalid — reddens the card borders (no message text, like `RadioGroup`). */\n  error?: boolean\n  /** Adds a red asterisk after the label. */\n  required?: boolean\n  /** Disables every card in the group. */\n  disabled?: boolean\n  /** `<ChoiceCard>` children (used when `options` is not given). */\n  children?: ReactNode\n}\n\n/**\n * A group of selectable cards — rich checkboxes/radios with icons, titles and descriptions (role\n * pickers, plan choices, permission sets). **`exclusive`** picks single-selection (radio semantics —\n * `value` is a `string | null` and Arrow keys rove between the cards) vs multiple (checkbox semantics —\n * `value` is a `string[]`); defaults to `false` (multiple). Controlled (`value` + `onChange`) or\n * uncontrolled (`defaultValue`); supply the cards via the data-driven `options` prop (`{ value, label,\n * description?, icon?, disabled? }[]`) or as `<ChoiceCard>` children. The cards lay out on a\n * **responsive grid** (`minCardWidth`, default `160` — as many per row as fit, wrapping below). Binds\n * to a surrounding `<Form>` by **`name`** — the form value is a `string` when `exclusive` (validate\n * with e.g. `z.string().min(1)`), else a `string[]` (`z.array(z.string()).min(1)`); the form's `error`\n * reddens the card borders (no message text, like `RadioGroup`). `role=\"radiogroup\"` / `\"group\"`;\n * styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCardGroup = forwardRef<HTMLDivElement, ChoiceCardGroupProps>(\n  function ChoiceCardGroup(\n    {\n      exclusive = false,\n      value,\n      defaultValue,\n      onChange,\n      name,\n      options,\n      label,\n      minCardWidth = 160,\n      align,\n      size = 'md',\n      color = 'primary',\n      error,\n      required = false,\n      disabled = false,\n      children,\n      className,\n      style,\n      ...props\n    },\n    ref,\n  ) {\n    // exclusive cards are native radios — they need a shared input name even without a form\n    const reactId = useId()\n    const resolvedName = name ?? `choice-${reactId}`\n\n    // Auto-bind to a surrounding <Form> by `name` — the form value mirrors the `exclusive` shape.\n    const form = useFormContext()\n    const isFormBound = Boolean(form && name)\n    const bound = form && name ? form.field(name) : undefined\n\n    const externalValue: string | string[] | null | undefined =\n      value !== undefined\n        ? value\n        : isFormBound\n          ? (form!.values[name!] as string | string[] | null | undefined)\n          : undefined\n    const isControlled = externalValue !== undefined\n    const [internal, setInternal] = useState<string | string[] | null | undefined>(defaultValue)\n    const current = isControlled ? externalValue : internal\n\n    const resolvedError = error ?? bound?.error ?? false\n\n    const isSelected = (v: string) =>\n      exclusive ? current === v : Array.isArray(current) && current.includes(v)\n\n    const toggle = (v: string) => {\n      let next: string | string[] | null\n      if (exclusive) {\n        next = v // radio semantics — selecting again keeps it selected\n      } else {\n        const arr = Array.isArray(current) ? current : []\n        next = arr.includes(v) ? arr.filter((x) => x !== v) : [...arr, v]\n      }\n      if (!isControlled) setInternal(next)\n      if (isFormBound) form!.setValue(name!, next)\n      onChange?.(next)\n    }\n\n    const ctx: ChoiceCardGroupContextValue = {\n      name: resolvedName,\n      exclusive,\n      isSelected,\n      toggle,\n      size,\n      align,\n      color,\n      disabled,\n      error: resolvedError,\n    }\n\n    return (\n      <div\n        ref={ref}\n        role={exclusive ? 'radiogroup' : 'group'}\n        aria-invalid={resolvedError || undefined}\n        className={clsx(styles.group, className)}\n        style={style as CSSProperties}\n        {...props}\n      >\n        {label != null && (\n          <span className={styles.groupLabel}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {label}\n            </Typography>\n            {required && (\n              <span className={styles.required} aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </span>\n        )}\n\n        <div className={styles.grid} style={{ '--cc-min': `${minCardWidth}px` } as CSSProperties}>\n          <ChoiceCardGroupContext.Provider value={ctx}>\n            {options\n              ? options.map((option) => (\n                  <ChoiceCard\n                    key={option.value}\n                    value={option.value}\n                    label={option.label}\n                    description={option.description}\n                    icon={option.icon}\n                    disabled={option.disabled}\n                  />\n                ))\n              : children}\n          </ChoiceCardGroupContext.Provider>\n        </div>\n      </div>\n    )\n  },\n)\n"],"names":["ChoiceCardGroupContext","createContext","useChoiceCardGroupContext","useContext","ICON_NAME_SET","ICON_NAMES","ChoiceCard","forwardRef","value","label","description","icon","align","color","size","error","checked","onChange","name","disabled","className","style","props","ref","group","resolvedColor","resolvedSize","resolvedError","resolvedDisabled","resolvedName","resolvedAlign","internal","setInternal","useState","isChecked","handleChange","event","iconNode","jsx","Icon","jsxs","clsx","styles","ChoiceCardGroup","exclusive","defaultValue","options","minCardWidth","required","children","reactId","useId","form","useFormContext","isFormBound","bound","externalValue","isControlled","current","ctx","v","next","arr","x","Typography","option"],"mappings":"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"}

package/dist/{ChoiceCardGroup-6eFM1eL0.cjs → ChoiceCardGroup-d0VVTUi5.cjs}

@@ -1,2 +1,2 @@
-"use strict";const r=require("react/jsx-runtime"),a=require("react"),$=require("clsx"),O=require("./formContext-bTWrqdEV.cjs"),V=require("./Typography-BFatE1_A.cjs"),P=require("./names-C2Yj1p3u.cjs"),H=require("./Icon-CXTl_QAP.cjs"),w=a.createContext(null);function J(){return a.useContext(w)}const K="_group_3p33b_2",Q="_groupLabel_3p33b_8",U="_required_3p33b_13",W="_grid_3p33b_17",X="_card_3p33b_24",Y="_disabled_3p33b_42",Z="_selected_3p33b_42",ee="_input_3p33b_51",se="_error_3p33b_55",re="_left_3p33b_67",te="_text_3p33b_71",oe="_sm_3p33b_77",ce="_md_3p33b_85",le="_lg_3p33b_93",ne="_indicator_3p33b_117",ie="_radioDot_3p33b_162",ae="_iconBox_3p33b_185",de="_label_3p33b_212",_e="_description_3p33b_219",s={group:K,groupLabel:Q,required:U,grid:W,card:X,disabled:Y,selected:Z,input:ee,error:se,left:re,text:te,sm:oe,md:ce,lg:le,indicator:ne,radioDot:ie,iconBox:ae,label:de,description:_e},ue=new Set(P.ICON_NAMES),R=a.forwardRef(function({value:c,label:d,description:_,icon:o,align:l,color:h,size:C,error:q,checked:u,onChange:b,name:S,disabled:I,className:z,style:A,...B},D){const e=J(),v=h??(e==null?void 0:e.color)??"primary",N=C??(e==null?void 0:e.size)??"md",j=q??(e==null?void 0:e.error)??!1,p=I??(e==null?void 0:e.disabled)??!1,i=S??(e==null?void 0:e.name),y=l??(e==null?void 0:e.align)??(o==null?"left":"center"),[x,g]=a.useState(!1),f=e?e.isSelected(c):u!==void 0?u:x,E=n=>{if(!p){if(e){e.toggle(c);return}u===void 0&&g(n.target.checked),b==null||b(n.target.checked)}},G=typeof o=="string"&&ue.has(o)?r.jsx(H.Icon,{name:o,size:N}):o;return r.jsxs("label",{className:$.clsx(s.card,s[N],y==="left"&&s.left,f&&s.selected,j&&s.error,p&&s.disabled,z),style:{"--tz-btn-rgb":`var(--tz-color-${v}-rgb)`,"--tz-btn-on":`var(--tz-color-${v}-contrast, #fff)`,...A},children:[r.jsx("input",{ref:D,type:e!=null&&e.exclusive?"radio":"checkbox",className:s.input,name:i,value:c,checked:f,onChange:E,disabled:p,"aria-invalid":j||void 0,...B}),r.jsx("span",{className:$.clsx(s.indicator,(e==null?void 0:e.exclusive)&&s.radioDot),"aria-hidden":"true"}),o!=null&&r.jsx("span",{className:s.iconBox,"aria-hidden":"true",children:G}),(d!=null||_!=null)&&r.jsxs("span",{className:s.text,children:[d!=null&&r.jsx("span",{className:s.label,children:d}),_!=null&&r.jsx("span",{className:s.description,children:_})]})]})}),be=a.forwardRef(function({exclusive:c=!1,value:d,defaultValue:_,onChange:o,name:l,options:h,label:C,minCardWidth:q=160,align:u,size:b="md",color:S="primary",error:I,required:z=!1,disabled:A=!1,children:B,className:D,style:e,...v},N){const j=a.useId(),p=l??`choice-${j}`,i=O.useFormContext(),y=!!(i&&l),x=i&&l?i.field(l):void 0,g=d!==void 0?d:y?i.values[l]:void 0,f=g!==void 0,[E,G]=a.useState(_),n=f?g:E,k=I??(x==null?void 0:x.error)??!1,F={name:p,exclusive:c,isSelected:t=>c?n===t:Array.isArray(n)&&n.includes(t),toggle:t=>{let m;if(c)m=t;else{const L=Array.isArray(n)?n:[];m=L.includes(t)?L.filter(M=>M!==t):[...L,t]}f||G(m),y&&i.setValue(l,m),o==null||o(m)},size:b,align:u,color:S,disabled:A,error:k};return r.jsxs("div",{ref:N,role:c?"radiogroup":"group","aria-invalid":k||void 0,className:$.clsx(s.group,D),style:e,...v,children:[C!=null&&r.jsxs("span",{className:s.groupLabel,children:[r.jsx(V.Typography,{as:"span",variant:"bodySmall",color:"muted",children:C}),z&&r.jsx("span",{className:s.required,"aria-hidden":"true",children:"*"})]}),r.jsx("div",{className:s.grid,style:{"--cc-min":`${q}px`},children:r.jsx(w.Provider,{value:F,children:h?h.map(t=>r.jsx(R,{value:t.value,label:t.label,description:t.description,icon:t.icon,disabled:t.disabled},t.value)):B})})]})});exports.ChoiceCard=R;exports.ChoiceCardGroup=be;
-//# sourceMappingURL=ChoiceCardGroup-6eFM1eL0.cjs.map
+"use strict";const r=require("react/jsx-runtime"),a=require("react"),$=require("clsx"),O=require("./formContext-bTWrqdEV.cjs"),V=require("./Typography-BFatE1_A.cjs"),P=require("./names-BJnFU_5m.cjs"),H=require("./Icon-BVULqOJD.cjs"),w=a.createContext(null);function J(){return a.useContext(w)}const K="_group_3p33b_2",Q="_groupLabel_3p33b_8",U="_required_3p33b_13",W="_grid_3p33b_17",X="_card_3p33b_24",Y="_disabled_3p33b_42",Z="_selected_3p33b_42",ee="_input_3p33b_51",se="_error_3p33b_55",re="_left_3p33b_67",te="_text_3p33b_71",oe="_sm_3p33b_77",ce="_md_3p33b_85",le="_lg_3p33b_93",ne="_indicator_3p33b_117",ie="_radioDot_3p33b_162",ae="_iconBox_3p33b_185",de="_label_3p33b_212",_e="_description_3p33b_219",s={group:K,groupLabel:Q,required:U,grid:W,card:X,disabled:Y,selected:Z,input:ee,error:se,left:re,text:te,sm:oe,md:ce,lg:le,indicator:ne,radioDot:ie,iconBox:ae,label:de,description:_e},ue=new Set(P.ICON_NAMES),R=a.forwardRef(function({value:c,label:d,description:_,icon:o,align:l,color:h,size:C,error:q,checked:u,onChange:b,name:S,disabled:I,className:z,style:A,...B},D){const e=J(),v=h??(e==null?void 0:e.color)??"primary",N=C??(e==null?void 0:e.size)??"md",j=q??(e==null?void 0:e.error)??!1,p=I??(e==null?void 0:e.disabled)??!1,i=S??(e==null?void 0:e.name),y=l??(e==null?void 0:e.align)??(o==null?"left":"center"),[x,g]=a.useState(!1),f=e?e.isSelected(c):u!==void 0?u:x,E=n=>{if(!p){if(e){e.toggle(c);return}u===void 0&&g(n.target.checked),b==null||b(n.target.checked)}},G=typeof o=="string"&&ue.has(o)?r.jsx(H.Icon,{name:o,size:N}):o;return r.jsxs("label",{className:$.clsx(s.card,s[N],y==="left"&&s.left,f&&s.selected,j&&s.error,p&&s.disabled,z),style:{"--tz-btn-rgb":`var(--tz-color-${v}-rgb)`,"--tz-btn-on":`var(--tz-color-${v}-contrast, #fff)`,...A},children:[r.jsx("input",{ref:D,type:e!=null&&e.exclusive?"radio":"checkbox",className:s.input,name:i,value:c,checked:f,onChange:E,disabled:p,"aria-invalid":j||void 0,...B}),r.jsx("span",{className:$.clsx(s.indicator,(e==null?void 0:e.exclusive)&&s.radioDot),"aria-hidden":"true"}),o!=null&&r.jsx("span",{className:s.iconBox,"aria-hidden":"true",children:G}),(d!=null||_!=null)&&r.jsxs("span",{className:s.text,children:[d!=null&&r.jsx("span",{className:s.label,children:d}),_!=null&&r.jsx("span",{className:s.description,children:_})]})]})}),be=a.forwardRef(function({exclusive:c=!1,value:d,defaultValue:_,onChange:o,name:l,options:h,label:C,minCardWidth:q=160,align:u,size:b="md",color:S="primary",error:I,required:z=!1,disabled:A=!1,children:B,className:D,style:e,...v},N){const j=a.useId(),p=l??`choice-${j}`,i=O.useFormContext(),y=!!(i&&l),x=i&&l?i.field(l):void 0,g=d!==void 0?d:y?i.values[l]:void 0,f=g!==void 0,[E,G]=a.useState(_),n=f?g:E,k=I??(x==null?void 0:x.error)??!1,F={name:p,exclusive:c,isSelected:t=>c?n===t:Array.isArray(n)&&n.includes(t),toggle:t=>{let m;if(c)m=t;else{const L=Array.isArray(n)?n:[];m=L.includes(t)?L.filter(M=>M!==t):[...L,t]}f||G(m),y&&i.setValue(l,m),o==null||o(m)},size:b,align:u,color:S,disabled:A,error:k};return r.jsxs("div",{ref:N,role:c?"radiogroup":"group","aria-invalid":k||void 0,className:$.clsx(s.group,D),style:e,...v,children:[C!=null&&r.jsxs("span",{className:s.groupLabel,children:[r.jsx(V.Typography,{as:"span",variant:"bodySmall",color:"muted",children:C}),z&&r.jsx("span",{className:s.required,"aria-hidden":"true",children:"*"})]}),r.jsx("div",{className:s.grid,style:{"--cc-min":`${q}px`},children:r.jsx(w.Provider,{value:F,children:h?h.map(t=>r.jsx(R,{value:t.value,label:t.label,description:t.description,icon:t.icon,disabled:t.disabled},t.value)):B})})]})});exports.ChoiceCard=R;exports.ChoiceCardGroup=be;
+//# sourceMappingURL=ChoiceCardGroup-d0VVTUi5.cjs.map

package/dist/{ChoiceCardGroup-6eFM1eL0.cjs.map → ChoiceCardGroup-d0VVTUi5.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"ChoiceCardGroup-6eFM1eL0.cjs","sources":["../src/components/ChoiceCard/choiceCardContext.ts","../src/components/ChoiceCard/ChoiceCard.tsx","../src/components/ChoiceCard/ChoiceCardGroup.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport type { ThemeColor } from '../../theme'\nimport type { ChoiceCardAlign, ChoiceCardSize } from './ChoiceCard'\n\n/** Shared state a `<ChoiceCardGroup>` hands down to its `<ChoiceCard>` children via context. */\nexport interface ChoiceCardGroupContextValue {\n  /** Shared input `name` — in `exclusive` mode the cards are native radios and must share one. */\n  name?: string\n  /** Single-selection (radio semantics) vs multiple (checkbox semantics). */\n  exclusive: boolean\n  /** Whether a card's value is currently selected. */\n  isSelected: (value: string) => boolean\n  /** Select / toggle a value — called by a child `<ChoiceCard>` on change. */\n  toggle: (value: string) => void\n  size?: ChoiceCardSize\n  align?: ChoiceCardAlign\n  color?: ThemeColor\n  disabled?: boolean\n  error?: boolean\n}\n\nexport const ChoiceCardGroupContext = createContext<ChoiceCardGroupContextValue | null>(null)\n\n/** Read the surrounding `<ChoiceCardGroup>` so a `<ChoiceCard>` can wire itself in (or `null` when standalone). */\nexport function useChoiceCardGroupContext(): ChoiceCardGroupContextValue | null {\n  return useContext(ChoiceCardGroupContext)\n}\n","import {\n  forwardRef,\n  useState,\n  type ChangeEvent,\n  type CSSProperties,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { Icon } from '../Icon'\nimport { useChoiceCardGroupContext } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport type ChoiceCardSize = 'sm' | 'md' | 'lg'\nexport type ChoiceCardAlign = 'left' | 'center'\n\nexport interface ChoiceCardProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'color' | 'type' | 'onChange' | 'value'\n> {\n  /** This card's value — selected when the surrounding `ChoiceCardGroup`'s value holds it. */\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. Optional. */\n  icon?: IconName | ReactNode\n  /**\n   * Content alignment. `center` centers the icon + text stack; `left` anchors the same stack to the\n   * left edge (icon above left-aligned text). Defaults to the group's `align`, else `center` with an\n   * icon and `left` without one.\n   */\n  align?: ChoiceCardAlign\n  /** Theme palette token for the selected tint. Defaults to `primary` (inherits the group's `color`). */\n  color?: ThemeColor\n  /** Preset size — padding, icon circle and fonts. Inherits the group's `size` when omitted. */\n  size?: ChoiceCardSize\n  /** Marks the card invalid — reddens the border + indicator. Inherits the group's `error`. */\n  error?: boolean\n  /** Controlled selected state for standalone use (inside a `ChoiceCardGroup` the group drives this). */\n  checked?: boolean\n  /** Fires with the next selected state (standalone use). */\n  onChange?: (checked: boolean) => void\n}\n\n/**\n * A selectable card — a rich checkbox/radio with an icon, title and description. The native input is\n * visually hidden but fully accessible (Space toggles; in an `exclusive` group the cards are real\n * radios, so Arrow keys rove between them); the card shows the state with a accent border + soft halo,\n * a top-right tick indicator, and an icon circle that fills with the color while selected. Designed to\n * live inside a `<ChoiceCardGroup>` (which supplies the selection, `exclusive` mode and\n * `size`/`color`/`disabled`/`error` via context), but also works standalone as a single fancy checkbox\n * (`checked` + `onChange`). Styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCard = forwardRef<HTMLInputElement, ChoiceCardProps>(function ChoiceCard(\n  {\n    value,\n    label,\n    description,\n    icon,\n    align,\n    color,\n    size,\n    error,\n    checked,\n    onChange,\n    name,\n    disabled,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const group = useChoiceCardGroupContext()\n\n  const resolvedColor = color ?? group?.color ?? 'primary'\n  const resolvedSize = size ?? group?.size ?? 'md'\n  const resolvedError = error ?? group?.error ?? false\n  const resolvedDisabled = disabled ?? group?.disabled ?? false\n  const resolvedName = name ?? group?.name\n  // explicit prop → group's align → smart default (an icon centers the card, no icon reads as a row)\n  const resolvedAlign = align ?? group?.align ?? (icon == null ? 'left' : 'center')\n\n  // In a group the selection comes from context; standalone it's controlled (`checked`) or local.\n  const [internal, setInternal] = useState(false)\n  const isChecked = group ? group.isSelected(value) : checked !== undefined ? checked : internal\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    if (resolvedDisabled) return\n    if (group) {\n      group.toggle(value)\n      return\n    }\n    if (checked === undefined) setInternal(event.target.checked)\n    onChange?.(event.target.checked)\n  }\n\n  const iconNode =\n    typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n      <Icon name={icon as IconName} size={resolvedSize} />\n    ) : (\n      icon\n    )\n\n  return (\n    <label\n      className={clsx(\n        styles.card,\n        styles[resolvedSize],\n        resolvedAlign === 'left' && styles.left,\n        isChecked && styles.selected,\n        resolvedError && styles.error,\n        resolvedDisabled && styles.disabled,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${resolvedColor}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${resolvedColor}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n    >\n      <input\n        ref={ref}\n        type={group?.exclusive ? 'radio' : 'checkbox'}\n        className={styles.input}\n        name={resolvedName}\n        value={value}\n        checked={isChecked}\n        onChange={handleChange}\n        disabled={resolvedDisabled}\n        aria-invalid={resolvedError || undefined}\n        {...props}\n      />\n      {/* top-right selection indicator — radio-style ring + dot in exclusive groups (mirrors Radio),\n          else a circle that fills with the theme color + a CSS tick (checkbox semantics) */}\n      <span\n        className={clsx(styles.indicator, group?.exclusive && styles.radioDot)}\n        aria-hidden=\"true\"\n      />\n      {icon != null && (\n        <span className={styles.iconBox} aria-hidden=\"true\">\n          {iconNode}\n        </span>\n      )}\n      {(label != null || description != null) && (\n        <span className={styles.text}>\n          {label != null && <span className={styles.label}>{label}</span>}\n          {description != null && <span className={styles.description}>{description}</span>}\n        </span>\n      )}\n    </label>\n  )\n})\n","import {\n  forwardRef,\n  useId,\n  useState,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useFormContext } from '../../form/formContext'\nimport type { ThemeColor } from '../../theme'\nimport type { IconName } from '../../icons/names'\nimport { Typography } from '../Typography'\nimport { ChoiceCard, type ChoiceCardAlign, type ChoiceCardSize } from './ChoiceCard'\nimport { ChoiceCardGroupContext, type ChoiceCardGroupContextValue } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\n/** A single card for the data-driven `options` prop. */\nexport interface ChoiceCardOption {\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. */\n  icon?: IconName | ReactNode\n  disabled?: boolean\n}\n\nexport interface ChoiceCardGroupProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'color' | 'onChange' | 'defaultValue'\n> {\n  /**\n   * Single-selection (radio semantics — the cards are native radios, `value` is a `string | null`,\n   * clicking the selected card keeps it selected) vs multiple (checkbox semantics — `value` is a\n   * `string[]`). Defaults to `false` (multiple).\n   */\n  exclusive?: boolean\n  /** Controlled value — a `string | null` when `exclusive`, else a `string[]`. */\n  value?: string | string[] | null\n  /** Initial value for uncontrolled use (same shape as `value`). */\n  defaultValue?: string | string[] | null\n  /** Fires with the next value (matches the `exclusive` shape). */\n  onChange?: (value: string | string[] | null) => void\n  /**\n   * Input `name` — shared by the radios in `exclusive` mode, and the `<Form>` binding key (form value:\n   * `string` when `exclusive`, else `string[]`). Auto-generated when omitted.\n   */\n  name?: string\n  /** Data-driven cards — an alternative to passing `<ChoiceCard>` children. */\n  options?: ChoiceCardOption[]\n  /** Group label rendered above the cards. */\n  label?: ReactNode\n  /** Minimum card width in px — the grid fits as many per row as this allows. Defaults to `160`. */\n  minCardWidth?: number\n  /**\n   * Content alignment for every card. `center` centers the icon + text stack; `left` anchors the same\n   * stack to the left edge (icon above left-aligned text). Omit for the smart default — cards with an\n   * icon center, icon-less cards left-align. A card's own `align` wins.\n   */\n  align?: ChoiceCardAlign\n  /** Preset size for every card. Defaults to `md`. */\n  size?: ChoiceCardSize\n  /** Theme palette token for the selected tint. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Marks the group invalid — reddens the card borders (no message text, like `RadioGroup`). */\n  error?: boolean\n  /** Adds a red asterisk after the label. */\n  required?: boolean\n  /** Disables every card in the group. */\n  disabled?: boolean\n  /** `<ChoiceCard>` children (used when `options` is not given). */\n  children?: ReactNode\n}\n\n/**\n * A group of selectable cards — rich checkboxes/radios with icons, titles and descriptions (role\n * pickers, plan choices, permission sets). **`exclusive`** picks single-selection (radio semantics —\n * `value` is a `string | null` and Arrow keys rove between the cards) vs multiple (checkbox semantics —\n * `value` is a `string[]`); defaults to `false` (multiple). Controlled (`value` + `onChange`) or\n * uncontrolled (`defaultValue`); supply the cards via the data-driven `options` prop (`{ value, label,\n * description?, icon?, disabled? }[]`) or as `<ChoiceCard>` children. The cards lay out on a\n * **responsive grid** (`minCardWidth`, default `160` — as many per row as fit, wrapping below). Binds\n * to a surrounding `<Form>` by **`name`** — the form value is a `string` when `exclusive` (validate\n * with e.g. `z.string().min(1)`), else a `string[]` (`z.array(z.string()).min(1)`); the form's `error`\n * reddens the card borders (no message text, like `RadioGroup`). `role=\"radiogroup\"` / `\"group\"`;\n * styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCardGroup = forwardRef<HTMLDivElement, ChoiceCardGroupProps>(\n  function ChoiceCardGroup(\n    {\n      exclusive = false,\n      value,\n      defaultValue,\n      onChange,\n      name,\n      options,\n      label,\n      minCardWidth = 160,\n      align,\n      size = 'md',\n      color = 'primary',\n      error,\n      required = false,\n      disabled = false,\n      children,\n      className,\n      style,\n      ...props\n    },\n    ref,\n  ) {\n    // exclusive cards are native radios — they need a shared input name even without a form\n    const reactId = useId()\n    const resolvedName = name ?? `choice-${reactId}`\n\n    // Auto-bind to a surrounding <Form> by `name` — the form value mirrors the `exclusive` shape.\n    const form = useFormContext()\n    const isFormBound = Boolean(form && name)\n    const bound = form && name ? form.field(name) : undefined\n\n    const externalValue: string | string[] | null | undefined =\n      value !== undefined\n        ? value\n        : isFormBound\n          ? (form!.values[name!] as string | string[] | null | undefined)\n          : undefined\n    const isControlled = externalValue !== undefined\n    const [internal, setInternal] = useState<string | string[] | null | undefined>(defaultValue)\n    const current = isControlled ? externalValue : internal\n\n    const resolvedError = error ?? bound?.error ?? false\n\n    const isSelected = (v: string) =>\n      exclusive ? current === v : Array.isArray(current) && current.includes(v)\n\n    const toggle = (v: string) => {\n      let next: string | string[] | null\n      if (exclusive) {\n        next = v // radio semantics — selecting again keeps it selected\n      } else {\n        const arr = Array.isArray(current) ? current : []\n        next = arr.includes(v) ? arr.filter((x) => x !== v) : [...arr, v]\n      }\n      if (!isControlled) setInternal(next)\n      if (isFormBound) form!.setValue(name!, next)\n      onChange?.(next)\n    }\n\n    const ctx: ChoiceCardGroupContextValue = {\n      name: resolvedName,\n      exclusive,\n      isSelected,\n      toggle,\n      size,\n      align,\n      color,\n      disabled,\n      error: resolvedError,\n    }\n\n    return (\n      <div\n        ref={ref}\n        role={exclusive ? 'radiogroup' : 'group'}\n        aria-invalid={resolvedError || undefined}\n        className={clsx(styles.group, className)}\n        style={style as CSSProperties}\n        {...props}\n      >\n        {label != null && (\n          <span className={styles.groupLabel}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {label}\n            </Typography>\n            {required && (\n              <span className={styles.required} aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </span>\n        )}\n\n        <div className={styles.grid} style={{ '--cc-min': `${minCardWidth}px` } as CSSProperties}>\n          <ChoiceCardGroupContext.Provider value={ctx}>\n            {options\n              ? options.map((option) => (\n                  <ChoiceCard\n                    key={option.value}\n                    value={option.value}\n                    label={option.label}\n                    description={option.description}\n                    icon={option.icon}\n                    disabled={option.disabled}\n                  />\n                ))\n              : children}\n          </ChoiceCardGroupContext.Provider>\n        </div>\n      </div>\n    )\n  },\n)\n"],"names":["ChoiceCardGroupContext","createContext","useChoiceCardGroupContext","useContext","ICON_NAME_SET","ICON_NAMES","ChoiceCard","forwardRef","value","label","description","icon","align","color","size","error","checked","onChange","name","disabled","className","style","props","ref","group","resolvedColor","resolvedSize","resolvedError","resolvedDisabled","resolvedName","resolvedAlign","internal","setInternal","useState","isChecked","handleChange","event","iconNode","jsx","Icon","jsxs","clsx","styles","ChoiceCardGroup","exclusive","defaultValue","options","minCardWidth","required","children","reactId","useId","form","useFormContext","isFormBound","bound","externalValue","isControlled","current","ctx","v","next","arr","x","Typography","option"],"mappings":"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"}
+{"version":3,"file":"ChoiceCardGroup-d0VVTUi5.cjs","sources":["../src/components/ChoiceCard/choiceCardContext.ts","../src/components/ChoiceCard/ChoiceCard.tsx","../src/components/ChoiceCard/ChoiceCardGroup.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport type { ThemeColor } from '../../theme'\nimport type { ChoiceCardAlign, ChoiceCardSize } from './ChoiceCard'\n\n/** Shared state a `<ChoiceCardGroup>` hands down to its `<ChoiceCard>` children via context. */\nexport interface ChoiceCardGroupContextValue {\n  /** Shared input `name` — in `exclusive` mode the cards are native radios and must share one. */\n  name?: string\n  /** Single-selection (radio semantics) vs multiple (checkbox semantics). */\n  exclusive: boolean\n  /** Whether a card's value is currently selected. */\n  isSelected: (value: string) => boolean\n  /** Select / toggle a value — called by a child `<ChoiceCard>` on change. */\n  toggle: (value: string) => void\n  size?: ChoiceCardSize\n  align?: ChoiceCardAlign\n  color?: ThemeColor\n  disabled?: boolean\n  error?: boolean\n}\n\nexport const ChoiceCardGroupContext = createContext<ChoiceCardGroupContextValue | null>(null)\n\n/** Read the surrounding `<ChoiceCardGroup>` so a `<ChoiceCard>` can wire itself in (or `null` when standalone). */\nexport function useChoiceCardGroupContext(): ChoiceCardGroupContextValue | null {\n  return useContext(ChoiceCardGroupContext)\n}\n","import {\n  forwardRef,\n  useState,\n  type ChangeEvent,\n  type CSSProperties,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { Icon } from '../Icon'\nimport { useChoiceCardGroupContext } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport type ChoiceCardSize = 'sm' | 'md' | 'lg'\nexport type ChoiceCardAlign = 'left' | 'center'\n\nexport interface ChoiceCardProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'color' | 'type' | 'onChange' | 'value'\n> {\n  /** This card's value — selected when the surrounding `ChoiceCardGroup`'s value holds it. */\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. Optional. */\n  icon?: IconName | ReactNode\n  /**\n   * Content alignment. `center` centers the icon + text stack; `left` anchors the same stack to the\n   * left edge (icon above left-aligned text). Defaults to the group's `align`, else `center` with an\n   * icon and `left` without one.\n   */\n  align?: ChoiceCardAlign\n  /** Theme palette token for the selected tint. Defaults to `primary` (inherits the group's `color`). */\n  color?: ThemeColor\n  /** Preset size — padding, icon circle and fonts. Inherits the group's `size` when omitted. */\n  size?: ChoiceCardSize\n  /** Marks the card invalid — reddens the border + indicator. Inherits the group's `error`. */\n  error?: boolean\n  /** Controlled selected state for standalone use (inside a `ChoiceCardGroup` the group drives this). */\n  checked?: boolean\n  /** Fires with the next selected state (standalone use). */\n  onChange?: (checked: boolean) => void\n}\n\n/**\n * A selectable card — a rich checkbox/radio with an icon, title and description. The native input is\n * visually hidden but fully accessible (Space toggles; in an `exclusive` group the cards are real\n * radios, so Arrow keys rove between them); the card shows the state with a accent border + soft halo,\n * a top-right tick indicator, and an icon circle that fills with the color while selected. Designed to\n * live inside a `<ChoiceCardGroup>` (which supplies the selection, `exclusive` mode and\n * `size`/`color`/`disabled`/`error` via context), but also works standalone as a single fancy checkbox\n * (`checked` + `onChange`). Styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCard = forwardRef<HTMLInputElement, ChoiceCardProps>(function ChoiceCard(\n  {\n    value,\n    label,\n    description,\n    icon,\n    align,\n    color,\n    size,\n    error,\n    checked,\n    onChange,\n    name,\n    disabled,\n    className,\n    style,\n    ...props\n  },\n  ref,\n) {\n  const group = useChoiceCardGroupContext()\n\n  const resolvedColor = color ?? group?.color ?? 'primary'\n  const resolvedSize = size ?? group?.size ?? 'md'\n  const resolvedError = error ?? group?.error ?? false\n  const resolvedDisabled = disabled ?? group?.disabled ?? false\n  const resolvedName = name ?? group?.name\n  // explicit prop → group's align → smart default (an icon centers the card, no icon reads as a row)\n  const resolvedAlign = align ?? group?.align ?? (icon == null ? 'left' : 'center')\n\n  // In a group the selection comes from context; standalone it's controlled (`checked`) or local.\n  const [internal, setInternal] = useState(false)\n  const isChecked = group ? group.isSelected(value) : checked !== undefined ? checked : internal\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    if (resolvedDisabled) return\n    if (group) {\n      group.toggle(value)\n      return\n    }\n    if (checked === undefined) setInternal(event.target.checked)\n    onChange?.(event.target.checked)\n  }\n\n  const iconNode =\n    typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n      <Icon name={icon as IconName} size={resolvedSize} />\n    ) : (\n      icon\n    )\n\n  return (\n    <label\n      className={clsx(\n        styles.card,\n        styles[resolvedSize],\n        resolvedAlign === 'left' && styles.left,\n        isChecked && styles.selected,\n        resolvedError && styles.error,\n        resolvedDisabled && styles.disabled,\n        className,\n      )}\n      style={\n        {\n          '--tz-btn-rgb': `var(--tz-color-${resolvedColor}-rgb)`,\n          '--tz-btn-on': `var(--tz-color-${resolvedColor}-contrast, #fff)`,\n          ...style,\n        } as CSSProperties\n      }\n    >\n      <input\n        ref={ref}\n        type={group?.exclusive ? 'radio' : 'checkbox'}\n        className={styles.input}\n        name={resolvedName}\n        value={value}\n        checked={isChecked}\n        onChange={handleChange}\n        disabled={resolvedDisabled}\n        aria-invalid={resolvedError || undefined}\n        {...props}\n      />\n      {/* top-right selection indicator — radio-style ring + dot in exclusive groups (mirrors Radio),\n          else a circle that fills with the theme color + a CSS tick (checkbox semantics) */}\n      <span\n        className={clsx(styles.indicator, group?.exclusive && styles.radioDot)}\n        aria-hidden=\"true\"\n      />\n      {icon != null && (\n        <span className={styles.iconBox} aria-hidden=\"true\">\n          {iconNode}\n        </span>\n      )}\n      {(label != null || description != null) && (\n        <span className={styles.text}>\n          {label != null && <span className={styles.label}>{label}</span>}\n          {description != null && <span className={styles.description}>{description}</span>}\n        </span>\n      )}\n    </label>\n  )\n})\n","import {\n  forwardRef,\n  useId,\n  useState,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useFormContext } from '../../form/formContext'\nimport type { ThemeColor } from '../../theme'\nimport type { IconName } from '../../icons/names'\nimport { Typography } from '../Typography'\nimport { ChoiceCard, type ChoiceCardAlign, type ChoiceCardSize } from './ChoiceCard'\nimport { ChoiceCardGroupContext, type ChoiceCardGroupContextValue } from './choiceCardContext'\nimport styles from './ChoiceCard.module.css'\n\n/** A single card for the data-driven `options` prop. */\nexport interface ChoiceCardOption {\n  value: string\n  /** Card title. */\n  label?: ReactNode\n  /** Muted description line under the title. */\n  description?: ReactNode\n  /** Leading icon in a tinted circle — a known `IconName` or any node. */\n  icon?: IconName | ReactNode\n  disabled?: boolean\n}\n\nexport interface ChoiceCardGroupProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'color' | 'onChange' | 'defaultValue'\n> {\n  /**\n   * Single-selection (radio semantics — the cards are native radios, `value` is a `string | null`,\n   * clicking the selected card keeps it selected) vs multiple (checkbox semantics — `value` is a\n   * `string[]`). Defaults to `false` (multiple).\n   */\n  exclusive?: boolean\n  /** Controlled value — a `string | null` when `exclusive`, else a `string[]`. */\n  value?: string | string[] | null\n  /** Initial value for uncontrolled use (same shape as `value`). */\n  defaultValue?: string | string[] | null\n  /** Fires with the next value (matches the `exclusive` shape). */\n  onChange?: (value: string | string[] | null) => void\n  /**\n   * Input `name` — shared by the radios in `exclusive` mode, and the `<Form>` binding key (form value:\n   * `string` when `exclusive`, else `string[]`). Auto-generated when omitted.\n   */\n  name?: string\n  /** Data-driven cards — an alternative to passing `<ChoiceCard>` children. */\n  options?: ChoiceCardOption[]\n  /** Group label rendered above the cards. */\n  label?: ReactNode\n  /** Minimum card width in px — the grid fits as many per row as this allows. Defaults to `160`. */\n  minCardWidth?: number\n  /**\n   * Content alignment for every card. `center` centers the icon + text stack; `left` anchors the same\n   * stack to the left edge (icon above left-aligned text). Omit for the smart default — cards with an\n   * icon center, icon-less cards left-align. A card's own `align` wins.\n   */\n  align?: ChoiceCardAlign\n  /** Preset size for every card. Defaults to `md`. */\n  size?: ChoiceCardSize\n  /** Theme palette token for the selected tint. Defaults to `primary`. */\n  color?: ThemeColor\n  /** Marks the group invalid — reddens the card borders (no message text, like `RadioGroup`). */\n  error?: boolean\n  /** Adds a red asterisk after the label. */\n  required?: boolean\n  /** Disables every card in the group. */\n  disabled?: boolean\n  /** `<ChoiceCard>` children (used when `options` is not given). */\n  children?: ReactNode\n}\n\n/**\n * A group of selectable cards — rich checkboxes/radios with icons, titles and descriptions (role\n * pickers, plan choices, permission sets). **`exclusive`** picks single-selection (radio semantics —\n * `value` is a `string | null` and Arrow keys rove between the cards) vs multiple (checkbox semantics —\n * `value` is a `string[]`); defaults to `false` (multiple). Controlled (`value` + `onChange`) or\n * uncontrolled (`defaultValue`); supply the cards via the data-driven `options` prop (`{ value, label,\n * description?, icon?, disabled? }[]`) or as `<ChoiceCard>` children. The cards lay out on a\n * **responsive grid** (`minCardWidth`, default `160` — as many per row as fit, wrapping below). Binds\n * to a surrounding `<Form>` by **`name`** — the form value is a `string` when `exclusive` (validate\n * with e.g. `z.string().min(1)`), else a `string[]` (`z.array(z.string()).min(1)`); the form's `error`\n * reddens the card borders (no message text, like `RadioGroup`). `role=\"radiogroup\"` / `\"group\"`;\n * styling uses `--tz-*` tokens via the shared `--tz-btn-rgb` pattern.\n */\nexport const ChoiceCardGroup = forwardRef<HTMLDivElement, ChoiceCardGroupProps>(\n  function ChoiceCardGroup(\n    {\n      exclusive = false,\n      value,\n      defaultValue,\n      onChange,\n      name,\n      options,\n      label,\n      minCardWidth = 160,\n      align,\n      size = 'md',\n      color = 'primary',\n      error,\n      required = false,\n      disabled = false,\n      children,\n      className,\n      style,\n      ...props\n    },\n    ref,\n  ) {\n    // exclusive cards are native radios — they need a shared input name even without a form\n    const reactId = useId()\n    const resolvedName = name ?? `choice-${reactId}`\n\n    // Auto-bind to a surrounding <Form> by `name` — the form value mirrors the `exclusive` shape.\n    const form = useFormContext()\n    const isFormBound = Boolean(form && name)\n    const bound = form && name ? form.field(name) : undefined\n\n    const externalValue: string | string[] | null | undefined =\n      value !== undefined\n        ? value\n        : isFormBound\n          ? (form!.values[name!] as string | string[] | null | undefined)\n          : undefined\n    const isControlled = externalValue !== undefined\n    const [internal, setInternal] = useState<string | string[] | null | undefined>(defaultValue)\n    const current = isControlled ? externalValue : internal\n\n    const resolvedError = error ?? bound?.error ?? false\n\n    const isSelected = (v: string) =>\n      exclusive ? current === v : Array.isArray(current) && current.includes(v)\n\n    const toggle = (v: string) => {\n      let next: string | string[] | null\n      if (exclusive) {\n        next = v // radio semantics — selecting again keeps it selected\n      } else {\n        const arr = Array.isArray(current) ? current : []\n        next = arr.includes(v) ? arr.filter((x) => x !== v) : [...arr, v]\n      }\n      if (!isControlled) setInternal(next)\n      if (isFormBound) form!.setValue(name!, next)\n      onChange?.(next)\n    }\n\n    const ctx: ChoiceCardGroupContextValue = {\n      name: resolvedName,\n      exclusive,\n      isSelected,\n      toggle,\n      size,\n      align,\n      color,\n      disabled,\n      error: resolvedError,\n    }\n\n    return (\n      <div\n        ref={ref}\n        role={exclusive ? 'radiogroup' : 'group'}\n        aria-invalid={resolvedError || undefined}\n        className={clsx(styles.group, className)}\n        style={style as CSSProperties}\n        {...props}\n      >\n        {label != null && (\n          <span className={styles.groupLabel}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {label}\n            </Typography>\n            {required && (\n              <span className={styles.required} aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </span>\n        )}\n\n        <div className={styles.grid} style={{ '--cc-min': `${minCardWidth}px` } as CSSProperties}>\n          <ChoiceCardGroupContext.Provider value={ctx}>\n            {options\n              ? options.map((option) => (\n                  <ChoiceCard\n                    key={option.value}\n                    value={option.value}\n                    label={option.label}\n                    description={option.description}\n                    icon={option.icon}\n                    disabled={option.disabled}\n                  />\n                ))\n              : children}\n          </ChoiceCardGroupContext.Provider>\n        </div>\n      </div>\n    )\n  },\n)\n"],"names":["ChoiceCardGroupContext","createContext","useChoiceCardGroupContext","useContext","ICON_NAME_SET","ICON_NAMES","ChoiceCard","forwardRef","value","label","description","icon","align","color","size","error","checked","onChange","name","disabled","className","style","props","ref","group","resolvedColor","resolvedSize","resolvedError","resolvedDisabled","resolvedName","resolvedAlign","internal","setInternal","useState","isChecked","handleChange","event","iconNode","jsx","Icon","jsxs","clsx","styles","ChoiceCardGroup","exclusive","defaultValue","options","minCardWidth","required","children","reactId","useId","form","useFormContext","isFormBound","bound","externalValue","isControlled","current","ctx","v","next","arr","x","Typography","option"],"mappings":"yOAqBaA,EAAyBC,EAAAA,cAAkD,IAAI,EAGrF,SAASC,GAAgE,CAC9E,OAAOC,EAAAA,WAAWH,CAAsB,CAC1C,0lBCXMI,GAAgB,IAAI,IAAYC,YAAU,EA4CnCC,EAAaC,EAAAA,WAA8C,SACtE,CACE,MAAAC,EACA,MAAAC,EACA,YAAAC,EACA,KAAAC,EACA,MAAAC,EACA,MAAAC,EACA,KAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EACA,KAAAC,EACA,SAAAC,EACA,UAAAC,EACA,MAAAC,EACA,GAAGC,CACL,EACAC,EACA,CACA,MAAMC,EAAQtB,EAAA,EAERuB,EAAgBZ,IAASW,GAAA,YAAAA,EAAO,QAAS,UACzCE,EAAeZ,IAAQU,GAAA,YAAAA,EAAO,OAAQ,KACtCG,EAAgBZ,IAASS,GAAA,YAAAA,EAAO,QAAS,GACzCI,EAAmBT,IAAYK,GAAA,YAAAA,EAAO,WAAY,GAClDK,EAAeX,IAAQM,GAAA,YAAAA,EAAO,MAE9BM,EAAgBlB,IAASY,GAAA,YAAAA,EAAO,SAAUb,GAAQ,KAAO,OAAS,UAGlE,CAACoB,EAAUC,CAAW,EAAIC,EAAAA,SAAS,EAAK,EACxCC,EAAYV,EAAQA,EAAM,WAAWhB,CAAK,EAAIQ,IAAY,OAAYA,EAAUe,EAEhFI,EAAgBC,GAAyC,CAC7D,GAAI,CAAAR,EACJ,IAAIJ,EAAO,CACTA,EAAM,OAAOhB,CAAK,EAClB,MACF,CACIQ,IAAY,QAAWgB,EAAYI,EAAM,OAAO,OAAO,EAC3DnB,GAAA,MAAAA,EAAWmB,EAAM,OAAO,SAC1B,EAEMC,EACJ,OAAO1B,GAAS,UAAYP,GAAc,IAAIO,CAAI,EAChD2B,EAAAA,IAACC,EAAAA,KAAA,CAAK,KAAM5B,EAAkB,KAAMe,EAAc,EAElDf,EAGJ,OACE6B,EAAAA,KAAC,QAAA,CACC,UAAWC,EAAAA,KACTC,EAAO,KACPA,EAAOhB,CAAY,EACnBI,IAAkB,QAAUY,EAAO,KACnCR,GAAaQ,EAAO,SACpBf,GAAiBe,EAAO,MACxBd,GAAoBc,EAAO,SAC3BtB,CAAA,EAEF,MACE,CACE,eAAgB,kBAAkBK,CAAa,QAC/C,cAAe,kBAAkBA,CAAa,mBAC9C,GAAGJ,CAAA,EAIP,SAAA,CAAAiB,EAAAA,IAAC,QAAA,CACC,IAAAf,EACA,KAAMC,GAAA,MAAAA,EAAO,UAAY,QAAU,WACnC,UAAWkB,EAAO,MAClB,KAAMb,EACN,MAAArB,EACA,QAAS0B,EACT,SAAUC,EACV,SAAUP,EACV,eAAcD,GAAiB,OAC9B,GAAGL,CAAA,CAAA,EAINgB,EAAAA,IAAC,OAAA,CACC,UAAWG,EAAAA,KAAKC,EAAO,WAAWlB,GAAA,YAAAA,EAAO,YAAakB,EAAO,QAAQ,EACrE,cAAY,MAAA,CAAA,EAEb/B,GAAQ,MACP2B,MAAC,OAAA,CAAK,UAAWI,EAAO,QAAS,cAAY,OAC1C,SAAAL,CAAA,CACH,GAEA5B,GAAS,MAAQC,GAAe,cAC/B,OAAA,CAAK,UAAWgC,EAAO,KACrB,SAAA,CAAAjC,GAAS,MAAQ6B,EAAAA,IAAC,OAAA,CAAK,UAAWI,EAAO,MAAQ,SAAAjC,EAAM,EACvDC,GAAe,MAAQ4B,EAAAA,IAAC,QAAK,UAAWI,EAAO,YAAc,SAAAhC,CAAA,CAAY,CAAA,CAAA,CAC5E,CAAA,CAAA,CAAA,CAIR,CAAC,ECvEYiC,GAAkBpC,EAAAA,WAC7B,SACE,CACE,UAAAqC,EAAY,GACZ,MAAApC,EACA,aAAAqC,EACA,SAAA5B,EACA,KAAAC,EACA,QAAA4B,EACA,MAAArC,EACA,aAAAsC,EAAe,IACf,MAAAnC,EACA,KAAAE,EAAO,KACP,MAAAD,EAAQ,UACR,MAAAE,EACA,SAAAiC,EAAW,GACX,SAAA7B,EAAW,GACX,SAAA8B,EACA,UAAA7B,EACA,MAAAC,EACA,GAAGC,CAAA,EAELC,EACA,CAEA,MAAM2B,EAAUC,EAAAA,MAAA,EACVtB,EAAeX,GAAQ,UAAUgC,CAAO,GAGxCE,EAAOC,EAAAA,eAAA,EACPC,EAAc,GAAQF,GAAQlC,GAC9BqC,EAAQH,GAAQlC,EAAOkC,EAAK,MAAMlC,CAAI,EAAI,OAE1CsC,EACJhD,IAAU,OACNA,EACA8C,EACGF,EAAM,OAAOlC,CAAK,EACnB,OACFuC,EAAeD,IAAkB,OACjC,CAACzB,EAAUC,CAAW,EAAIC,EAAAA,SAA+CY,CAAY,EACrFa,EAAUD,EAAeD,EAAgBzB,EAEzCJ,EAAgBZ,IAASwC,GAAA,YAAAA,EAAO,QAAS,GAkBzCI,EAAmC,CACvC,KAAM9B,EACN,UAAAe,EACA,WAnBkBgB,GAClBhB,EAAYc,IAAYE,EAAI,MAAM,QAAQF,CAAO,GAAKA,EAAQ,SAASE,CAAC,EAmBxE,OAjBcA,GAAc,CAC5B,IAAIC,EACJ,GAAIjB,EACFiB,EAAOD,MACF,CACL,MAAME,EAAM,MAAM,QAAQJ,CAAO,EAAIA,EAAU,CAAA,EAC/CG,EAAOC,EAAI,SAASF,CAAC,EAAIE,EAAI,OAAQC,GAAMA,IAAMH,CAAC,EAAI,CAAC,GAAGE,EAAKF,CAAC,CAClE,CACKH,GAAczB,EAAY6B,CAAI,EAC/BP,GAAaF,EAAM,SAASlC,EAAO2C,CAAI,EAC3C5C,GAAA,MAAAA,EAAW4C,EACb,EAOE,KAAA/C,EACA,MAAAF,EACA,MAAAC,EACA,SAAAM,EACA,MAAOQ,CAAA,EAGT,OACEa,EAAAA,KAAC,MAAA,CACC,IAAAjB,EACA,KAAMqB,EAAY,aAAe,QACjC,eAAcjB,GAAiB,OAC/B,UAAWc,EAAAA,KAAKC,EAAO,MAAOtB,CAAS,EACvC,MAAAC,EACC,GAAGC,EAEH,SAAA,CAAAb,GAAS,MACR+B,EAAAA,KAAC,OAAA,CAAK,UAAWE,EAAO,WACtB,SAAA,CAAAJ,EAAAA,IAAC0B,EAAAA,YAAW,GAAG,OAAO,QAAQ,YAAY,MAAM,QAC7C,SAAAvD,CAAA,CACH,EACCuC,SACE,OAAA,CAAK,UAAWN,EAAO,SAAU,cAAY,OAAO,SAAA,GAAA,CAErD,CAAA,EAEJ,EAGFJ,EAAAA,IAAC,OAAI,UAAWI,EAAO,KAAM,MAAO,CAAE,WAAY,GAAGK,CAAY,IAAA,EAC/D,SAAAT,EAAAA,IAACtC,EAAuB,SAAvB,CAAgC,MAAO2D,EACrC,SAAAb,EACGA,EAAQ,IAAKmB,GACX3B,EAAAA,IAAChC,EAAA,CAEC,MAAO2D,EAAO,MACd,MAAOA,EAAO,MACd,YAAaA,EAAO,YACpB,KAAMA,EAAO,KACb,SAAUA,EAAO,QAAA,EALZA,EAAO,KAAA,CAOf,EACDhB,CAAA,CACN,CAAA,CACF,CAAA,CAAA,CAAA,CAGN,CACF"}

package/dist/{CodeBlock-BK_KXhos.js → CodeBlock-BX_0tpk3.js}

@@ -1,10 +1,10 @@
 import { jsx as o, jsxs as _ } from "react/jsx-runtime";
 import { forwardRef as I, useState as h, useRef as S, useEffect as y } from "react";
 import { clsx as w } from "clsx";
-import { I as g } from "./IconButton-DpTxmj3d.js";
-import { I as z } from "./Icon-CophpkHo.js";
+import { I as g } from "./IconButton-DXMmtuLA.js";
+import { I as z } from "./Icon-DaTvzLBu.js";
 import { T as E } from "./Tooltip-Cb_FKxT9.js";
-import { a as R } from "./ConfigProvider-DDuIJSM7.js";
+import { a as R } from "./ConfigProvider-DT0yrgmd.js";
 const j = "_root_floau_4", M = "_header_floau_15", D = "_title_floau_24", H = "_code_floau_34", L = "_plain_floau_50", O = "_wrap_floau_56", P = "_lineNumbers_floau_62", q = "_copy_floau_77", e = {
   root: j,
   header: M,
@@ -93,4 +93,4 @@ const j = "_root_floau_4", M = "_header_floau_15", D = "_title_floau_24", H = "_
 export {
   X as C
 };
-//# sourceMappingURL=CodeBlock-BK_KXhos.js.map
+//# sourceMappingURL=CodeBlock-BX_0tpk3.js.map