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

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

@@ -0,0 +1,47 @@
+import { CheckboxGroupProps } from "@base-ui/react/checkbox-group";
+
+//#region src/atoms/checkbox-group/checkbox-group.d.ts
+/**
+ * Represents an item in the checkbox group.
+ */
+interface CheckboxGroupItem {
+  /** The value of the checkbox option. */
+  value: string;
+  /** The display label for the checkbox option. */
+  label: string;
+  /** Whether this option is disabled. */
+  disabled?: boolean;
+}
+type CheckboxGroupProps$1 = Omit<CheckboxGroupProps, "className"> & {
+  /** The items to render as checkbox options. */items: CheckboxGroupItem[]; /** The size applied to all checkbox items. @default "md" */
+  size?: "sm" | "md" | "lg";
+  /**
+   * The layout orientation of the checkbox 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 CheckboxGroup$1: ({
+  items,
+  size,
+  orientation,
+  invalid,
+  disabled,
+  classNames,
+  ...props
+}: CheckboxGroupProps$1) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { CheckboxGroup$1 as CheckboxGroup, CheckboxGroupItem, CheckboxGroupProps$1 as CheckboxGroupProps };
+//# sourceMappingURL=checkbox-group.d.ts.map

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-group.js","names":["CheckboxGroup","BaseUICheckboxGroup","styles"],"sources":["../../../src/atoms/checkbox-group/checkbox-group.tsx"],"sourcesContent":["import {\n  CheckboxGroup as BaseUICheckboxGroup,\n  type CheckboxGroupProps as BaseUICheckboxGroupProps,\n} from \"@base-ui/react/checkbox-group\";\nimport clsx from \"clsx\";\nimport styles from \"./checkbox-group.module.css\";\nimport { Checkbox } from \"../checkbox\";\n\n/**\n * Represents an item in the checkbox group.\n */\nexport interface CheckboxGroupItem {\n  /** The value of the checkbox option. */\n  value: string;\n  /** The display label for the checkbox option. */\n  label: string;\n  /** Whether this option is disabled. */\n  disabled?: boolean;\n}\n\nexport type CheckboxGroupProps = Omit<BaseUICheckboxGroupProps, \"className\"> & {\n  /** The items to render as checkbox options. */\n  items: CheckboxGroupItem[];\n  /** The size applied to all checkbox items. @default \"md\" */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * The layout orientation of the checkbox 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 CheckboxGroup = ({\n  items,\n  size = \"md\",\n  orientation = \"vertical\",\n  invalid,\n  disabled = false,\n  classNames,\n  ...props\n}: CheckboxGroupProps) => {\n  return (\n    <BaseUICheckboxGroup\n      {...props}\n      disabled={disabled}\n      data-size={size}\n      data-orientation={orientation}\n      data-invalid={invalid || undefined}\n      className={clsx(styles[\"group\"], classNames?.root)}\n      data-slot=\"checkbox-group\"\n    >\n      {items.map(item => (\n        <Checkbox\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    </BaseUICheckboxGroup>\n  );\n};\n"],"mappings":"oPA6CA,MAAaA,GAAiB,CAC5B,QACA,OAAO,KACP,cAAc,WACd,UACA,WAAW,GACX,aACA,GAAG,KAGD,EAACC,EAAD,CACE,GAAI,EACM,WACV,YAAW,EACX,mBAAkB,EAClB,eAAc,GAAW,IAAA,GACzB,UAAW,EAAKC,EAAO,MAAU,GAAY,IAAI,EACjD,YAAU,0BAET,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,CACkB,CAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-group.module.js","names":[],"sources":["../../../src/atoms/checkbox-group/checkbox-group.module.css"],"sourcesContent":[".group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-xs);\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/checkbox-group/index.d.ts

@@ -0,0 +1 @@
+import { CheckboxGroup, CheckboxGroupItem, CheckboxGroupProps } from "./checkbox-group.js";

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

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

package/dist/atoms/clickable-area/clickable-area.d.ts

@@ -0,0 +1,15 @@
+import { MergeElementProps, WithBaseProps } from "../../types.js";
+
+//#region src/atoms/clickable-area/clickable-area.d.ts
+type ClickableAreaProps = MergeElementProps<"button", WithBaseProps<{
+  /**
+   * If true, the button will be disabled and non-interactive.
+   *
+   * @default false
+   */
+  disabled?: boolean;
+}>>;
+declare const ClickableArea: React.FC<ClickableAreaProps>;
+//#endregion
+export { ClickableArea, ClickableAreaProps };
+//# sourceMappingURL=clickable-area.d.ts.map

package/dist/atoms/clickable-area/clickable-area.js

@@ -0,0 +1,2 @@
+import e from"./styles.module.js";import t from"clsx";import{jsx as n}from"react/jsx-runtime";const r=r=>{let{children:i,className:a,disabled:o=!1,tabIndex:s,...c}=r,l=o?-1:s??0;return n(`button`,{...c,inert:o,disabled:o,tabIndex:l,className:t(e.root,a),children:i})};export{r as ClickableArea};
+//# sourceMappingURL=clickable-area.js.map

package/dist/atoms/clickable-area/clickable-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clickable-area.js","names":["classes"],"sources":["../../../src/atoms/clickable-area/clickable-area.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { MergeElementProps, WithBaseProps } from \"../../types\";\nimport classes from \"./styles.module.css\";\n\nexport type ClickableAreaProps = MergeElementProps<\n  \"button\",\n  WithBaseProps<{\n    /**\n     * If true, the button will be disabled and non-interactive.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n  }>\n>;\n\nexport const ClickableArea: React.FC<ClickableAreaProps> = props => {\n  const {\n    children,\n    className,\n    disabled = false,\n    tabIndex: tabIndexProp,\n    ...otherProps\n  } = props;\n\n  const tabIndex = disabled ? -1 : (tabIndexProp ?? 0);\n\n  return (\n    <button\n      {...otherProps}\n      inert={disabled}\n      disabled={disabled}\n      tabIndex={tabIndex}\n      className={clsx(classes[\"root\"], className)}\n    >\n      {children}\n    </button>\n  );\n};\n"],"mappings":"8FAgBA,MAAa,EAA8C,GAAS,CAClE,GAAM,CACJ,WACA,YACA,WAAW,GACX,SAAU,EACV,GAAG,GACD,EAEE,EAAW,EAAW,GAAM,GAAgB,EAElD,OACE,EAAC,SAAD,CACE,GAAI,EACJ,MAAO,EACG,WACA,WACV,UAAW,EAAKA,EAAQ,KAAS,CAAS,EAEzC,UACK,CAAA,CAEZ"}

package/dist/atoms/clickable-area/index.d.ts

@@ -0,0 +1 @@
+import { ClickableArea, ClickableAreaProps } from "./clickable-area.js";

package/dist/atoms/clickable-area/index.js

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

package/dist/atoms/clickable-area/styles.css

