@pantool/components 1.0.0-alpha.10 → 1.0.0-alpha.11

package/dist/atoms/radio/index.d.ts

@@ -1 +1 @@
-import { Radio, RadioGroup, RadioGroupProps, RadioProps } from "./radio.js";
+import { Radio, RadioProps } from "./radio.js";

package/dist/atoms/radio/radio.css

@@ -1 +1 @@
-.FLTLnW_group{gap:var(--spacing-xs);flex-direction:column;display:flex}.FLTLnW_group[data-disabled]{cursor:not-allowed;opacity:.5;& *{cursor:not-allowed}}.FLTLnW_root{--radio-size:1rem;--radio-bg:transparent;--radio-border:var(--color-border-primary);--radio-dot-color:transparent;--radio-gap:var(--spacing-xs);--radio-label-color:var(--color-content-neutral-base);font-family:var(--typography-typeface-ltr);align-items:center;gap:var(--radio-gap);display:flex;position:relative}.FLTLnW_control{box-sizing:border-box;width:var(--radio-size);height:var(--radio-size);background-color:var(--radio-bg);box-shadow:0 0 0 1px var(--radio-border) inset;cursor:pointer;border:none;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .2s,box-shadow .2s;display:flex}.FLTLnW_root[data-size=sm]{--radio-size:.875rem;--radio-gap:var(--spacing-xs);--radio-label-font-size:var(--typography-body-2-size);--radio-label-line-height:var(--typography-body-2-height);--radio-label-font-weight:var(--typography-body-2-weight)}.FLTLnW_root[data-size=md],.FLTLnW_root:not([data-size]){--radio-size:1rem;--radio-gap:var(--spacing-xs);--radio-label-font-size:var(--typography-body-1-size);--radio-label-line-height:var(--typography-body-1-height);--radio-label-font-weight:var(--typography-body-1-weight)}.FLTLnW_root[data-size=lg]{--radio-size:1.25rem;--radio-gap:var(--spacing-sm);--radio-label-font-size:var(--typography-body-1-size);--radio-label-line-height:var(--typography-body-1-height);--radio-label-font-weight:var(--typography-body-1-weight)}.FLTLnW_control[data-checked]:not([data-invalid]){--radio-bg:var(--color-action-neutral-base);--radio-border:transparent;--radio-dot-color:var(--color-on-neutral)}.FLTLnW_control:focus-visible{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}.FLTLnW_root[data-disabled]{cursor:not-allowed;opacity:.5;& *{cursor:not-allowed}}.FLTLnW_root[data-invalid]{--radio-border:var(--color-negative);--radio-label-color:var(--color-content-negative-base)}.FLTLnW_control[data-invalid][data-checked]{--radio-bg:var(--color-negative);--radio-dot-color:var(--color-on-negative)}.FLTLnW_indicator{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.FLTLnW_indicator[data-unchecked]{display:none}.FLTLnW_indicator:before{content:"";background-color:var(--radio-dot-color);border-radius:9999px;width:45%;height:45%;transition:background-color .2s;display:block}.FLTLnW_label{font-size:var(--radio-label-font-size,var(--typography-body-2-size));line-height:var(--radio-label-line-height,var(--typography-body-2-height));font-weight:var(--radio-label-font-weight,var(--typography-body-2-weight));color:var(--radio-label-color)}.FLTLnW_label--hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
+.FLTLnW_root{--radio-size:1rem;--radio-bg:transparent;--radio-border:var(--color-border-primary);--radio-dot-color:transparent;--radio-gap:var(--spacing-xs);--radio-label-color:var(--color-content-neutral-base);font-family:var(--typography-typeface-ltr);align-items:center;gap:var(--radio-gap);display:flex;position:relative}.FLTLnW_control{box-sizing:border-box;width:var(--radio-size);height:var(--radio-size);background-color:var(--radio-bg);box-shadow:0 0 0 1px var(--radio-border) inset;cursor:pointer;border:none;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .2s,box-shadow .2s;display:flex}.FLTLnW_root[data-size=sm]{--radio-size:.875rem;--radio-gap:var(--spacing-xs);--radio-label-font-size:var(--typography-body-2-size);--radio-label-line-height:var(--typography-body-2-height);--radio-label-font-weight:var(--typography-body-2-weight)}.FLTLnW_root[data-size=md],.FLTLnW_root:not([data-size]){--radio-size:1rem;--radio-gap:var(--spacing-xs);--radio-label-font-size:var(--typography-body-1-size);--radio-label-line-height:var(--typography-body-1-height);--radio-label-font-weight:var(--typography-body-1-weight)}.FLTLnW_root[data-size=lg]{--radio-size:1.25rem;--radio-gap:var(--spacing-sm);--radio-label-font-size:var(--typography-body-1-size);--radio-label-line-height:var(--typography-body-1-height);--radio-label-font-weight:var(--typography-body-1-weight)}.FLTLnW_control[data-checked]:not([data-invalid]){--radio-bg:var(--color-action-neutral-base);--radio-border:transparent;--radio-dot-color:var(--color-on-neutral)}.FLTLnW_control:focus-visible{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}.FLTLnW_root[data-disabled]{cursor:not-allowed;opacity:.5;& *{cursor:not-allowed}}.FLTLnW_root[data-invalid]{--radio-border:var(--color-negative);--radio-label-color:var(--color-content-negative-base)}.FLTLnW_control[data-invalid][data-checked]{--radio-bg:var(--color-negative);--radio-dot-color:var(--color-on-negative)}.FLTLnW_indicator{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.FLTLnW_indicator[data-unchecked]{display:none}.FLTLnW_indicator:before{content:"";background-color:var(--radio-dot-color);border-radius:9999px;width:45%;height:45%;transition:background-color .2s;display:block}.FLTLnW_label{font-size:var(--radio-label-font-size,var(--typography-body-2-size));line-height:var(--radio-label-line-height,var(--typography-body-2-height));font-weight:var(--radio-label-font-weight,var(--typography-body-2-weight));color:var(--radio-label-color)}.FLTLnW_label--hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}

package/dist/atoms/radio/radio.d.ts

@@ -1,21 +1,8 @@
 import { RadioRootProps } from "@base-ui/react/radio";
-import { RadioGroupProps } from "@base-ui/react/radio-group";
 
 //#region src/atoms/radio/radio.d.ts
-type RadioGroupProps$1 = Omit<RadioGroupProps, "className"> & {
-  /** The size applied to all child Radio items. @default "md" */size?: "sm" | "md" | "lg";
-  /**
-   * Gets or sets whether or not the group is in a visually invalid state.
-   * @default false
-   */
-  invalid?: boolean; /** Additional CSS classes for styling. */
-  classNames?: {
-    root?: string;
-  };
-};
-declare const RadioGroup$1: (props: RadioGroupProps$1) => import("react/jsx-runtime").JSX.Element;
 type RadioProps = Omit<RadioRootProps, "className"> & {
-  /** The size of the radio button. Inherited from RadioGroup if not set. @default "md" */size?: "sm" | "md" | "lg"; /** The text label accompanying the radio button. */
+  /** The size of the radio button. @default "md" */size?: "sm" | "md" | "lg"; /** The text label accompanying the radio button. */
   label: string;
   /**
    * Visually hides the label but keeps it accessible to screen readers.
@@ -23,7 +10,7 @@ type RadioProps = Omit<RadioRootProps, "className"> & {
    */
   hideLabel?: boolean;
   /**
-   * Gets or sets whether or not the radio is in a visually invalid state.
+   * Whether the radio is in a visually invalid state.
    * @default false
    */
   invalid?: boolean; /** Additional CSS classes for styling. */
@@ -34,7 +21,17 @@ type RadioProps = Omit<RadioRootProps, "className"> & {
     label?: string;
   };
 };
-declare const Radio$1: (props: RadioProps) => import("react/jsx-runtime").JSX.Element;
+declare const Radio$1: ({
+  size,
+  label,
+  hideLabel,
+  disabled,
+  required,
+  invalid,
+  readOnly,
+  classNames,
+  ...props
+}: RadioProps) => import("react/jsx-runtime").JSX.Element;
 //#endregion
-export { Radio$1 as Radio, RadioGroup$1 as RadioGroup, RadioGroupProps$1 as RadioGroupProps, RadioProps };
+export { Radio$1 as Radio, RadioProps };
 //# sourceMappingURL=radio.d.ts.map

package/dist/atoms/radio/radio.js

@@ -1,2 +1,2 @@
-import e from"./radio.module.js";import t from"clsx";import{useId as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{Radio as a}from"@base-ui/react/radio";import{RadioGroup as o}from"@base-ui/react/radio-group";const s=n=>{let{size:i=`md`,invalid:a,disabled:s=!1,required:c=!1,classNames:l,children:u,...d}=n;return r(o,{...d,disabled:s,required:c,"data-size":i,"data-invalid":a||void 0,"data-disabled":s||void 0,"data-required":c||void 0,className:t(e.group,l?.root),"data-slot":`radio-group`,children:u})},c=o=>{let{size:s,label:c,hideLabel:l=!1,disabled:u=!1,required:d=!1,invalid:f,readOnly:p,classNames:m,...h}=o,g=n();return i(`div`,{"data-size":s,"data-disabled":u||void 0,"data-required":d||void 0,"data-invalid":f||void 0,className:t(e.root,m?.root),"data-slot":`radio-root`,children:[r(a.Root,{...h,disabled:u,required:d,readOnly:p,"data-invalid":f||void 0,className:t(e.control,m?.control),"data-slot":`radio-control`,id:g,children:r(a.Indicator,{"data-slot":`radio-indicator`,className:t(e.indicator,m?.indicator)})}),r(`label`,{htmlFor:g,className:t(e.label,l&&e[`label--hidden`],m?.label),"data-slot":`radio-label`,children:c})]})};export{c as Radio,s as RadioGroup};
+import e from"./radio.module.js";import t from"clsx";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{Radio as i}from"@base-ui/react/radio";const a=({size:a,label:o,hideLabel:s=!1,disabled:c=!1,required:l=!1,invalid:u,readOnly:d,classNames:f,...p})=>r(`label`,{"data-size":a,"data-disabled":c||void 0,"data-invalid":u||void 0,className:t(e.root,f?.root),"data-slot":`radio-root`,children:[n(i.Root,{...p,disabled:c,required:l,readOnly:d,"data-invalid":u||void 0,className:t(e.control,f?.control),"data-slot":`radio-control`,children:n(i.Indicator,{"data-slot":`radio-indicator`,className:t(e.indicator,f?.indicator)})}),n(`span`,{className:t(e.label,s&&e[`label--hidden`],f?.label),"data-slot":`radio-label`,children:o})]});export{a as Radio};
 //# sourceMappingURL=radio.js.map

package/dist/atoms/radio/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","names":["RadioGroup","BaseUIRadioGroup","styles","Radio","BaseUIRadio"],"sources":["../../../src/atoms/radio/radio.tsx"],"sourcesContent":["import {\n  Radio as BaseUIRadio,\n  type RadioRootProps,\n} from \"@base-ui/react/radio\";\nimport {\n  RadioGroup as BaseUIRadioGroup,\n  type RadioGroupProps as BaseUIRadioGroupProps,\n} from \"@base-ui/react/radio-group\";\nimport styles from \"./radio.module.css\";\nimport clsx from \"clsx\";\nimport { useId } from \"react\";\n\n// ─── RadioGroup ───────────────────────────────────────────────────────────────\n\nexport type RadioGroupProps = Omit<BaseUIRadioGroupProps, \"className\"> & {\n  /** The size applied to all child Radio items. @default \"md\" */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * Gets or sets whether or not the group is in a visually invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /** Additional CSS classes for styling. */\n  classNames?: {\n    root?: string;\n  };\n};\n\nexport const RadioGroup = (props: RadioGroupProps) => {\n  const {\n    size = \"md\",\n    invalid,\n    disabled = false,\n    required = false,\n    classNames,\n    children,\n    ...otherProps\n  } = props;\n\n  return (\n    <BaseUIRadioGroup\n      {...otherProps}\n      disabled={disabled}\n      required={required}\n      data-size={size}\n      data-invalid={invalid || undefined}\n      data-disabled={disabled || undefined}\n      data-required={required || undefined}\n      className={clsx(styles[\"group\"], classNames?.root)}\n      data-slot=\"radio-group\"\n    >\n      {children}\n    </BaseUIRadioGroup>\n  );\n};\n\n// ─── Radio ────────────────────────────────────────────────────────────────────\n\nexport type RadioProps = Omit<RadioRootProps, \"className\"> & {\n  /** The size of the radio button. Inherited from RadioGroup if not set. @default \"md\" */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /** The text label accompanying the radio button. */\n  label: string;\n  /**\n   * Visually hides the label but keeps it accessible to screen readers.\n   * @default false\n   */\n  hideLabel?: boolean;\n  /**\n   * Gets or sets whether or not the radio is in a visually invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /** Additional CSS classes for styling. */\n  classNames?: {\n    root?: string;\n    control?: string;\n    indicator?: string;\n    label?: string;\n  };\n};\n\nexport const Radio = (props: RadioProps) => {\n  const {\n    size,\n    label,\n    hideLabel = false,\n    disabled = false,\n    required = false,\n    invalid,\n    readOnly,\n    classNames,\n    ...otherProps\n  } = props;\n\n  const id = useId();\n\n  return (\n    <div\n      data-size={size}\n      data-disabled={disabled || undefined}\n      data-required={required || undefined}\n      data-invalid={invalid || undefined}\n      className={clsx(styles[\"root\"], classNames?.root)}\n      data-slot=\"radio-root\"\n    >\n      <BaseUIRadio.Root\n        {...otherProps}\n        disabled={disabled}\n        required={required}\n        readOnly={readOnly}\n        data-invalid={invalid || undefined}\n        className={clsx(styles[\"control\"], classNames?.control)}\n        data-slot=\"radio-control\"\n        id={id}\n      >\n        <BaseUIRadio.Indicator\n          data-slot=\"radio-indicator\"\n          className={clsx(styles[\"indicator\"], classNames?.indicator)}\n        />\n      </BaseUIRadio.Root>\n\n      <label\n        htmlFor={id}\n        className={clsx(\n          styles[\"label\"],\n          hideLabel && styles[\"label--hidden\"],\n          classNames?.label,\n        )}\n        data-slot=\"radio-label\"\n      >\n        {label}\n      </label>\n    </div>\n  );\n};\n"],"mappings":"0OA4BA,MAAaA,EAAc,GAA2B,CACpD,GAAM,CACJ,OAAO,KACP,UACA,WAAW,GACX,WAAW,GACX,aACA,WACA,GAAG,GACD,EAEJ,OACE,EAACC,EAAD,CACE,GAAI,EACM,WACA,WACV,YAAW,EACX,eAAc,GAAW,IAAA,GACzB,gBAAe,GAAY,IAAA,GAC3B,gBAAe,GAAY,IAAA,GAC3B,UAAW,EAAKC,EAAO,MAAU,GAAY,IAAI,EACjD,YAAU,cAET,UACe,CAAA,CAEtB,EA4BaC,EAAS,GAAsB,CAC1C,GAAM,CACJ,OACA,QACA,YAAY,GACZ,WAAW,GACX,WAAW,GACX,UACA,WACA,aACA,GAAG,GACD,EAEE,EAAK,EAAM,EAEjB,OACE,EAAC,MAAD,CACE,YAAW,EACX,gBAAe,GAAY,IAAA,GAC3B,gBAAe,GAAY,IAAA,GAC3B,eAAc,GAAW,IAAA,GACzB,UAAW,EAAKD,EAAO,KAAS,GAAY,IAAI,EAChD,YAAU,sBANZ,CAQE,EAACE,EAAY,KAAb,CACE,GAAI,EACM,WACA,WACA,WACV,eAAc,GAAW,IAAA,GACzB,UAAW,EAAKF,EAAO,QAAY,GAAY,OAAO,EACtD,YAAU,gBACN,cAEJ,EAACE,EAAY,UAAb,CACE,YAAU,kBACV,UAAW,EAAKF,EAAO,UAAc,GAAY,SAAS,CAC3D,CAAA,CACe,CAAA,EAElB,EAAC,QAAD,CACE,QAAS,EACT,UAAW,EACTA,EAAO,MACP,GAAaA,EAAO,iBACpB,GAAY,KACd,EACA,YAAU,uBAET,CACI,CAAA,CACJ,GAET"}
+{"version":3,"file":"radio.js","names":["Radio","styles","BaseUIRadio"],"sources":["../../../src/atoms/radio/radio.tsx"],"sourcesContent":["import {\n  Radio as BaseUIRadio,\n  type RadioRootProps,\n} from \"@base-ui/react/radio\";\nimport clsx from \"clsx\";\nimport styles from \"./radio.module.css\";\n\nexport type RadioProps = Omit<RadioRootProps, \"className\"> & {\n  /** The size of the radio button. @default \"md\" */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /** The text label accompanying the radio button. */\n  label: string;\n  /**\n   * Visually hides the label but keeps it accessible to screen readers.\n   * @default false\n   */\n  hideLabel?: boolean;\n  /**\n   * Whether the radio is in a visually invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /** Additional CSS classes for styling. */\n  classNames?: {\n    root?: string;\n    control?: string;\n    indicator?: string;\n    label?: string;\n  };\n};\n\nexport const Radio = ({\n  size,\n  label,\n  hideLabel = false,\n  disabled = false,\n  required = false,\n  invalid,\n  readOnly,\n  classNames,\n  ...props\n}: RadioProps) => {\n  return (\n    <label\n      data-size={size}\n      data-disabled={disabled || undefined}\n      data-invalid={invalid || undefined}\n      className={clsx(styles[\"root\"], classNames?.root)}\n      data-slot=\"radio-root\"\n    >\n      <BaseUIRadio.Root\n        {...props}\n        disabled={disabled}\n        required={required}\n        readOnly={readOnly}\n        data-invalid={invalid || undefined}\n        className={clsx(styles[\"control\"], classNames?.control)}\n        data-slot=\"radio-control\"\n      >\n        <BaseUIRadio.Indicator\n          data-slot=\"radio-indicator\"\n          className={clsx(styles[\"indicator\"], classNames?.indicator)}\n        />\n      </BaseUIRadio.Root>\n\n      <span\n        className={clsx(\n          styles[\"label\"],\n          hideLabel && styles[\"label--hidden\"],\n          classNames?.label,\n        )}\n        data-slot=\"radio-label\"\n      >\n        {label}\n      </span>\n    </label>\n  );\n};\n"],"mappings":"oJA+BA,MAAaA,GAAS,CACpB,OACA,QACA,YAAY,GACZ,WAAW,GACX,WAAW,GACX,UACA,WACA,aACA,GAAG,KAGD,EAAC,QAAD,CACE,YAAW,EACX,gBAAe,GAAY,IAAA,GAC3B,eAAc,GAAW,IAAA,GACzB,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,YAAU,sBALZ,CAOE,EAACC,EAAY,KAAb,CACE,GAAI,EACM,WACA,WACA,WACV,eAAc,GAAW,IAAA,GACzB,UAAW,EAAKD,EAAO,QAAY,GAAY,OAAO,EACtD,YAAU,yBAEV,EAACC,EAAY,UAAb,CACE,YAAU,kBACV,UAAW,EAAKD,EAAO,UAAc,GAAY,SAAS,CAC3D,CAAA,CACe,CAAA,EAElB,EAAC,OAAD,CACE,UAAW,EACTA,EAAO,MACP,GAAaA,EAAO,iBACpB,GAAY,KACd,EACA,YAAU,uBAET,CACG,CAAA,CACD"}

