@pantool/components 1.0.0-alpha.0

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

@@ -0,0 +1,115 @@
+import { FieldProps } from "../../internals/base-field/base-field.js";
+import { ComboboxItem } from "./components/item.js";
+import * as React from "react";
+import { ComboboxRootProps } from "@base-ui/react/combobox";
+
+//#region src/atoms/combobox/combobox.d.ts
+/**
+ * Represents a group of items in the combobox.
+ */
+interface ComboboxGroup {
+  /** The text label of the group */
+  label: string;
+  /** The items in the group */
+  items: ComboboxItem[];
+}
+/**
+ * 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> & {
+  /**
+   * Whether the combobox is clearable when a value is selected.
+   * @default false
+   */
+  clearable?: boolean;
+  /**
+   * Whether the combobox is searchable.
+   * @default true
+   */
+  searchable?: boolean;
+  /**
+   * Whether the combobox contents should be full width.
+   * @default false
+   */
+  fullWidthContents?: boolean;
+  /**
+   * Additional CSS classes for styling.
+   */
+  classNames?: {
+    root?: string;
+    label?: string;
+    description?: string;
+    error?: string;
+    control?: string;
+    inputGroup?: string;
+    startAdornment?: string;
+    endAdornment?: string;
+    input?: string;
+    actionButtons?: string;
+    chips?: string;
+    chip?: string;
+    chipText?: string;
+    chipRemove?: string;
+    positioner?: string;
+    empty?: string;
+    list?: string;
+    group?: string;
+    item?: string;
+    groupLabel?: string;
+    trigger?: string;
+    clear?: string;
+    popup?: string;
+  };
+  /**
+   * Slot for element placed at the start of the input group.
+   */
+  startAdornment?: React.ReactNode;
+  /**
+   * Slot for element placed at the end of the input group.
+   */
+  endAdornment?: React.ReactNode;
+  /**
+   * Placeholder text for the input.
+   */
+  placeholder?: string;
+};
+/**
+ * A combobox component that combines an input with a list of selectable items.
+ * Built on top of Base UI's combobox primitive with zero-runtime CSS styling.
+ *
+ * @example
+ * ```tsx
+ * <Combobox
+ *   label="Favorite Fruit"
+ *   items={[
+ *     { id: "1", label: "Apple", value: "apple" },
+ *     { id: "2", label: "Banana", value: "banana" },
+ *   ]}
+ *   placeholder="Select a fruit"
+ * />
+ * ```
+ */
+declare const Combobox$1: <T = string, Multiple extends boolean | undefined = false>({
+  label,
+  description,
+  fullWidthContents,
+  invalid,
+  errorText,
+  hideLabel,
+  clearable,
+  searchable,
+  required,
+  size,
+  readOnly,
+  disabled,
+  endAdornment,
+  startAdornment,
+  placeholder,
+  classNames,
+  items,
+  multiple,
+  ...props
+}: ComboboxProps<T, Multiple>) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Combobox$1 as Combobox, ComboboxGroup, ComboboxProps };
+//# sourceMappingURL=combobox.d.ts.map

package/dist/atoms/combobox/combobox.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{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};
+//# sourceMappingURL=combobox.js.map

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

@@ -0,0 +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":"smBAsHA,MAAaA,GAGX,CACA,QACA,cACA,oBAAoB,GACpB,UAAU,GACV,YACA,YAAY,GACZ,YAAY,GACZ,aAAa,GACb,WAAW,GACX,OAAO,KACP,WAAW,GACX,WAAW,GACX,eACA,iBACA,cAAc,mBACd,aACA,QACA,WACA,GAAG,KAC6B,CAChC,GAAM,CAAE,oBAAqB,EAAgB,EACvC,EAAkB,EAAiB,EAEzC,OACE,EAAC,EAAD,CACS,QACI,YACL,OACI,WACA,WACC,YACF,UACI,cACb,WAAY,CACV,KAAM,GAAY,KAClB,MAAO,GAAY,MACnB,YAAa,GAAY,YACzB,MAAO,GAAY,KACrB,EACA,YAAU,yBAEV,EAACC,EAAe,KAAhB,CACS,QACG,WACA,WACA,WACV,GAAI,WALN,CAOE,EAAC,MAAD,CACE,UAAW,EAAKC,EAAO,QAAY,GAAY,OAAO,EACtD,YAAW,EACX,YAAU,4BAEV,EAACD,EAAe,WAAhB,CACE,UAAW,EAAKC,EAAO,eAAgB,GAAY,UAAU,EAC7D,YAAU,gCAFZ,CAIG,GACC,EAAC,MAAD,CACE,UAAW,EACTA,EAAO,mBACP,GAAY,cACd,EACA,YAAU,oCAET,CACE,CAAA,EAGN,EACC,EAACD,EAAe,MAAhB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,0BAEV,EAACD,EAAe,MAAhB,CAAA,SACI,GACA,EAAA,EAAA,CAAA,SAAA,CACG,EAAe,IAAI,GAClB,EAAC,EAAD,CACQ,OACN,WAAY,CACV,KAAM,GAAY,KAClB,KAAM,GAAY,SAClB,OAAQ,GAAY,UACtB,CAED,EADM,EAAK,EACX,CACF,EACD,EAACA,EAAe,MAAhB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,iBACV,YACE,EAAe,OAAS,EAAI,GAAK,CAEpC,CAAA,CACD,CAAA,CAAA,CAEgB,CAAA,CACF,CAAA,EAEtB,EAACD,EAAe,MAAhB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,iBACG,aACd,CAAA,EAGH,EAAC,MAAD,CACE,UAAW,EACTA,EAAO,kBACP,GAAY,aACd,EACA,YAAU,mCALZ,CAOG,GACC,EAACD,EAAe,MAAhB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,iBACV,aAAW,kBACD,oBAEV,EAAC,EAAD,CAAM,KAAM,CAAW,CAAA,CACH,CAAA,EAGxB,EAACD,EAAe,QAAhB,CACE,UAAW,EAAKC,EAAO,QAAY,GAAY,OAAO,EACtD,YAAU,mBACA,WACV,aAAW,yBAEX,EAAC,EAAD,CAAM,KAAM,CAAiB,CAAA,CACP,CAAA,EAEvB,GACC,EAAC,MAAD,CACE,UAAW,EACTA,EAAO,iBACP,GAAY,YACd,EACA,YAAU,kCAET,CACE,CAAA,CAEJ,GACoB,GACxB,CAAA,EAEL,EAACD,EAAe,OAAhB,CAAuB,UAAW,WAChC,EAACA,EAAe,WAAhB,CACE,UAAW,EAAKC,EAAO,WAAe,GAAY,UAAU,EAC5D,YAAU,sBACV,WAAY,WAEZ,EAACD,EAAe,MAAhB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,MAAO,EACjDA,EAAO,eAAiB,CAC3B,CAAC,EACD,YAAU,0BAJZ,CAME,EAACD,EAAe,MAAhB,CAAA,SACE,EAAC,MAAD,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAClD,YAAU,0BACX,iBAEI,CAAA,CACe,CAAA,EAEtB,EAACD,EAAe,KAAhB,CACE,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,YAAU,yBAER,GACI,UAAW,EAEX,EAACD,EAAe,MAAhB,CACE,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,EAElD,MAAO,EAAY,MACnB,YAAU,0BAJZ,CAME,EAACD,EAAe,WAAhB,CACE,UAAW,EACTC,EAAO,eACP,GAAY,UACd,EACA,YAAU,gCAET,EAAY,KACY,CAAA,EAC3B,EAACD,EAAe,WAAhB,CAAA,SACI,GACA,EAAC,EAAD,CACE,UAAW,GAAY,KAEjB,MACP,EAFM,EAAK,EAEX,CAEsB,CAAA,CACP,GAtBf,EAAY,KAsBG,EAKxB,EAAC,EAAD,CACE,UAAW,GAAY,KAEvB,KAAM,CACP,EAFM,EAAY,EAElB,CAGc,CAAA,CACD,GACG,CAAA,CACN,CAAA,CACJ,GAChB,CAAA,CAEX"}