@@ -0,0 +1 @@
+.TyvJFa_root{--clickable-area-background:transparent;all:unset;cursor:pointer;border-radius:var(--radius-lg);background-color:var(--clickable-area-background)}.TyvJFa_root:focus-visible{outline-style:solid;outline-width:var(--token-focus-ring-stroke);outline-color:var(--token-focus-ring-color);outline-offset:var(--token-focus-ring-offset)}.TyvJFa_root.TyvJFa_disabled{pointer-events:none}@media (hover:hover){.TyvJFa_root:not(.TyvJFa_disabled):hover{--clickable-area-background:#ffffff1f}}.TyvJFa_root:not(.TyvJFa_disabled):active{--clickable-area-background:#ffffff0f}

package/dist/atoms/clickable-area/styles.module.js

@@ -0,0 +1,3 @@
+import './styles.css';
+var e={disabled:`TyvJFa_disabled`,root:`TyvJFa_root`};export{e as default};
+//# sourceMappingURL=styles.module.js.map

package/dist/atoms/clickable-area/styles.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module.js","names":[],"sources":["../../../src/atoms/clickable-area/styles.module.css"],"sourcesContent":[".root {\n  --clickable-area-background: transparent;\n\n  all: unset;\n  cursor: pointer;\n\n  border-radius: var(--radius-lg);\n  background-color: var(--clickable-area-background);\n}\n\n.root:focus-visible {\n  outline-style: solid;\n  outline-width: var(--token-focus-ring-stroke);\n  outline-color: var(--token-focus-ring-color);\n  outline-offset: var(--token-focus-ring-offset);\n}\n\n.root.disabled {\n  pointer-events: none;\n}\n\n@media (hover: hover) {\n  .root:not(.disabled):hover {\n    --clickable-area-background: rgba(255, 255, 255, 0.12);\n  }\n}\n\n.root:not(.disabled):active {\n  --clickable-area-background: rgba(255, 255, 255, 0.06);\n}\n"],"mappings":""}

package/dist/atoms/collapsible/collapsible.css

@@ -0,0 +1 @@
+.uQwcna_panel{height:var(--collapsible-panel-height);width:var(--collapsible-panel-width);transition:height .15s ease-out;overflow:hidden;&[hidden]:not([hidden=until-found]){display:none}&[data-starting-style],&[data-ending-style]{height:0}}

package/dist/atoms/collapsible/collapsible.d.ts

@@ -0,0 +1,16 @@
+import { CollapsibleRootProps } from "@base-ui/react";
+
+//#region src/atoms/collapsible/collapsible.d.ts
+type CollapsibleProps = Omit<CollapsibleRootProps, "className"> & {
+  renderTrigger: React.ReactElement;
+  classNames?: {
+    root?: string;
+    trigger?: string;
+    panel?: string;
+  };
+  children: React.ReactNode;
+};
+declare const Collapsible$1: React.FC<CollapsibleProps>;
+//#endregion
+export { Collapsible$1 as Collapsible };
+//# sourceMappingURL=collapsible.d.ts.map

package/dist/atoms/collapsible/collapsible.js

@@ -0,0 +1,2 @@
+import e from"./collapsible.module.js";import t from"clsx";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{Collapsible as i}from"@base-ui/react";const a=a=>{let{renderTrigger:o,classNames:s,children:c}=a;return r(i.Root,{className:s?.root,children:[n(i.Trigger,{className:s?.trigger,render:o}),n(i.Panel,{className:t(e.panel,s?.panel),children:c})]})};export{a as Collapsible};
+//# sourceMappingURL=collapsible.js.map

package/dist/atoms/collapsible/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.js","names":["Collapsible","BaseUiCollapsible","styles"],"sources":["../../../src/atoms/collapsible/collapsible.tsx"],"sourcesContent":["import {\n  Collapsible as BaseUiCollapsible,\n  type CollapsibleRootProps as BaseUiCollapsibleRootProps,\n} from \"@base-ui/react\";\nimport clsx from \"clsx\";\nimport styles from \"./collapsible.module.css\";\n\ntype CollapsibleProps = Omit<BaseUiCollapsibleRootProps, \"className\"> & {\n  renderTrigger: React.ReactElement;\n  classNames?: {\n    root?: string;\n    trigger?: string;\n    panel?: string;\n  };\n  children: React.ReactNode;\n};\n\nexport const Collapsible: React.FC<CollapsibleProps> = props => {\n  const { renderTrigger, classNames, children } = props;\n  return (\n    <BaseUiCollapsible.Root className={classNames?.root}>\n      <BaseUiCollapsible.Trigger\n        className={classNames?.trigger}\n        render={renderTrigger}\n      />\n      <BaseUiCollapsible.Panel\n        className={clsx(styles[\"panel\"], classNames?.panel)}\n      >\n        {children}\n      </BaseUiCollapsible.Panel>\n    </BaseUiCollapsible.Root>\n  );\n};\n"],"mappings":"0JAiBA,MAAaA,EAA0C,GAAS,CAC9D,GAAM,CAAE,gBAAe,aAAY,YAAa,EAChD,OACE,EAACC,EAAkB,KAAnB,CAAwB,UAAW,GAAY,cAA/C,CACE,EAACA,EAAkB,QAAnB,CACE,UAAW,GAAY,QACvB,OAAQ,CACT,CAAA,EACD,EAACA,EAAkB,MAAnB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAEjD,UACsB,CAAA,CACH,GAE5B"}