package/dist/atoms/radio/radio.module.js

@@ -1,3 +1,3 @@
 import './radio.css';
-var e={control:`FLTLnW_control`,group:`FLTLnW_group`,indicator:`FLTLnW_indicator`,label:`FLTLnW_label`,"label--hidden":`FLTLnW_label--hidden`,root:`FLTLnW_root`};export{e as default};
+var e={control:`FLTLnW_control`,indicator:`FLTLnW_indicator`,label:`FLTLnW_label`,"label--hidden":`FLTLnW_label--hidden`,root:`FLTLnW_root`};export{e as default};
 //# sourceMappingURL=radio.module.js.map

package/dist/atoms/radio/radio.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.module.js","names":[],"sources":["../../../src/atoms/radio/radio.module.css"],"sourcesContent":["/* ─── RadioGroup ─────────────────────────────────────────────────────────────── */\n\n.group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-xs);\n}\n\n.group[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n  & * {\n    cursor: not-allowed;\n  }\n}\n\n/* ─── Radio Item ─────────────────────────────────────────────────────────────── */\n\n.root {\n  --radio-size: 1rem;\n  --radio-bg: transparent;\n  --radio-border: var(--color-border-primary);\n  --radio-dot-color: transparent;\n  --radio-gap: var(--spacing-xs);\n  --radio-label-color: var(--color-content-neutral-base);\n  font-family: var(--typography-typeface-ltr);\n  display: flex;\n  align-items: center;\n  position: relative;\n  gap: var(--radio-gap);\n}\n\n.control {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--radio-size);\n  height: var(--radio-size);\n  background-color: var(--radio-bg);\n  box-shadow: 0 0 0 1px var(--radio-border) inset;\n  border-radius: 9999px;\n  border: none;\n  cursor: pointer;\n  padding: 0;\n  transition:\n    background-color 0.2s,\n    box-shadow 0.2s;\n}\n\n/* Sizes — mirrors Checkbox sizing tokens */\n\n.root[data-size=\"sm\"] {\n  --radio-size: 0.875rem;\n  --radio-gap: var(--spacing-xs);\n  --radio-label-font-size: var(--typography-body-2-size);\n  --radio-label-line-height: var(--typography-body-2-height);\n  --radio-label-font-weight: var(--typography-body-2-weight);\n}\n\n.root[data-size=\"md\"],\n.root:not([data-size]) {\n  --radio-size: 1rem;\n  --radio-gap: var(--spacing-xs);\n  --radio-label-font-size: var(--typography-body-1-size);\n  --radio-label-line-height: var(--typography-body-1-height);\n  --radio-label-font-weight: var(--typography-body-1-weight);\n}\n\n.root[data-size=\"lg\"] {\n  --radio-size: 1.25rem;\n  --radio-gap: var(--spacing-sm);\n  --radio-label-font-size: var(--typography-body-1-size);\n  --radio-label-line-height: var(--typography-body-1-height);\n  --radio-label-font-weight: var(--typography-body-1-weight);\n}\n\n/* Checked state */\n\n.control[data-checked]:not([data-invalid]) {\n  --radio-bg: var(--color-action-neutral-base);\n  --radio-border: transparent;\n  --radio-dot-color: var(--color-on-neutral);\n}\n\n/* Focus */\n\n.control:focus-visible {\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n\n/* Disabled — scoped to item root, mirrors group-level disabled */\n\n.root[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n  & * {\n    cursor: not-allowed;\n  }\n}\n\n/* Invalid */\n\n.root[data-invalid] {\n  --radio-border: var(--color-negative);\n  --radio-label-color: var(--color-content-negative-base);\n}\n\n.control[data-invalid][data-checked] {\n  --radio-bg: var(--color-negative);\n  --radio-dot-color: var(--color-on-negative);\n}\n\n/* ─── Indicator (CSS dot) ─────────────────────────────────────────────────────── */\n\n.indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n}\n\n.indicator[data-unchecked] {\n  display: none;\n}\n\n.indicator::before {\n  content: \"\";\n  display: block;\n  width: 45%; /* proportional dot — scales with --radio-size */\n  height: 45%;\n  border-radius: 9999px;\n  background-color: var(--radio-dot-color);\n  transition: background-color 0.2s;\n}\n\n/* ─── Label ───────────────────────────────────────────────────────────────────── */\n\n.label {\n  font-size: var(--radio-label-font-size, var(--typography-body-2-size));\n  line-height: var(--radio-label-line-height, var(--typography-body-2-height));\n  font-weight: var(--radio-label-font-weight, var(--typography-body-2-weight));\n  color: var(--radio-label-color);\n}\n\n.label--hidden {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n"],"mappings":""}
+{"version":3,"file":"radio.module.js","names":[],"sources":["../../../src/atoms/radio/radio.module.css"],"sourcesContent":[".root {\n  --radio-size: 1rem;\n  --radio-bg: transparent;\n  --radio-border: var(--color-border-primary);\n  --radio-dot-color: transparent;\n  --radio-gap: var(--spacing-xs);\n  --radio-label-color: var(--color-content-neutral-base);\n  font-family: var(--typography-typeface-ltr);\n  display: flex;\n  align-items: center;\n  position: relative;\n  gap: var(--radio-gap);\n}\n\n.control {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--radio-size);\n  height: var(--radio-size);\n  background-color: var(--radio-bg);\n  box-shadow: 0 0 0 1px var(--radio-border) inset;\n  border-radius: 9999px;\n  border: none;\n  cursor: pointer;\n  padding: 0;\n  transition:\n    background-color 0.2s,\n    box-shadow 0.2s;\n}\n\n.root[data-size=\"sm\"] {\n  --radio-size: 0.875rem;\n  --radio-gap: var(--spacing-xs);\n  --radio-label-font-size: var(--typography-body-2-size);\n  --radio-label-line-height: var(--typography-body-2-height);\n  --radio-label-font-weight: var(--typography-body-2-weight);\n}\n\n.root[data-size=\"md\"],\n.root:not([data-size]) {\n  --radio-size: 1rem;\n  --radio-gap: var(--spacing-xs);\n  --radio-label-font-size: var(--typography-body-1-size);\n  --radio-label-line-height: var(--typography-body-1-height);\n  --radio-label-font-weight: var(--typography-body-1-weight);\n}\n\n.root[data-size=\"lg\"] {\n  --radio-size: 1.25rem;\n  --radio-gap: var(--spacing-sm);\n  --radio-label-font-size: var(--typography-body-1-size);\n  --radio-label-line-height: var(--typography-body-1-height);\n  --radio-label-font-weight: var(--typography-body-1-weight);\n}\n\n.control[data-checked]:not([data-invalid]) {\n  --radio-bg: var(--color-action-neutral-base);\n  --radio-border: transparent;\n  --radio-dot-color: var(--color-on-neutral);\n}\n\n.control:focus-visible {\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n\n.root[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n  & * {\n    cursor: not-allowed;\n  }\n}\n\n.root[data-invalid] {\n  --radio-border: var(--color-negative);\n  --radio-label-color: var(--color-content-negative-base);\n}\n\n.control[data-invalid][data-checked] {\n  --radio-bg: var(--color-negative);\n  --radio-dot-color: var(--color-on-negative);\n}\n\n.indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n}\n\n.indicator[data-unchecked] {\n  display: none;\n}\n\n.indicator::before {\n  content: \"\";\n  display: block;\n  width: 45%;\n  height: 45%;\n  border-radius: 9999px;\n  background-color: var(--radio-dot-color);\n  transition: background-color 0.2s;\n}\n\n.label {\n  font-size: var(--radio-label-font-size, var(--typography-body-2-size));\n  line-height: var(--radio-label-line-height, var(--typography-body-2-height));\n  font-weight: var(--radio-label-font-weight, var(--typography-body-2-weight));\n  color: var(--radio-label-color);\n}\n\n.label--hidden {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n"],"mappings":""}