package/dist/atoms/combobox/combobox.module.js

@@ -0,0 +1,2 @@
+var e={"action-buttons":`KAWYaW_action-buttons`,chip:`KAWYaW_chip`,"chip-remove":`KAWYaW_chip-remove`,"chip-text":`KAWYaW_chip-text`,chips:`KAWYaW_chips`,clear:`KAWYaW_clear`,control:`KAWYaW_control`,empty:`KAWYaW_empty`,"end-adornment":`KAWYaW_end-adornment`,"full-width":`KAWYaW_full-width`,group:`KAWYaW_group`,"group-label":`KAWYaW_group-label`,input:`KAWYaW_input`,"input-group":`KAWYaW_input-group`,item:`KAWYaW_item`,"item-indicator":`KAWYaW_item-indicator`,"item-text":`KAWYaW_item-text`,list:`KAWYaW_list`,popup:`KAWYaW_popup`,positioner:`KAWYaW_positioner`,"start-adornment":`KAWYaW_start-adornment`,trigger:`KAWYaW_trigger`};export{e as default};
+//# sourceMappingURL=combobox.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"combobox.module.js","names":[],"sources":["../../../src/atoms/combobox/combobox.module.css"],"sourcesContent":[".control {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-xs);\n  position: relative;\n  width: 100%;\n}\n\n.start-adornment,\n.end-adornment {\n  display: flex;\n  align-items: center;\n  height: var(--field-control-icon-size);\n\n  & [data-slot=\"input-adornment-root\"] {\n    &[data-kind=\"icon\"] {\n      width: var(--adornment-icon-size);\n      height: var(--adornment-icon-size);\n      color: var(--field-label-color);\n    }\n    &[data-kind=\"button\"] {\n      width: var(--adornment-button-size);\n      height: var(--adornment-button-size);\n      color: var(--field-label-color);\n    }\n  }\n}\n\n.control[data-size=\"sm\"] {\n  --adornment-icon-size: 1rem;\n  --adornment-button-size: 1.5rem;\n  --input-group-gap: var(--spacing-xs);\n  --combobox-chip-size: 1rem;\n}\n.control[data-size=\"md\"] {\n  --adornment-icon-size: 1.5rem;\n  --adornment-button-size: 2rem;\n  --input-group-gap: var(--spacing-xs);\n  --combobox-chip-size: 1rem;\n}\n.control[data-size=\"lg\"] {\n  --adornment-icon-size: 2rem;\n  --adornment-button-size: 2.5rem;\n  --input-group-gap: var(--spacing-sm);\n  --combobox-chip-size: 1rem;\n}\n\n.input-group {\n  box-sizing: border-box;\n  position: relative;\n  flex: 1;\n  min-width: 12rem;\n  min-height: var(--field-control-height);\n  border: 1px solid var(--color-border-primary);\n  background-color: var(--color-surface-base);\n  border-radius: var(--field-control-radius);\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--input-group-gap);\n  padding: 0 var(--spacing-sm);\n  transition: border-color 0.2s ease-in-out;\n}\n\n.input-group:focus-within {\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.input {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  border: none;\n  border-radius: 0;\n  flex: 1;\n  min-width: 4rem;\n  height: calc(var(--field-control-height) - 2px);\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  background-color: transparent;\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 {\n  outline: none;\n}\n\n.chips {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--spacing-xs);\n  padding: var(--spacing-xxs) 0;\n  flex: 1;\n}\n\n.chip {\n  --combobox-chip-bg: var(--color-surface-secondary);\n  --combobox-chip-color: var(--color-content-brand-secondary);\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-xxs);\n  background-color: var(--combobox-chip-bg);\n  color: var(--combobox-chip-color);\n  border: 1px solid var(--combobox-chip-color);\n  padding: 0 var(--spacing-sm);\n  height: calc(var(--field-control-height) * 0.7);\n  border-radius: var(--radius-full);\n  font-size: var(--typography-caption-base-size);\n  outline: none;\n  cursor: default;\n}\n\n.chip[data-highlighted] {\n  background-color: var(--color-action-neutral-muted);\n}\n\n.chip-text {\n  white-space: nowrap;\n  color: var(--combobox-chip-color);\n}\n\n.chip-remove {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  color: var(--combobox-chip-color);\n  background-color: var(--combobox-chip-bg);\n  cursor: pointer;\n  border-radius: 50%;\n  transition: background-color 0.1s;\n  height: var(--combobox-chip-size);\n  width: var(--combobox-chip-size);\n}\n\n.chip-remove:hover {\n  --combobox-chip-bg: var(--color-surface-tertiary);\n}\n\n.action-buttons {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-xxs);\n  margin-left: auto;\n  padding-left: var(--spacing-sm);\n  height: 100%;\n}\n\n.trigger,\n.clear {\n  box-sizing: border-box;\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  border: none;\n  padding: 0;\n  background: none;\n  border-radius: var(--radius-full);\n  transition:\n    color 0.1s,\n    background-color 0.1s;\n}\n\n.trigger:hover,\n.clear:hover {\n  color: var(--color-content-neutral-base);\n  background-color: var(--color-surface-secondary);\n}\n\n.trigger:focus-visible,\n.clear: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.trigger[data-disabled],\n.clear[data-disabled] {\n  cursor: not-allowed;\n  user-select: none;\n}\n\n.positioner {\n  outline: 0;\n  z-index: var(--zindex-1);\n}\n\n.popup {\n  box-sizing: border-box;\n  background-color: var(--color-surface-base);\n  color: var(--color-content-neutral-base);\n  width: var(--anchor-width);\n  max-width: var(--available-width);\n  min-width: 12rem;\n  transition:\n    opacity 0.1s,\n    transform 0.1s;\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}\n\n.popup.full-width {\n  width: 100%;\n}\n\n.popup[data-starting-style],\n.popup[data-ending-style] {\n  opacity: 0;\n  transform: scale(0.95);\n}\n\n.list {\n  box-sizing: border-box;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  padding-block: var(--spacing-xs);\n  scroll-padding-block: var(--spacing-xs);\n  outline: 0;\n  max-height: min(22.5rem, var(--available-height));\n}\n\n.list[data-empty] {\n  padding: 0;\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  font-size: var(--field-control-font-size);\n  line-height: var(--field-control-line-height);\n  font-weight: var(--field-control-font-weight);\n  position: relative;\n  transition: background-color 0.1s;\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}\n\n.item-text {\n  grid-column-start: 2;\n}\n\n.empty {\n  box-sizing: border-box;\n  padding: var(--spacing-md);\n  font-size: var(--field-control-font-size);\n  color: var(--color-content-neutral-muted);\n  text-align: center;\n}\n"],"mappings":"AA4CA,IAAA,EAAa,CAAA,iBAAe,wBAAA,KAAA,cAAA,cAAA,qBAAA,YAAA,mBAAA,MAAA,eAAA,MAAA,eAAA,QAAA,iBAAA,MAAA,eAAA,gBAAA,uBAAA,aAAA,oBAAA,MAAA,eAAA,cAAA,qBAAA,MAAA,eAAA,cAAA,qBAAA,KAAA,cAAA,iBAAA,wBAAA,YAAA,mBAAA,KAAA,cAAA,MAAA,eAAA,WAAA,oBAAA,kBAAA,yBAAA,QAAA,gBAAA"}