package/dist/atoms/collapsible/collapsible.module.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.module.js","names":[],"sources":["../../../src/atoms/collapsible/collapsible.module.css"],"sourcesContent":[".panel {\n  height: var(--collapsible-panel-height);\n  width: var(--collapsible-panel-width);\n  overflow: hidden;\n  transition: height 150ms ease-out;\n\n  &[hidden]:not([hidden=\"until-found\"]) {\n    display: none;\n  }\n\n  &[data-starting-style],\n  &[data-ending-style] {\n    height: 0;\n  }\n}\n"],"mappings":""}

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

@@ -0,0 +1 @@
+import { Collapsible } from "./collapsible.js";

package/dist/atoms/collapsible/index.js

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

package/dist/atoms/combobox/combobox.css

@@ -1,302 +1 @@
-.KAWYaW_control {
-  align-items: center;
-  gap: var(--spacing-xs);
-  width: 100%;
-  display: flex;
-  position: relative;
-}
-
-.KAWYaW_start-adornment, .KAWYaW_end-adornment {
-  height: var(--field-control-icon-size);
-  align-items: center;
-  display: flex;
-
-  & [data-slot="input-adornment-root"] {
-    &[data-kind="icon"] {
-      width: var(--adornment-icon-size);
-      height: var(--adornment-icon-size);
-      color: var(--field-label-color);
-    }
-
-    &[data-kind="button"] {
-      width: var(--adornment-button-size);
-      height: var(--adornment-button-size);
-      color: var(--field-label-color);
-    }
-  }
-}
-
-.KAWYaW_control[data-size="sm"] {
-  --adornment-icon-size: 1rem;
-  --adornment-button-size: 1.5rem;
-  --input-group-gap: var(--spacing-xs);
-  --combobox-chip-size: 1rem;
-}
-
-.KAWYaW_control[data-size="md"] {
-  --adornment-icon-size: 1.5rem;
-  --adornment-button-size: 2rem;
-  --input-group-gap: var(--spacing-xs);
-  --combobox-chip-size: 1rem;
-}
-
-.KAWYaW_control[data-size="lg"] {
-  --adornment-icon-size: 2rem;
-  --adornment-button-size: 2.5rem;
-  --input-group-gap: var(--spacing-sm);
-  --combobox-chip-size: 1rem;
-}
-
-.KAWYaW_input-group {
-  box-sizing: border-box;
-  min-width: 12rem;
-  min-height: var(--field-control-height);
-  border: 1px solid var(--color-border-primary);
-  background-color: var(--color-surface-base);
-  border-radius: var(--field-control-radius);
-  align-items: center;
-  gap: var(--input-group-gap);
-  padding: 0 var(--spacing-sm);
-  flex-wrap: wrap;
-  flex: 1;
-  transition: border-color .2s ease-in-out;
-  display: flex;
-  position: relative;
-}
-
-.KAWYaW_input-group:focus-within {
-  outline-style: solid;
-  outline-width: var(--stroke-focus-ring);
-  outline-color: var(--color-action-info-base);
-  outline-offset: var(--spacing-xxs);
-}
-
-.KAWYaW_input {
-  box-sizing: border-box;
-  min-width: 4rem;
-  height: calc(var(--field-control-height) - 2px);
-  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);
-  color: var(--field-control-text-color);
-  background-color: #0000;
-  border: none;
-  border-radius: 0;
-  outline: none;
-  flex: 1;
-  margin: 0;
-  padding: 0;
-}
-
-.KAWYaW_input::placeholder {
-  color: var(--field-control-placeholder-color);
-}
-
-.KAWYaW_input:focus {
-  outline: none;
-}
-
-.KAWYaW_chips {
-  align-items: center;
-  gap: var(--spacing-xs);
-  padding: var(--spacing-xxs) 0;
-  flex-wrap: wrap;
-  flex: 1;
-  display: flex;
-}
-
-.KAWYaW_chip {
-  --combobox-chip-bg: var(--color-surface-secondary);
-  --combobox-chip-color: var(--color-content-brand-secondary);
-  box-sizing: border-box;
-  align-items: center;
-  gap: var(--spacing-xxs);
-  background-color: var(--combobox-chip-bg);
-  color: var(--combobox-chip-color);
-  border: 1px solid var(--combobox-chip-color);
-  padding: 0 var(--spacing-sm);
-  height: calc(var(--field-control-height) * .7);
-  border-radius: var(--radius-full);
-  font-size: var(--typography-caption-base-size);
-  cursor: default;
-  outline: none;
-  display: flex;
-}
-
-.KAWYaW_chip[data-highlighted] {
-  background-color: var(--color-action-neutral-muted);
-}
-
-.KAWYaW_chip-text {
-  white-space: nowrap;
-  color: var(--combobox-chip-color);
-}
-
-.KAWYaW_chip-remove {
-  color: var(--combobox-chip-color);
-  background-color: var(--combobox-chip-bg);
-  cursor: pointer;
-  height: var(--combobox-chip-size);
-  width: var(--combobox-chip-size);
-  border: none;
-  border-radius: 50%;
-  justify-content: center;
-  align-items: center;
-  padding: 0;
-  transition: background-color .1s;
-  display: flex;
-}
-
-.KAWYaW_chip-remove:hover {
-  --combobox-chip-bg: var(--color-surface-tertiary);
-}
-
-.KAWYaW_action-buttons {
-  box-sizing: border-box;
-  align-items: center;
-  gap: var(--spacing-xxs);
-  padding-left: var(--spacing-sm);
-  height: 100%;
-  margin-left: auto;
-  display: flex;
-}
-
-.KAWYaW_trigger, .KAWYaW_clear {
-  box-sizing: border-box;
-  width: var(--field-control-icon-size);
-  height: var(--field-control-icon-size);
-  color: var(--field-label-color);
-  border-radius: var(--radius-full);
-  background: none;
-  border: none;
-  justify-content: center;
-  align-items: center;
-  padding: 0;
-  transition: color .1s, background-color .1s;
-  display: flex;
-}
-
-.KAWYaW_trigger:hover, .KAWYaW_clear:hover {
-  color: var(--color-content-neutral-base);
-  background-color: var(--color-surface-secondary);
-}
-
-.KAWYaW_trigger:focus-visible, .KAWYaW_clear:focus-visible {
-  outline-style: solid;
-  outline-width: var(--stroke-focus-ring);
-  outline-color: var(--color-action-info-base);
-  outline-offset: var(--spacing-xxs);
-}
-
-.KAWYaW_trigger[data-disabled], .KAWYaW_clear[data-disabled] {
-  cursor: not-allowed;
-  user-select: none;
-}
-
-.KAWYaW_positioner {
-  z-index: var(--zindex-1);
-  outline: 0;
-}
-
-.KAWYaW_popup {
-  box-sizing: border-box;
-  background-color: var(--color-surface-base);
-  color: var(--color-content-neutral-base);
-  width: var(--anchor-width);
-  max-width: var(--available-width);
-  min-width: 12rem;
-  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;
-}
-
-.KAWYaW_popup.KAWYaW_full-width {
-  width: 100%;
-}
-
-.KAWYaW_popup[data-starting-style], .KAWYaW_popup[data-ending-style] {
-  opacity: 0;
-  transform: scale(.95);
-}
-
-.KAWYaW_list {
-  box-sizing: border-box;
-  overscroll-behavior: contain;
-  padding-block: var(--spacing-xs);
-  scroll-padding-block: var(--spacing-xs);
-  max-height: min(22.5rem, var(--available-height));
-  outline: 0;
-  overflow-y: auto;
-}
-
-.KAWYaW_list[data-empty] {
-  padding: 0;
-}
-
-.KAWYaW_group {
-  padding-block: var(--spacing-xs);
-}
-
-.KAWYaW_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;
-}
-
-.KAWYaW_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);
-  font-size: var(--field-control-font-size);
-  line-height: var(--field-control-line-height);
-  font-weight: var(--field-control-font-weight);
-  outline: 0;
-  grid-template-columns: 1rem 1fr;
-  align-items: center;
-  transition: background-color .1s;
-  display: grid;
-  position: relative;
-}
-
-.KAWYaW_item[data-highlighted] {
-  background-color: var(--color-surface-secondary);
-}
-
-.KAWYaW_item[data-selected] {
-  color: var(--color-content-brand-base);
-  font-weight: var(--typography-subheading-2-weight);
-}
-
-.KAWYaW_item[data-disabled] {
-  opacity: .5;
-  cursor: not-allowed;
-}
-
-.KAWYaW_item-indicator {
-  grid-column-start: 1;
-  justify-content: center;
-  align-items: center;
-  display: flex;
-}
-
-.KAWYaW_item-text {
-  grid-column-start: 2;
-}
-
-.KAWYaW_empty {
-  box-sizing: border-box;
-  padding: var(--spacing-md);
-  font-size: var(--field-control-font-size);
-  color: var(--color-content-neutral-muted);
-  text-align: center;
-}
+.KAWYaW_root{width:100%}.KAWYaW_control{--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);align-items:center;gap:var(--spacing-xs);border-radius:999px;width:100%;display:flex;position:relative}.KAWYaW_control[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);--adornment-icon-size:1rem;--adornment-button-size:1.5rem;--input-group-gap:var(--spacing-xs);--combobox-chip-size:1rem}.KAWYaW_control[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);--adornment-icon-size:1.5rem;--adornment-button-size:2rem;--input-group-gap:var(--spacing-xs);--combobox-chip-size:1rem}.KAWYaW_control[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);--adornment-icon-size:2rem;--adornment-button-size:2.5rem;--input-group-gap:var(--spacing-sm);--combobox-chip-size:1rem}.KAWYaW_control[data-invalid]{--field-control-border-color:var(--color-content-negative-base);--field-control-text-color:var(--color-content-negative-base)}.KAWYaW_start-adornment,.KAWYaW_end-adornment{height:var(--field-control-icon-size);align-items:center;display:flex;& [data-slot=input-adornment-root]{&[data-kind=icon]{width:var(--adornment-icon-size);height:var(--adornment-icon-size);color:var(--field-label-color)}&[data-kind=button]{width:var(--adornment-button-size);height:var(--adornment-button-size);color:var(--field-label-color)}}}.KAWYaW_input-group{box-sizing:border-box;min-width:12rem;min-height:var(--field-control-height);border:1px solid var(--field-control-border-color);background-color:var(--field-control-bg-color);border-radius:var(--field-control-radius);align-items:center;gap:var(--input-group-gap);padding:0 var(--spacing-sm);flex-wrap:wrap;flex:1;transition:border-color .2s ease-in-out;display:flex;position:relative}.KAWYaW_input-group:focus-within{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}.KAWYaW_input{box-sizing:border-box;min-width:4rem;height:calc(var(--field-control-height) - 2px);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);color:var(--field-control-text-color);background-color:#0000;border:none;border-radius:0;outline:none;flex:1;margin:0;padding:0}.KAWYaW_input::placeholder{color:var(--field-control-placeholder-color)}.KAWYaW_input:focus{outline:none}.KAWYaW_chips{align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xxs) 0;flex-wrap:wrap;flex:1;display:flex}.KAWYaW_chip{--combobox-chip-bg:var(--color-surface-tertiary);--combobox-chip-color:var(--color-content-neutral-base);box-sizing:border-box;align-items:center;gap:var(--spacing-xxs);background-color:var(--combobox-chip-bg);color:var(--combobox-chip-color);padding:0 var(--spacing-sm);height:calc(var(--field-control-height) * .7);border-radius:var(--radius-sm);font-size:var(--typography-caption-base-size);cursor:default;outline:none;display:flex}.KAWYaW_chip[data-highlighted]{background-color:var(--color-action-neutral-muted)}.KAWYaW_chip-text{white-space:nowrap;color:var(--combobox-chip-color)}.KAWYaW_chip-remove{color:var(--combobox-chip-color);background-color:var(--combobox-chip-bg);cursor:pointer;height:var(--combobox-chip-size);width:var(--combobox-chip-size);border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:background-color .1s;display:flex}.KAWYaW_chip-remove:hover{--combobox-chip-bg:var(--color-surface-tertiary)}.KAWYaW_action-buttons{box-sizing:border-box;align-items:center;gap:var(--spacing-xxs);padding-left:var(--spacing-sm);height:100%;margin-left:auto;display:flex}.KAWYaW_trigger,.KAWYaW_clear{box-sizing:border-box;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);background:0 0;border:none;justify-content:center;align-items:center;transition:color .1s,background-color .1s;display:flex}.KAWYaW_trigger:hover,.KAWYaW_clear:hover{color:var(--color-content-neutral-base);background-color:var(--color-surface-secondary)}.KAWYaW_trigger:focus-visible,.KAWYaW_clear:focus-visible{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}.KAWYaW_trigger[data-disabled],.KAWYaW_clear[data-disabled]{cursor:not-allowed;user-select:none}.KAWYaW_positioner{z-index:var(--zindex-1);outline:0}.KAWYaW_popup{box-sizing:border-box;background-color:var(--color-surface-base);color:var(--color-content-neutral-base);width:var(--anchor-width);max-width:var(--available-width);min-width:12rem;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}.KAWYaW_popup.KAWYaW_full-width{width:100%}.KAWYaW_popup[data-starting-style],.KAWYaW_popup[data-ending-style]{opacity:0;transform:scale(.95)}.KAWYaW_list{box-sizing:border-box;overscroll-behavior:contain;padding-block:var(--spacing-xs);scroll-padding-block:var(--spacing-xs);max-height:min(22.5rem, var(--available-height));outline:0;overflow-y:auto}.KAWYaW_list[data-empty]{padding:0}.KAWYaW_group{padding-block:var(--spacing-xs)}.KAWYaW_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}.KAWYaW_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}.KAWYaW_item[data-size=sm]{font-size:var(--typography-caption-base-size);line-height:var(--typography-caption-base-height);font-weight:var(--typography-caption-base-weight)}.KAWYaW_item[data-size=md]{font-size:var(--typography-body-2-size);line-height:var(--typography-body-2-height);font-weight:var(--typography-body-2-weight)}.KAWYaW_item[data-size=lg]{font-size:var(--typography-body-1-size);line-height:var(--typography-body-1-height);font-weight:var(--typography-body-1-weight)}.KAWYaW_item[data-highlighted]{background-color:var(--color-surface-secondary)}.KAWYaW_item[data-selected]{color:var(--color-content-brand-base);font-weight:var(--typography-subheading-2-weight)}.KAWYaW_item[data-disabled]{opacity:.5;cursor:not-allowed}.KAWYaW_item-indicator{visibility:hidden;grid-column-start:1;justify-content:center;align-items:center;display:flex}.KAWYaW_item[data-selected] .KAWYaW_item-indicator{visibility:visible}.KAWYaW_item-text{grid-column-start:2}.KAWYaW_empty{box-sizing:border-box;padding:var(--spacing-md);font-size:var(--field-control-font-size);color:var(--color-content-neutral-muted);text-align:center}