package/dist/atoms/radio-group/index.d.ts

@@ -0,0 +1 @@
+import { RadioGroup, RadioGroupItem, RadioGroupProps } from "./radio-group.js";

package/dist/atoms/radio-group/index.js

@@ -0,0 +1 @@
+import"./radio-group.js";

package/dist/atoms/radio-group/radio-group.css

@@ -0,0 +1 @@
+.JZt8ca_group{gap:var(--radio-group-gap);flex-direction:column;display:flex}.JZt8ca_group[data-size=sm]{--radio-group-gap:var(--spacing-sm)}.JZt8ca_group[data-size=md]{--radio-group-gap:var(--spacing-md)}.JZt8ca_group[data-size=lg]{--radio-group-gap:var(--spacing-lg)}.JZt8ca_group[data-orientation=horizontal]{flex-flow:wrap}.JZt8ca_group[data-disabled]{cursor:not-allowed;opacity:.5;& *{cursor:not-allowed}}

package/dist/atoms/radio-group/radio-group.d.ts

@@ -0,0 +1,48 @@
+import { RadioGroupProps } from "@base-ui/react/radio-group";
+
+//#region src/atoms/radio-group/radio-group.d.ts
+/**
+ * Represents an item in the radio group.
+ */
+interface RadioGroupItem {
+  /** The value of the radio option. */
+  value: string;
+  /** The display label for the radio option. */
+  label: string;
+  /** Whether this option is disabled. */
+  disabled?: boolean;
+}
+type RadioGroupProps$1 = Omit<RadioGroupProps, "className"> & {
+  /** The items to render as radio options. */items: RadioGroupItem[]; /** The size applied to all radio items. @default "md" */
+  size?: "sm" | "md" | "lg";
+  /**
+   * The layout orientation of the radio group.
+   * @default "vertical"
+   */
+  orientation?: "horizontal" | "vertical";
+  /**
+   * Whether the group is in a visually invalid state.
+   * @default false
+   */
+  invalid?: boolean; /** Additional CSS classes for styling. */
+  classNames?: {
+    root?: string;
+    item?: string;
+    itemControl?: string;
+    itemIndicator?: string;
+    itemLabel?: string;
+  };
+};
+declare const RadioGroup$1: ({
+  items,
+  size,
+  orientation,
+  invalid,
+  disabled,
+  required,
+  classNames,
+  ...props
+}: RadioGroupProps$1) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { RadioGroup$1 as RadioGroup, RadioGroupItem, RadioGroupProps$1 as RadioGroupProps };
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/atoms/radio-group/radio-group.js

@@ -0,0 +1,2 @@
+import{Radio as e}from"../radio/radio.js";import"../radio/index.js";import t from"./radio-group.module.js";import n from"clsx";import{jsx as r}from"react/jsx-runtime";import{RadioGroup as i}from"@base-ui/react/radio-group";const a=({items:a,size:o=`md`,orientation:s=`vertical`,invalid:c,disabled:l=!1,required:u=!1,classNames:d,...f})=>r(i,{...f,disabled:l,required:u,"data-size":o,"data-orientation":s,"data-invalid":c||void 0,className:n(t.group,d?.root),"data-slot":`radio-group`,children:a.map(t=>r(e,{value:t.value,label:t.label,disabled:t.disabled,size:o,invalid:c,classNames:{root:d?.item,control:d?.itemControl,indicator:d?.itemIndicator,label:d?.itemLabel}},t.value))});export{a as RadioGroup};
+//# sourceMappingURL=radio-group.js.map

package/dist/atoms/radio-group/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","names":["RadioGroup","BaseUIRadioGroup","styles"],"sources":["../../../src/atoms/radio-group/radio-group.tsx"],"sourcesContent":["import {\n  RadioGroup as BaseUIRadioGroup,\n  type RadioGroupProps as BaseUIRadioGroupProps,\n} from \"@base-ui/react/radio-group\";\nimport clsx from \"clsx\";\nimport styles from \"./radio-group.module.css\";\nimport { Radio } from \"../radio\";\n\n/**\n * Represents an item in the radio group.\n */\nexport interface RadioGroupItem {\n  /** The value of the radio option. */\n  value: string;\n  /** The display label for the radio option. */\n  label: string;\n  /** Whether this option is disabled. */\n  disabled?: boolean;\n}\n\nexport type RadioGroupProps = Omit<BaseUIRadioGroupProps, \"className\"> & {\n  /** The items to render as radio options. */\n  items: RadioGroupItem[];\n  /** The size applied to all radio items. @default \"md\" */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * The layout orientation of the radio group.\n   * @default \"vertical\"\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * Whether the group is in a visually invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /** Additional CSS classes for styling. */\n  classNames?: {\n    root?: string;\n    item?: string;\n    itemControl?: string;\n    itemIndicator?: string;\n    itemLabel?: string;\n  };\n};\n\nexport const RadioGroup = ({\n  items,\n  size = \"md\",\n  orientation = \"vertical\",\n  invalid,\n  disabled = false,\n  required = false,\n  classNames,\n  ...props\n}: RadioGroupProps) => {\n  return (\n    <BaseUIRadioGroup\n      {...props}\n      disabled={disabled}\n      required={required}\n      data-size={size}\n      data-orientation={orientation}\n      data-invalid={invalid || undefined}\n      className={clsx(styles[\"group\"], classNames?.root)}\n      data-slot=\"radio-group\"\n    >\n      {items.map(item => (\n        <Radio\n          key={item.value}\n          value={item.value}\n          label={item.label}\n          disabled={item.disabled}\n          size={size}\n          invalid={invalid}\n          classNames={{\n            root: classNames?.item,\n            control: classNames?.itemControl,\n            indicator: classNames?.itemIndicator,\n            label: classNames?.itemLabel,\n          }}\n        />\n      ))}\n    </BaseUIRadioGroup>\n  );\n};\n"],"mappings":"+NA6CA,MAAaA,GAAc,CACzB,QACA,OAAO,KACP,cAAc,WACd,UACA,WAAW,GACX,WAAW,GACX,aACA,GAAG,KAGD,EAACC,EAAD,CACE,GAAI,EACM,WACA,WACV,YAAW,EACX,mBAAkB,EAClB,eAAc,GAAW,IAAA,GACzB,UAAW,EAAKC,EAAO,MAAU,GAAY,IAAI,EACjD,YAAU,uBAET,EAAM,IAAI,GACT,EAAC,EAAD,CAEE,MAAO,EAAK,MACZ,MAAO,EAAK,MACZ,SAAU,EAAK,SACT,OACG,UACT,WAAY,CACV,KAAM,GAAY,KAClB,QAAS,GAAY,YACrB,UAAW,GAAY,cACvB,MAAO,GAAY,SACrB,CACD,EAZM,EAAK,KAYX,CACF,CACe,CAAA"}