package/dist/atoms/combobox/components/chip.js

@@ -0,0 +1,2 @@
+import{Text as e}from"../../text/text.js";import"../../text/index.js";import{Icon as t}from"../../icon/icon.js";import"../../icon/index.js";import n from"../combobox.module.js";import r from"clsx";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{mdiClose as o}from"@mdi/js";import{Combobox as s}from"@base-ui/react/combobox";function c({item:c,classNames:l}){return a(s.Chip,{"data-slot":`combobox-chip`,className:r(n.chip,l?.root),children:[i(e,{variant:`body2`,as:`span`,className:r(n[`chip-text`],l?.text),"data-slot":`combobox-chip-text`,children:c.label}),i(s.ChipRemove,{className:r(n[`chip-remove`],l?.remove),"data-slot":`combobox-chip-remove`,children:i(t,{data:o})})]},c.id)}export{c as Chip};
+//# sourceMappingURL=chip.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"chip.js","names":["BaseUICombobox","styles"],"sources":["../../../../src/atoms/combobox/components/chip.tsx"],"sourcesContent":["import { Combobox as BaseUICombobox } from \"@base-ui/react/combobox\";\nimport { Icon } from \"../../icon\";\nimport { mdiClose } from \"@mdi/js\";\nimport { Text } from \"../../text\";\nimport clsx from \"clsx\";\nimport styles from \"../combobox.module.css\";\nimport type { ComboboxItem } from \"./item\";\n\nexport function Chip({\n  item,\n  classNames,\n}: {\n  item: ComboboxItem<any>;\n  classNames?: {\n    root?: string;\n    text?: string;\n    remove?: string;\n  };\n}) {\n  return (\n    <BaseUICombobox.Chip\n      data-slot=\"combobox-chip\"\n      key={item.id}\n      className={clsx(styles[\"chip\"], classNames?.root)}\n    >\n      <Text\n        variant=\"body2\"\n        as=\"span\"\n        className={clsx(styles[\"chip-text\"], classNames?.text)}\n        data-slot=\"combobox-chip-text\"\n      >\n        {item.label}\n      </Text>\n      <BaseUICombobox.ChipRemove\n        className={clsx(styles[\"chip-remove\"], classNames?.remove)}\n        data-slot=\"combobox-chip-remove\"\n      >\n        <Icon data={mdiClose} />\n      </BaseUICombobox.ChipRemove>\n    </BaseUICombobox.Chip>\n  );\n}\n"],"mappings":"6UAQA,SAAgB,EAAK,CACnB,OACA,cAQC,CACD,OACE,EAACA,EAAe,KAAhB,CACE,YAAU,gBAEV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,WAHlD,CAKE,EAAC,EAAD,CACE,QAAQ,QACR,GAAG,OACH,UAAW,EAAKA,EAAO,aAAc,GAAY,IAAI,EACrD,YAAU,8BAET,EAAK,KACF,CAAA,EACN,EAACD,EAAe,WAAhB,CACE,UAAW,EAAKC,EAAO,eAAgB,GAAY,MAAM,EACzD,YAAU,gCAEV,EAAC,EAAD,CAAM,KAAM,CAAW,CAAA,CACE,CAAA,CACR,GAjBd,EAAK,EAiBS,CAEzB"}

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

@@ -0,0 +1,17 @@
+//#region src/atoms/combobox/components/item.d.ts
+/**
+ * Represents an item in the combobox.
+ */
+interface ComboboxItem<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 { ComboboxItem };
+//# sourceMappingURL=item.d.ts.map

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","names":["BaseUICombobox","styles"],"sources":["../../../../src/atoms/combobox/components/item.tsx"],"sourcesContent":["import { Combobox as BaseUICombobox } from \"@base-ui/react/combobox\";\nimport { Icon } from \"../../icon\";\nimport { mdiCheck } from \"@mdi/js\";\nimport { Text } from \"../../text\";\nimport clsx from \"clsx\";\nimport styles from \"../combobox.module.css\";\n\n/**\n * Represents an item in the combobox.\n */\nexport interface ComboboxItem<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  className,\n}: {\n  item: ComboboxItem<T>;\n  className?: string;\n}) {\n  return (\n    <BaseUICombobox.Item\n      value={item}\n      className={clsx(styles[\"item\"], className)}\n      data-slot=\"combobox-item\"\n      disabled={item.disabled}\n    >\n      <BaseUICombobox.ItemIndicator\n        className={styles[\"item-indicator\"]}\n        data-slot=\"combobox-item-indicator\"\n      >\n        <Icon data={mdiCheck} />\n      </BaseUICombobox.ItemIndicator>\n      <Text\n        as=\"span\"\n        variant=\"body1\"\n        className={styles[\"item-text\"]}\n        data-slot=\"combobox-item-text\"\n      >\n        {item.label}\n      </Text>\n    </BaseUICombobox.Item>\n  );\n}\n"],"mappings":"6UAqBA,SAAgB,EAAW,CACzB,OACA,aAIC,CACD,OACE,EAACA,EAAe,KAAhB,CACE,MAAO,EACP,UAAW,EAAKC,EAAO,KAAS,CAAS,EACzC,YAAU,gBACV,SAAU,EAAK,kBAJjB,CAME,EAACD,EAAe,cAAhB,CACE,UAAWC,EAAO,kBAClB,YAAU,mCAEV,EAAC,EAAD,CAAM,KAAM,CAAW,CAAA,CACK,CAAA,EAC9B,EAAC,EAAD,CACE,GAAG,OACH,QAAQ,QACR,UAAWA,EAAO,aAClB,YAAU,8BAET,EAAK,KACF,CAAA,CACa,GAEzB"}

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