package/dist/atoms/combobox/combobox.d.ts

@@ -1,6 +1,5 @@
-import { FieldProps } from "../../internals/base-field/base-field.js";
 import { ComboboxItem } from "./components/item.js";
-import * as React from "react";
+import * as React$1 from "react";
 import { ComboboxRootProps } from "@base-ui/react/combobox";
 
 //#region src/atoms/combobox/combobox.d.ts
@@ -16,7 +15,17 @@ interface ComboboxGroup {
 /**
  * Props for the Combobox component.
  */
-type ComboboxProps<T = string, Multiple extends boolean | undefined = false> = Pick<FieldProps, "label" | "hideLabel" | "name" | "required" | "description" | "invalid" | "errorText" | "dirty" | "size" | "disabled" | "autoFocus"> & ComboboxRootProps<T, Multiple> & {
+type ComboboxProps<T = string, Multiple extends boolean | undefined = false> = ComboboxRootProps<T, Multiple> & {
+  /**
+   * The size of the combobox.
+   * @default "md"
+   */
+  size?: "sm" | "md" | "lg";
+  /**
+   * Whether the combobox is in an invalid state.
+   * @default false
+   */
+  invalid?: boolean;
   /**
    * Whether the combobox is clearable when a value is selected.
    * @default false
@@ -37,9 +46,6 @@ type ComboboxProps<T = string, Multiple extends boolean | undefined = false> = P
    */
   classNames?: {
     root?: string;
-    label?: string;
-    description?: string;
-    error?: string;
     control?: string;
     inputGroup?: string;
     startAdornment?: string;
@@ -63,11 +69,11 @@ type ComboboxProps<T = string, Multiple extends boolean | undefined = false> = P
   /**
    * Slot for element placed at the start of the input group.
    */
-  startAdornment?: React.ReactNode;
+  startAdornment?: React$1.ReactNode;
   /**
    * Slot for element placed at the end of the input group.
    */
-  endAdornment?: React.ReactNode;
+  endAdornment?: React$1.ReactNode;
   /**
    * Placeholder text for the input.
    */
@@ -90,15 +96,10 @@ type ComboboxProps<T = string, Multiple extends boolean | undefined = false> = P
  * ```
  */
 declare const Combobox$1: <T = string, Multiple extends boolean | undefined = false>({
-  label,
-  description,
   fullWidthContents,
   invalid,
-  errorText,
-  hideLabel,
   clearable,
   searchable,
-  required,
   size,
   readOnly,
   disabled,

package/dist/atoms/combobox/combobox.js

@@ -1,2 +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{Field as n}from"../../internals/base-field/base-field.js";import"../../internals/base-field/index.js";import r from"./combobox.module.js";import{Chip as i}from"./components/chip.js";import{ItemRow as a}from"./components/item.js";import o from"clsx";import"react";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";import{mdiChevronDown as u,mdiClose as d}from"@mdi/js";import{Combobox as f}from"@base-ui/react/combobox";const p=({label:p,description:m,fullWidthContents:h=!1,invalid:g=!1,errorText:_,hideLabel:v=!1,clearable:y=!1,searchable:b=!0,required:x=!1,size:S=`md`,readOnly:C=!1,disabled:w=!1,endAdornment:T,startAdornment:E,placeholder:D=`Select an option`,classNames:O,items:k,multiple:A,...j})=>{let{resolveContainer:M}=e(),N=M();return c(n,{label:p,hideLabel:v,size:S,disabled:w,required:x,errorText:_,invalid:g,description:m,classNames:{root:O?.root,label:O?.label,description:O?.description,error:O?.error},"data-slot":`combobox-root`,children:l(f.Root,{items:k,multiple:A,disabled:w,readOnly:C,...j,children:[c(`div`,{className:o(r.control,O?.control),"data-size":S,"data-slot":`combobox-control`,children:l(f.InputGroup,{className:o(r[`input-group`],O?.inputGroup),"data-slot":`combobox-input-group`,children:[E&&c(`div`,{className:o(r[`start-adornment`],O?.startAdornment),"data-slot":`combobox-start-adornment`,children:E}),A?c(f.Chips,{className:o(r.chips,O?.chips),"data-slot":`combobox-chips`,children:c(f.Value,{children:e=>l(s,{children:[e.map(e=>c(i,{item:e,classNames:{root:O?.chip,text:O?.chipText,remove:O?.chipRemove}},e.id)),c(f.Input,{className:o(r.input,O?.input),"data-slot":`combobox-input`,placeholder:e.length>0?``:D})]})})}):c(f.Input,{className:o(r.input,O?.input),"data-slot":`combobox-input`,placeholder:D}),l(`div`,{className:o(r[`action-buttons`],O?.actionButtons),"data-slot":`combobox-action-buttons`,children:[y&&c(f.Clear,{className:o(r.clear,O?.clear),"data-slot":`combobox-clear`,"aria-label":`Clear selection`,disabled:w,children:c(t,{data:d})}),c(f.Trigger,{className:o(r.trigger,O?.trigger),"data-slot":`combobox-trigger`,disabled:w,"aria-label":`Open dropdown`,children:c(t,{data:u})}),T&&c(`div`,{className:o(r[`end-adornment`],O?.endAdornment),"data-slot":`combobox-end-adornment`,children:T})]})]})}),c(f.Portal,{container:N,children:c(f.Positioner,{className:o(r.positioner,O?.positioner),"data-slot":`combobox-positioner`,sideOffset:4,children:l(f.Popup,{className:o(r.popup,O?.popup,{[r[`full-width`]]:h}),"data-slot":`combobox-popup`,children:[c(f.Empty,{children:c(`div`,{className:o(r.empty,O?.empty),"data-slot":`combobox-empty`,children:`No items found.`})}),c(f.List,{className:o(r.list,O?.list),"data-slot":`combobox-list`,children:e=>`items`in e?l(f.Group,{className:o(r.group,O?.group),items:e.items,"data-slot":`combobox-group`,children:[c(f.GroupLabel,{className:o(r[`group-label`],O?.groupLabel),"data-slot":`combobox-group-label`,children:e.label}),c(f.Collection,{children:e=>c(a,{className:O?.item,item:e},e.id)})]},e.label):c(a,{className:O?.item,item:e},e.id)})]})})})]})})};export{p as Combobox};
+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"./combobox.module.js";import{Chip as r}from"./components/chip.js";import{ItemRow as i}from"./components/item.js";import a from"clsx";import"react";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";import{mdiChevronDown as l,mdiClose as u}from"@mdi/js";import{Combobox as d}from"@base-ui/react/combobox";const f=({fullWidthContents:f=!1,invalid:p=!1,clearable:m=!1,searchable:h=!0,size:g=`md`,readOnly:_=!1,disabled:v=!1,endAdornment:y,startAdornment:b,placeholder:x=`Select an option`,classNames:S,items:C,multiple:w,...T})=>{let{resolveContainer:E}=e(),D=E();return s(`div`,{"data-slot":`combobox-root`,className:a(n.root,S?.root),children:c(d.Root,{items:C,multiple:w,disabled:v,readOnly:_,...T,children:[s(`div`,{className:a(n.control,S?.control),"data-size":g,"data-invalid":p||void 0,"data-slot":`combobox-control`,children:c(d.InputGroup,{className:a(n[`input-group`],S?.inputGroup),"data-slot":`combobox-input-group`,children:[b&&s(`div`,{className:a(n[`start-adornment`],S?.startAdornment),"data-slot":`combobox-start-adornment`,children:b}),w?s(d.Chips,{className:a(n.chips,S?.chips),"data-slot":`combobox-chips`,children:s(d.Value,{children:e=>c(o,{children:[e.map(e=>s(r,{item:e,classNames:{root:S?.chip,text:S?.chipText,remove:S?.chipRemove}},e.id)),s(d.Input,{className:a(n.input,S?.input),"data-slot":`combobox-input`,placeholder:e.length>0?``:x})]})})}):s(d.Input,{className:a(n.input,S?.input),"data-slot":`combobox-input`,placeholder:x}),c(`div`,{className:a(n[`action-buttons`],S?.actionButtons),"data-slot":`combobox-action-buttons`,children:[m&&s(d.Clear,{className:a(n.clear,S?.clear),"data-slot":`combobox-clear`,"aria-label":`Clear selection`,disabled:v,children:s(t,{data:u})}),s(d.Trigger,{className:a(n.trigger,S?.trigger),"data-slot":`combobox-trigger`,disabled:v,"aria-label":`Open dropdown`,children:s(t,{data:l})}),y&&s(`div`,{className:a(n[`end-adornment`],S?.endAdornment),"data-slot":`combobox-end-adornment`,children:y})]})]})}),s(d.Portal,{container:D,children:s(d.Positioner,{className:a(n.positioner,S?.positioner),"data-slot":`combobox-positioner`,sideOffset:4,children:c(d.Popup,{className:a(n.popup,S?.popup,{[n[`full-width`]]:f}),"data-slot":`combobox-popup`,children:[s(d.Empty,{children:s(`div`,{className:a(n.empty,S?.empty),"data-slot":`combobox-empty`,children:`No items found.`})}),s(d.List,{className:a(n.list,S?.list),"data-slot":`combobox-list`,children:e=>`items`in e?c(d.Group,{className:a(n.group,S?.group),items:e.items,"data-slot":`combobox-group`,children:[s(d.GroupLabel,{className:a(n[`group-label`],S?.groupLabel),"data-slot":`combobox-group-label`,children:e.label}),s(d.Collection,{children:e=>s(i,{className:S?.item,item:e,size:g},e.id)})]},e.label):s(i,{className:S?.item,item:e,size:g},e.id)})]})})})]})})};export{f as Combobox};
 //# sourceMappingURL=combobox.js.map

package/dist/atoms/combobox/combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.js","names":["Combobox","BaseUICombobox","styles"],"sources":["../../../src/atoms/combobox/combobox.tsx"],"sourcesContent":["import {\n  Combobox as BaseUICombobox,\n  type ComboboxRootProps,\n} from \"@base-ui/react/combobox\";\nimport { mdiChevronDown, mdiClose } from \"@mdi/js\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { usePortalConfig } from \"../../helpers/portal\";\nimport { Field, type FieldProps } from \"../../internals/base-field\";\nimport { Icon } from \"../icon\";\nimport styles from \"./combobox.module.css\";\nimport { Chip } from \"./components/chip\";\nimport { ItemRow, type ComboboxItem } from \"./components/item\";\n\n/**\n * Represents a group of items in the combobox.\n */\nexport interface ComboboxGroup {\n  /** The text label of the group */\n  label: string;\n  /** The items in the group */\n  items: ComboboxItem[];\n}\n\n/**\n * Props for the Combobox component.\n */\nexport type ComboboxProps<\n  T = string,\n  Multiple extends boolean | undefined = false,\n> = Pick<\n  FieldProps,\n  | \"label\"\n  | \"hideLabel\"\n  | \"name\"\n  | \"required\"\n  | \"description\"\n  | \"invalid\"\n  | \"errorText\"\n  | \"dirty\"\n  | \"size\"\n  | \"disabled\"\n  | \"autoFocus\"\n> &\n  ComboboxRootProps<T, Multiple> & {\n    /**\n     * Whether the combobox is clearable when a value is selected.\n     * @default false\n     */\n    clearable?: boolean;\n    /**\n     * Whether the combobox is searchable.\n     * @default true\n     */\n    searchable?: boolean;\n    /**\n     * Whether the combobox contents should be full width.\n     * @default false\n     */\n    fullWidthContents?: boolean;\n    /**\n     * Additional CSS classes for styling.\n     */\n    classNames?: {\n      root?: string;\n      label?: string;\n      description?: string;\n      error?: string;\n      control?: string;\n      inputGroup?: string;\n      startAdornment?: string;\n      endAdornment?: string;\n      input?: string;\n      actionButtons?: string;\n      chips?: string;\n      chip?: string;\n      chipText?: string;\n      chipRemove?: string;\n      positioner?: string;\n      empty?: string;\n      list?: string;\n      group?: string;\n      item?: string;\n      groupLabel?: string;\n      trigger?: string;\n      clear?: string;\n      popup?: string;\n    };\n    /**\n     * Slot for element placed at the start of the input group.\n     */\n    startAdornment?: React.ReactNode;\n    /**\n     * Slot for element placed at the end of the input group.\n     */\n    endAdornment?: React.ReactNode;\n    /**\n     * Placeholder text for the input.\n     */\n    placeholder?: string;\n  };\n\n/**\n * A combobox component that combines an input with a list of selectable items.\n * Built on top of Base UI's combobox primitive with zero-runtime CSS styling.\n *\n * @example\n * ```tsx\n * <Combobox\n *   label=\"Favorite Fruit\"\n *   items={[\n *     { id: \"1\", label: \"Apple\", value: \"apple\" },\n *     { id: \"2\", label: \"Banana\", value: \"banana\" },\n *   ]}\n *   placeholder=\"Select a fruit\"\n * />\n * ```\n */\nexport const Combobox = <\n  T = string,\n  Multiple extends boolean | undefined = false,\n>({\n  label,\n  description,\n  fullWidthContents = false,\n  invalid = false,\n  errorText,\n  hideLabel = false,\n  clearable = false,\n  searchable = true,\n  required = false,\n  size = \"md\",\n  readOnly = false,\n  disabled = false,\n  endAdornment,\n  startAdornment,\n  placeholder = \"Select an option\",\n  classNames,\n  items,\n  multiple,\n  ...props\n}: ComboboxProps<T, Multiple>) => {\n  const { resolveContainer } = usePortalConfig();\n  const portalContainer = resolveContainer();\n\n  return (\n    <Field\n      label={label}\n      hideLabel={hideLabel}\n      size={size}\n      disabled={disabled}\n      required={required}\n      errorText={errorText}\n      invalid={invalid}\n      description={description}\n      classNames={{\n        root: classNames?.root,\n        label: classNames?.label,\n        description: classNames?.description,\n        error: classNames?.error,\n      }}\n      data-slot=\"combobox-root\"\n    >\n      <BaseUICombobox.Root<T, Multiple>\n        items={items}\n        multiple={multiple}\n        disabled={disabled}\n        readOnly={readOnly}\n        {...props}\n      >\n        <div\n          className={clsx(styles[\"control\"], classNames?.control)}\n          data-size={size}\n          data-slot=\"combobox-control\"\n        >\n          <BaseUICombobox.InputGroup\n            className={clsx(styles[\"input-group\"], classNames?.inputGroup)}\n            data-slot=\"combobox-input-group\"\n          >\n            {startAdornment && (\n              <div\n                className={clsx(\n                  styles[\"start-adornment\"],\n                  classNames?.startAdornment,\n                )}\n                data-slot=\"combobox-start-adornment\"\n              >\n                {startAdornment}\n              </div>\n            )}\n\n            {multiple ? (\n              <BaseUICombobox.Chips\n                className={clsx(styles[\"chips\"], classNames?.chips)}\n                data-slot=\"combobox-chips\"\n              >\n                <BaseUICombobox.Value>\n                  {(selectedValues: ComboboxItem[]) => (\n                    <>\n                      {selectedValues.map(item => (\n                        <Chip\n                          item={item}\n                          classNames={{\n                            root: classNames?.chip,\n                            text: classNames?.chipText,\n                            remove: classNames?.chipRemove,\n                          }}\n                          key={item.id}\n                        />\n                      ))}\n                      <BaseUICombobox.Input\n                        className={clsx(styles[\"input\"], classNames?.input)}\n                        data-slot=\"combobox-input\"\n                        placeholder={\n                          selectedValues.length > 0 ? \"\" : placeholder\n                        }\n                      />\n                    </>\n                  )}\n                </BaseUICombobox.Value>\n              </BaseUICombobox.Chips>\n            ) : (\n              <BaseUICombobox.Input\n                className={clsx(styles[\"input\"], classNames?.input)}\n                data-slot=\"combobox-input\"\n                placeholder={placeholder}\n              />\n            )}\n\n            <div\n              className={clsx(\n                styles[\"action-buttons\"],\n                classNames?.actionButtons,\n              )}\n              data-slot=\"combobox-action-buttons\"\n            >\n              {clearable && (\n                <BaseUICombobox.Clear\n                  className={clsx(styles[\"clear\"], classNames?.clear)}\n                  data-slot=\"combobox-clear\"\n                  aria-label=\"Clear selection\"\n                  disabled={disabled}\n                >\n                  <Icon data={mdiClose} />\n                </BaseUICombobox.Clear>\n              )}\n\n              <BaseUICombobox.Trigger\n                className={clsx(styles[\"trigger\"], classNames?.trigger)}\n                data-slot=\"combobox-trigger\"\n                disabled={disabled}\n                aria-label=\"Open dropdown\"\n              >\n                <Icon data={mdiChevronDown} />\n              </BaseUICombobox.Trigger>\n\n              {endAdornment && (\n                <div\n                  className={clsx(\n                    styles[\"end-adornment\"],\n                    classNames?.endAdornment,\n                  )}\n                  data-slot=\"combobox-end-adornment\"\n                >\n                  {endAdornment}\n                </div>\n              )}\n            </div>\n          </BaseUICombobox.InputGroup>\n        </div>\n\n        <BaseUICombobox.Portal container={portalContainer}>\n          <BaseUICombobox.Positioner\n            className={clsx(styles[\"positioner\"], classNames?.positioner)}\n            data-slot=\"combobox-positioner\"\n            sideOffset={4}\n          >\n            <BaseUICombobox.Popup\n              className={clsx(styles[\"popup\"], classNames?.popup, {\n                [styles[\"full-width\"]!]: fullWidthContents,\n              })}\n              data-slot=\"combobox-popup\"\n            >\n              <BaseUICombobox.Empty>\n                <div\n                  className={clsx(styles[\"empty\"], classNames?.empty)}\n                  data-slot=\"combobox-empty\"\n                >\n                  No items found.\n                </div>\n              </BaseUICombobox.Empty>\n\n              <BaseUICombobox.List\n                className={clsx(styles[\"list\"], classNames?.list)}\n                data-slot=\"combobox-list\"\n              >\n                {(itemOrGroup: ComboboxItem | ComboboxGroup) => {\n                  if (\"items\" in itemOrGroup) {\n                    return (\n                      <BaseUICombobox.Group\n                        className={clsx(styles[\"group\"], classNames?.group)}\n                        key={itemOrGroup.label}\n                        items={itemOrGroup.items}\n                        data-slot=\"combobox-group\"\n                      >\n                        <BaseUICombobox.GroupLabel\n                          className={clsx(\n                            styles[\"group-label\"],\n                            classNames?.groupLabel,\n                          )}\n                          data-slot=\"combobox-group-label\"\n                        >\n                          {itemOrGroup.label}\n                        </BaseUICombobox.GroupLabel>\n                        <BaseUICombobox.Collection>\n                          {(item: ComboboxItem) => (\n                            <ItemRow\n                              className={classNames?.item}\n                              key={item.id}\n                              item={item}\n                            />\n                          )}\n                        </BaseUICombobox.Collection>\n                      </BaseUICombobox.Group>\n                    );\n                  }\n\n                  return (\n                    <ItemRow\n                      className={classNames?.item}\n                      key={itemOrGroup.id}\n                      item={itemOrGroup}\n                    />\n                  );\n                }}\n              </BaseUICombobox.List>\n            </BaseUICombobox.Popup>\n          </BaseUICombobox.Positioner>\n        </BaseUICombobox.Portal>\n      </BaseUICombobox.Root>\n    </Field>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"combobox.js","names":["Combobox","styles","BaseUICombobox"],"sources":["../../../src/atoms/combobox/combobox.tsx"],"sourcesContent":["import {\n  Combobox as BaseUICombobox,\n  type ComboboxRootProps,\n} from \"@base-ui/react/combobox\";\nimport { mdiChevronDown, mdiClose } from \"@mdi/js\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { usePortalConfig } from \"../../helpers/portal\";\nimport { Icon } from \"../icon\";\nimport styles from \"./combobox.module.css\";\nimport { Chip } from \"./components/chip\";\nimport { ItemRow, type ComboboxItem } from \"./components/item\";\n\n/**\n * Represents a group of items in the combobox.\n */\nexport interface ComboboxGroup {\n  /** The text label of the group */\n  label: string;\n  /** The items in the group */\n  items: ComboboxItem[];\n}\n\n/**\n * Props for the Combobox component.\n */\nexport type ComboboxProps<\n  T = string,\n  Multiple extends boolean | undefined = false,\n> = ComboboxRootProps<T, Multiple> & {\n  /**\n   * The size of the combobox.\n   * @default \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * Whether the combobox is in an invalid state.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * Whether the combobox is clearable when a value is selected.\n   * @default false\n   */\n  clearable?: boolean;\n  /**\n   * Whether the combobox is searchable.\n   * @default true\n   */\n  searchable?: boolean;\n  /**\n   * Whether the combobox contents should be full width.\n   * @default false\n   */\n  fullWidthContents?: boolean;\n  /**\n   * Additional CSS classes for styling.\n   */\n  classNames?: {\n    root?: string;\n    control?: string;\n    inputGroup?: string;\n    startAdornment?: string;\n    endAdornment?: string;\n    input?: string;\n    actionButtons?: string;\n    chips?: string;\n    chip?: string;\n    chipText?: string;\n    chipRemove?: string;\n    positioner?: string;\n    empty?: string;\n    list?: string;\n    group?: string;\n    item?: string;\n    groupLabel?: string;\n    trigger?: string;\n    clear?: string;\n    popup?: string;\n  };\n  /**\n   * Slot for element placed at the start of the input group.\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Slot for element placed at the end of the input group.\n   */\n  endAdornment?: React.ReactNode;\n  /**\n   * Placeholder text for the input.\n   */\n  placeholder?: string;\n};\n\n/**\n * A combobox component that combines an input with a list of selectable items.\n * Built on top of Base UI's combobox primitive with zero-runtime CSS styling.\n *\n * @example\n * ```tsx\n * <Combobox\n *   label=\"Favorite Fruit\"\n *   items={[\n *     { id: \"1\", label: \"Apple\", value: \"apple\" },\n *     { id: \"2\", label: \"Banana\", value: \"banana\" },\n *   ]}\n *   placeholder=\"Select a fruit\"\n * />\n * ```\n */\nexport const Combobox = <\n  T = string,\n  Multiple extends boolean | undefined = false,\n>({\n  fullWidthContents = false,\n  invalid = false,\n  clearable = false,\n  searchable = true,\n  size = \"md\",\n  readOnly = false,\n  disabled = false,\n  endAdornment,\n  startAdornment,\n  placeholder = \"Select an option\",\n  classNames,\n  items,\n  multiple,\n  ...props\n}: ComboboxProps<T, Multiple>) => {\n  const { resolveContainer } = usePortalConfig();\n  const portalContainer = resolveContainer();\n  return (\n    <div\n      data-slot=\"combobox-root\"\n      className={clsx(styles[\"root\"], classNames?.root)}\n    >\n      <BaseUICombobox.Root<T, Multiple>\n        items={items}\n        multiple={multiple}\n        disabled={disabled}\n        readOnly={readOnly}\n        {...props}\n      >\n        <div\n          className={clsx(styles[\"control\"], classNames?.control)}\n          data-size={size}\n          data-invalid={invalid || undefined}\n          data-slot=\"combobox-control\"\n        >\n          <BaseUICombobox.InputGroup\n            className={clsx(styles[\"input-group\"], classNames?.inputGroup)}\n            data-slot=\"combobox-input-group\"\n          >\n            {startAdornment && (\n              <div\n                className={clsx(\n                  styles[\"start-adornment\"],\n                  classNames?.startAdornment,\n                )}\n                data-slot=\"combobox-start-adornment\"\n              >\n                {startAdornment}\n              </div>\n            )}\n\n            {multiple ? (\n              <BaseUICombobox.Chips\n                className={clsx(styles[\"chips\"], classNames?.chips)}\n                data-slot=\"combobox-chips\"\n              >\n                <BaseUICombobox.Value>\n                  {(selectedValues: ComboboxItem[]) => (\n                    <>\n                      {selectedValues.map(item => (\n                        <Chip\n                          item={item}\n                          classNames={{\n                            root: classNames?.chip,\n                            text: classNames?.chipText,\n                            remove: classNames?.chipRemove,\n                          }}\n                          key={item.id}\n                        />\n                      ))}\n                      <BaseUICombobox.Input\n                        className={clsx(styles[\"input\"], classNames?.input)}\n                        data-slot=\"combobox-input\"\n                        placeholder={\n                          selectedValues.length > 0 ? \"\" : placeholder\n                        }\n                      />\n                    </>\n                  )}\n                </BaseUICombobox.Value>\n              </BaseUICombobox.Chips>\n            ) : (\n              <BaseUICombobox.Input\n                className={clsx(styles[\"input\"], classNames?.input)}\n                data-slot=\"combobox-input\"\n                placeholder={placeholder}\n              />\n            )}\n\n            <div\n              className={clsx(\n                styles[\"action-buttons\"],\n                classNames?.actionButtons,\n              )}\n              data-slot=\"combobox-action-buttons\"\n            >\n              {clearable && (\n                <BaseUICombobox.Clear\n                  className={clsx(styles[\"clear\"], classNames?.clear)}\n                  data-slot=\"combobox-clear\"\n                  aria-label=\"Clear selection\"\n                  disabled={disabled}\n                >\n                  <Icon data={mdiClose} />\n                </BaseUICombobox.Clear>\n              )}\n\n              <BaseUICombobox.Trigger\n                className={clsx(styles[\"trigger\"], classNames?.trigger)}\n                data-slot=\"combobox-trigger\"\n                disabled={disabled}\n                aria-label=\"Open dropdown\"\n              >\n                <Icon data={mdiChevronDown} />\n              </BaseUICombobox.Trigger>\n\n              {endAdornment && (\n                <div\n                  className={clsx(\n                    styles[\"end-adornment\"],\n                    classNames?.endAdornment,\n                  )}\n                  data-slot=\"combobox-end-adornment\"\n                >\n                  {endAdornment}\n                </div>\n              )}\n            </div>\n          </BaseUICombobox.InputGroup>\n        </div>\n\n        <BaseUICombobox.Portal container={portalContainer}>\n          <BaseUICombobox.Positioner\n            className={clsx(styles[\"positioner\"], classNames?.positioner)}\n            data-slot=\"combobox-positioner\"\n            sideOffset={4}\n          >\n            <BaseUICombobox.Popup\n              className={clsx(styles[\"popup\"], classNames?.popup, {\n                [styles[\"full-width\"]!]: fullWidthContents,\n              })}\n              data-slot=\"combobox-popup\"\n            >\n              <BaseUICombobox.Empty>\n                <div\n                  className={clsx(styles[\"empty\"], classNames?.empty)}\n                  data-slot=\"combobox-empty\"\n                >\n                  No items found.\n                </div>\n              </BaseUICombobox.Empty>\n\n              <BaseUICombobox.List\n                className={clsx(styles[\"list\"], classNames?.list)}\n                data-slot=\"combobox-list\"\n              >\n                {(itemOrGroup: ComboboxItem | ComboboxGroup) => {\n                  if (\"items\" in itemOrGroup) {\n                    return (\n                      <BaseUICombobox.Group\n                        className={clsx(styles[\"group\"], classNames?.group)}\n                        key={itemOrGroup.label}\n                        items={itemOrGroup.items}\n                        data-slot=\"combobox-group\"\n                      >\n                        <BaseUICombobox.GroupLabel\n                          className={clsx(\n                            styles[\"group-label\"],\n                            classNames?.groupLabel,\n                          )}\n                          data-slot=\"combobox-group-label\"\n                        >\n                          {itemOrGroup.label}\n                        </BaseUICombobox.GroupLabel>\n                        <BaseUICombobox.Collection>\n                          {(item: ComboboxItem) => (\n                            <ItemRow\n                              className={classNames?.item}\n                              key={item.id}\n                              item={item}\n                              size={size}\n                            />\n                          )}\n                        </BaseUICombobox.Collection>\n                      </BaseUICombobox.Group>\n                    );\n                  }\n\n                  return (\n                    <ItemRow\n                      className={classNames?.item}\n                      key={itemOrGroup.id}\n                      item={itemOrGroup}\n                      size={size}\n                    />\n                  );\n                }}\n              </BaseUICombobox.List>\n            </BaseUICombobox.Popup>\n          </BaseUICombobox.Positioner>\n        </BaseUICombobox.Portal>\n      </BaseUICombobox.Root>\n    </div>\n  );\n};\n"],"mappings":"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"}