package/dist/atoms/radio-group/radio-group.module.js

@@ -0,0 +1,3 @@
+import './radio-group.css';
+var e={group:`JZt8ca_group`};export{e as default};
+//# sourceMappingURL=radio-group.module.js.map

package/dist/atoms/radio-group/radio-group.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.module.js","names":[],"sources":["../../../src/atoms/radio-group/radio-group.module.css"],"sourcesContent":[".group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--radio-group-gap);\n}\n\n.group[data-size=\"sm\"] {\n  --radio-group-gap: var(--spacing-sm);\n}\n.group[data-size=\"md\"] {\n  --radio-group-gap: var(--spacing-md);\n}\n.group[data-size=\"lg\"] {\n  --radio-group-gap: var(--spacing-lg);\n}\n\n.group[data-orientation=\"horizontal\"] {\n  flex-direction: row;\n  flex-wrap: wrap;\n}\n\n.group[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n  & * {\n    cursor: not-allowed;\n  }\n}\n"],"mappings":""}

package/dist/atoms/select/components/item.d.ts

@@ -0,0 +1,17 @@
+//#region src/atoms/select/components/item.d.ts
+/**
+ * Represents an item in the select.
+ */
+interface SelectItem<T = string> {
+  /** Unique identifier for the item */
+  id: string;
+  /** Display label for the item */
+  label: string;
+  /** Underlying value of the item */
+  value: T;
+  /** Whether the item is disabled */
+  disabled?: boolean;
+}
+//#endregion
+export { SelectItem };
+//# sourceMappingURL=item.d.ts.map

package/dist/atoms/select/components/item.js

@@ -0,0 +1,2 @@
+import{Icon as e}from"../../icon/icon.js";import"../../icon/index.js";import t from"../select.module.js";import n from"clsx";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{mdiCheck as a}from"@mdi/js";import{Select as o}from"@base-ui/react/select";function s({item:s,size:c,classNames:l}){return i(o.Item,{value:s.value,disabled:s.disabled,className:n(t.item,l?.root),"data-slot":`select-item`,"data-size":c,children:[r(o.ItemIndicator,{className:n(t[`item-indicator`],l?.indicator),"data-slot":`select-item-indicator`,keepMounted:!0,children:r(e,{data:a})}),r(o.ItemText,{className:n(t[`item-text`],l?.text),"data-slot":`select-item-text`,children:s.label})]})}export{s as ItemRow};
+//# sourceMappingURL=item.js.map

package/dist/atoms/select/components/item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","names":["BaseUISelect","styles"],"sources":["../../../../src/atoms/select/components/item.tsx"],"sourcesContent":["import { Select as BaseUISelect } from \"@base-ui/react/select\";\nimport { mdiCheck } from \"@mdi/js\";\nimport clsx from \"clsx\";\nimport { Icon } from \"../../icon\";\nimport styles from \"../select.module.css\";\n\n/**\n * Represents an item in the select.\n */\nexport interface SelectItem<T = string> {\n  /** Unique identifier for the item */\n  id: string;\n  /** Display label for the item */\n  label: string;\n  /** Underlying value of the item */\n  value: T;\n  /** Whether the item is disabled */\n  disabled?: boolean;\n}\n\nexport function ItemRow<T>({\n  item,\n  size,\n  classNames,\n}: {\n  item: SelectItem<T>;\n  size?: \"sm\" | \"md\" | \"lg\";\n  classNames?: { root?: string; indicator?: string; text?: string };\n}) {\n  return (\n    <BaseUISelect.Item\n      value={item.value}\n      disabled={item.disabled}\n      className={clsx(styles[\"item\"], classNames?.root)}\n      data-slot=\"select-item\"\n      data-size={size}\n    >\n      <BaseUISelect.ItemIndicator\n        className={clsx(styles[\"item-indicator\"], classNames?.indicator)}\n        data-slot=\"select-item-indicator\"\n        keepMounted\n      >\n        <Icon data={mdiCheck} />\n      </BaseUISelect.ItemIndicator>\n      <BaseUISelect.ItemText\n        className={clsx(styles[\"item-text\"], classNames?.text)}\n        data-slot=\"select-item-text\"\n      >\n        {item.label}\n      </BaseUISelect.ItemText>\n    </BaseUISelect.Item>\n  );\n}\n"],"mappings":"iQAoBA,SAAgB,EAAW,CACzB,OACA,OACA,cAKC,CACD,OACE,EAACA,EAAa,KAAd,CACE,MAAO,EAAK,MACZ,SAAU,EAAK,SACf,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,YAAU,cACV,YAAW,WALb,CAOE,EAACD,EAAa,cAAd,CACE,UAAW,EAAKC,EAAO,kBAAmB,GAAY,SAAS,EAC/D,YAAU,wBACV,YAAA,YAEA,EAAC,EAAD,CAAM,KAAM,CAAW,CAAA,CACG,CAAA,EAC5B,EAACD,EAAa,SAAd,CACE,UAAW,EAAKC,EAAO,aAAc,GAAY,IAAI,EACrD,YAAU,4BAET,EAAK,KACe,CAAA,CACN,GAEvB"}

package/dist/atoms/select/index.d.ts

@@ -0,0 +1,2 @@
+import { SelectItem } from "./components/item.js";
+import { Select, SelectGroup, SelectProps } from "./select.js";

package/dist/atoms/select/index.js

@@ -0,0 +1 @@
+import"./select.js";

package/dist/atoms/select/select.css

@@ -0,0 +1 @@
+.XmN6oG_root{width:100%}.XmN6oG_trigger{--field-control-radius:var(--radius-md);--field-control-bg-color:var(--color-surface-base);--field-control-text-color:var(--color-content-neutral-base);--field-control-border-color:var(--color-border-secondary);--field-control-placeholder-color:var(--color-content-neutral-muted);--field-label-color:var(--color-content-neutral-secondary);box-sizing:border-box;justify-content:space-between;align-items:center;gap:var(--spacing-sm);width:100%;height:var(--field-control-height);padding:0 var(--spacing-sm);border:1px solid var(--field-control-border-color);border-radius:var(--field-control-radius);background-color:var(--field-control-bg-color);font-family:var(--typography-typeface-ltr);font-size:var(--field-control-font-size);font-weight:var(--field-control-font-weight);color:var(--field-control-text-color);white-space:nowrap;user-select:none;cursor:default;outline:0;margin:0;transition:border-color .2s ease-in-out;display:flex}.XmN6oG_trigger[data-size=sm]{--field-control-height:1.5rem;--field-control-icon-size:1.5rem;--field-control-font-size:var(--typography-caption-base-size);--field-control-font-weight:var(--typography-caption-base-weight)}.XmN6oG_trigger[data-size=md]{--field-control-height:2rem;--field-control-icon-size:2rem;--field-control-font-size:var(--typography-body-2-size);--field-control-font-weight:var(--typography-body-2-weight)}.XmN6oG_trigger[data-size=lg]{--field-control-height:2.5rem;--field-control-icon-size:2rem;--field-control-font-size:var(--typography-body-1-size);--field-control-font-weight:var(--typography-body-1-weight)}.XmN6oG_trigger[data-invalid]{--field-control-border-color:var(--color-content-negative-base);--field-control-text-color:var(--color-content-negative-base)}.XmN6oG_trigger[data-disabled]{--field-control-bg-color:var(--color-surface-tertiary);--field-control-text-color:var(--color-content-neutral-muted);--field-control-border-color:var(--color-border-secondary);--field-label-color:var(--color-content-neutral-muted);cursor:not-allowed}.XmN6oG_trigger:focus-visible{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}.XmN6oG_value{text-overflow:ellipsis;overflow:hidden}.XmN6oG_value[data-placeholder]{color:var(--field-control-placeholder-color)}.XmN6oG_icon{width:var(--field-control-icon-size);height:var(--field-control-icon-size);color:var(--field-label-color);padding:var(--spacing-xxs);border-radius:var(--radius-full);justify-content:center;align-items:center;transition:color .1s,background-color .1s;display:flex}.XmN6oG_icon:hover{color:var(--color-content-neutral-base);background-color:var(--color-surface-secondary)}.XmN6oG_positioner{z-index:var(--zindex-1);outline:0}.XmN6oG_popup{box-sizing:border-box;font-family:var(--typography-typeface-ltr);background-color:var(--color-surface-base);color:var(--color-content-neutral-base);min-width:var(--anchor-width);transform-origin:var(--transform-origin);border:1px solid var(--color-border-primary);transition:opacity .1s,transform .1s;overflow:hidden;box-shadow:0 4px 12px #0000001a}.XmN6oG_popup[data-starting-style],.XmN6oG_popup[data-ending-style]{opacity:0;transform:scale(.95)}.XmN6oG_popup[data-side=none]{opacity:1;min-width:calc(var(--anchor-width) + 1.75rem);transition:none;transform:none}.XmN6oG_list{box-sizing:border-box;overscroll-behavior:contain;padding-block:var(--spacing-xs);max-height:var(--available-height);outline:0;overflow-y:auto}.XmN6oG_group{padding-block:var(--spacing-xs)}.XmN6oG_group-label{padding:var(--spacing-xxs) var(--spacing-md);font-size:var(--typography-caption-base-size);font-weight:var(--typography-subheading-2-weight);color:var(--color-content-neutral-muted);text-transform:uppercase;letter-spacing:.05em}.XmN6oG_item{box-sizing:border-box;cursor:default;user-select:none;padding-block:var(--spacing-sm);padding-left:var(--spacing-md);padding-right:var(--spacing-md);gap:var(--spacing-sm);outline:0;grid-template-columns:1rem 1fr;align-items:center;transition:background-color .1s;display:grid;position:relative}.XmN6oG_item[data-size=sm]{font-size:var(--typography-caption-base-size);font-weight:var(--typography-caption-base-weight)}.XmN6oG_item[data-size=md]{font-size:var(--typography-body-2-size);font-weight:var(--typography-body-2-weight)}.XmN6oG_item[data-size=lg]{font-size:var(--typography-body-1-size);font-weight:var(--typography-body-1-weight)}.XmN6oG_item[data-highlighted]{background-color:var(--color-surface-secondary)}.XmN6oG_item[data-selected]{color:var(--color-content-brand-base);font-weight:var(--typography-subheading-2-weight)}.XmN6oG_item[data-disabled]{opacity:.5;cursor:not-allowed}.XmN6oG_item-indicator{visibility:hidden;grid-column-start:1;justify-content:center;align-items:center;display:flex}.XmN6oG_item[data-selected] .XmN6oG_item-indicator{visibility:visible}.XmN6oG_item-text{grid-column-start:2}

package/dist/atoms/select/select.d.ts

@@ -0,0 +1,67 @@
+import { SelectItem } from "./components/item.js";
+import { SelectRootProps } from "@base-ui/react/select";
+
+//#region src/atoms/select/select.d.ts
+/**
+ * Represents a group of items in the select.
+ */
+interface SelectGroup<T = string> {
+  /** The text label of the group */
+  label: string;
+  /** The items in the group */
+  items: SelectItem<T>[];
+}
+/**
+ * Props for the Select component.
+ */
+type SelectProps<T = string, Multiple extends boolean | undefined = false> = SelectRootProps<T, Multiple> & {
+  /**
+   * The size of the select.
+   * @default "md"
+   */
+  size?: "sm" | "md" | "lg";
+  /**
+   * Whether the select is in an invalid state.
+   * @default false
+   */
+  invalid?: boolean;
+  /**
+   * Placeholder text when no value is selected.
+   */
+  placeholder?: string;
+  /**
+   * Additional CSS classes for styling.
+   */
+  classNames?: {
+    root?: string;
+    trigger?: string;
+    value?: string;
+    icon?: string;
+    positioner?: string;
+    popup?: string;
+    list?: string;
+    item?: string;
+    itemIndicator?: string;
+    itemText?: string;
+    group?: string;
+    groupLabel?: string;
+  };
+};
+/**
+ * A select component for choosing a predefined value from a dropdown.
+ * Built on top of Base UI's Select primitive.
+ */
+declare const Select$1: <T = string, Multiple extends boolean | undefined = false>({
+  size,
+  invalid,
+  disabled,
+  readOnly,
+  placeholder,
+  classNames,
+  items,
+  multiple,
+  ...props
+}: SelectProps<T, Multiple>) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Select$1 as Select, SelectGroup, SelectProps };
+//# sourceMappingURL=select.d.ts.map