@@ -0,0 +1 @@
+import { Combobox, ComboboxGroup, ComboboxProps } from "./combobox.js";

package/dist/atoms/combobox/index.js

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

package/dist/atoms/condition-guard/condition-guard.d.ts

@@ -0,0 +1,32 @@
+//#region src/atoms/condition-guard/condition-guard.d.ts
+type ConditionGuardProps = {
+  /**
+   * Boolean condition that determines whether to render children or fallback.
+   * When `true`, renders children; when `false`, renders fallback.
+   */
+  condition: boolean;
+  /**
+   * Content to render when the condition is `true`.
+   */
+  children: React.ReactNode;
+  /**
+   * Optional content to render when the condition is `false`.
+   * If not provided, renders `null` (nothing).
+   */
+  fallback?: React.ReactNode;
+};
+/**
+ * A conditional rendering component that displays children or fallback content
+ * based on a boolean condition.
+ *
+ * @example
+ * ```tsx
+ * <ConditionGuard condition={isLoggedIn} fallback={<LoginForm />}>
+ *   <Dashboard />
+ * </ConditionGuard>
+ * ```
+ */
+declare const ConditionGuard: React.FC<ConditionGuardProps>;
+//#endregion
+export { ConditionGuard, ConditionGuardProps };
+//# sourceMappingURL=condition-guard.d.ts.map

package/dist/atoms/condition-guard/condition-guard.js

@@ -0,0 +1,2 @@
+import{Fragment as e,jsx as t}from"react/jsx-runtime";const n=n=>{let{children:r,condition:i,fallback:a=null}=n;return i?t(e,{children:r}):t(e,{children:a})};export{n as ConditionGuard};
+//# sourceMappingURL=condition-guard.js.map

package/dist/atoms/condition-guard/condition-guard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"condition-guard.js","names":[],"sources":["../../../src/atoms/condition-guard/condition-guard.tsx"],"sourcesContent":["export type ConditionGuardProps = {\n  /**\n   * Boolean condition that determines whether to render children or fallback.\n   * When `true`, renders children; when `false`, renders fallback.\n   */\n  condition: boolean;\n\n  /**\n   * Content to render when the condition is `true`.\n   */\n  children: React.ReactNode;\n\n  /**\n   * Optional content to render when the condition is `false`.\n   * If not provided, renders `null` (nothing).\n   */\n  fallback?: React.ReactNode;\n};\n\n/**\n * A conditional rendering component that displays children or fallback content\n * based on a boolean condition.\n *\n * @example\n * ```tsx\n * <ConditionGuard condition={isLoggedIn} fallback={<LoginForm />}>\n *   <Dashboard />\n * </ConditionGuard>\n * ```\n */\nexport const ConditionGuard: React.FC<ConditionGuardProps> = (props) => {\n  const { children, condition, fallback = null } = props;\n\n  if (!condition) return <>{fallback}</>;\n\n  return <>{children}</>;\n};\n"],"mappings":"sDA8BA,MAAa,EAAiD,GAAU,CACtE,GAAM,CAAE,WAAU,YAAW,WAAW,MAAS,EAIjD,OAFK,EAEE,EAAA,EAAA,CAAG,UAAW,CAAA,EAFE,EAAA,EAAA,CAAA,SAAG,CAAW,CAAA,CAGvC"}

package/dist/atoms/condition-guard/index.js

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

package/dist/atoms/context-menu/context-menu.css

@@ -0,0 +1,75 @@
+.K6vv9G_popup {
+  box-sizing: border-box;
+  font-family: var(--typography-typeface-ltr);
+  padding-block: var(--spacing-xs);
+  border: 1px solid var(--color-border-primary);
+  border-radius: var(--spacing-xs);
+  background-color: var(--color-surface-base);
+  color: var(--color-content-neutral-base);
+  transform-origin: var(--transform-origin);
+  outline: none;
+  transition: transform .1s ease-out, opacity .1s ease-out;
+  box-shadow: 0 4px 16px #0000001a;
+
+  &[data-starting-style], &[data-ending-style] {
+    opacity: 0;
+    transform: scale(.98);
+  }
+}
+
+.K6vv9G_item {
+  font-family: var(--typography-typeface-ltr);
+  cursor: default;
+  user-select: none;
+  padding-block: var(--spacing-sm);
+  padding-inline: var(--spacing-md);
+  border-radius: var(--spacing-xxs);
+  color: var(--color-content-neutral-base);
+  outline: none;
+  justify-content: space-between;
+  font-size: .875rem;
+  line-height: 1.4;
+  display: flex;
+
+  &[data-highlighted] {
+    z-index: 0;
+    color: var(--color-on-brand);
+    position: relative;
+  }
+
+  &[data-highlighted]:before {
+    content: "";
+    inset: 0;
+    inset-inline: var(--spacing-xs);
+    z-index: -1;
+    border-radius: var(--spacing-xxs);
+    background-color: var(--color-action-brand-base);
+    position: absolute;
+  }
+
+  &[data-disabled] {
+    color: var(--color-content-neutral-muted);
+    pointer-events: none;
+  }
+}
+
+.K6vv9G_separator {
+  margin-block: var(--spacing-xs);
+  margin-inline: var(--spacing-sm);
+  background-color: var(--color-border-tertiary);
+  height: 1px;
+}
+
+.K6vv9G_group-label {
+  font-family: var(--typography-typeface-ltr);
+  padding-block: var(--spacing-xxs);
+  padding-inline: var(--spacing-md);
+  color: var(--color-content-neutral-tertiary);
+  font-size: .75rem;
+  font-weight: 600;
+}
+
+.K6vv9G_chevron {
+  width: 1rem;
+  height: 1rem;
+}