package/dist/atoms/select/select.js

@@ -0,0 +1,2 @@
+import{usePortalConfig as e}from"../../helpers/portal/context/hooks.js";import"../../helpers/portal/index.js";import{Icon as t}from"../icon/icon.js";import"../icon/index.js";import n from"./select.module.js";import{ItemRow as r}from"./components/item.js";import i from"clsx";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{mdiChevronDown as s}from"@mdi/js";import{Select as c}from"@base-ui/react/select";const l=({size:l=`md`,invalid:u=!1,disabled:d=!1,readOnly:f=!1,placeholder:p=`Select an option`,classNames:m,items:h,multiple:g,..._})=>{let{resolveContainer:v}=e(),y=v();return a(`div`,{"data-slot":`select-root`,className:i(n.root,m?.root),children:o(c.Root,{items:h,multiple:g,disabled:d,readOnly:f,..._,children:[o(c.Trigger,{className:i(n.trigger,m?.trigger),"data-size":l,"data-invalid":u||void 0,"data-slot":`select-trigger`,children:[a(c.Value,{className:i(n.value,m?.value),"data-slot":`select-value`,placeholder:p??void 0}),a(c.Icon,{className:i(n.icon,m?.icon),"data-slot":`select-icon`,children:a(t,{data:s})})]}),a(c.Portal,{container:y,children:a(c.Positioner,{className:i(n.positioner,m?.positioner),"data-slot":`select-positioner`,sideOffset:4,children:a(c.Popup,{className:i(n.popup,m?.popup),"data-slot":`select-popup`,children:a(c.List,{className:i(n.list,m?.list),"data-slot":`select-list`,children:h?.map(e=>`items`in e?o(c.Group,{className:i(n.group,m?.group),"data-slot":`select-group`,children:[a(c.GroupLabel,{className:i(n[`group-label`],m?.groupLabel),"data-slot":`select-group-label`,children:e.label}),e.items.map(e=>a(r,{item:e,size:l,classNames:{root:m?.item,text:m?.itemText,indicator:m?.itemIndicator}},e.id))]},e.label):a(r,{item:e,size:l,classNames:{root:m?.item,text:m?.itemText,indicator:m?.itemIndicator}},e.id))})})})})]})})};export{l as Select};
+//# sourceMappingURL=select.js.map

package/dist/atoms/select/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","names":["Select","styles","BaseUISelect"],"sources":["../../../src/atoms/select/select.tsx"],"sourcesContent":["import {\n  Select as BaseUISelect,\n  type SelectRootProps,\n} from \"@base-ui/react/select\";\nimport { mdiChevronDown } from \"@mdi/js\";\nimport clsx from \"clsx\";\nimport { usePortalConfig } from \"../../helpers/portal\";\nimport { Icon } from \"../icon\";\nimport { ItemRow, type SelectItem } from \"./components/item\";\nimport styles from \"./select.module.css\";\n\n/**\n * Represents a group of items in the select.\n */\nexport interface SelectGroup<T = string> {\n  /** The text label of the group */\n  label: string;\n  /** The items in the group */\n  items: SelectItem<T>[];\n}\n\n/**\n * Props for the Select component.\n */\nexport type SelectProps<\n  T = string,\n  Multiple extends boolean | undefined = false,\n> = SelectRootProps<T, Multiple> & {\n  /**\n   * The size of the select.\n   * @default \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * Whether the select is in an invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * Placeholder text when no value is selected.\n   */\n  placeholder?: string;\n  /**\n   * Additional CSS classes for styling.\n   */\n  classNames?: {\n    root?: string;\n    trigger?: string;\n    value?: string;\n    icon?: string;\n    positioner?: string;\n    popup?: string;\n    list?: string;\n    item?: string;\n    itemIndicator?: string;\n    itemText?: string;\n    group?: string;\n    groupLabel?: string;\n  };\n};\n\n/**\n * A select component for choosing a predefined value from a dropdown.\n * Built on top of Base UI's Select primitive.\n */\nexport const Select = <\n  T = string,\n  Multiple extends boolean | undefined = false,\n>({\n  size = \"md\",\n  invalid = false,\n  disabled = false,\n  readOnly = false,\n  placeholder = \"Select an option\",\n  classNames,\n  items,\n  multiple,\n  ...props\n}: SelectProps<T, Multiple>) => {\n  const { resolveContainer } = usePortalConfig();\n  const portalContainer = resolveContainer();\n\n  return (\n    <div\n      data-slot=\"select-root\"\n      className={clsx(styles[\"root\"], classNames?.root)}\n    >\n      <BaseUISelect.Root<T, Multiple>\n        items={items}\n        multiple={multiple}\n        disabled={disabled}\n        readOnly={readOnly}\n        {...props}\n      >\n        <BaseUISelect.Trigger\n          className={clsx(styles[\"trigger\"], classNames?.trigger)}\n          data-size={size}\n          data-invalid={invalid || undefined}\n          data-slot=\"select-trigger\"\n        >\n          <BaseUISelect.Value\n            className={clsx(styles[\"value\"], classNames?.value)}\n            data-slot=\"select-value\"\n            placeholder={placeholder ?? undefined}\n          />\n          <BaseUISelect.Icon\n            className={clsx(styles[\"icon\"], classNames?.icon)}\n            data-slot=\"select-icon\"\n          >\n            <Icon data={mdiChevronDown} />\n          </BaseUISelect.Icon>\n        </BaseUISelect.Trigger>\n\n        <BaseUISelect.Portal container={portalContainer}>\n          <BaseUISelect.Positioner\n            className={clsx(styles[\"positioner\"], classNames?.positioner)}\n            data-slot=\"select-positioner\"\n            sideOffset={4}\n          >\n            <BaseUISelect.Popup\n              className={clsx(styles[\"popup\"], classNames?.popup)}\n              data-slot=\"select-popup\"\n            >\n              <BaseUISelect.List\n                className={clsx(styles[\"list\"], classNames?.list)}\n                data-slot=\"select-list\"\n              >\n                {(items as (SelectItem<T> | SelectGroup<T>)[])?.map(\n                  itemOrGroup => {\n                    if (\"items\" in itemOrGroup) {\n                      return (\n                        <BaseUISelect.Group\n                          className={clsx(styles[\"group\"], classNames?.group)}\n                          key={itemOrGroup.label}\n                          data-slot=\"select-group\"\n                        >\n                          <BaseUISelect.GroupLabel\n                            className={clsx(\n                              styles[\"group-label\"],\n                              classNames?.groupLabel,\n                            )}\n                            data-slot=\"select-group-label\"\n                          >\n                            {itemOrGroup.label}\n                          </BaseUISelect.GroupLabel>\n                          {itemOrGroup.items.map(item => (\n                            <ItemRow<T>\n                              key={item.id}\n                              item={item}\n                              size={size}\n                              classNames={{\n                                root: classNames?.item,\n                                text: classNames?.itemText,\n                                indicator: classNames?.itemIndicator,\n                              }}\n                            />\n                          ))}\n                        </BaseUISelect.Group>\n                      );\n                    }\n\n                    return (\n                      <ItemRow<T>\n                        key={itemOrGroup.id}\n                        item={itemOrGroup}\n                        size={size}\n                        classNames={{\n                          root: classNames?.item,\n                          text: classNames?.itemText,\n                          indicator: classNames?.itemIndicator,\n                        }}\n                      />\n                    );\n                  },\n                )}\n              </BaseUISelect.List>\n            </BaseUISelect.Popup>\n          </BaseUISelect.Positioner>\n        </BaseUISelect.Portal>\n      </BaseUISelect.Root>\n    </div>\n  );\n};\n\nexport type { SelectItem } from \"./components/item\";\n"],"mappings":"6ZAiEA,MAAaA,GAGX,CACA,OAAO,KACP,UAAU,GACV,WAAW,GACX,WAAW,GACX,cAAc,mBACd,aACA,QACA,WACA,GAAG,KAC2B,CAC9B,GAAM,CAAE,oBAAqB,EAAgB,EACvC,EAAkB,EAAiB,EAEzC,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,WAEhD,EAACC,EAAa,KAAd,CACS,QACG,WACA,WACA,WACV,GAAI,WALN,CAOE,EAACA,EAAa,QAAd,CACE,UAAW,EAAKD,EAAO,QAAY,GAAY,OAAO,EACtD,YAAW,EACX,eAAc,GAAW,IAAA,GACzB,YAAU,0BAJZ,CAME,EAACC,EAAa,MAAd,CACE,UAAW,EAAKD,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,eACV,YAAa,GAAe,IAAA,EAC7B,CAAA,EACD,EAACC,EAAa,KAAd,CACE,UAAW,EAAKD,EAAO,KAAS,GAAY,IAAI,EAChD,YAAU,uBAEV,EAAC,EAAD,CAAM,KAAM,CAAiB,CAAA,CACZ,CAAA,CACC,IAEtB,EAACC,EAAa,OAAd,CAAqB,UAAW,WAC9B,EAACA,EAAa,WAAd,CACE,UAAW,EAAKD,EAAO,WAAe,GAAY,UAAU,EAC5D,YAAU,oBACV,WAAY,WAEZ,EAACC,EAAa,MAAd,CACE,UAAW,EAAKD,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,wBAEV,EAACC,EAAa,KAAd,CACE,UAAW,EAAKD,EAAO,KAAS,GAAY,IAAI,EAChD,YAAU,uBAER,GAA8C,IAC9C,GACM,UAAW,EAEX,EAACC,EAAa,MAAd,CACE,UAAW,EAAKD,EAAO,MAAU,GAAY,KAAK,EAElD,YAAU,wBAHZ,CAKE,EAACC,EAAa,WAAd,CACE,UAAW,EACTD,EAAO,eACP,GAAY,UACd,EACA,YAAU,8BAET,EAAY,KACU,CAAA,EACxB,EAAY,MAAM,IAAI,GACrB,EAAC,EAAD,CAEQ,OACA,OACN,WAAY,CACV,KAAM,GAAY,KAClB,KAAM,GAAY,SAClB,UAAW,GAAY,aACzB,CACD,EARM,EAAK,EAQX,CACF,CACiB,GAxBb,EAAY,KAwBC,EAKtB,EAAC,EAAD,CAEE,KAAM,EACA,OACN,WAAY,CACV,KAAM,GAAY,KAClB,KAAM,GAAY,SAClB,UAAW,GAAY,aACzB,CACD,EARM,EAAY,EAQlB,CAGP,CACiB,CAAA,CACD,CAAA,CACG,CAAA,CACN,CAAA,CACJ,GAChB,CAAA,CAET"}

package/dist/atoms/select/select.module.js

@@ -0,0 +1,3 @@
+import './select.css';
+var e={group:`XmN6oG_group`,"group-label":`XmN6oG_group-label`,icon:`XmN6oG_icon`,item:`XmN6oG_item`,"item-indicator":`XmN6oG_item-indicator`,"item-text":`XmN6oG_item-text`,list:`XmN6oG_list`,popup:`XmN6oG_popup`,positioner:`XmN6oG_positioner`,root:`XmN6oG_root`,trigger:`XmN6oG_trigger`,value:`XmN6oG_value`};export{e as default};
+//# sourceMappingURL=select.module.js.map

package/dist/atoms/select/select.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.module.js","names":[],"sources":["../../../src/atoms/select/select.module.css"],"sourcesContent":[".root {\n  width: 100%;\n}\n\n.trigger {\n  --field-control-radius: var(--radius-md);\n  --field-control-bg-color: var(--color-surface-base);\n  --field-control-text-color: var(--color-content-neutral-base);\n  --field-control-border-color: var(--color-border-secondary);\n  --field-control-placeholder-color: var(--color-content-neutral-muted);\n  --field-label-color: var(--color-content-neutral-secondary);\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--spacing-sm);\n  width: 100%;\n  height: var(--field-control-height);\n  padding: 0 var(--spacing-sm);\n  margin: 0;\n  outline: 0;\n  border: 1px solid var(--field-control-border-color);\n  border-radius: var(--field-control-radius);\n  background-color: var(--field-control-bg-color);\n  font-family: var(--typography-typeface-ltr);\n  font-size: var(--field-control-font-size);\n  font-weight: var(--field-control-font-weight);\n  color: var(--field-control-text-color);\n  white-space: nowrap;\n  user-select: none;\n  cursor: default;\n  transition: border-color 0.2s ease-in-out;\n}\n\n.trigger[data-size=\"sm\"] {\n  --field-control-height: 1.5rem;\n  --field-control-icon-size: 1.5rem;\n  --field-control-font-size: var(--typography-caption-base-size);\n  --field-control-font-weight: var(--typography-caption-base-weight);\n}\n\n.trigger[data-size=\"md\"] {\n  --field-control-height: 2rem;\n  --field-control-icon-size: 2rem;\n  --field-control-font-size: var(--typography-body-2-size);\n  --field-control-font-weight: var(--typography-body-2-weight);\n}\n\n.trigger[data-size=\"lg\"] {\n  --field-control-height: 2.5rem;\n  --field-control-icon-size: 2rem;\n  --field-control-font-size: var(--typography-body-1-size);\n  --field-control-font-weight: var(--typography-body-1-weight);\n}\n\n.trigger[data-invalid] {\n  --field-control-border-color: var(--color-content-negative-base);\n  --field-control-text-color: var(--color-content-negative-base);\n}\n\n.trigger[data-disabled] {\n  --field-control-bg-color: var(--color-surface-tertiary);\n  --field-control-text-color: var(--color-content-neutral-muted);\n  --field-control-border-color: var(--color-border-secondary);\n  --field-label-color: var(--color-content-neutral-muted);\n  cursor: not-allowed;\n}\n\n.trigger:focus-visible {\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n\n.value {\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.value[data-placeholder] {\n  color: var(--field-control-placeholder-color);\n}\n\n.icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--field-control-icon-size);\n  height: var(--field-control-icon-size);\n  color: var(--field-label-color);\n  padding: var(--spacing-xxs);\n  border-radius: var(--radius-full);\n  transition:\n    color 0.1s,\n    background-color 0.1s;\n}\n\n.icon:hover {\n  color: var(--color-content-neutral-base);\n  background-color: var(--color-surface-secondary);\n}\n\n.positioner {\n  outline: 0;\n  z-index: var(--zindex-1);\n}\n\n.popup {\n  box-sizing: border-box;\n  font-family: var(--typography-typeface-ltr);\n  background-color: var(--color-surface-base);\n  color: var(--color-content-neutral-base);\n  min-width: var(--anchor-width);\n  transform-origin: var(--transform-origin);\n  border: 1px solid var(--color-border-primary);\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n  overflow: hidden;\n  transition:\n    opacity 0.1s,\n    transform 0.1s;\n}\n\n.popup[data-starting-style],\n.popup[data-ending-style] {\n  opacity: 0;\n  transform: scale(0.95);\n}\n\n.popup[data-side=\"none\"] {\n  transition: none;\n  transform: none;\n  opacity: 1;\n  min-width: calc(var(--anchor-width) + 1.75rem);\n}\n\n.list {\n  box-sizing: border-box;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  padding-block: var(--spacing-xs);\n  outline: 0;\n  max-height: var(--available-height);\n}\n\n.group {\n  padding-block: var(--spacing-xs);\n}\n\n.group-label {\n  padding: var(--spacing-xxs) var(--spacing-md);\n  font-size: var(--typography-caption-base-size);\n  font-weight: var(--typography-subheading-2-weight);\n  color: var(--color-content-neutral-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.item {\n  box-sizing: border-box;\n  outline: 0;\n  cursor: default;\n  user-select: none;\n  padding-block: var(--spacing-sm);\n  padding-left: var(--spacing-md);\n  padding-right: var(--spacing-md);\n  display: grid;\n  gap: var(--spacing-sm);\n  align-items: center;\n  grid-template-columns: 1rem 1fr;\n  position: relative;\n  transition: background-color 0.1s;\n}\n\n.item[data-size=\"sm\"] {\n  font-size: var(--typography-caption-base-size);\n  font-weight: var(--typography-caption-base-weight);\n}\n\n.item[data-size=\"md\"] {\n  font-size: var(--typography-body-2-size);\n  font-weight: var(--typography-body-2-weight);\n}\n\n.item[data-size=\"lg\"] {\n  font-size: var(--typography-body-1-size);\n  font-weight: var(--typography-body-1-weight);\n}\n\n.item[data-highlighted] {\n  background-color: var(--color-surface-secondary);\n}\n\n.item[data-selected] {\n  color: var(--color-content-brand-base);\n  font-weight: var(--typography-subheading-2-weight);\n}\n\n.item[data-disabled] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.item-indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  grid-column-start: 1;\n  visibility: hidden;\n}\n\n.item[data-selected] .item-indicator {\n  visibility: visible;\n}\n\n.item-text {\n  grid-column-start: 2;\n}\n"],"mappings":""}

package/dist/atoms/slider/index.d.ts

@@ -0,0 +1 @@
+import { Slider, SliderProps } from "./slider.js";

package/dist/atoms/slider/index.js

@@ -0,0 +1 @@
+import"./slider.js";

package/dist/atoms/slider/slider.css

@@ -0,0 +1 @@
+.uTCv8W_root{--slider-track-color:var(--color-surface-tertiary);--slider-indicator-color:var(--color-action-brand-base);--slider-thumb-bg:var(--color-surface-base);--slider-thumb-border:var(--color-action-brand-base);width:100%}.uTCv8W_root[data-invalid]{--slider-indicator-color:var(--color-content-negative-base);--slider-thumb-border:var(--color-content-negative-base)}.uTCv8W_root[data-disabled]{--slider-indicator-color:var(--color-content-neutral-muted);--slider-thumb-border:var(--color-content-neutral-muted);--slider-thumb-bg:var(--color-surface-tertiary);cursor:not-allowed}.uTCv8W_root[data-size=sm]{--slider-track-height:.125rem;--slider-thumb-size:.75rem}.uTCv8W_root[data-size=md]{--slider-track-height:.25rem;--slider-thumb-size:1rem}.uTCv8W_root[data-size=lg]{--slider-track-height:.375rem;--slider-thumb-size:1.25rem}.uTCv8W_control{box-sizing:border-box;width:100%;padding-block:var(--spacing-sm);touch-action:none;user-select:none;align-items:center;display:flex}.uTCv8W_control[data-orientation=vertical]{width:auto;height:8rem;padding-block:0;padding-inline:var(--spacing-sm)}.uTCv8W_track{width:100%;height:var(--slider-track-height);background-color:var(--slider-track-color);border-radius:var(--radius-full);user-select:none}.uTCv8W_track[data-orientation=vertical]{width:var(--slider-track-height);height:100%}.uTCv8W_indicator{background-color:var(--slider-indicator-color);border-radius:var(--radius-full);user-select:none}.uTCv8W_thumb{box-sizing:border-box;width:var(--slider-thumb-size);height:var(--slider-thumb-size);border:2px solid var(--slider-thumb-border);background-color:var(--slider-thumb-bg);border-radius:var(--radius-md);user-select:none;transition:box-shadow .1s,transform .1s}.uTCv8W_thumb:has(:focus-visible){outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}.uTCv8W_thumb[data-dragging]{transform:scale(1.15)}

package/dist/atoms/slider/slider.d.ts

@@ -0,0 +1,53 @@
+import { SliderRootProps } from "@base-ui/react/slider";
+
+//#region src/atoms/slider/slider.d.ts
+/**
+ * Props for the Slider component.
+ */
+type SliderProps = Omit<SliderRootProps, "className"> & {
+  /**
+   * The size of the slider.
+   * @default "md"
+   */
+  size?: "sm" | "md" | "lg";
+  /**
+   * Whether the slider is in an invalid state.
+   * @default false
+   */
+  invalid?: boolean;
+  /**
+   * Accessible label for the thumb (single-thumb sliders).
+   */
+  thumbLabel?: string;
+  /**
+   * Accessible labels for range slider thumbs.
+   */
+  thumbLabels?: string[];
+  /**
+   * Additional CSS classes for styling.
+   */
+  classNames?: {
+    root?: string;
+    control?: string;
+    track?: string;
+    indicator?: string;
+    thumb?: string;
+  };
+};
+/**
+ * A slider component for selecting a value or range within a given interval.
+ * Built on top of Base UI's Slider primitive.
+ */
+declare function Slider$1({
+  size,
+  invalid,
+  disabled,
+  defaultValue,
+  thumbLabel,
+  thumbLabels,
+  classNames,
+  ...props
+}: SliderProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Slider$1 as Slider, SliderProps };
+//# sourceMappingURL=slider.d.ts.map

package/dist/atoms/slider/slider.js