package/dist/atoms/context-menu/context-menu.d.ts

@@ -0,0 +1,41 @@
+//#region src/atoms/context-menu/context-menu.d.ts
+type MenuSeparator = {
+  type: "separator";
+};
+type MenuItem = {
+  type: "item";
+  label: string;
+  onSelect?: () => void;
+  disabled?: boolean;
+};
+type MenuGroup = {
+  type: "group";
+  label?: string;
+  items: MenuItem[];
+};
+type MenuSubmenu = {
+  type: "submenu";
+  label: string;
+  items: MenuEntry[];
+};
+type MenuEntry = MenuItem | MenuGroup | MenuSeparator | MenuSubmenu;
+type ClassNames = {
+  item?: string;
+  separator?: string;
+  groupLabel?: string;
+  popup?: string;
+  chevron?: string;
+};
+interface ContextMenuProps {
+  children: React.ReactNode;
+  items: MenuEntry[];
+  classNames?: ClassNames;
+}
+declare function ContextMenu({
+  children,
+  items,
+  classNames
+}: ContextMenuProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { ContextMenu };
+//# sourceMappingURL=context-menu.d.ts.map

package/dist/atoms/context-menu/context-menu.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"./context-menu.module.js";import r from"clsx";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{mdiChevronRight as o}from"@mdi/js";import{ContextMenu as s}from"@base-ui/react/context-menu";function c({children:c,items:l,classNames:u}){let{resolveContainer:d}=e(),f=d(),p=(e,c)=>e.map((e,l)=>e.type===`separator`?i(s.Separator,{"data-slot":`context-menu-separator`,className:r(n.separator,c?.separator)},l):e.type===`group`?a(`div`,{role:`group`,children:[e.label&&i(`div`,{role:`presentation`,"data-slot":`context-menu-group-label`,className:r(n[`group-label`],c?.groupLabel),children:e.label}),e.items.map((t,a)=>i(s.Item,{"data-slot":`context-menu-item`,className:r(n.item,c?.item),disabled:t.disabled,onClick:t.onSelect,children:e.label},`${l}-${a}`))]},l):e.type===`submenu`?a(s.SubmenuRoot,{children:[a(s.SubmenuTrigger,{"data-slot":`context-menu-item`,className:r(n.item,c?.item),children:[e.label,i(`span`,{"data-slot":`context-menu-chevron`,className:r(n.chevron,c?.chevron),children:i(t,{data:o})})]}),i(s.Portal,{container:f,children:i(s.Positioner,{alignOffset:-4,sideOffset:-4,children:i(s.Popup,{"data-slot":`context-menu-popup`,className:r(n.popup,c?.popup),children:p(e.items,c)})})})]},l):i(s.Item,{"data-slot":`context-menu-item`,className:r(n.item,c?.item),disabled:e.disabled,onClick:e.onSelect,children:e.label},l));return a(s.Root,{children:[i(s.Trigger,{children:c}),i(s.Portal,{container:f,children:i(s.Positioner,{children:i(s.Popup,{"data-slot":`context-menu-popup`,className:r(n.popup,u?.popup),children:p(l,u)})})})]})}export{c as ContextMenu};
+//# sourceMappingURL=context-menu.js.map

package/dist/atoms/context-menu/context-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.js","names":["ContextMenu","BaseContextMenu","styles"],"sources":["../../../src/atoms/context-menu/context-menu.tsx"],"sourcesContent":["import { ContextMenu as BaseContextMenu } from \"@base-ui/react/context-menu\";\nimport { mdiChevronRight } from \"@mdi/js\";\nimport clsx from \"clsx\";\nimport { usePortalConfig } from \"../../helpers/portal\";\nimport { Icon } from \"../icon\";\nimport styles from \"./context-menu.module.css\";\n\ntype MenuSeparator = { type: \"separator\" };\ntype MenuItem = {\n  type: \"item\";\n  label: string;\n  onSelect?: () => void;\n  disabled?: boolean;\n};\ntype MenuGroup = { type: \"group\"; label?: string; items: MenuItem[] };\ntype MenuSubmenu = { type: \"submenu\"; label: string; items: MenuEntry[] };\ntype MenuEntry = MenuItem | MenuGroup | MenuSeparator | MenuSubmenu;\n\ntype ClassNames = {\n  item?: string;\n  separator?: string;\n  groupLabel?: string;\n  popup?: string;\n  chevron?: string;\n};\n\ninterface ContextMenuProps {\n  children: React.ReactNode;\n  items: MenuEntry[];\n  classNames?: ClassNames;\n}\n\nexport function ContextMenu({ children, items, classNames }: ContextMenuProps) {\n  const { resolveContainer } = usePortalConfig();\n  const portalContainer = resolveContainer();\n\n  const renderEntries = (items: MenuEntry[], classNames?: ClassNames) => {\n    return items.map((entry, i) => {\n      if (entry.type === \"separator\")\n        return (\n          <BaseContextMenu.Separator\n            key={i}\n            data-slot=\"context-menu-separator\"\n            className={clsx(styles[\"separator\"], classNames?.separator)}\n          />\n        );\n\n      if (entry.type === \"group\")\n        return (\n          <div\n            key={i}\n            role=\"group\"\n          >\n            {entry.label && (\n              <div\n                role=\"presentation\"\n                data-slot=\"context-menu-group-label\"\n                className={clsx(styles[\"group-label\"], classNames?.groupLabel)}\n              >\n                {entry.label}\n              </div>\n            )}\n            {entry.items.map((item, j) => (\n              <BaseContextMenu.Item\n                key={`${i}-${j}`}\n                data-slot=\"context-menu-item\"\n                className={clsx(styles[\"item\"], classNames?.item)}\n                disabled={item.disabled}\n                onClick={item.onSelect}\n              >\n                {entry.label}\n              </BaseContextMenu.Item>\n            ))}\n          </div>\n        );\n\n      if (entry.type === \"submenu\")\n        return (\n          <BaseContextMenu.SubmenuRoot key={i}>\n            <BaseContextMenu.SubmenuTrigger\n              data-slot=\"context-menu-item\"\n              className={clsx(styles[\"item\"], classNames?.item)}\n            >\n              {entry.label}\n              <span\n                data-slot=\"context-menu-chevron\"\n                className={clsx(styles[\"chevron\"], classNames?.chevron)}\n              >\n                <Icon data={mdiChevronRight} />\n              </span>\n            </BaseContextMenu.SubmenuTrigger>\n            <BaseContextMenu.Portal container={portalContainer}>\n              <BaseContextMenu.Positioner\n                alignOffset={-4}\n                sideOffset={-4}\n              >\n                <BaseContextMenu.Popup\n                  data-slot=\"context-menu-popup\"\n                  className={clsx(styles[\"popup\"], classNames?.popup)}\n                >\n                  {renderEntries(entry.items, classNames)}\n                </BaseContextMenu.Popup>\n              </BaseContextMenu.Positioner>\n            </BaseContextMenu.Portal>\n          </BaseContextMenu.SubmenuRoot>\n        );\n\n      return (\n        <BaseContextMenu.Item\n          key={i}\n          data-slot=\"context-menu-item\"\n          className={clsx(styles[\"item\"], classNames?.item)}\n          disabled={entry.disabled}\n          onClick={entry.onSelect}\n        >\n          {entry.label}\n        </BaseContextMenu.Item>\n      );\n    });\n  };\n  return (\n    <BaseContextMenu.Root>\n      <BaseContextMenu.Trigger>{children}</BaseContextMenu.Trigger>\n      <BaseContextMenu.Portal container={portalContainer}>\n        <BaseContextMenu.Positioner>\n          <BaseContextMenu.Popup\n            data-slot=\"context-menu-popup\"\n            className={clsx(styles[\"popup\"], classNames?.popup)}\n          >\n            {renderEntries(items, classNames)}\n          </BaseContextMenu.Popup>\n        </BaseContextMenu.Positioner>\n      </BaseContextMenu.Portal>\n    </BaseContextMenu.Root>\n  );\n}\n"],"mappings":"gYAgCA,SAAgBA,EAAY,CAAE,WAAU,QAAO,cAAgC,CAC7E,GAAM,CAAE,oBAAqB,EAAgB,EACvC,EAAkB,EAAiB,EAEnC,GAAiB,EAAoB,IAClC,EAAM,KAAK,EAAO,IACnB,EAAM,OAAS,YAEf,EAACC,EAAgB,UAAjB,CAEE,YAAU,yBACV,UAAW,EAAKC,EAAO,UAAc,GAAY,SAAS,CAC3D,EAHM,CAGN,EAGD,EAAM,OAAS,QAEf,EAAC,MAAD,CAEE,KAAK,iBAFP,CAIG,EAAM,OACL,EAAC,MAAD,CACE,KAAK,eACL,YAAU,2BACV,UAAW,EAAKA,EAAO,eAAgB,GAAY,UAAU,WAE5D,EAAM,KACJ,CAAA,EAEN,EAAM,MAAM,KAAK,EAAM,IACtB,EAACD,EAAgB,KAAjB,CAEE,YAAU,oBACV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,SAAU,EAAK,SACf,QAAS,EAAK,kBAEb,EAAM,KACa,EAPf,GAAG,EAAE,GAAG,GAOO,CACvB,CACE,GAvBE,CAuBF,EAGL,EAAM,OAAS,UAEf,EAACD,EAAgB,YAAjB,CAAA,SAAA,CACE,EAACA,EAAgB,eAAjB,CACE,YAAU,oBACV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,WAFlD,CAIG,EAAM,MACP,EAAC,OAAD,CACE,YAAU,uBACV,UAAW,EAAKA,EAAO,QAAY,GAAY,OAAO,WAEtD,EAAC,EAAD,CAAM,KAAM,CAAkB,CAAA,CAC1B,CAAA,CACwB,IAChC,EAACD,EAAgB,OAAjB,CAAwB,UAAW,WACjC,EAACA,EAAgB,WAAjB,CACE,YAAa,GACb,WAAY,YAEZ,EAACA,EAAgB,MAAjB,CACE,YAAU,qBACV,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,WAEjD,EAAc,EAAM,MAAO,CAAU,CACjB,CAAA,CACG,CAAA,CACN,CAAA,CACG,CAAA,EA1BK,CA0BL,EAI/B,EAACD,EAAgB,KAAjB,CAEE,YAAU,oBACV,UAAW,EAAKC,EAAO,KAAS,GAAY,IAAI,EAChD,SAAU,EAAM,SAChB,QAAS,EAAM,kBAEd,EAAM,KACa,EAPf,CAOe,CAEzB,EAEH,OACE,EAACD,EAAgB,KAAjB,CAAA,SAAA,CACE,EAACA,EAAgB,QAAjB,CAA0B,UAAkC,CAAA,EAC5D,EAACA,EAAgB,OAAjB,CAAwB,UAAW,WACjC,EAACA,EAAgB,WAAjB,CAAA,SACE,EAACA,EAAgB,MAAjB,CACE,YAAU,qBACV,UAAW,EAAKC,EAAO,MAAU,GAAY,KAAK,WAEjD,EAAc,EAAO,CAAU,CACX,CAAA,CACG,CAAA,CACN,CAAA,CACJ,CAAA,CAAA,CAE1B"}