@@ -0,0 +1,2 @@
+import e from"./slider.module.js";import t from"clsx";import{Fragment as n,jsx as r,jsxs as i}from"react/jsx-runtime";import{Slider as a}from"@base-ui/react/slider";function o({size:o=`md`,invalid:s=!1,disabled:c=!1,defaultValue:l,thumbLabel:u,thumbLabels:d,classNames:f,...p}){let m=Array.isArray(l??p.value);return r(a.Root,{defaultValue:l,disabled:c,className:t(e.root,f?.root),"data-size":o,"data-invalid":s||void 0,"data-slot":`slider-root`,...p,children:r(a.Control,{className:t(e.control,f?.control),"data-slot":`slider-control`,children:i(a.Track,{className:t(e.track,f?.track),"data-slot":`slider-track`,children:[r(a.Indicator,{className:t(e.indicator,f?.indicator),"data-slot":`slider-indicator`}),m?i(n,{children:[r(a.Thumb,{index:0,"aria-label":d?.[0],className:t(e.thumb,f?.thumb),"data-slot":`slider-thumb`}),r(a.Thumb,{index:1,"aria-label":d?.[1],className:t(e.thumb,f?.thumb),"data-slot":`slider-thumb`})]}):r(a.Thumb,{"aria-label":u,className:t(e.thumb,f?.thumb),"data-slot":`slider-thumb`})]})})})}export{o as Slider};
+//# sourceMappingURL=slider.js.map

package/dist/atoms/slider/slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.js","names":["Slider","BaseUISlider","styles"],"sources":["../../../src/atoms/slider/slider.tsx"],"sourcesContent":["import {\n  Slider as BaseUISlider,\n  type SliderRootProps,\n} from \"@base-ui/react/slider\";\nimport clsx from \"clsx\";\nimport styles from \"./slider.module.css\";\n\n/**\n * Props for the Slider component.\n */\nexport type SliderProps = Omit<SliderRootProps, \"className\"> & {\n  /**\n   * The size of the slider.\n   * @default \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * Whether the slider is in an invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * Accessible label for the thumb (single-thumb sliders).\n   */\n  thumbLabel?: string;\n  /**\n   * Accessible labels for range slider thumbs.\n   */\n  thumbLabels?: string[];\n  /**\n   * Additional CSS classes for styling.\n   */\n  classNames?: {\n    root?: string;\n    control?: string;\n    track?: string;\n    indicator?: string;\n    thumb?: string;\n  };\n};\n\n/**\n * A slider component for selecting a value or range within a given interval.\n * Built on top of Base UI's Slider primitive.\n */\nexport function Slider({\n  size = \"md\",\n  invalid = false,\n  disabled = false,\n  defaultValue,\n  thumbLabel,\n  thumbLabels,\n  classNames,\n  ...props\n}: SliderProps) {\n  const isRange = Array.isArray(defaultValue ?? props.value);\n\n  return (\n    <BaseUISlider.Root\n      defaultValue={defaultValue}\n      disabled={disabled}\n      className={clsx(styles[\"root\"], classNames?.root)}\n      data-size={size}\n      data-invalid={invalid || undefined}\n      data-slot=\"slider-root\"\n      {...props}\n    >\n      <BaseUISlider.Control\n        className={clsx(styles[\"control\"], classNames?.control)}\n        data-slot=\"slider-control\"\n      >\n        <BaseUISlider.Track\n          className={clsx(styles[\"track\"], classNames?.track)}\n          data-slot=\"slider-track\"\n        >\n          <BaseUISlider.Indicator\n            className={clsx(styles[\"indicator\"], classNames?.indicator)}\n            data-slot=\"slider-indicator\"\n          />\n          {isRange ? (\n            <>\n              <BaseUISlider.Thumb\n                index={0}\n                aria-label={thumbLabels?.[0]}\n                className={clsx(styles[\"thumb\"], classNames?.thumb)}\n                data-slot=\"slider-thumb\"\n              />\n              <BaseUISlider.Thumb\n                index={1}\n                aria-label={thumbLabels?.[1]}\n                className={clsx(styles[\"thumb\"], classNames?.thumb)}\n                data-slot=\"slider-thumb\"\n              />\n            </>\n          ) : (\n            <BaseUISlider.Thumb\n              aria-label={thumbLabel}\n              className={clsx(styles[\"thumb\"], classNames?.thumb)}\n              data-slot=\"slider-thumb\"\n            />\n          )}\n        </BaseUISlider.Track>\n      </BaseUISlider.Control>\n    </BaseUISlider.Root>\n  );\n}\n"],"mappings":"qKA6CA,SAAgBA,EAAO,CACrB,OAAO,KACP,UAAU,GACV,WAAW,GACX,eACA,aACA,cACA,aACA,GAAG,GACW,CACd,IAAM,EAAU,MAAM,QAAQ,GAAgB,EAAM,KAAK,EAEzD,OACE,EAACC,EAAa,KAAd,CACgB,eACJ,WACV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,YAAW,EACX,eAAc,GAAW,IAAA,GACzB,YAAU,cACV,GAAI,WAEJ,EAACD,EAAa,QAAd,CACE,UAAW,EAAKC,EAAO,QAAY,GAAY,OAAO,EACtD,YAAU,0BAEV,EAACD,EAAa,MAAd,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,wBAFZ,CAIE,EAACD,EAAa,UAAd,CACE,UAAW,EAAKC,EAAO,UAAc,GAAY,SAAS,EAC1D,YAAU,kBACX,CAAA,EACA,EACC,EAAA,EAAA,CAAA,SAAA,CACE,EAACD,EAAa,MAAd,CACE,MAAO,EACP,aAAY,IAAc,GAC1B,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,cACX,CAAA,EACD,EAACD,EAAa,MAAd,CACE,MAAO,EACP,aAAY,IAAc,GAC1B,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,cACX,CAAA,CACD,CAAA,CAAA,EAEF,EAACD,EAAa,MAAd,CACE,aAAY,EACZ,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,cACX,CAAA,CAEe,GACA,CAAA,CACL,CAAA,CAEvB"}

package/dist/atoms/slider/slider.module.js

@@ -0,0 +1,3 @@
+import './slider.css';
+var e={control:`uTCv8W_control`,indicator:`uTCv8W_indicator`,root:`uTCv8W_root`,thumb:`uTCv8W_thumb`,track:`uTCv8W_track`};export{e as default};
+//# sourceMappingURL=slider.module.js.map

package/dist/atoms/slider/slider.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.module.js","names":[],"sources":["../../../src/atoms/slider/slider.module.css"],"sourcesContent":[".root {\n  --slider-track-color: var(--color-surface-tertiary);\n  --slider-indicator-color: var(--color-action-brand-base);\n  --slider-thumb-bg: var(--color-surface-base);\n  --slider-thumb-border: var(--color-action-brand-base);\n  width: 100%;\n}\n\n.root[data-invalid] {\n  --slider-indicator-color: var(--color-content-negative-base);\n  --slider-thumb-border: var(--color-content-negative-base);\n}\n\n.root[data-disabled] {\n  --slider-indicator-color: var(--color-content-neutral-muted);\n  --slider-thumb-border: var(--color-content-neutral-muted);\n  --slider-thumb-bg: var(--color-surface-tertiary);\n  cursor: not-allowed;\n}\n\n.root[data-size=\"sm\"] {\n  --slider-track-height: 0.125rem;\n  --slider-thumb-size: 0.75rem;\n}\n\n.root[data-size=\"md\"] {\n  --slider-track-height: 0.25rem;\n  --slider-thumb-size: 1rem;\n}\n\n.root[data-size=\"lg\"] {\n  --slider-track-height: 0.375rem;\n  --slider-thumb-size: 1.25rem;\n}\n\n.control {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding-block: var(--spacing-sm);\n  touch-action: none;\n  user-select: none;\n}\n\n.control[data-orientation=\"vertical\"] {\n  height: 8rem;\n  width: auto;\n  padding-block: 0;\n  padding-inline: var(--spacing-sm);\n}\n\n.track {\n  width: 100%;\n  height: var(--slider-track-height);\n  background-color: var(--slider-track-color);\n  border-radius: var(--radius-full);\n  user-select: none;\n}\n\n.track[data-orientation=\"vertical\"] {\n  width: var(--slider-track-height);\n  height: 100%;\n}\n\n.indicator {\n  background-color: var(--slider-indicator-color);\n  border-radius: var(--radius-full);\n  user-select: none;\n}\n\n.thumb {\n  box-sizing: border-box;\n  width: var(--slider-thumb-size);\n  height: var(--slider-thumb-size);\n  border: 2px solid var(--slider-thumb-border);\n  background-color: var(--slider-thumb-bg);\n  border-radius: var(--radius-md);\n  user-select: none;\n  transition:\n    box-shadow 0.1s,\n    transform 0.1s;\n}\n\n.thumb:has(:focus-visible) {\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n\n.thumb[data-dragging] {\n  transform: scale(1.15);\n}\n"],"mappings":""}

package/dist/atoms/stepper/index.d.ts

@@ -0,0 +1 @@
+import { Stepper, StepperProps } from "./stepper.js";

package/dist/atoms/stepper/index.js

@@ -0,0 +1 @@
+import"./stepper.js";

package/dist/atoms/stepper/stepper.css

@@ -0,0 +1 @@
+.nIISiW_root{--field-control-radius:var(--radius-md);--field-control-bg-color:var(--color-surface-base);--field-control-text-color:var(--color-content-neutral-base);--field-control-border-color:var(--color-border-secondary);--field-control-placeholder-color:var(--color-content-neutral-muted);--field-label-color:var(--color-content-neutral-secondary);width:100%}.nIISiW_root[data-size=sm]{--field-control-height:1.5rem;--field-control-icon-size:1.5rem;--field-control-font-size:var(--typography-caption-base-size);--field-control-line-height:var(--typography-caption-base-height);--field-control-font-weight:var(--typography-caption-base-weight)}.nIISiW_root[data-size=md]{--field-control-height:2rem;--field-control-icon-size:2rem;--field-control-font-size:var(--typography-body-2-size);--field-control-line-height:var(--typography-body-2-height);--field-control-font-weight:var(--typography-body-2-weight)}.nIISiW_root[data-size=lg]{--field-control-height:2.5rem;--field-control-icon-size:2rem;--field-control-font-size:var(--typography-body-1-size);--field-control-line-height:var(--typography-body-1-height);--field-control-font-weight:var(--typography-body-1-weight)}.nIISiW_root[data-invalid]{--field-control-border-color:var(--color-content-negative-base);--field-control-text-color:var(--color-content-negative-base)}.nIISiW_root[data-disabled]{--field-control-bg-color:var(--color-surface-tertiary);--field-control-text-color:var(--color-content-neutral-muted);--field-control-border-color:var(--color-border-secondary);--field-label-color:var(--color-content-neutral-muted);cursor:not-allowed}.nIISiW_group{height:var(--field-control-height);width:100%;display:flex}.nIISiW_input{box-sizing:border-box;min-width:0;padding:0 var(--spacing-sm);border:1px solid var(--field-control-border-color);border-radius:var(--radius-md);height:100%;font-family:var(--typography-typeface-ltr);font-size:var(--field-control-font-size);line-height:var(--field-control-line-height);font-weight:var(--field-control-font-weight);font-variant-numeric:tabular-nums;text-align:left;background-color:var(--field-control-bg-color);color:var(--field-control-text-color);outline:none;flex:1;margin:0}.nIISiW_input::placeholder{color:var(--field-control-placeholder-color)}.nIISiW_input:focus-visible{z-index:1;outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}