package/dist/atoms/context-menu/context-menu.module.js

@@ -0,0 +1,2 @@
+var e={chevron:`K6vv9G_chevron`,"group-label":`K6vv9G_group-label`,item:`K6vv9G_item`,popup:`K6vv9G_popup`,separator:`K6vv9G_separator`};export{e as default};
+//# sourceMappingURL=context-menu.module.js.map

package/dist/atoms/context-menu/context-menu.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.module.js","names":[],"sources":["../../../src/atoms/context-menu/context-menu.module.css"],"sourcesContent":[".popup {\n  box-sizing: border-box;\n  font-family: var(--typography-typeface-ltr);\n  outline: none;\n  padding-block: var(--spacing-xs);\n  border: 1px solid var(--color-border-primary);\n  border-radius: var(--spacing-xs);\n  background-color: var(--color-surface-base);\n  color: var(--color-content-neutral-base);\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);\n  transform-origin: var(--transform-origin);\n  transition:\n    transform 100ms ease-out,\n    opacity 100ms ease-out;\n\n  &[data-starting-style],\n  &[data-ending-style] {\n    opacity: 0;\n    transform: scale(0.98);\n  }\n}\n\n.item {\n  font-family: var(--typography-typeface-ltr);\n  outline: none;\n  cursor: default;\n  user-select: none;\n  padding-block: var(--spacing-sm);\n  padding-inline: var(--spacing-md);\n  display: flex;\n  justify-content: space-between;\n  font-size: 0.875rem;\n  line-height: 1.4;\n  border-radius: var(--spacing-xxs);\n  color: var(--color-content-neutral-base);\n\n  &[data-highlighted] {\n    position: relative;\n    z-index: 0;\n    color: var(--color-on-brand);\n  }\n\n  &[data-highlighted]::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    inset-inline: var(--spacing-xs);\n    z-index: -1;\n    border-radius: var(--spacing-xxs);\n    background-color: var(--color-action-brand-base);\n  }\n\n  &[data-disabled] {\n    color: var(--color-content-neutral-muted);\n    pointer-events: none;\n  }\n}\n\n.separator {\n  margin-block: var(--spacing-xs);\n  margin-inline: var(--spacing-sm);\n  height: 1px;\n  background-color: var(--color-border-tertiary);\n}\n\n.group-label {\n  font-family: var(--typography-typeface-ltr);\n  padding-block: var(--spacing-xxs);\n  padding-inline: var(--spacing-md);\n  font-size: 0.75rem;\n  font-weight: 600;\n  color: var(--color-content-neutral-tertiary);\n}\n\n.chevron {\n  width: 1rem;\n  height: 1rem;\n}\n"],"mappings":"AAUA,IAAA,EAAY,CAAA,QAAa,iBAAW,cAAO,qBAAA,KAAA,cAAA,MAAA,eAAA,UAAA,kBAAA"}