package/dist/atoms/stepper/stepper.d.ts

@@ -0,0 +1,42 @@
+import { NumberFieldRootProps } from "@base-ui/react/number-field";
+
+//#region src/atoms/stepper/stepper.d.ts
+/**
+ * Props for the Stepper component.
+ */
+type StepperProps = Omit<NumberFieldRootProps, "className"> & {
+  /**
+   * The size of the stepper.
+   * @default "md"
+   */
+  size?: "sm" | "md" | "lg";
+  /**
+   * Whether the stepper is in an invalid state.
+   * @default false
+   */
+  invalid?: boolean;
+  /**
+   * Additional CSS classes for styling.
+   */
+  classNames?: {
+    root?: string;
+    group?: string;
+    input?: string;
+    decrement?: string;
+    increment?: string;
+  };
+};
+/**
+ * A numeric stepper component with increment and decrement buttons.
+ * Built on Base UI's NumberField primitive.
+ */
+declare function Stepper({
+  size,
+  invalid,
+  disabled,
+  classNames,
+  ...props
+}: StepperProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Stepper, StepperProps };
+//# sourceMappingURL=stepper.d.ts.map

package/dist/atoms/stepper/stepper.js

@@ -0,0 +1,2 @@
+import{IconButton as e}from"../icon-button/icon-button.js";import"../icon-button/index.js";import t from"./stepper.module.js";import n from"clsx";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{mdiMinus as a,mdiPlus as o}from"@mdi/js";import{NumberField as s}from"@base-ui/react/number-field";function c({size:c=`md`,invalid:l=!1,disabled:u=!1,classNames:d,...f}){return r(s.Root,{disabled:u,className:n(t.root,d?.root),"data-size":c,"data-invalid":l||void 0,"data-slot":`stepper-root`,...f,children:i(s.Group,{className:n(t.group,d?.group),"data-slot":`stepper-group`,children:[r(s.Decrement,{className:n(d?.decrement),"data-slot":`stepper-decrement`,render:r(e,{label:`decrement`,size:c,variant:`ghost`,iconData:a})}),r(s.Input,{className:n(t.input,d?.input),"data-slot":`stepper-input`}),r(s.Increment,{className:n(d?.increment),"data-slot":`stepper-increment`,render:r(e,{label:`increment`,size:c,variant:`ghost`,iconData:o})})]})})}export{c as Stepper};
+//# sourceMappingURL=stepper.js.map

package/dist/atoms/stepper/stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.js","names":["BaseUINumberField","styles"],"sources":["../../../src/atoms/stepper/stepper.tsx"],"sourcesContent":["import {\n  NumberField as BaseUINumberField,\n  type NumberFieldRootProps,\n} from \"@base-ui/react/number-field\";\nimport { mdiMinus, mdiPlus } from \"@mdi/js\";\nimport clsx from \"clsx\";\nimport { IconButton } from \"../icon-button\";\nimport styles from \"./stepper.module.css\";\n\n/**\n * Props for the Stepper component.\n */\nexport type StepperProps = Omit<NumberFieldRootProps, \"className\"> & {\n  /**\n   * The size of the stepper.\n   * @default \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * Whether the stepper is in an invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * Additional CSS classes for styling.\n   */\n  classNames?: {\n    root?: string;\n    group?: string;\n    input?: string;\n    decrement?: string;\n    increment?: string;\n  };\n};\n\n/**\n * A numeric stepper component with increment and decrement buttons.\n * Built on Base UI's NumberField primitive.\n */\nexport function Stepper({\n  size = \"md\",\n  invalid = false,\n  disabled = false,\n  classNames,\n  ...props\n}: StepperProps) {\n  return (\n    <BaseUINumberField.Root\n      disabled={disabled}\n      className={clsx(styles[\"root\"], classNames?.root)}\n      data-size={size}\n      data-invalid={invalid || undefined}\n      data-slot=\"stepper-root\"\n      {...props}\n    >\n      <BaseUINumberField.Group\n        className={clsx(styles[\"group\"], classNames?.group)}\n        data-slot=\"stepper-group\"\n      >\n        <BaseUINumberField.Decrement\n          className={clsx(classNames?.decrement)}\n          data-slot=\"stepper-decrement\"\n          render={\n            <IconButton\n              label=\"decrement\"\n              size={size}\n              variant=\"ghost\"\n              iconData={mdiMinus}\n            />\n          }\n        />\n        <BaseUINumberField.Input\n          className={clsx(styles[\"input\"], classNames?.input)}\n          data-slot=\"stepper-input\"\n        />\n        <BaseUINumberField.Increment\n          className={clsx(classNames?.increment)}\n          data-slot=\"stepper-increment\"\n          render={\n            <IconButton\n              label=\"increment\"\n              size={size}\n              variant=\"ghost\"\n              iconData={mdiPlus}\n            />\n          }\n        />\n      </BaseUINumberField.Group>\n    </BaseUINumberField.Root>\n  );\n}\n"],"mappings":"8SAuCA,SAAgB,EAAQ,CACtB,OAAO,KACP,UAAU,GACV,WAAW,GACX,aACA,GAAG,GACY,CACf,OACE,EAACA,EAAkB,KAAnB,CACY,WACV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,YAAW,EACX,eAAc,GAAW,IAAA,GACzB,YAAU,eACV,GAAI,WAEJ,EAACD,EAAkB,MAAnB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,yBAFZ,CAIE,EAACD,EAAkB,UAAnB,CACE,UAAW,EAAK,GAAY,SAAS,EACrC,YAAU,oBACV,OACE,EAAC,EAAD,CACE,MAAM,YACA,OACN,QAAQ,QACR,SAAU,CACX,CAAA,CAEJ,CAAA,EACD,EAACA,EAAkB,MAAnB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,eACX,CAAA,EACD,EAACD,EAAkB,UAAnB,CACE,UAAW,EAAK,GAAY,SAAS,EACrC,YAAU,oBACV,OACE,EAAC,EAAD,CACE,MAAM,YACA,OACN,QAAQ,QACR,SAAU,CACX,CAAA,CAEJ,CAAA,CACsB,GACH,CAAA,CAE5B"}

package/dist/atoms/stepper/stepper.module.js

@@ -0,0 +1,3 @@
+import './stepper.css';
+var e={group:`nIISiW_group`,input:`nIISiW_input`,root:`nIISiW_root`};export{e as default};
+//# sourceMappingURL=stepper.module.js.map

package/dist/atoms/stepper/stepper.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.module.js","names":[],"sources":["../../../src/atoms/stepper/stepper.module.css"],"sourcesContent":[".root {\n  --field-control-radius: var(--radius-md);\n  --field-control-bg-color: var(--color-surface-base);\n  --field-control-text-color: var(--color-content-neutral-base);\n  --field-control-border-color: var(--color-border-secondary);\n  --field-control-placeholder-color: var(--color-content-neutral-muted);\n  --field-label-color: var(--color-content-neutral-secondary);\n  width: 100%;\n}\n\n.root[data-size=\"sm\"] {\n  --field-control-height: 1.5rem;\n  --field-control-icon-size: 1.5rem;\n  --field-control-font-size: var(--typography-caption-base-size);\n  --field-control-line-height: var(--typography-caption-base-height);\n  --field-control-font-weight: var(--typography-caption-base-weight);\n}\n\n.root[data-size=\"md\"] {\n  --field-control-height: 2rem;\n  --field-control-icon-size: 2rem;\n  --field-control-font-size: var(--typography-body-2-size);\n  --field-control-line-height: var(--typography-body-2-height);\n  --field-control-font-weight: var(--typography-body-2-weight);\n}\n\n.root[data-size=\"lg\"] {\n  --field-control-height: 2.5rem;\n  --field-control-icon-size: 2rem;\n  --field-control-font-size: var(--typography-body-1-size);\n  --field-control-line-height: var(--typography-body-1-height);\n  --field-control-font-weight: var(--typography-body-1-weight);\n}\n\n.root[data-invalid] {\n  --field-control-border-color: var(--color-content-negative-base);\n  --field-control-text-color: var(--color-content-negative-base);\n}\n\n.root[data-disabled] {\n  --field-control-bg-color: var(--color-surface-tertiary);\n  --field-control-text-color: var(--color-content-neutral-muted);\n  --field-control-border-color: var(--color-border-secondary);\n  --field-label-color: var(--color-content-neutral-muted);\n  cursor: not-allowed;\n}\n\n.group {\n  display: flex;\n  height: var(--field-control-height);\n  width: 100%;\n}\n\n.input {\n  box-sizing: border-box;\n  flex: 1;\n  min-width: 0;\n  margin: 0;\n  padding: 0 var(--spacing-sm);\n  border: 1px solid var(--field-control-border-color);\n  border-radius: var(--radius-md);\n  height: 100%;\n  font-family: var(--typography-typeface-ltr);\n  font-size: var(--field-control-font-size);\n  line-height: var(--field-control-line-height);\n  font-weight: var(--field-control-font-weight);\n  font-variant-numeric: tabular-nums;\n  text-align: left;\n  background-color: var(--field-control-bg-color);\n  color: var(--field-control-text-color);\n  outline: none;\n}\n\n.input::placeholder {\n  color: var(--field-control-placeholder-color);\n}\n\n.input:focus-visible {\n  z-index: 1;\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n"],"mappings":""}

package/dist/fields/autocomplete-field/autocomplete-field.d.ts

@@ -0,0 +1,26 @@
+import { AutocompleteProps } from "../../atoms/autocomplete/autocomplete.js";
+import { FieldProps } from "../../internals/base-field/base-field.js";
+//#region src/fields/autocomplete-field/autocomplete-field.d.ts
+type AutocompleteFieldProps<T = string> = AutocompleteProps<T> & Pick<FieldProps, "label" | "hideLabel" | "required" | "description" | "invalid" | "errorText" | "dirty" | "disabled"> & {
+  classNames?: AutocompleteProps<T>["classNames"] & {
+    label?: string;
+    description?: string;
+    error?: string;
+  };
+};
+declare const AutocompleteField: <T = string>({
+  label,
+  hideLabel,
+  required,
+  description,
+  invalid,
+  errorText,
+  dirty,
+  disabled,
+  size,
+  classNames,
+  ...props
+}: AutocompleteFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { AutocompleteField, AutocompleteFieldProps };
+//# sourceMappingURL=autocomplete-field.d.ts.map

package/dist/fields/autocomplete-field/autocomplete-field.js

@@ -0,0 +1,2 @@
+import{Autocomplete as e}from"../../atoms/autocomplete/autocomplete.js";import"../../atoms/autocomplete/index.js";import{Field as t}from"../../internals/base-field/base-field.js";import"../../internals/base-field/index.js";import{jsx as n}from"react/jsx-runtime";const r=({label:r,hideLabel:i,required:a,description:o,invalid:s,errorText:c,dirty:l,disabled:u,size:d,classNames:f,...p})=>n(t,{label:r,hideLabel:i,size:d,disabled:u,required:a,errorText:c,invalid:s,description:o,dirty:l,classNames:{root:f?.root,label:f?.label,description:f?.description,error:f?.error},"data-slot":`autocomplete-field-root`,children:n(e,{size:d,disabled:u,invalid:s,classNames:f,...p})});export{r as AutocompleteField};
+//# sourceMappingURL=autocomplete-field.js.map