package/dist/atoms/context-menu/index.js

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

package/dist/atoms/dialog/dialog.d.ts

@@ -0,0 +1,7 @@
+import { BaseDialogProps } from "../../internals/base-dialog/base-dialog.js";
+//#region src/atoms/dialog/dialog.d.ts
+type DialogProps = Omit<BaseDialogProps, "as">;
+declare const Dialog: (props: DialogProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Dialog, DialogProps };
+//# sourceMappingURL=dialog.d.ts.map

package/dist/atoms/dialog/dialog.js

@@ -0,0 +1,2 @@
+import{BaseDialog as e}from"../../internals/base-dialog/base-dialog.js";import"../../internals/base-dialog/index.js";import{Dialog as t}from"@base-ui/react/dialog";import{jsx as n}from"react/jsx-runtime";const r=r=>n(e,{as:t,...r});export{r as Dialog};
+//# sourceMappingURL=dialog.js.map

package/dist/atoms/dialog/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.js","names":["Dialog","BaseUIDialog"],"sources":["../../../src/atoms/dialog/dialog.tsx"],"sourcesContent":["import { Dialog as BaseUIDialog } from \"@base-ui/react/dialog\";\nimport { BaseDialog, type BaseDialogProps } from \"../../internals/base-dialog\";\n\nexport type DialogProps = Omit<BaseDialogProps, \"as\">;\n\nexport const Dialog = (props: DialogProps) => {\n  return <BaseDialog as={BaseUIDialog} {...props} />;\n};\n"],"mappings":"4MAKA,MAAaA,EAAU,GACd,EAAC,EAAD,CAAY,GAAIC,EAAc,GAAI,CAAQ,CAAA"}

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

@@ -0,0 +1 @@
+import { Dialog, DialogProps } from "./dialog.js";

package/dist/atoms/dialog/index.js

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

package/dist/atoms/icon/icon.d.ts

@@ -0,0 +1,14 @@
+import { BaseSvgProps } from "../../internals/base-svg/base-svg.js";
+import * as React from "react";
+
+//#region src/atoms/icon/icon.d.ts
+interface IconProps extends Omit<BaseSvgProps, "children"> {
+  /**
+   * The SVG path string (`d` attribute value).
+   */
+  data: string;
+}
+declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
+//#endregion
+export { Icon, IconProps };
+//# sourceMappingURL=icon.d.ts.map

package/dist/atoms/icon/icon.js

@@ -0,0 +1,2 @@
+import{BaseSvg as e}from"../../internals/base-svg/base-svg.js";import"../../internals/base-svg/index.js";import*as t from"react";import{jsx as n}from"react/jsx-runtime";const r=t.forwardRef((t,r)=>{let{data:i,className:a,...o}=t;return n(e,{"data-slot":`icon`,ref:r,className:`${a||``}`.trim(),...o,children:n(`path`,{d:i})})});export{r as Icon};
+//# sourceMappingURL=icon.js.map

package/dist/atoms/icon/icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.js","names":[],"sources":["../../../src/atoms/icon/icon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { BaseSvg, type BaseSvgProps } from \"../../internals/base-svg\";\n\nexport interface IconProps extends Omit<BaseSvgProps, \"children\"> {\n  /**\n   * The SVG path string (`d` attribute value).\n   */\n  data: string;\n}\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>((props, ref) => {\n  const { data, className, ...otherProps } = props;\n\n  return (\n    <BaseSvg\n      data-slot=\"icon\"\n      ref={ref}\n      className={`${className || \"\"}`.trim()}\n      {...otherProps}\n    >\n      <path d={data} />\n    </BaseSvg>\n  );\n});\n"],"mappings":"yKAUA,MAAa,EAAO,EAAM,YAAsC,EAAO,IAAQ,CAC7E,GAAM,CAAE,OAAM,YAAW,GAAG,GAAe,EAE3C,OACE,EAAC,EAAD,CACE,YAAU,OACL,MACL,UAAW,GAAG,GAAa,KAAK,KAAK,EACrC,GAAI,WAEJ,EAAC,OAAD,CAAM,EAAG,CAAO,CAAA,CACT,CAAA,CAEb,CAAC"}

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

@@ -0,0 +1 @@
+import { Icon, IconProps } from "./icon.js";

package/dist/atoms/icon/index.js

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

package/dist/atoms/icon-button/icon-button.css

@@ -0,0 +1,12 @@
+.fESXeq_root {
+  width: var(--btn-height);
+  padding: 0;
+}
+
+.fESXeq_icon {
+  width: var(--btn-icon-size);
+  height: var(--btn-icon-size);
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}

package/dist/atoms/icon-button/icon-button.d.ts

@@ -0,0 +1,14 @@
+import { BaseButtonProps } from "../../internals/base-button/base-button.js";
+import * as React from "react";
+
+//#region src/atoms/icon-button/icon-button.d.ts
+interface IconButtonProps extends Omit<BaseButtonProps, "children"> {
+  /** The icon to render inside the button. */
+  icon: React.ReactNode;
+  /** Required accessible label for screen readers. */
+  label: string;
+}
+declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+//#endregion
+export { IconButton, IconButtonProps };
+//# sourceMappingURL=icon-button.d.ts.map

package/dist/atoms/icon-button/icon-button.js

@@ -0,0 +1,2 @@
+import{BaseButton as e}from"../../internals/base-button/base-button.js";import"../../internals/base-button/index.js";import t from"./icon-button.module.js";import*as n from"react";import{jsx as r}from"react/jsx-runtime";const i=n.forwardRef((n,i)=>{let{icon:a,label:o,className:s,...c}=n;return r(e,{ref:i,className:`${t.root} ${s||``}`.trim(),"aria-label":o,...c,children:r(`span`,{className:t.icon,children:a})})});export{i as IconButton};
+//# sourceMappingURL=icon-button.js.map

package/dist/atoms/icon-button/icon-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button.js","names":["styles"],"sources":["../../../src/atoms/icon-button/icon-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { BaseButton, type BaseButtonProps } from \"../../internals/base-button\";\nimport styles from \"./icon-button.module.css\";\n\nexport interface IconButtonProps extends Omit<BaseButtonProps, \"children\"> {\n  /** The icon to render inside the button. */\n  icon: React.ReactNode;\n  /** Required accessible label for screen readers. */\n  label: string;\n}\n\nexport const IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  (props, ref) => {\n    const { icon, label, className, ...rest } = props;\n\n    return (\n      <BaseButton\n        ref={ref}\n        className={`${styles[\"root\"]} ${className || \"\"}`.trim()}\n        aria-label={label}\n        {...rest}\n      >\n        <span className={styles[\"icon\"]}>{icon}</span>\n      </BaseButton>\n    );\n  },\n);\n"],"mappings":"4NAWA,MAAa,EAAa,EAAM,YAC7B,EAAO,IAAQ,CACd,GAAM,CAAE,OAAM,QAAO,YAAW,GAAG,GAAS,EAE5C,OACE,EAAC,EAAD,CACO,MACL,UAAW,GAAGA,EAAO,KAAQ,GAAG,GAAa,KAAK,KAAK,EACvD,aAAY,EACZ,GAAI,WAEJ,EAAC,OAAD,CAAM,UAAWA,EAAO,cAAU,CAAW,CAAA,CACnC,CAAA,CAEhB,CACF"}

package/dist/atoms/icon-button/icon-button.module.js

@@ -0,0 +1,2 @@
+var e={icon:`fESXeq_icon`,root:`fESXeq_root`};export{e as default};
+//# sourceMappingURL=icon-button.module.js.map

package/dist/atoms/icon-button/icon-button.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button.module.js","names":[],"sources":["../../../src/atoms/icon-button/icon-button.module.css"],"sourcesContent":[".root {\n  /* Override the default horizontal padding from BaseButton */\n  padding: 0;\n  /* Enforce a perfect square based on the height defined by BaseButton's size */\n  width: var(--btn-height);\n}\n\n.icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  /* Icon sizing relative to text */\n  width: var(--btn-icon-size);\n  height: var(--btn-icon-size);\n}\n"],"mappings":""}

package/dist/atoms/icon-button/index.d.ts

@@ -0,0 +1 @@
+import { IconButton, IconButtonProps } from "./icon-button.js";

package/dist/atoms/icon-button/index.js

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

package/dist/atoms/index.d.ts

@@ -0,0 +1,17 @@
+import { AlertDialog, AlertDialogProps } from "./alert-dialog/alert-dialog.js";
+import { Button, ButtonProps } from "./button/button.js";
+import { Checkbox, CheckboxProps } from "./checkbox/checkbox.js";
+import { Combobox, ComboboxGroup, ComboboxProps } from "./combobox/combobox.js";
+import { ContextMenu } from "./context-menu/context-menu.js";
+import { Dialog, DialogProps } from "./dialog/dialog.js";
+import { Icon, IconProps } from "./icon/icon.js";
+import { IconButton, IconButtonProps } from "./icon-button/icon-button.js";
+import { Input, InputProps } from "./input/input.js";
+import { Radio, RadioGroup, RadioGroupProps, RadioProps } from "./radio/radio.js";
+import { Switch, SwitchProps } from "./switch/switch.js";
+import { Tabs, TabsList, TabsListProps, TabsPanel, TabsPanelProps, TabsTab, TabsTabProps } from "./tabs/tabs.js";
+import { TabsListState, TabsPanelState, TabsRootChangeEventDetails, TabsRootState, TabsTabState, TabsTabValue } from "./tabs/index.js";
+import { Text, TextColor, TextProps, TextVariant } from "./text/text.js";
+import { Toast, ToastData, ToastProps } from "./toast/toast.js";
+import { Tooltip, TooltipProps, TooltipProvider, TooltipProviderProps } from "./tooltip/tooltip.js";
+import { ConditionGuard, ConditionGuardProps } from "./condition-guard/condition-guard.js";

package/dist/atoms/index.js

@@ -0,0 +1 @@
+import"./button/button.js";import"./button/index.js";import"./text/text.js";import"./text/index.js";import"./alert-dialog/alert-dialog.js";import"./alert-dialog/index.js";import"./icon/icon.js";import"./icon/index.js";import"./checkbox/checkbox.js";import"./checkbox/index.js";import"./combobox/combobox.js";import"./combobox/index.js";import"./context-menu/context-menu.js";import"./context-menu/index.js";import"./dialog/dialog.js";import"./dialog/index.js";import"./icon-button/icon-button.js";import"./icon-button/index.js";import"./input/input.js";import"./input/index.js";import"./radio/radio.js";import"./radio/index.js";import"./switch/switch.js";import"./switch/index.js";import"./tabs/tabs.js";import"./tabs/index.js";import"./toast/toast.js";import"./toast/index.js";import"./tooltip/tooltip.js";import"./tooltip/index.js";import"./condition-guard/condition-guard.js";import"./condition-guard/index.js";

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

@@ -0,0 +1 @@
+import { Input, InputProps } from "./input.js";

package/dist/atoms/input/index.js

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

package/dist/atoms/input/input.css

@@ -0,0 +1,29 @@
+.uLevqq_control {
+  box-sizing: border-box;
+  padding: 0 var(--spacing-sm);
+  border-radius: var(--field-control-radius);
+  border: 1px solid var(--field-control-border-color);
+  width: 100%;
+  height: var(--field-control-height);
+  font-family: inherit;
+  font-size: var(--field-control-font-size, var(--typography-body-2-size));
+  line-height: var(--field-control-line-height, var(--typography-body-2-height));
+  font-weight: var(--field-control-font-weight, var(--typography-body-2-weight));
+  background-color: var(--field-control-bg-color);
+  color: var(--field-control-text-color);
+  font-family: var(--typography-typeface-ltr);
+  margin: 0;
+  transition: border-color .2s ease-in-out;
+
+  &::placeholder {
+    color: var(--field-control-placeholder-color);
+    font-family: var(--typography-typeface-ltr);
+  }
+
+  &:focus-visible {
+    outline-style: solid;
+    outline-width: var(--stroke-focus-ring);
+    outline-color: var(--color-action-info-base);
+    outline-offset: var(--spacing-xxs);
+  }
+}