@mage-ui/components 1.0.63 → 1.0.64

package/dist/components/buttons/button-icon/ButtonIcon.d.mts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime0 from "react/jsx-runtime";
-import { ComponentProps } from "react";
+import { ComponentPropsWithoutRef } from "react";
 
 //#region src/components/buttons/button-icon/ButtonIcon.d.ts
-type ButtonIconProps = ComponentProps<'button'> & {
+type ButtonIconProps = ComponentPropsWithoutRef<'button'> & {
   name: string;
   path: string;
   label: string;
@@ -20,9 +20,8 @@ declare const ButtonIcon: ({
   label,
   name,
   path,
-  onClick,
-  disabled,
-  classNames
+  classNames,
+  ...props
 }: ButtonIconProps) => react_jsx_runtime0.JSX.Element;
 //#endregion
 export { ButtonIcon, ButtonIconProps };

package/dist/components/buttons/button-icon/ButtonIcon.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonIcon.d.mts","names":[],"sources":["../../../../src/components/buttons/button-icon/ButtonIcon.tsx"],"mappings":";;;;KAcY,eAAA,GAAkB,cAAA;EAC5B,IAAA;EACA,IAAA;EACA,KAAA;EACA,UAAA;IACE,UAAA;IACA,IAAA;IACA,IAAA;IACA,OAAA;MACE,OAAA;MACA,IAAA;IAAA;EAAA;AAAA;AAAA,cAKO,UAAA;EAAc,KAAA;EAAA,IAAA;EAAA,IAAA;EAAA,OAAA;EAAA,QAAA;EAAA;AAAA,GAOxB,eAAA,KAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"ButtonIcon.d.mts","names":[],"sources":["../../../../src/components/buttons/button-icon/ButtonIcon.tsx"],"mappings":";;;;KAcY,eAAA,GAAkB,wBAAA;EAC5B,IAAA;EACA,IAAA;EACA,KAAA;EACA,UAAA;IACE,UAAA;IACA,IAAA;IACA,IAAA;IACA,OAAA;MACE,OAAA;MACA,IAAA;IAAA;EAAA;AAAA;AAAA,cAKO,UAAA;EAAc,KAAA;EAAA,IAAA;EAAA,IAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAMxB,eAAA,KAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/buttons/button-icon/ButtonIcon.mjs

@@ -1,2 +1,2 @@
-import{VisuallyHidden as e}from"../../misc/visually-hidden/VisuallyHidden.mjs";import{IconRaw as t}from"../../data-display/icons/icon-raw/IconRaw.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{buttonIcon as r,buttonIconIcon as i,buttonIconIconRaw as a,buttonIconIconRawRoot as o,buttonIconRoot as s}from"@mage-ui/styled-system/recipes";import{ActionIcon as c}from"@mantine/core";import{jsx as l,jsxs as u}from"react/jsx-runtime";const d=({label:d,name:f,path:p,onClick:m,disabled:h,classNames:g})=>u(c,{classNames:{root:n(g?.buttonIcon??r(),g?.root??s()),icon:g?.icon??i()},onClick:m,disabled:h,children:[l(t,{path:p,name:f,classNames:{iconRaw:g?.iconRaw?.iconRaw??a(),root:g?.iconRaw?.root??o()}}),l(e,{children:d})]});export{d as ButtonIcon};
+import{VisuallyHidden as e}from"../../misc/visually-hidden/VisuallyHidden.mjs";import{IconRaw as t}from"../../data-display/icons/icon-raw/IconRaw.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{buttonIcon as r,buttonIconIcon as i,buttonIconIconRaw as a,buttonIconIconRawRoot as o,buttonIconRoot as s}from"@mage-ui/styled-system/recipes";import{ActionIcon as c}from"@mantine/core";import{jsx as l,jsxs as u}from"react/jsx-runtime";const d=({label:d,name:f,path:p,classNames:m,...h})=>u(c,{classNames:{root:n(m?.buttonIcon??r(),m?.root??s()),icon:m?.icon??i()},...h,children:[l(t,{path:p,name:f,classNames:{iconRaw:m?.iconRaw?.iconRaw??a(),root:m?.iconRaw?.root??o()}}),l(e,{children:d})]});export{d as ButtonIcon};
 //# sourceMappingURL=ButtonIcon.mjs.map

package/dist/components/buttons/button-icon/ButtonIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonIcon.mjs","names":["VisuallyHidden"],"sources":["../../../../src/components/buttons/button-icon/ButtonIcon.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  buttonIcon,\n  buttonIconIcon,\n  buttonIconIconRaw,\n  buttonIconIconRawRoot,\n  buttonIconRoot,\n} from '@mage-ui/styled-system/recipes';\nimport { ActionIcon } from '@mantine/core';\nimport { IconRaw } from '@/components/data-display';\nimport { VisuallyHidden } from '@/components/misc';\n\nexport type ButtonIconProps = ComponentProps<'button'> & {\n  name: string;\n  path: string;\n  label: string;\n  classNames?: {\n    buttonIcon?: string;\n    root?: string;\n    icon?: string;\n    iconRaw?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n};\n\nexport const ButtonIcon = ({\n  label,\n  name,\n  path,\n  onClick,\n  disabled,\n  classNames,\n}: ButtonIconProps) => {\n  return (\n    <ActionIcon\n      classNames={{\n        root: cx(\n          classNames?.buttonIcon ?? buttonIcon(),\n          classNames?.root ?? buttonIconRoot(),\n        ),\n        icon: classNames?.icon ?? buttonIconIcon(),\n      }}\n      onClick={onClick}\n      disabled={disabled}\n    >\n      <IconRaw\n        path={path}\n        name={name}\n        classNames={{\n          iconRaw: classNames?.iconRaw?.iconRaw ?? buttonIconIconRaw(),\n          root: classNames?.iconRaw?.root ?? buttonIconIconRawRoot(),\n        }}\n      />\n      <VisuallyHidden>{label}</VisuallyHidden>\n    </ActionIcon>\n  );\n};\n"],"mappings":"0bA6BA,MAAa,GAAc,CACzB,QACA,OACA,OACA,UACA,WACA,gBAGE,EAAC,EAAA,CACC,WAAY,CACV,KAAM,EACJ,GAAY,YAAc,GAAY,CACtC,GAAY,MAAQ,GAAgB,CACrC,CACD,KAAM,GAAY,MAAQ,GAAgB,CAC3C,CACQ,UACC,qBAEV,EAAC,EAAA,CACO,OACA,OACN,WAAY,CACV,QAAS,GAAY,SAAS,SAAW,GAAmB,CAC5D,KAAM,GAAY,SAAS,MAAQ,GAAuB,CAC3D,EACD,CACF,EAACA,EAAAA,CAAAA,SAAgB,EAAA,CAAuB,CAAA,EAC7B"}
+{"version":3,"file":"ButtonIcon.mjs","names":["VisuallyHidden"],"sources":["../../../../src/components/buttons/button-icon/ButtonIcon.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  buttonIcon,\n  buttonIconIcon,\n  buttonIconIconRaw,\n  buttonIconIconRawRoot,\n  buttonIconRoot,\n} from '@mage-ui/styled-system/recipes';\nimport { ActionIcon } from '@mantine/core';\nimport { IconRaw } from '@/components/data-display';\nimport { VisuallyHidden } from '@/components/misc';\n\nexport type ButtonIconProps = ComponentPropsWithoutRef<'button'> & {\n  name: string;\n  path: string;\n  label: string;\n  classNames?: {\n    buttonIcon?: string;\n    root?: string;\n    icon?: string;\n    iconRaw?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n};\n\nexport const ButtonIcon = ({\n  label,\n  name,\n  path,\n  classNames,\n  ...props\n}: ButtonIconProps) => {\n  return (\n    <ActionIcon\n      classNames={{\n        root: cx(\n          classNames?.buttonIcon ?? buttonIcon(),\n          classNames?.root ?? buttonIconRoot(),\n        ),\n        icon: classNames?.icon ?? buttonIconIcon(),\n      }}\n      {...props}\n    >\n      <IconRaw\n        path={path}\n        name={name}\n        classNames={{\n          iconRaw: classNames?.iconRaw?.iconRaw ?? buttonIconIconRaw(),\n          root: classNames?.iconRaw?.root ?? buttonIconIconRawRoot(),\n        }}\n      />\n      <VisuallyHidden>{label}</VisuallyHidden>\n    </ActionIcon>\n  );\n};\n"],"mappings":"0bA6BA,MAAa,GAAc,CACzB,QACA,OACA,OACA,aACA,GAAG,KAGD,EAAC,EAAA,CACC,WAAY,CACV,KAAM,EACJ,GAAY,YAAc,GAAY,CACtC,GAAY,MAAQ,GAAgB,CACrC,CACD,KAAM,GAAY,MAAQ,GAAgB,CAC3C,CACD,GAAI,YAEJ,EAAC,EAAA,CACO,OACA,OACN,WAAY,CACV,QAAS,GAAY,SAAS,SAAW,GAAmB,CAC5D,KAAM,GAAY,SAAS,MAAQ,GAAuB,CAC3D,EACD,CACF,EAACA,EAAAA,CAAAA,SAAgB,EAAA,CAAuB,CAAA,EAC7B"}

package/dist/components/controls/dropdown/Dropdown.d.mts

@@ -1,63 +1,15 @@
-import { ComboboxStore } from "@mantine/core";
+import { ScrollAreaAutosizeProps } from "../../misc/scroll-area-autosize/ScrollAreaAutosize.mjs";
+import "../../misc/index.mjs";
+import { DropdownValue } from "./DropdownContextProvider.mjs";
+import "@mantine/core";
 import "react/jsx-runtime";
 import { ReactNode } from "react";
 
 //#region src/components/controls/dropdown/Dropdown.d.ts
-type DefaultEndSlotClassNames = {
-  chevron?: {
-    iconWrapped?: string;
-    root?: string;
-    open?: {
-      iconRaw?: string;
-      root?: string;
-    };
-    close?: {
-      iconRaw?: string;
-      root?: string;
-    };
-  };
-  clearButton?: {
-    buttonIcon?: string;
-    root?: string;
-    icon?: string;
-    iconRaw?: {
-      iconRaw?: string;
-      root?: string;
-    };
-  };
-};
-type DropdownTextInputClassNames = {
-  textInput?: string;
-  root?: string;
-  label?: string;
-  description?: string;
-  error?: string;
-  wrapper?: string;
-  input?: string;
-  section?: string;
-  required?: string;
-  endSlot?: DefaultEndSlotClassNames;
-};
 type DropdownProps = {
-  onChange: (event: ComboboxStore, value?: string) => void;
-  onFocus: (event: ComboboxStore) => void;
-  onBlur: (event: ComboboxStore) => void;
-  onClick: (event: ComboboxStore) => void;
   children: ReactNode;
-  startSlot?: ReactNode;
-  endSlot?: ReactNode;
-  readOnly?: boolean;
-  name?: string;
-  label?: ReactNode;
-  description?: ReactNode;
-  error?: ReactNode;
-  disabled?: boolean;
-  placeholder?: string;
   withinPortal?: boolean;
   keepMounted?: boolean;
-  clearable?: boolean;
-  chevron?: boolean;
-  offset?: number;
   classNames?: {
     dropdown?: string;
     root?: string;
@@ -65,19 +17,17 @@ type DropdownProps = {
     option?: string;
     empty?: string;
     search?: string;
-    textInput?: DropdownTextInputClassNames;
-    scrollArea?: {
-      scrollArea?: string;
+  };
+  target: ReactNode;
+  options: DropdownValue[];
+  scrollAreaProps?: Partial<Omit<ScrollAreaAutosizeProps, 'children' | 'classNames'>> & {
+    classNames?: Omit<NonNullable<ScrollAreaAutosizeProps['classNames']>, 'scrollArea'> & {
+      dropdownScrollAreaAutosize?: string;
     };
   };
-  value?: string;
-  search?: string;
-  setValue: (value: string | undefined, combobox: ComboboxStore) => void;
-  store?: ComboboxStore;
-  target?: ReactNode;
-  btnClearLabel?: string;
   dropdownHeight?: number | string;
+  shouldFilter?: boolean;
 };
 //#endregion
-export { DropdownProps, DropdownTextInputClassNames };
+export { DropdownProps };
 //# sourceMappingURL=Dropdown.d.mts.map

package/dist/components/controls/dropdown/Dropdown.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/Dropdown.tsx"],"mappings":";;;;;KAuCY,wBAAA;EACV,OAAA;IACE,WAAA;IACA,IAAA;IACA,IAAA;MACE,OAAA;MACA,IAAA;IAAA;IAEF,KAAA;MACE,OAAA;MACA,IAAA;IAAA;EAAA;EAGJ,WAAA;IACE,UAAA;IACA,IAAA;IACA,IAAA;IACA,OAAA;MACE,OAAA;MACA,IAAA;IAAA;EAAA;AAAA;AAAA,KAKM,2BAAA;EACV,SAAA;EACA,IAAA;EACA,KAAA;EACA,WAAA;EACA,KAAA;EACA,OAAA;EACA,KAAA;EACA,OAAA;EACA,QAAA;EACA,OAAA,GAAU,wBAAA;AAAA;AAAA,KAGA,aAAA;EACV,QAAA,GAAW,KAAA,EAAO,aAAA,EAAe,KAAA;EACjC,OAAA,GAAU,KAAA,EAAO,aAAA;EACjB,MAAA,GAAS,KAAA,EAAO,aAAA;EAChB,OAAA,GAAU,KAAA,EAAO,aAAA;EACjB,QAAA,EAAU,SAAA;EACV,SAAA,GAAY,SAAA;EACZ,OAAA,GAAU,SAAA;EACV,QAAA;EACA,IAAA;EACA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,QAAA;EACA,WAAA;EACA,YAAA;EACA,WAAA;EACA,SAAA;EACA,OAAA;EACA,MAAA;EACA,UAAA;IACE,QAAA;IACA,IAAA;IACA,OAAA;IACA,MAAA;IACA,KAAA;IACA,MAAA;IACA,SAAA,GAAY,2BAAA;IACZ,UAAA;MACE,UAAA;IAAA;EAAA;EAGJ,KAAA;EACA,MAAA;EACA,QAAA,GAAW,KAAA,sBAA2B,QAAA,EAAU,aAAA;EAChD,KAAA,GAAQ,aAAA;EACR,MAAA,GAAS,SAAA;EACT,aAAA;EACA,cAAA;AAAA"}
+{"version":3,"file":"Dropdown.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/Dropdown.tsx"],"mappings":";;;;;;;;KAoBY,aAAA;EACV,QAAA,EAAU,SAAA;EACV,YAAA;EACA,WAAA;EACA,UAAA;IACE,QAAA;IACA,IAAA;IACA,OAAA;IACA,MAAA;IACA,KAAA;IACA,MAAA;EAAA;EAEF,MAAA,EAAQ,SAAA;EACR,OAAA,EAAS,aAAA;EACT,eAAA,GAAkB,OAAA,CAChB,IAAA,CAAK,uBAAA;IAEL,UAAA,GAAa,IAAA,CACX,WAAA,CAAY,uBAAA;MAGZ,0BAAA;IAAA;EAAA;EAGJ,cAAA;EACA,YAAA;AAAA"}

package/dist/components/controls/dropdown/Dropdown.mjs

@@ -1,2 +1,2 @@
-import{ScrollAreaAutosize as e}from"../../misc/scroll-area-autosize/ScrollAreaAutosize.mjs";import{TextInput as t}from"../text-input/TextInput.mjs";import{Chevron as n}from"../utils/chevron/Chevron.mjs";import{ClearButton as r}from"../utils/clear-button/ClearButton.mjs";import{cx as i}from"@mage-ui/styled-system/css";import{dropdown as a,dropdownChevron as o,dropdownChevronIcon as s,dropdownChevronIconRoot as c,dropdownChevronRoot as l,dropdownClearButton as u,dropdownClearButtonIcon as d,dropdownClearButtonIconRaw as f,dropdownClearButtonIconRawRoot as p,dropdownClearButtonRoot as m,dropdownEmpty as h,dropdownOption as g,dropdownOptions as _,dropdownRoot as v,dropdownScrollAreaAutosize as y,dropdownTextInput as b,dropdownTextInputDescription as x,dropdownTextInputError as S,dropdownTextInputInput as C,dropdownTextInputLabel as w,dropdownTextInputRequired as T,dropdownTextInputRoot as E,dropdownTextInputSection as D,dropdownTextInputWrapper as O}from"@mage-ui/styled-system/recipes";import{Combobox as k,useCombobox as A}from"@mantine/core";import{Fragment as j,jsx as M,jsxs as N}from"react/jsx-runtime";function P({clearable:e,chevron:t,value:i,setValue:a,combobox:h,classNames:g,btnClearLabel:_=`Clear selection`}){return M(j,{children:e&&(i??``)!==``?M(r,{onClick:()=>{a(void 0,h),h.resetSelectedOption()},label:_,name:`mage-clear-button-x`,classNames:{buttonIcon:g?.clearButton?.buttonIcon??u(),root:g?.clearButton?.root??m(),icon:g?.clearButton?.icon??d(),iconRaw:{iconRaw:g?.clearButton?.iconRaw?.iconRaw??f(),root:g?.clearButton?.iconRaw?.root??p()}}}):t&&M(n,{chevronOpen:`mage-dropdown-chevron-down`,chevronClose:`mage-dropdown-chevron-up`,classNames:{iconWrapped:g?.chevron?.iconWrapped??o(),root:g?.chevron?.root??l(),open:{iconRaw:g?.chevron?.open?.iconRaw??s(),root:g?.chevron?.open?.root??c()},close:{iconRaw:g?.chevron?.close?.iconRaw??s(),root:g?.chevron?.close?.root??c({invert:!0})}}})})}function F({onChange:n,onBlur:r,onFocus:o,onClick:s,disabled:c,children:l,startSlot:u,endSlot:d,readOnly:f,label:p,placeholder:m,name:j,description:F,error:I,classNames:L,withinPortal:R,keepMounted:z,clearable:B,chevron:V,offset:H,value:U,search:W,setValue:G,store:K,target:q,btnClearLabel:J,dropdownHeight:Y=192}){let X=K??A({scrollBehavior:`smooth`,onDropdownClose:()=>X.resetSelectedOption()}),Z=(U??``)===``?`none`:`auto`,Q={};return B&&(Q[`--dropdown-text-input-right-section-pointer-events`]=Z),N(k,{width:`target`,store:X,withinPortal:R,keepMounted:z,offset:H||8,onOptionSubmit:e=>{G(e,X)},classNames:{dropdown:i(L?.dropdown??a(),L?.root??v()),options:L?.options??_(),option:L?.option??g(),empty:L?.empty??h(),search:L?.search},children:[M(k.Target,{children:q||M(t,{readOnly:f??!1,value:W??U??``,startSlot:u,endSlot:d??M(P,{clearable:B,chevron:V,value:U,setValue:G,combobox:X,btnClearLabel:J??`Clear selection`,classNames:L?.textInput?.endSlot}),onClick:e=>{s(X)},onChange:e=>{e.stopPropagation(),n(X,e.currentTarget?.value)},onFocus:e=>{o(X)},onBlur:e=>{r(X),e.stopPropagation()},label:p,placeholder:m,description:F,name:j,error:I,disabled:c,classNames:{root:L?.textInput?.root??E(),textInput:L?.textInput?.textInput??b(),label:L?.textInput?.label??w(),description:L?.textInput?.description??x(),error:L?.textInput?.error??S(),wrapper:L?.textInput?.wrapper??O(),input:L?.textInput?.input??C(),section:L?.textInput?.section??D(),required:L?.textInput?.required??T()},style:Q})}),M(k.Dropdown,{children:M(e,{type:`scroll`,mah:Y,classNames:{scrollArea:L?.scrollArea?.scrollArea??y()},children:l})})]})}F.Options=k.Options,F.Options.displayName=`Dropdown.Options`,F.Option=k.Option,F.Option.displayName=`Dropdown.Option`,F.Empty=k.Empty,F.Empty.displayName=`Dropdown.Empty`,F.Search=k.Search,F.Search.displayName=`Dropdown.Search`,F.EventsTarget=k.EventsTarget,F.EventsTarget.displayName=`Dropdown.EventsTarget`;export{F as Dropdown};
+import{ScrollAreaAutosize as e}from"../../misc/scroll-area-autosize/ScrollAreaAutosize.mjs";import{DropdownContextProvider as t,useDropdownContext as n}from"./DropdownContextProvider.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dropdown as i,dropdownEmpty as a,dropdownOption as o,dropdownOptions as s,dropdownRoot as c,dropdownScrollAreaAutosize as l}from"@mage-ui/styled-system/recipes";import{Combobox as u}from"@mantine/core";import{jsx as d,jsxs as f}from"react/jsx-runtime";const p=({children:t,classNames:p,target:m,scrollAreaProps:h,dropdownHeight:g=192,..._})=>{let{store:v,setValue:y}=n();return f(u,{width:`target`,store:v,withinPortal:!0,keepMounted:!1,onOptionSubmit:e=>{y(e)},classNames:{dropdown:r(p?.dropdown??i(),p?.root??c()),options:p?.options??s(),option:p?.option??o(),empty:p?.empty??a(),search:p?.search},..._,children:[d(u.Target,{children:m}),d(u.Dropdown,{children:d(e,{type:`scroll`,mah:g,classNames:{scrollArea:h?.classNames?.dropdownScrollAreaAutosize??l()},...h,children:t})})]})};function m({options:e,shouldFilter:n=!0,...r}){return d(t,{options:e,shouldFilter:n,children:d(p,{...r})})}m.Options=u.Options,m.Options.displayName=`Dropdown.Options`,m.Option=u.Option,m.Option.displayName=`Dropdown.Option`,m.Empty=u.Empty,m.Empty.displayName=`Dropdown.Empty`,m.Search=u.Search,m.Search.displayName=`Dropdown.Search`,m.EventsTarget=u.EventsTarget,m.EventsTarget.displayName=`Dropdown.EventsTarget`;export{m as Dropdown};
 //# sourceMappingURL=Dropdown.mjs.map

package/dist/components/controls/dropdown/Dropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.mjs","names":["MantineCombobox","TextInput"],"sources":["../../../../src/components/controls/dropdown/Dropdown.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dropdown,\n  dropdownChevron,\n  dropdownChevronIcon,\n  dropdownChevronIconRoot,\n  dropdownChevronRoot,\n  dropdownClearButton,\n  dropdownClearButtonIcon,\n  dropdownClearButtonIconRaw,\n  dropdownClearButtonIconRawRoot,\n  dropdownClearButtonRoot,\n  dropdownEmpty,\n  dropdownOption,\n  dropdownOptions,\n  dropdownRoot,\n  dropdownScrollAreaAutosize,\n  dropdownTextInput,\n  dropdownTextInputDescription,\n  dropdownTextInputError,\n  dropdownTextInputInput,\n  dropdownTextInputLabel,\n  dropdownTextInputRequired,\n  dropdownTextInputRoot,\n  dropdownTextInputSection,\n  dropdownTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  type ComboboxStore,\n  Combobox as MantineCombobox,\n  useCombobox,\n} from '@mantine/core';\n\nimport { ScrollAreaAutosize } from '../../misc';\nimport { TextInput } from '../text-input/TextInput';\nimport { Chevron, ClearButton } from '../utils';\n\nexport type DefaultEndSlotClassNames = {\n  chevron?: {\n    iconWrapped?: string;\n    root?: string;\n    open?: {\n      iconRaw?: string;\n      root?: string;\n    };\n    close?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n  clearButton?: {\n    buttonIcon?: string;\n    root?: string;\n    icon?: string;\n    iconRaw?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n};\n\nexport type DropdownTextInputClassNames = {\n  textInput?: string;\n  root?: string;\n  label?: string;\n  description?: string;\n  error?: string;\n  wrapper?: string;\n  input?: string;\n  section?: string;\n  required?: string;\n  endSlot?: DefaultEndSlotClassNames;\n};\n\nexport type DropdownProps = {\n  onChange: (event: ComboboxStore, value?: string) => void;\n  onFocus: (event: ComboboxStore) => void;\n  onBlur: (event: ComboboxStore) => void;\n  onClick: (event: ComboboxStore) => void;\n  children: ReactNode;\n  startSlot?: ReactNode;\n  endSlot?: ReactNode;\n  readOnly?: boolean;\n  name?: string;\n  label?: ReactNode;\n  description?: ReactNode;\n  error?: ReactNode;\n  disabled?: boolean;\n  placeholder?: string;\n  withinPortal?: boolean;\n  keepMounted?: boolean;\n  clearable?: boolean;\n  chevron?: boolean;\n  offset?: number;\n  classNames?: {\n    dropdown?: string;\n    root?: string;\n    options?: string;\n    option?: string;\n    empty?: string;\n    search?: string;\n    textInput?: DropdownTextInputClassNames;\n    scrollArea?: {\n      scrollArea?: string;\n    };\n  };\n  value?: string;\n  search?: string;\n  setValue: (value: string | undefined, combobox: ComboboxStore) => void;\n  store?: ComboboxStore;\n  target?: ReactNode;\n  btnClearLabel?: string;\n  dropdownHeight?: number | string;\n};\n\nexport type DefaultEndSlotProps = {\n  clearable?: boolean;\n  chevron?: boolean;\n  value?: string;\n  setValue: (val: string | undefined, combobox: ComboboxStore) => void;\n  combobox: ComboboxStore;\n  classNames?: DefaultEndSlotClassNames;\n  btnClearLabel: string;\n};\n\nfunction DefaultEndSlot({\n  clearable,\n  chevron,\n  value,\n  setValue,\n  combobox,\n  classNames,\n  btnClearLabel = 'Clear selection',\n}: DefaultEndSlotProps) {\n  const showClearable = clearable && (value ?? '') !== '';\n  return (\n    <>\n      {showClearable ? (\n        <ClearButton\n          onClick={() => {\n            setValue(undefined, combobox);\n            combobox.resetSelectedOption();\n          }}\n          label={btnClearLabel}\n          name='mage-clear-button-x'\n          classNames={{\n            buttonIcon:\n              classNames?.clearButton?.buttonIcon ?? dropdownClearButton(),\n            root: classNames?.clearButton?.root ?? dropdownClearButtonRoot(),\n            icon: classNames?.clearButton?.icon ?? dropdownClearButtonIcon(),\n            iconRaw: {\n              iconRaw:\n                classNames?.clearButton?.iconRaw?.iconRaw ??\n                dropdownClearButtonIconRaw(),\n              root:\n                classNames?.clearButton?.iconRaw?.root ??\n                dropdownClearButtonIconRawRoot(),\n            },\n          }}\n        />\n      ) : (\n        chevron && (\n          <Chevron\n            chevronOpen='mage-dropdown-chevron-down'\n            chevronClose='mage-dropdown-chevron-up'\n            classNames={{\n              iconWrapped:\n                classNames?.chevron?.iconWrapped ?? dropdownChevron(),\n              root: classNames?.chevron?.root ?? dropdownChevronRoot(),\n              open: {\n                iconRaw:\n                  classNames?.chevron?.open?.iconRaw ?? dropdownChevronIcon(),\n                root:\n                  classNames?.chevron?.open?.root ?? dropdownChevronIconRoot(),\n              },\n              close: {\n                iconRaw:\n                  classNames?.chevron?.close?.iconRaw ?? dropdownChevronIcon(),\n                root:\n                  classNames?.chevron?.close?.root ??\n                  dropdownChevronIconRoot({ invert: true }),\n              },\n            }}\n          />\n        )\n      )}\n    </>\n  );\n}\n\nexport function Dropdown({\n  onChange,\n  onBlur,\n  onFocus,\n  onClick,\n  disabled,\n  children,\n  startSlot,\n  endSlot,\n  readOnly,\n  label,\n  placeholder,\n  name,\n  description,\n  error,\n  classNames,\n  withinPortal,\n  keepMounted,\n  clearable,\n  chevron,\n  offset,\n  value,\n  search,\n  setValue,\n  store,\n  target,\n  btnClearLabel,\n  dropdownHeight = 192,\n}: DropdownProps) {\n  const combobox =\n    store ??\n    useCombobox({\n      scrollBehavior: 'smooth',\n      onDropdownClose: () => combobox.resetSelectedOption(),\n    });\n  const clearablePointerEvents = (value ?? '') !== '' ? 'auto' : 'none';\n  const style: Record<string, string> = {};\n  if (clearable) {\n    style['--dropdown-text-input-right-section-pointer-events' as string] =\n      clearablePointerEvents;\n  }\n  return (\n    <MantineCombobox\n      width='target'\n      store={combobox}\n      withinPortal={withinPortal}\n      keepMounted={keepMounted}\n      offset={offset || 8}\n      onOptionSubmit={(option) => {\n        setValue(option, combobox);\n      }}\n      classNames={{\n        dropdown: cx(\n          classNames?.dropdown ?? dropdown(),\n          classNames?.root ?? dropdownRoot(),\n        ),\n        options: classNames?.options ?? dropdownOptions(),\n        option: classNames?.option ?? dropdownOption(),\n        empty: classNames?.empty ?? dropdownEmpty(),\n        search: classNames?.search,\n      }}\n    >\n      <MantineCombobox.Target>\n        {target ? (\n          target\n        ) : (\n          <TextInput\n            readOnly={readOnly ?? false}\n            value={search ?? value ?? ''}\n            startSlot={startSlot}\n            endSlot={\n              endSlot ?? (\n                <DefaultEndSlot\n                  clearable={clearable}\n                  chevron={chevron}\n                  value={value}\n                  setValue={setValue}\n                  combobox={combobox}\n                  btnClearLabel={btnClearLabel ?? 'Clear selection'}\n                  classNames={classNames?.textInput?.endSlot}\n                />\n              )\n            }\n            onClick={(e) => {\n              onClick(combobox);\n              // e.stopPropagation();\n            }}\n            onChange={(e) => {\n              e.stopPropagation();\n              onChange(combobox, e.currentTarget?.value);\n            }}\n            onFocus={(e) => {\n              onFocus(combobox);\n              // e.stopPropagation();\n            }}\n            onBlur={(e) => {\n              onBlur(combobox);\n              e.stopPropagation();\n            }}\n            label={label}\n            placeholder={placeholder}\n            description={description}\n            name={name}\n            error={error}\n            disabled={disabled}\n            classNames={{\n              root: classNames?.textInput?.root ?? dropdownTextInputRoot(),\n              textInput:\n                classNames?.textInput?.textInput ?? dropdownTextInput(),\n              label: classNames?.textInput?.label ?? dropdownTextInputLabel(),\n              description:\n                classNames?.textInput?.description ??\n                dropdownTextInputDescription(),\n              error: classNames?.textInput?.error ?? dropdownTextInputError(),\n              wrapper:\n                classNames?.textInput?.wrapper ?? dropdownTextInputWrapper(),\n              input: classNames?.textInput?.input ?? dropdownTextInputInput(),\n              section:\n                classNames?.textInput?.section ?? dropdownTextInputSection(),\n              required:\n                classNames?.textInput?.required ?? dropdownTextInputRequired(),\n            }}\n            style={style}\n          />\n        )}\n      </MantineCombobox.Target>\n      <MantineCombobox.Dropdown>\n        <ScrollAreaAutosize\n          type='scroll'\n          mah={dropdownHeight}\n          classNames={{\n            scrollArea:\n              classNames?.scrollArea?.scrollArea ??\n              dropdownScrollAreaAutosize(),\n          }}\n        >\n          {children}\n        </ScrollAreaAutosize>\n      </MantineCombobox.Dropdown>\n    </MantineCombobox>\n  );\n}\n\nDropdown.Options = MantineCombobox.Options;\nDropdown.Options.displayName = 'Dropdown.Options';\nDropdown.Option = MantineCombobox.Option;\nDropdown.Option.displayName = 'Dropdown.Option';\nDropdown.Empty = MantineCombobox.Empty;\nDropdown.Empty.displayName = 'Dropdown.Empty';\nDropdown.Search = MantineCombobox.Search;\nDropdown.Search.displayName = 'Dropdown.Search';\nDropdown.EventsTarget = MantineCombobox.EventsTarget;\nDropdown.EventsTarget.displayName = 'Dropdown.EventsTarget';\n"],"mappings":"+lCA+HA,SAAS,EAAe,CACtB,YACA,UACA,QACA,WACA,WACA,aACA,gBAAgB,mBACM,CAEtB,OACE,EAAA,EAAA,CAAA,SAFoB,IAAc,GAAS,MAAQ,GAI/C,EAAC,EAAA,CACC,YAAe,CACb,EAAS,IAAA,GAAW,EAAS,CAC7B,EAAS,qBAAqB,EAEhC,MAAO,EACP,KAAK,sBACL,WAAY,CACV,WACE,GAAY,aAAa,YAAc,GAAqB,CAC9D,KAAM,GAAY,aAAa,MAAQ,GAAyB,CAChE,KAAM,GAAY,aAAa,MAAQ,GAAyB,CAChE,QAAS,CACP,QACE,GAAY,aAAa,SAAS,SAClC,GAA4B,CAC9B,KACE,GAAY,aAAa,SAAS,MAClC,GAAgC,CACnC,CACF,EACD,CAEF,GACE,EAAC,EAAA,CACC,YAAY,6BACZ,aAAa,2BACb,WAAY,CACV,YACE,GAAY,SAAS,aAAe,GAAiB,CACvD,KAAM,GAAY,SAAS,MAAQ,GAAqB,CACxD,KAAM,CACJ,QACE,GAAY,SAAS,MAAM,SAAW,GAAqB,CAC7D,KACE,GAAY,SAAS,MAAM,MAAQ,GAAyB,CAC/D,CACD,MAAO,CACL,QACE,GAAY,SAAS,OAAO,SAAW,GAAqB,CAC9D,KACE,GAAY,SAAS,OAAO,MAC5B,EAAwB,CAAE,OAAQ,GAAM,CAAC,CAC5C,CACF,EACD,CAAA,CAGL,CAIP,SAAgB,EAAS,CACvB,WACA,SACA,UACA,UACA,WACA,WACA,YACA,UACA,WACA,QACA,cACA,OACA,cACA,QACA,aACA,eACA,cACA,YACA,UACA,SACA,QACA,SACA,WACA,QACA,SACA,gBACA,iBAAiB,KACD,CAChB,IAAM,EACJ,GACA,EAAY,CACV,eAAgB,SAChB,oBAAuB,EAAS,qBAAqB,CACtD,CAAC,CACE,GAA0B,GAAS,MAAQ,GAAc,OAAT,OAChD,EAAgC,EAAE,CAKxC,OAJI,IACF,EAAM,sDACJ,GAGF,EAACA,EAAAA,CACC,MAAM,SACN,MAAO,EACO,eACD,cACb,OAAQ,GAAU,EAClB,eAAiB,GAAW,CAC1B,EAAS,EAAQ,EAAS,EAE5B,WAAY,CACV,SAAU,EACR,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CACnC,CACD,QAAS,GAAY,SAAW,GAAiB,CACjD,OAAQ,GAAY,QAAU,GAAgB,CAC9C,MAAO,GAAY,OAAS,GAAe,CAC3C,OAAQ,GAAY,OACrB,WAED,EAACA,EAAgB,OAAA,CAAA,SACd,GAGC,EAACC,EAAAA,CACC,SAAU,GAAY,GACtB,MAAO,GAAU,GAAS,GACf,YACX,QACE,GACE,EAAC,EAAA,CACY,YACF,UACF,QACG,WACA,WACV,cAAe,GAAiB,kBAChC,WAAY,GAAY,WAAW,SACnC,CAGN,QAAU,GAAM,CACd,EAAQ,EAAS,EAGnB,SAAW,GAAM,CACf,EAAE,iBAAiB,CACnB,EAAS,EAAU,EAAE,eAAe,MAAM,EAE5C,QAAU,GAAM,CACd,EAAQ,EAAS,EAGnB,OAAS,GAAM,CACb,EAAO,EAAS,CAChB,EAAE,iBAAiB,EAEd,QACM,cACA,cACP,OACC,QACG,WACV,WAAY,CACV,KAAM,GAAY,WAAW,MAAQ,GAAuB,CAC5D,UACE,GAAY,WAAW,WAAa,GAAmB,CACzD,MAAO,GAAY,WAAW,OAAS,GAAwB,CAC/D,YACE,GAAY,WAAW,aACvB,GAA8B,CAChC,MAAO,GAAY,WAAW,OAAS,GAAwB,CAC/D,QACE,GAAY,WAAW,SAAW,GAA0B,CAC9D,MAAO,GAAY,WAAW,OAAS,GAAwB,CAC/D,QACE,GAAY,WAAW,SAAW,GAA0B,CAC9D,SACE,GAAY,WAAW,UAAY,GAA2B,CACjE,CACM,SACP,CAAA,CAEmB,CACzB,EAACD,EAAgB,SAAA,CAAA,SACf,EAAC,EAAA,CACC,KAAK,SACL,IAAK,EACL,WAAY,CACV,WACE,GAAY,YAAY,YACxB,GAA4B,CAC/B,CAEA,YACkB,CAAA,CACI,CAAA,EACX,CAItB,EAAS,QAAUA,EAAgB,QACnC,EAAS,QAAQ,YAAc,mBAC/B,EAAS,OAASA,EAAgB,OAClC,EAAS,OAAO,YAAc,kBAC9B,EAAS,MAAQA,EAAgB,MACjC,EAAS,MAAM,YAAc,iBAC7B,EAAS,OAASA,EAAgB,OAClC,EAAS,OAAO,YAAc,kBAC9B,EAAS,aAAeA,EAAgB,aACxC,EAAS,aAAa,YAAc"}
+{"version":3,"file":"Dropdown.mjs","names":["MantineCombobox"],"sources":["../../../../src/components/controls/dropdown/Dropdown.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dropdown,\n  dropdownEmpty,\n  dropdownOption,\n  dropdownOptions,\n  dropdownRoot,\n  dropdownScrollAreaAutosize,\n} from '@mage-ui/styled-system/recipes';\nimport { Combobox as MantineCombobox } from '@mantine/core';\n\nimport { ScrollAreaAutosize, type ScrollAreaAutosizeProps } from '../../misc';\nimport {\n  DropdownContextProvider,\n  type DropdownValue,\n  useDropdownContext,\n} from './DropdownContextProvider';\n\nexport type DropdownProps = {\n  children: ReactNode;\n  withinPortal?: boolean;\n  keepMounted?: boolean;\n  classNames?: {\n    dropdown?: string;\n    root?: string;\n    options?: string;\n    option?: string;\n    empty?: string;\n    search?: string;\n  };\n  target: ReactNode;\n  options: DropdownValue[];\n  scrollAreaProps?: Partial<\n    Omit<ScrollAreaAutosizeProps, 'children' | 'classNames'>\n  > & {\n    classNames?: Omit<\n      NonNullable<ScrollAreaAutosizeProps['classNames']>,\n      'scrollArea'\n    > & {\n      dropdownScrollAreaAutosize?: string;\n    };\n  };\n  dropdownHeight?: number | string;\n  shouldFilter?: boolean;\n};\n\nconst DropdownContent = ({\n  children,\n  classNames,\n  target,\n  scrollAreaProps,\n  dropdownHeight = 192,\n  ...props\n}: Omit<DropdownProps, 'options'>) => {\n  const { store, setValue } = useDropdownContext();\n\n  return (\n    <MantineCombobox\n      width='target'\n      store={store}\n      withinPortal={true}\n      keepMounted={false}\n      onOptionSubmit={(option) => {\n        setValue(option);\n      }}\n      classNames={{\n        dropdown: cx(\n          classNames?.dropdown ?? dropdown(),\n          classNames?.root ?? dropdownRoot(),\n        ),\n        options: classNames?.options ?? dropdownOptions(),\n        option: classNames?.option ?? dropdownOption(),\n        empty: classNames?.empty ?? dropdownEmpty(),\n        search: classNames?.search,\n      }}\n      {...props}\n    >\n      <MantineCombobox.Target>{target}</MantineCombobox.Target>\n      <MantineCombobox.Dropdown>\n        <ScrollAreaAutosize\n          type='scroll'\n          mah={dropdownHeight}\n          classNames={{\n            scrollArea:\n              scrollAreaProps?.classNames?.dropdownScrollAreaAutosize ??\n              dropdownScrollAreaAutosize(),\n          }}\n          {...scrollAreaProps}\n        >\n          {children}\n        </ScrollAreaAutosize>\n      </MantineCombobox.Dropdown>\n    </MantineCombobox>\n  );\n};\n\nexport function Dropdown({\n  options,\n  shouldFilter = true,\n  ...props\n}: DropdownProps) {\n  return (\n    <DropdownContextProvider options={options} shouldFilter={shouldFilter}>\n      <DropdownContent {...props} />\n    </DropdownContextProvider>\n  );\n}\n\nDropdown.Options = MantineCombobox.Options;\nDropdown.Options.displayName = 'Dropdown.Options';\nDropdown.Option = MantineCombobox.Option;\nDropdown.Option.displayName = 'Dropdown.Option';\nDropdown.Empty = MantineCombobox.Empty;\nDropdown.Empty.displayName = 'Dropdown.Empty';\nDropdown.Search = MantineCombobox.Search;\nDropdown.Search.displayName = 'Dropdown.Search';\nDropdown.EventsTarget = MantineCombobox.EventsTarget;\nDropdown.EventsTarget.displayName = 'Dropdown.EventsTarget';\n"],"mappings":"+eAgDA,MAAM,GAAmB,CACvB,WACA,aACA,SACA,kBACA,iBAAiB,IACjB,GAAG,KACiC,CACpC,GAAM,CAAE,QAAO,YAAa,GAAoB,CAEhD,OACE,EAACA,EAAAA,CACC,MAAM,SACC,QACP,aAAc,GACd,YAAa,GACb,eAAiB,GAAW,CAC1B,EAAS,EAAO,EAElB,WAAY,CACV,SAAU,EACR,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CACnC,CACD,QAAS,GAAY,SAAW,GAAiB,CACjD,OAAQ,GAAY,QAAU,GAAgB,CAC9C,MAAO,GAAY,OAAS,GAAe,CAC3C,OAAQ,GAAY,OACrB,CACD,GAAI,YAEJ,EAACA,EAAgB,OAAA,CAAA,SAAQ,EAAA,CAAgC,CACzD,EAACA,EAAgB,SAAA,CAAA,SACf,EAAC,EAAA,CACC,KAAK,SACL,IAAK,EACL,WAAY,CACV,WACE,GAAiB,YAAY,4BAC7B,GAA4B,CAC/B,CACD,GAAI,EAEH,YACkB,CAAA,CACI,CAAA,EACX,EAItB,SAAgB,EAAS,CACvB,UACA,eAAe,GACf,GAAG,GACa,CAChB,OACE,EAAC,EAAA,CAAiC,UAAuB,wBACvD,EAAC,EAAA,CAAgB,GAAI,EAAA,CAAS,EACN,CAI9B,EAAS,QAAUA,EAAgB,QACnC,EAAS,QAAQ,YAAc,mBAC/B,EAAS,OAASA,EAAgB,OAClC,EAAS,OAAO,YAAc,kBAC9B,EAAS,MAAQA,EAAgB,MACjC,EAAS,MAAM,YAAc,iBAC7B,EAAS,OAASA,EAAgB,OAClC,EAAS,OAAO,YAAc,kBAC9B,EAAS,aAAeA,EAAgB,aACxC,EAAS,aAAa,YAAc"}

package/dist/components/controls/dropdown/DropdownChevron.d.mts

@@ -0,0 +1,23 @@
+import "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/DropdownChevron.d.ts
+type DropdownChevronProps = {
+  chevronOpen?: string;
+  chevronClose?: string;
+  path?: string;
+  classNames?: {
+    chevron?: string;
+    root?: string;
+    open?: {
+      iconRaw?: string;
+      root?: string;
+    };
+    close?: {
+      iconRaw?: string;
+      root?: string;
+    };
+  };
+};
+//#endregion
+export { DropdownChevronProps };
+//# sourceMappingURL=DropdownChevron.d.mts.map

package/dist/components/controls/dropdown/DropdownChevron.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownChevron.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownChevron.tsx"],"mappings":";;;KASY,oBAAA;EACV,WAAA;EACA,YAAA;EACA,IAAA;EACA,UAAA;IACE,OAAA;IACA,IAAA;IACA,IAAA;MACE,OAAA;MACA,IAAA;IAAA;IAEF,KAAA;MACE,OAAA;MACA,IAAA;IAAA;EAAA;AAAA"}

package/dist/components/controls/dropdown/DropdownChevron.mjs

@@ -0,0 +1,2 @@
+import{IconRaw as e}from"../../data-display/icons/icon-raw/IconRaw.mjs";import{IconWrapped as t}from"../../data-display/icons/icon-wrapped/IconWrapped.mjs";import{dropdownChevron as n,dropdownChevronIcon as r,dropdownChevronIconRoot as i,dropdownChevronRoot as a}from"@mage-ui/styled-system/recipes";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=({chevronOpen:c=`mage-dropdown-chevron-down`,chevronClose:l=`mage-dropdown-chevron-up`,path:u=`/icons/sprite-mage.svg`,classNames:d})=>s(t,{classNames:{iconWrapped:d?.chevron??n(),root:d?.root??a()},children:[o(e,{path:u,name:c,classNames:{iconRaw:d?.open?.iconRaw??r(),root:d?.open?.root??i()}}),o(e,{path:u,name:l||c,classNames:{iconRaw:d?.close?.iconRaw??r(),root:d?.close?.root??i({invert:!0})}})]});export{c as DropdownChevron};
+//# sourceMappingURL=DropdownChevron.mjs.map

package/dist/components/controls/dropdown/DropdownChevron.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownChevron.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownChevron.tsx"],"sourcesContent":["import {\n  dropdownChevron,\n  dropdownChevronIcon,\n  dropdownChevronIconRoot,\n  dropdownChevronRoot,\n} from '@mage-ui/styled-system/recipes';\nimport { IconRaw } from '@/components/data-display/icons/icon-raw/IconRaw';\nimport { IconWrapped } from '@/components/data-display/icons/icon-wrapped/IconWrapped';\n\nexport type DropdownChevronProps = {\n  chevronOpen?: string;\n  chevronClose?: string;\n  path?: string;\n  classNames?: {\n    chevron?: string;\n    root?: string;\n    open?: {\n      iconRaw?: string;\n      root?: string;\n    };\n    close?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n};\n\nexport const DropdownChevron = ({\n  chevronOpen = 'mage-dropdown-chevron-down',\n  chevronClose = 'mage-dropdown-chevron-up',\n  path = '/icons/sprite-mage.svg',\n  classNames,\n}: DropdownChevronProps) => {\n  return (\n    <IconWrapped\n      classNames={{\n        iconWrapped: classNames?.chevron ?? dropdownChevron(),\n        root: classNames?.root ?? dropdownChevronRoot(),\n      }}\n    >\n      <IconRaw\n        path={path}\n        name={chevronOpen}\n        classNames={{\n          iconRaw: classNames?.open?.iconRaw ?? dropdownChevronIcon(),\n          root: classNames?.open?.root ?? dropdownChevronIconRoot(),\n        }}\n      />\n      <IconRaw\n        path={path}\n        name={chevronClose || chevronOpen}\n        classNames={{\n          iconRaw: classNames?.close?.iconRaw ?? dropdownChevronIcon(),\n          root:\n            classNames?.close?.root ??\n            dropdownChevronIconRoot({ invert: true }),\n        }}\n      />\n    </IconWrapped>\n  );\n};\n"],"mappings":"8VA2BA,MAAa,GAAmB,CAC9B,cAAc,6BACd,eAAe,2BACf,OAAO,yBACP,gBAGE,EAAC,EAAA,CACC,WAAY,CACV,YAAa,GAAY,SAAW,GAAiB,CACrD,KAAM,GAAY,MAAQ,GAAqB,CAChD,WAED,EAAC,EAAA,CACO,OACN,KAAM,EACN,WAAY,CACV,QAAS,GAAY,MAAM,SAAW,GAAqB,CAC3D,KAAM,GAAY,MAAM,MAAQ,GAAyB,CAC1D,EACD,CACF,EAAC,EAAA,CACO,OACN,KAAM,GAAgB,EACtB,WAAY,CACV,QAAS,GAAY,OAAO,SAAW,GAAqB,CAC5D,KACE,GAAY,OAAO,MACnB,EAAwB,CAAE,OAAQ,GAAM,CAAC,CAC5C,EACD,CAAA,EACU"}

package/dist/components/controls/dropdown/DropdownClearButton.d.mts

@@ -0,0 +1,15 @@
+import { ButtonIconProps } from "../../buttons/button-icon/ButtonIcon.mjs";
+import "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/DropdownClearButton.d.ts
+type DropdownClearButtonProps = Omit<ButtonIconProps, 'classNames' | 'label' | 'name' | 'path'> & {
+  classNames?: Omit<NonNullable<ButtonIconProps['classNames']>, 'buttonIcon'> & {
+    clearButton?: string;
+  };
+  label?: string;
+  name?: string;
+  path?: string;
+};
+//#endregion
+export { DropdownClearButtonProps };
+//# sourceMappingURL=DropdownClearButton.d.mts.map

package/dist/components/controls/dropdown/DropdownClearButton.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownClearButton.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownClearButton.tsx"],"mappings":";;;;KAcY,wBAAA,GAA2B,IAAA,CACrC,eAAA;EAGA,UAAA,GAAa,IAAA,CACX,WAAA,CAAY,eAAA;IAGZ,WAAA;EAAA;EAEF,KAAA;EACA,IAAA;EACA,IAAA;AAAA"}

package/dist/components/controls/dropdown/DropdownClearButton.mjs

@@ -0,0 +1,2 @@
+import{ButtonIcon as e}from"../../buttons/button-icon/ButtonIcon.mjs";import{useDropdownContext as t}from"./DropdownContextProvider.mjs";import{dropdownClearButton as n,dropdownClearButtonIcon as r,dropdownClearButtonIconRaw as i,dropdownClearButtonIconRawRoot as a,dropdownClearButtonRoot as o}from"@mage-ui/styled-system/recipes";import{jsx as s}from"react/jsx-runtime";const c=({classNames:c,label:l=`Clear selection`,name:u=`mage-clear-button-x`,path:d=`/icons/sprite-mage.svg`,...f})=>{let{setValue:p,setQuery:m}=t();return s(e,{label:l,name:u,path:d,onClick:e=>{e.stopPropagation(),e.preventDefault(),p(void 0),m(void 0)},classNames:{buttonIcon:c?.clearButton??n(),root:c?.root??o(),icon:c?.icon??r(),iconRaw:{iconRaw:c?.iconRaw?.iconRaw??i(),root:c?.iconRaw?.root??a()}},...f})};export{c as DropdownClearButton};
+//# sourceMappingURL=DropdownClearButton.mjs.map

package/dist/components/controls/dropdown/DropdownClearButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownClearButton.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownClearButton.tsx"],"sourcesContent":["import {\n  dropdownClearButton,\n  dropdownClearButtonIcon,\n  dropdownClearButtonIconRaw,\n  dropdownClearButtonIconRawRoot,\n  dropdownClearButtonRoot,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  ButtonIcon,\n  type ButtonIconProps,\n} from '@/components/buttons/button-icon/ButtonIcon';\n\nimport { useDropdownContext } from './DropdownContextProvider';\n\nexport type DropdownClearButtonProps = Omit<\n  ButtonIconProps,\n  'classNames' | 'label' | 'name' | 'path'\n> & {\n  classNames?: Omit<\n    NonNullable<ButtonIconProps['classNames']>,\n    'buttonIcon'\n  > & {\n    clearButton?: string;\n  };\n  label?: string;\n  name?: string;\n  path?: string;\n};\n\nexport const DropdownClearButton = ({\n  classNames,\n  label = 'Clear selection',\n  name = 'mage-clear-button-x',\n  path = '/icons/sprite-mage.svg',\n  ...props\n}: DropdownClearButtonProps) => {\n  const { setValue, setQuery } = useDropdownContext();\n\n  return (\n    <ButtonIcon\n      label={label}\n      name={name}\n      path={path}\n      onClick={(e) => {\n        e.stopPropagation();\n        e.preventDefault();\n        setValue(undefined);\n        setQuery(undefined);\n      }}\n      classNames={{\n        buttonIcon: classNames?.clearButton ?? dropdownClearButton(),\n        root: classNames?.root ?? dropdownClearButtonRoot(),\n        icon: classNames?.icon ?? dropdownClearButtonIcon(),\n        iconRaw: {\n          iconRaw: classNames?.iconRaw?.iconRaw ?? dropdownClearButtonIconRaw(),\n          root: classNames?.iconRaw?.root ?? dropdownClearButtonIconRawRoot(),\n        },\n      }}\n      {...props}\n    />\n  );\n};\n"],"mappings":"oXA6BA,MAAa,GAAuB,CAClC,aACA,QAAQ,kBACR,OAAO,sBACP,OAAO,yBACP,GAAG,KAC2B,CAC9B,GAAM,CAAE,WAAU,YAAa,GAAoB,CAEnD,OACE,EAAC,EAAA,CACQ,QACD,OACA,OACN,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CAClB,EAAS,IAAA,GAAU,CACnB,EAAS,IAAA,GAAU,EAErB,WAAY,CACV,WAAY,GAAY,aAAe,GAAqB,CAC5D,KAAM,GAAY,MAAQ,GAAyB,CACnD,KAAM,GAAY,MAAQ,GAAyB,CACnD,QAAS,CACP,QAAS,GAAY,SAAS,SAAW,GAA4B,CACrE,KAAM,GAAY,SAAS,MAAQ,GAAgC,CACpE,CACF,CACD,GAAI,GACJ"}

package/dist/components/controls/dropdown/DropdownContextProvider.d.mts

@@ -0,0 +1,11 @@
+import "@mantine/core";
+import "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/DropdownContextProvider.d.ts
+type DropdownValue = {
+  id: string | number;
+  value: string | number | undefined | null;
+};
+//#endregion
+export { DropdownValue };
+//# sourceMappingURL=DropdownContextProvider.d.mts.map

package/dist/components/controls/dropdown/DropdownContextProvider.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownContextProvider.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownContextProvider.tsx"],"mappings":";;;;KAIY,aAAA;EACV,EAAA;EACA,KAAA;AAAA"}

package/dist/components/controls/dropdown/DropdownContextProvider.mjs

@@ -0,0 +1,2 @@
+import{useCombobox as e}from"@mantine/core";import{jsx as t}from"react/jsx-runtime";import{createContext as n,useContext as r,useState as i}from"react";const a=n({store:{},value:{id:``,value:``},query:void 0,setValue:()=>{},setQuery:()=>{},options:[]});function o(){let e=r(a);if(!e)throw Error(`useDropdownContext must be used within DropdownContextProvider`);return e}function s({children:n,options:r,shouldFilter:o=!0}){let[s,c]=i(void 0),[l,u]=i({id:``,value:``}),d=e({scrollBehavior:`smooth`,onDropdownClose:()=>d.resetSelectedOption()}),f=s&&o?r.filter(e=>e.value?.toString().toLowerCase().trim().includes(s?.toLowerCase().trim())):r;return t(a.Provider,{value:{store:d,value:l,setValue:e=>{let t=r.find(t=>t.value===e);u(e&&!t?{id:``,value:e}:t??{id:``,value:``}),c(void 0),d.closeDropdown()},query:s,setQuery:c,options:f},children:n})}export{s as DropdownContextProvider,o as useDropdownContext};
+//# sourceMappingURL=DropdownContextProvider.mjs.map

package/dist/components/controls/dropdown/DropdownContextProvider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownContextProvider.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownContextProvider.tsx"],"sourcesContent":["import { createContext, useContext, useState } from 'react';\n\nimport { type ComboboxStore, useCombobox } from '@mantine/core';\n\nexport type DropdownValue = {\n  id: string | number;\n  value: string | number | undefined | null;\n};\n\ntype DropdownContextType = {\n  store: ComboboxStore;\n  value: DropdownValue;\n  setValue: (value: string | undefined) => void;\n  query: string | undefined;\n  setQuery: (query: string | undefined) => void;\n  options: DropdownValue[];\n};\n\nconst DropdownContext = createContext<DropdownContextType>({\n  store: {} as ComboboxStore,\n  value: { id: '', value: '' },\n  query: undefined,\n  setValue: () => {},\n  setQuery: () => {},\n  options: [],\n});\n\nexport function useDropdownContext(): DropdownContextType {\n  const ctx = useContext(DropdownContext);\n  if (!ctx)\n    throw new Error(\n      'useDropdownContext must be used within DropdownContextProvider',\n    );\n  return ctx;\n}\n\nexport function DropdownContextProvider({\n  children,\n  options,\n  shouldFilter = true,\n}: {\n  children: React.ReactNode;\n  options: DropdownValue[];\n  shouldFilter?: boolean;\n}) {\n  const [query, setQuery] = useState<string | undefined>(undefined);\n  const [value, setValue] = useState<DropdownValue>({\n    id: '',\n    value: '',\n  });\n\n  const store = useCombobox({\n    scrollBehavior: 'smooth',\n    onDropdownClose: () => store.resetSelectedOption(),\n  });\n\n  const filteredOptions =\n    query && shouldFilter\n      ? options.filter((item) =>\n          item.value\n            ?.toString()\n            .toLowerCase()\n            .trim()\n            .includes(query?.toLowerCase().trim()),\n        )\n      : options;\n\n  const handleValueChange = (value: string | undefined) => {\n    const option = options.find((option) => option.value === value);\n\n    if (value && !option) {\n      setValue({ id: '', value: value });\n    } else {\n      setValue(option ?? { id: '', value: '' });\n    }\n\n    setQuery(undefined);\n    store.closeDropdown();\n  };\n\n  return (\n    <DropdownContext.Provider\n      value={{\n        store,\n        value,\n        setValue: handleValueChange,\n        query,\n        setQuery,\n        options: filteredOptions,\n      }}\n    >\n      {children}\n    </DropdownContext.Provider>\n  );\n}\n"],"mappings":"wJAkBA,MAAM,EAAkB,EAAmC,CACzD,MAAO,EAAE,CACT,MAAO,CAAE,GAAI,GAAI,MAAO,GAAI,CAC5B,MAAO,IAAA,GACP,aAAgB,GAChB,aAAgB,GAChB,QAAS,EAAE,CACZ,CAAC,CAEF,SAAgB,GAA0C,CACxD,IAAM,EAAM,EAAW,EAAgB,CACvC,GAAI,CAAC,EACH,MAAU,MACR,iEACD,CACH,OAAO,EAGT,SAAgB,EAAwB,CACtC,WACA,UACA,eAAe,IAKd,CACD,GAAM,CAAC,EAAO,GAAY,EAA6B,IAAA,GAAU,CAC3D,CAAC,EAAO,GAAY,EAAwB,CAChD,GAAI,GACJ,MAAO,GACR,CAAC,CAEI,EAAQ,EAAY,CACxB,eAAgB,SAChB,oBAAuB,EAAM,qBAAqB,CACnD,CAAC,CAEI,EACJ,GAAS,EACL,EAAQ,OAAQ,GACd,EAAK,OACD,UAAU,CACX,aAAa,CACb,MAAM,CACN,SAAS,GAAO,aAAa,CAAC,MAAM,CAAC,CACzC,CACD,EAeN,OACE,EAAC,EAAgB,SAAA,CACf,MAAO,CACL,QACA,QACA,SAlBqB,GAA8B,CACvD,IAAM,EAAS,EAAQ,KAAM,GAAW,EAAO,QAAU,EAAM,CAG7D,EADE,GAAS,CAAC,EACH,CAAE,GAAI,GAAW,QAAO,CAExB,GAAU,CAAE,GAAI,GAAI,MAAO,GAAI,CAAC,CAG3C,EAAS,IAAA,GAAU,CACnB,EAAM,eAAe,EASjB,QACA,WACA,QAAS,EACV,CAEA,YACwB"}

package/dist/components/controls/dropdown/DropdownEndSlot.mjs

@@ -0,0 +1,2 @@
+import{DropdownChevron as e}from"./DropdownChevron.mjs";import{DropdownClearButton as t}from"./DropdownClearButton.mjs";import{jsx as n}from"react/jsx-runtime";const r=({clearable:r,showChevron:i,clearButtonProps:a,chevronProps:o})=>{if(r)return n(t,{...a});if(i)return n(e,{...o})};export{r as DropdownEndSlot};
+//# sourceMappingURL=DropdownEndSlot.mjs.map

package/dist/components/controls/dropdown/DropdownEndSlot.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownEndSlot.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownEndSlot.tsx"],"sourcesContent":["import type { DropdownChevronProps } from './DropdownChevron';\nimport { DropdownChevron } from './DropdownChevron';\nimport type { DropdownClearButtonProps } from './DropdownClearButton';\nimport { DropdownClearButton } from './DropdownClearButton';\n\nexport type DropdownEndSlotProps = {\n  clearButtonProps?: DropdownClearButtonProps;\n  chevronProps?: DropdownChevronProps;\n  clearable?: boolean;\n  showChevron?: boolean;\n};\n\nexport const DropdownEndSlot = ({\n  clearable,\n  showChevron,\n  clearButtonProps,\n  chevronProps,\n}: DropdownEndSlotProps) => {\n  if (clearable) {\n    return <DropdownClearButton {...clearButtonProps} />;\n  }\n\n  if (showChevron) {\n    return <DropdownChevron {...chevronProps} />;\n  }\n  return;\n};\n"],"mappings":"gKAYA,MAAa,GAAmB,CAC9B,YACA,cACA,mBACA,kBAC0B,CAC1B,GAAI,EACF,OAAO,EAAC,EAAA,CAAoB,GAAI,EAAA,CAAoB,CAGtD,GAAI,EACF,OAAO,EAAC,EAAA,CAAgB,GAAI,EAAA,CAAgB"}

package/dist/components/controls/dropdown/DropdownTargetTextInput.d.mts

@@ -0,0 +1,19 @@
+import { TextInputProps } from "../text-input/TextInput.mjs";
+import { DropdownChevronProps } from "./DropdownChevron.mjs";
+import { DropdownClearButtonProps } from "./DropdownClearButton.mjs";
+import "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/DropdownTargetTextInput.d.ts
+type DropdownTargetTextInputProps = Omit<TextInputProps, 'classNames'> & {
+  classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {
+    dropdownTextInput?: string;
+  };
+  clearButtonProps?: DropdownClearButtonProps;
+  chevronProps?: DropdownChevronProps;
+  showChevron?: boolean;
+  clearable?: boolean;
+  closeOnBlur?: boolean;
+};
+//#endregion
+export { DropdownTargetTextInputProps };
+//# sourceMappingURL=DropdownTargetTextInput.d.mts.map

package/dist/components/controls/dropdown/DropdownTargetTextInput.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownTargetTextInput.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownTargetTextInput.tsx"],"mappings":";;;;;;KAkBY,4BAAA,GAA+B,IAAA,CACzC,cAAA;EAGA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,cAAA;IAC5B,iBAAA;EAAA;EAEF,gBAAA,GAAmB,wBAAA;EACnB,YAAA,GAAe,oBAAA;EAEf,WAAA;EACA,SAAA;EACA,WAAA;AAAA"}

package/dist/components/controls/dropdown/DropdownTargetTextInput.mjs

@@ -0,0 +1,2 @@
+import{useDropdownContext as e}from"./DropdownContextProvider.mjs";import{TextInput as t}from"../text-input/TextInput.mjs";import{DropdownEndSlot as n}from"./DropdownEndSlot.mjs";import{dropdownTextInput as r,dropdownTextInputDescription as i,dropdownTextInputError as a,dropdownTextInputInput as o,dropdownTextInputLabel as s,dropdownTextInputRequired as c,dropdownTextInputRoot as l,dropdownTextInputSection as u,dropdownTextInputWrapper as d}from"@mage-ui/styled-system/recipes";import{jsx as f}from"react/jsx-runtime";const p=({classNames:p,clearable:m,showChevron:h,clearButtonProps:g,chevronProps:_,closeOnBlur:v=!0,...y})=>{let{store:b,value:x,query:S,setQuery:C}=e(),w=m&&(S??x?.value??``)!==``,T={"--dropdown-text-input-right-section-pointer-events":w?`auto`:`none`};return f(t,{readOnly:!1,value:S??x?.value??``,endSlot:f(n,{clearable:w,showChevron:h,clearButtonProps:g,chevronProps:_}),onFocus:e=>{e.stopPropagation(),e.preventDefault(),b.openDropdown()},onBlur:e=>{e.stopPropagation(),e.preventDefault(),v&&(b.closeDropdown(),C(void 0))},classNames:{textInput:p?.dropdownTextInput??r(),root:p?.root??l(),label:p?.label??s(),description:p?.description??i(),error:p?.error??a(),wrapper:p?.wrapper??d(),input:p?.input??o(),section:p?.section??u(),required:p?.required??c()},style:T,...y})};export{p as DropdownTargetTextInput};
+//# sourceMappingURL=DropdownTargetTextInput.mjs.map

package/dist/components/controls/dropdown/DropdownTargetTextInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownTargetTextInput.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownTargetTextInput.tsx"],"sourcesContent":["import {\n  dropdownTextInput,\n  dropdownTextInputDescription,\n  dropdownTextInputError,\n  dropdownTextInputInput,\n  dropdownTextInputLabel,\n  dropdownTextInputRequired,\n  dropdownTextInputRoot,\n  dropdownTextInputSection,\n  dropdownTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { TextInput, type TextInputProps } from '../text-input/TextInput';\nimport type { DropdownChevronProps } from './DropdownChevron';\nimport type { DropdownClearButtonProps } from './DropdownClearButton';\nimport { useDropdownContext } from './DropdownContextProvider';\nimport { DropdownEndSlot } from './DropdownEndSlot';\n\nexport type DropdownTargetTextInputProps = Omit<\n  TextInputProps,\n  'classNames'\n> & {\n  classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {\n    dropdownTextInput?: string;\n  };\n  clearButtonProps?: DropdownClearButtonProps;\n  chevronProps?: DropdownChevronProps;\n\n  showChevron?: boolean;\n  clearable?: boolean;\n  closeOnBlur?: boolean;\n};\n\nexport const DropdownTargetTextInput = ({\n  classNames,\n  clearable,\n  showChevron,\n  clearButtonProps,\n  chevronProps,\n  closeOnBlur = true,\n  ...props\n}: DropdownTargetTextInputProps) => {\n  const { store, value, query, setQuery } = useDropdownContext();\n  const isClearable = clearable && (query ?? value?.value ?? '') !== '';\n\n  const style = {\n    '--dropdown-text-input-right-section-pointer-events': isClearable\n      ? 'auto'\n      : 'none',\n  } as React.CSSProperties;\n\n  return (\n    <TextInput\n      readOnly={false}\n      value={query ?? value?.value ?? ''}\n      endSlot={\n        <DropdownEndSlot\n          clearable={isClearable}\n          showChevron={showChevron}\n          clearButtonProps={clearButtonProps}\n          chevronProps={chevronProps}\n        />\n      }\n      onFocus={(e) => {\n        e.stopPropagation();\n        e.preventDefault();\n        store.openDropdown();\n      }}\n      onBlur={(e) => {\n        e.stopPropagation();\n        e.preventDefault();\n        if (closeOnBlur) {\n          store.closeDropdown();\n          setQuery(undefined);\n        }\n      }}\n      classNames={{\n        textInput: classNames?.dropdownTextInput ?? dropdownTextInput(),\n        root: classNames?.root ?? dropdownTextInputRoot(),\n        label: classNames?.label ?? dropdownTextInputLabel(),\n        description: classNames?.description ?? dropdownTextInputDescription(),\n        error: classNames?.error ?? dropdownTextInputError(),\n        wrapper: classNames?.wrapper ?? dropdownTextInputWrapper(),\n        input: classNames?.input ?? dropdownTextInputInput(),\n        section: classNames?.section ?? dropdownTextInputSection(),\n        required: classNames?.required ?? dropdownTextInputRequired(),\n      }}\n      style={style}\n      {...props}\n    />\n  );\n};\n"],"mappings":"0gBAiCA,MAAa,GAA2B,CACtC,aACA,YACA,cACA,mBACA,eACA,cAAc,GACd,GAAG,KAC+B,CAClC,GAAM,CAAE,QAAO,QAAO,QAAO,YAAa,GAAoB,CACxD,EAAc,IAAc,GAAS,GAAO,OAAS,MAAQ,GAE7D,EAAQ,CACZ,qDAAsD,EAClD,OACA,OACL,CAED,OACE,EAAC,EAAA,CACC,SAAU,GACV,MAAO,GAAS,GAAO,OAAS,GAChC,QACE,EAAC,EAAA,CACC,UAAW,EACE,cACK,mBACJ,gBACd,CAEJ,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CAClB,EAAM,cAAc,EAEtB,OAAS,GAAM,CACb,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CACd,IACF,EAAM,eAAe,CACrB,EAAS,IAAA,GAAU,GAGvB,WAAY,CACV,UAAW,GAAY,mBAAqB,GAAmB,CAC/D,KAAM,GAAY,MAAQ,GAAuB,CACjD,MAAO,GAAY,OAAS,GAAwB,CACpD,YAAa,GAAY,aAAe,GAA8B,CACtE,MAAO,GAAY,OAAS,GAAwB,CACpD,QAAS,GAAY,SAAW,GAA0B,CAC1D,MAAO,GAAY,OAAS,GAAwB,CACpD,QAAS,GAAY,SAAW,GAA0B,CAC1D,SAAU,GAAY,UAAY,GAA2B,CAC9D,CACM,QACP,GAAI,GACJ"}

package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts

@@ -0,0 +1,40 @@
+import { DropdownValue } from "../DropdownContextProvider.mjs";
+import { ComboboxTargetProps } from "../combobox/ComboboxTarget.mjs";
+import { ComboboxProps } from "../combobox/Combobox.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/autocomplete/Autocomplete.d.ts
+type AutocompleteProps = Omit<ComboboxProps, 'options' | 'classNames'> & {
+  name: string;
+  url?: string;
+  fetcher: (params: {
+    url?: string;
+    query: string;
+  }) => Promise<DropdownValue[]>;
+  threshold?: number;
+  debounce?: number;
+  query?: string;
+  classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {
+    target?: ComboboxTargetProps['classNames'] & {
+      clearButton?: NonNullable<ComboboxTargetProps['clearButtonProps']>['classNames'];
+    };
+  };
+};
+declare const Autocomplete: ({
+  name,
+  label,
+  placeholder,
+  creatable,
+  url,
+  fetcher,
+  query,
+  debounce,
+  threshold,
+  clearButtonText,
+  emptyText,
+  classNames,
+  ...props
+}: AutocompleteProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Autocomplete, AutocompleteProps };
+//# sourceMappingURL=Autocomplete.d.mts.map

package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autocomplete.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"mappings":";;;;;;KAkCY,iBAAA,GAAoB,IAAA,CAC9B,aAAA;EAGA,IAAA;EACA,GAAA;EACA,OAAA,GAAU,MAAA;IACR,GAAA;IACA,KAAA;EAAA,MACI,OAAA,CAAQ,aAAA;EACd,SAAA;EACA,QAAA;EACA,KAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,aAAA;IAC5B,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;IAAA;EAAA;AAAA;AAAA,cAMK,YAAA;EAAgB,IAAA;EAAA,KAAA;EAAA,WAAA;EAAA,SAAA;EAAA,GAAA;EAAA,OAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAc1B,iBAAA,KAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs

@@ -0,0 +1,2 @@
+import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{AutocompleteTarget as n}from"./AutocompleteTarget.mjs";import{autocomplete as r,autocompleteClearButton as i,autocompleteClearButtonIcon as a,autocompleteClearButtonIconRaw as o,autocompleteClearButtonIconRawRoot as s,autocompleteClearButtonRoot as c,autocompleteEmpty as l,autocompleteOption as u,autocompleteOptions as d,autocompleteRoot as f,autocompleteScrollAreaAutosize as ee,autocompleteTextInput as p,autocompleteTextInputDescription as m,autocompleteTextInputError as h,autocompleteTextInputInput as g,autocompleteTextInputLabel as _,autocompleteTextInputRequired as v,autocompleteTextInputRoot as y,autocompleteTextInputSection as b,autocompleteTextInputWrapper as x}from"@mage-ui/styled-system/recipes";import{jsx as S}from"react/jsx-runtime";import{useState as C}from"react";import{useDebouncedCallback as w}from"@mantine/hooks";import{useQuery as T}from"@tanstack/react-query";const E=({name:E,label:D,placeholder:O,creatable:k,url:A,fetcher:j,query:M=``,debounce:N=500,threshold:P=3,clearButtonText:F,emptyText:I=`No hay resultados`,classNames:L,...R})=>{let[z,B]=C(M),[V,H]=C(!1),{data:U,isFetching:W}=T({queryKey:[E,A,z],queryFn:()=>j({url:A,query:z}),initialData:[],enabled:z.length>=P}),G=w(e=>{B(e),H(!1)},N),K=e=>{H(!0),G(e)},{creatable:q,empty:J,target:Y,scrollArea:X,...Z}=L||{},{clearButton:Q,...$}=Y||{},te={placeholder:O,label:D,classNames:{dropdownTextInput:$?.dropdownTextInput??p(),root:$?.root??y(),label:$?.label??_(),description:$?.description??m(),error:$?.error??h(),wrapper:$?.wrapper??x(),input:$?.input??g(),section:$?.section??b(),required:$?.required??v()},clearButtonProps:{label:F,classNames:{clearButton:Q?.clearButton??i(),root:Q?.root??c(),icon:Q?.icon??a(),iconRaw:{iconRaw:Q?.iconRaw?.iconRaw??o(),root:Q?.iconRaw?.root??s()}}}},ne={emptyText:I,classNames:{empty:J?.empty??l()}},re={creatable:k??!1,classNames:q};return S(e,{shouldFilter:!1,classNames:{dropdown:Z?.dropdown??r(),root:Z?.root??f(),options:Z?.options??d(),option:Z?.option??u(),empty:J?.empty??l(),search:Z?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:X?.dropdownScrollAreaAutosize??ee()}},target:S(n,{debounced:K,isLoading:W||V,threshold:P,showEmpty:I!==void 0,...te}),options:U,...R,children:S(t,{emptyProps:ne,creatableProps:re})})};export{E as Autocomplete};
+//# sourceMappingURL=Autocomplete.mjs.map

package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autocomplete.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport {\n  autocomplete,\n  autocompleteClearButton,\n  autocompleteClearButtonIcon,\n  autocompleteClearButtonIconRaw,\n  autocompleteClearButtonIconRawRoot,\n  autocompleteClearButtonRoot,\n  autocompleteEmpty,\n  autocompleteOption,\n  autocompleteOptions,\n  autocompleteRoot,\n  autocompleteScrollAreaAutosize,\n  autocompleteTextInput,\n  autocompleteTextInputDescription,\n  autocompleteTextInputError,\n  autocompleteTextInputInput,\n  autocompleteTextInputLabel,\n  autocompleteTextInputRequired,\n  autocompleteTextInputRoot,\n  autocompleteTextInputSection,\n  autocompleteTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { useDebouncedCallback } from '@mantine/hooks';\nimport { useQuery } from '@tanstack/react-query';\n\nimport type { ComboboxProps } from '../combobox/Combobox';\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { Dropdown } from '../Dropdown';\nimport type { DropdownValue } from '../DropdownContextProvider';\nimport { AutocompleteTarget } from './AutocompleteTarget';\n\nexport type AutocompleteProps = Omit<\n  ComboboxProps,\n  'options' | 'classNames'\n> & {\n  name: string;\n  url?: string;\n  fetcher: (params: {\n    url?: string;\n    query: string;\n  }) => Promise<DropdownValue[]>;\n  threshold?: number;\n  debounce?: number;\n  query?: string;\n  classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n    };\n  };\n};\n\nexport const Autocomplete = ({\n  name,\n  label,\n  placeholder,\n  creatable,\n  url,\n  fetcher,\n  query = '',\n  debounce = 500,\n  threshold = 3,\n  clearButtonText,\n  emptyText = 'No hay resultados',\n  classNames,\n  ...props\n}: AutocompleteProps) => {\n  const [searchValue, setSearchValue] = useState(query);\n  const [isTyping, setIsTyping] = useState(false);\n\n  const { data, isFetching } = useQuery<DropdownValue[]>({\n    queryKey: [name, url, searchValue],\n    queryFn: () => {\n      return fetcher({\n        url,\n        query: searchValue,\n      });\n    },\n    initialData: [],\n    enabled: searchValue.length >= threshold,\n  });\n\n  const debounced = useDebouncedCallback((value: string) => {\n    setSearchValue(value);\n    setIsTyping(false);\n  }, debounce);\n\n  const handleSearch = (value: string) => {\n    setIsTyping(true);\n    debounced(value);\n  };\n\n  const {\n    creatable: creatableClassNames,\n    empty: emptyClassNames,\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const { clearButton: clearButtonClassNames, ...restTargetClassNames } =\n    targetClassNames || {};\n\n  const targetProps = {\n    placeholder,\n    label,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? autocompleteTextInput(),\n      root: restTargetClassNames?.root ?? autocompleteTextInputRoot(),\n      label: restTargetClassNames?.label ?? autocompleteTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? autocompleteTextInputDescription(),\n      error: restTargetClassNames?.error ?? autocompleteTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? autocompleteTextInputWrapper(),\n      input: restTargetClassNames?.input ?? autocompleteTextInputInput(),\n      section: restTargetClassNames?.section ?? autocompleteTextInputSection(),\n      required:\n        restTargetClassNames?.required ?? autocompleteTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton:\n          clearButtonClassNames?.clearButton ?? autocompleteClearButton(),\n        root: clearButtonClassNames?.root ?? autocompleteClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? autocompleteClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            autocompleteClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            autocompleteClearButtonIconRawRoot(),\n        },\n      },\n    },\n  };\n\n  const emptyProps = {\n    emptyText,\n    classNames: {\n      empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n    },\n  };\n\n  const creatableProps = {\n    creatable: creatable ?? false,\n    classNames: creatableClassNames,\n  };\n\n  return (\n    <Dropdown\n      shouldFilter={false}\n      classNames={{\n        dropdown: dropdownClassNames?.dropdown ?? autocomplete(),\n        root: dropdownClassNames?.root ?? autocompleteRoot(),\n        options: dropdownClassNames?.options ?? autocompleteOptions(),\n        option: dropdownClassNames?.option ?? autocompleteOption(),\n        empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n        search: dropdownClassNames?.search,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            autocompleteScrollAreaAutosize(),\n        },\n      }}\n      target={\n        <AutocompleteTarget\n          debounced={handleSearch}\n          isLoading={isFetching || isTyping}\n          threshold={threshold}\n          showEmpty={emptyText !== undefined}\n          {...targetProps}\n        />\n      }\n      options={data}\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={emptyProps}\n        creatableProps={creatableProps}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"8+BAwDA,MAAa,GAAgB,CAC3B,OACA,QACA,cACA,YACA,MACA,UACA,QAAQ,GACR,WAAW,IACX,YAAY,EACZ,kBACA,YAAY,oBACZ,aACA,GAAG,KACoB,CACvB,GAAM,CAAC,EAAa,GAAkB,EAAS,EAAM,CAC/C,CAAC,EAAU,GAAe,EAAS,GAAM,CAEzC,CAAE,OAAM,cAAe,EAA0B,CACrD,SAAU,CAAC,EAAM,EAAK,EAAY,CAClC,YACS,EAAQ,CACb,MACA,MAAO,EACR,CAAC,CAEJ,YAAa,EAAE,CACf,QAAS,EAAY,QAAU,EAChC,CAAC,CAEI,EAAY,EAAsB,GAAkB,CACxD,EAAe,EAAM,CACrB,EAAY,GAAM,EACjB,EAAS,CAEN,EAAgB,GAAkB,CACtC,EAAY,GAAK,CACjB,EAAU,EAAM,EAGZ,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CAAE,YAAa,EAAuB,GAAG,GAC7C,GAAoB,EAAE,CAElB,GAAc,CAClB,cACA,QACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAuB,CACpE,KAAM,GAAsB,MAAQ,GAA2B,CAC/D,MAAO,GAAsB,OAAS,GAA4B,CAClE,YACE,GAAsB,aAAe,GAAkC,CACzE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,SACE,GAAsB,UAAY,GAA+B,CACpE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAyB,CACjE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAAgC,CAClC,KACE,GAAuB,SAAS,MAChC,GAAoC,CACvC,CACF,CACF,CACF,CAEK,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,GAAmB,CACrD,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,WAAY,EACb,CAED,OACE,EAAC,EAAA,CACC,aAAc,GACd,WAAY,CACV,SAAU,GAAoB,UAAY,GAAc,CACxD,KAAM,GAAoB,MAAQ,GAAkB,CACpD,QAAS,GAAoB,SAAW,GAAqB,CAC7D,OAAQ,GAAoB,QAAU,GAAoB,CAC1D,MAAO,GAAiB,OAAS,GAAmB,CACpD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,IAAgC,CACnC,CACF,CACD,OACE,EAAC,EAAA,CACC,UAAW,EACX,UAAW,GAAc,EACd,YACX,UAAW,IAAc,IAAA,GACzB,GAAI,IACJ,CAEJ,QAAS,EACT,GAAI,WAEJ,EAAC,EAAA,CACa,cACI,mBAChB,EACO"}

package/dist/components/controls/dropdown/autocomplete/AutocompleteLoader.mjs

@@ -0,0 +1,2 @@
+import{cx as e}from"@mage-ui/styled-system/css";import{loaderDot as t,loaderDotRoot as n}from"@mage-ui/styled-system/recipes";import{Loader as r}from"@mantine/core";import{jsx as i}from"react/jsx-runtime";const a=()=>i(r,{type:`dots`,classNames:{root:e(t(),n())}});export{a as AutocompleteLoader};
+//# sourceMappingURL=AutocompleteLoader.mjs.map

package/dist/components/controls/dropdown/autocomplete/AutocompleteLoader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteLoader.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/AutocompleteLoader.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { loaderDot, loaderDotRoot } from '@mage-ui/styled-system/recipes';\nimport { Loader } from '@mantine/core';\n\nexport const AutocompleteLoader = () => {\n  return (\n    <Loader\n      type='dots'\n      classNames={{ root: cx(loaderDot(), loaderDotRoot()) }}\n    />\n  );\n};\n"],"mappings":"6MAIA,MAAa,MAET,EAAC,EAAA,CACC,KAAK,OACL,WAAY,CAAE,KAAM,EAAG,GAAW,CAAE,GAAe,CAAC,CAAE,EACtD"}

package/dist/components/controls/dropdown/autocomplete/AutocompleteTarget.mjs

@@ -0,0 +1,2 @@
+import{useDropdownContext as e}from"../DropdownContextProvider.mjs";import{ComboboxTarget as t}from"../combobox/ComboboxTarget.mjs";import{AutocompleteLoader as n}from"./AutocompleteLoader.mjs";import{jsx as r}from"react/jsx-runtime";import{useEffect as i,useEffectEvent as a,useRef as o}from"react";const s=({debounced:s,isLoading:c,threshold:l=3,showEmpty:u,...d})=>{let{store:f,setQuery:p,query:m}=e(),h=o(c),g=m&&m.length>=l,_=a(()=>{h.current&&!c&&u?g&&f.openDropdown():(c||!g)&&f.closeDropdown()});return i(()=>{_(),h.current=c},[c,_]),r(t,{onFocus:e=>{e.stopPropagation(),e.preventDefault()},onClick:e=>{e.stopPropagation(),e.preventDefault()},onChange:e=>{e.stopPropagation(),e.preventDefault(),p(e.currentTarget?.value),s(e.currentTarget?.value)},showChevron:!1,clearable:!0,...c&&g?{endSlot:r(n,{})}:{},...d})};export{s as AutocompleteTarget};
+//# sourceMappingURL=AutocompleteTarget.mjs.map

package/dist/components/controls/dropdown/autocomplete/AutocompleteTarget.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteTarget.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/AutocompleteTarget.tsx"],"sourcesContent":["import { useEffect, useEffectEvent, useRef } from 'react';\n\nimport {\n  ComboboxTarget,\n  type ComboboxTargetProps,\n} from '../combobox/ComboboxTarget';\nimport { useDropdownContext } from '../DropdownContextProvider';\nimport { AutocompleteLoader } from './AutocompleteLoader';\n\nexport type AutocompleteTargetProps = ComboboxTargetProps & {\n  debounced: (value: string) => void;\n  isLoading?: boolean;\n  threshold?: number;\n  showEmpty?: boolean;\n};\n\nexport const AutocompleteTarget = ({\n  debounced,\n  isLoading,\n  threshold = 3,\n  showEmpty,\n  ...props\n}: AutocompleteTargetProps) => {\n  const { store, setQuery, query } = useDropdownContext();\n  const prevIsLoadingRef = useRef(isLoading);\n  const isQueriable = query && query.length >= threshold;\n\n  const handleDropdownState = useEffectEvent(() => {\n    if (prevIsLoadingRef.current && !isLoading && showEmpty) {\n      if (isQueriable) {\n        store.openDropdown();\n      }\n    } else if (isLoading || !isQueriable) {\n      store.closeDropdown();\n    }\n  });\n\n  useEffect(() => {\n    handleDropdownState();\n    prevIsLoadingRef.current = isLoading;\n  }, [isLoading, handleDropdownState]);\n\n  return (\n    <ComboboxTarget\n      onFocus={(e) => {\n        e.stopPropagation();\n        e.preventDefault();\n      }}\n      onClick={(e) => {\n        e.stopPropagation();\n        e.preventDefault();\n      }}\n      onChange={(e) => {\n        e.stopPropagation();\n        e.preventDefault();\n        setQuery(e.currentTarget?.value);\n        debounced(e.currentTarget?.value);\n      }}\n      showChevron={false}\n      clearable={true}\n      {...(isLoading && isQueriable ? { endSlot: <AutocompleteLoader /> } : {})}\n      {...props}\n    />\n  );\n};\n"],"mappings":"4SAgBA,MAAa,GAAsB,CACjC,YACA,YACA,YAAY,EACZ,YACA,GAAG,KAC0B,CAC7B,GAAM,CAAE,QAAO,WAAU,SAAU,GAAoB,CACjD,EAAmB,EAAO,EAAU,CACpC,EAAc,GAAS,EAAM,QAAU,EAEvC,EAAsB,MAAqB,CAC3C,EAAiB,SAAW,CAAC,GAAa,EACxC,GACF,EAAM,cAAc,EAEb,GAAa,CAAC,IACvB,EAAM,eAAe,EAEvB,CAOF,OALA,MAAgB,CACd,GAAqB,CACrB,EAAiB,QAAU,GAC1B,CAAC,EAAW,EAAoB,CAAC,CAGlC,EAAC,EAAA,CACC,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,EAEpB,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,EAEpB,SAAW,GAAM,CACf,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CAClB,EAAS,EAAE,eAAe,MAAM,CAChC,EAAU,EAAE,eAAe,MAAM,EAEnC,YAAa,GACb,UAAW,GACX,GAAK,GAAa,EAAc,CAAE,QAAS,EAAC,EAAA,EAAA,CAAqB,CAAE,CAAG,EAAE,CACxE,GAAI,GACJ"}

package/dist/components/controls/dropdown/combobox/Combobox.d.mts

@@ -0,0 +1,35 @@
+import { DropdownProps } from "../Dropdown.mjs";
+import { ComboboxCreatableOptionProps } from "./ComboboxCreatableOption.mjs";
+import { ComboboxEmptyOptionProps } from "./ComboboxEmptyOption.mjs";
+import { ComboboxTargetProps } from "./ComboboxTarget.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/combobox/Combobox.d.ts
+type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> & {
+  label?: string;
+  placeholder?: string;
+  creatable?: boolean;
+  emptyText?: string;
+  clearButtonText?: string;
+  classNames?: DropdownProps['classNames'] & {
+    creatable?: ComboboxCreatableOptionProps['classNames'];
+    empty?: ComboboxEmptyOptionProps['classNames'];
+    target?: ComboboxTargetProps['classNames'] & {
+      clearButton?: NonNullable<ComboboxTargetProps['clearButtonProps']>['classNames'];
+      chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];
+    };
+    scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];
+  };
+};
+declare const Combobox: ({
+  label,
+  placeholder,
+  creatable,
+  clearButtonText,
+  emptyText,
+  classNames,
+  ...props
+}: ComboboxProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Combobox, ComboboxProps };
+//# sourceMappingURL=Combobox.d.mts.map

package/dist/components/controls/dropdown/combobox/Combobox.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"mappings":";;;;;;;KAqCY,aAAA,GAAgB,IAAA,CAC1B,aAAA;EAGA,KAAA;EACA,WAAA;EACA,SAAA;EACA,SAAA;EACA,eAAA;EACA,UAAA,GAAa,aAAA;IACX,SAAA,GAAY,4BAAA;IACZ,KAAA,GAAQ,wBAAA;IACR,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,QAAA;EAAY,KAAA;EAAA,WAAA;EAAA,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAQtB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/combobox/Combobox.mjs

@@ -0,0 +1,2 @@
+import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as ee}from"./ComboboxTarget.mjs";import{combobox as n,comboboxChevron as r,comboboxChevronIcon as i,comboboxChevronIconRoot as a,comboboxChevronRoot as o,comboboxClearButton as s,comboboxClearButtonIcon as c,comboboxClearButtonIconRaw as l,comboboxClearButtonIconRawRoot as u,comboboxClearButtonRoot as d,comboboxEmpty as f,comboboxOption as p,comboboxOptionCreateIcon as m,comboboxOptionCreateIconIconRaw as h,comboboxOptionCreateIconIconRawRoot as g,comboboxOptionCreateIconRoot as _,comboboxOptions as v,comboboxRoot as y,comboboxScrollAreaAutosize as b,comboboxTextInput as x,comboboxTextInputDescription as S,comboboxTextInputError as C,comboboxTextInputInput as w,comboboxTextInputLabel as T,comboboxTextInputRequired as E,comboboxTextInputRoot as D,comboboxTextInputSection as O,comboboxTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,placeholder:M,creatable:N,clearButtonText:P,emptyText:F=`No results`,classNames:I,...L})=>{let{creatable:R,empty:z,target:B,scrollArea:V,...H}=I||{},{clearButton:U,chevron:W,...G}=B||{},K={placeholder:M,label:j,classNames:{dropdownTextInput:G?.dropdownTextInput??x(),root:G?.root??D(),label:G?.label??T(),description:G?.description??S(),error:G?.error??C(),wrapper:G?.wrapper??k(),input:G?.input??w(),section:G?.section??O(),required:G?.required??E()},clearButtonProps:{label:P,classNames:{clearButton:U?.clearButton??s(),root:U?.root??d(),icon:U?.icon??c(),iconRaw:{iconRaw:U?.iconRaw?.iconRaw??l(),root:U?.iconRaw?.root??u()}}},chevronProps:{classNames:{chevron:W?.chevron??r(),root:W?.root??o(),open:{iconRaw:W?.open?.iconRaw??i(),root:W?.open?.root??a()},close:{iconRaw:W?.close?.iconRaw??i(),root:W?.close?.root??a({invert:!0})}}}},q=H?.dropdown??n(),J=H?.root??y(),Y=H?.options??v(),X=H?.option??p(),Z=z?.empty??f(),Q=H?.search,$={emptyText:F,classNames:{empty:z?.empty??Z}},te={creatable:N??!1,classNames:{create:R?.create,createIcon:{createIcon:R?.createIcon?.createIcon??m(),root:R?.createIcon?.root??_(),iconRaw:{iconRaw:R?.createIcon?.iconRaw?.iconRaw??h(),root:R?.createIcon?.iconRaw?.root??g()}}}};return A(e,{classNames:{dropdown:q,root:J,options:Y,option:X,empty:Z,search:Q},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:V?.dropdownScrollAreaAutosize??b()}},target:A(ee,{...K}),...L,children:A(t,{emptyProps:$,creatableProps:te})})};export{j as Combobox};
+//# sourceMappingURL=Combobox.mjs.map

package/dist/components/controls/dropdown/combobox/Combobox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"sourcesContent":["import {\n  combobox,\n  comboboxChevron,\n  comboboxChevronIcon,\n  comboboxChevronIconRoot,\n  comboboxChevronRoot,\n  comboboxClearButton,\n  comboboxClearButtonIcon,\n  comboboxClearButtonIconRaw,\n  comboboxClearButtonIconRawRoot,\n  comboboxClearButtonRoot,\n  comboboxEmpty,\n  comboboxOption,\n  comboboxOptionCreateIcon,\n  comboboxOptionCreateIconIconRaw,\n  comboboxOptionCreateIconIconRawRoot,\n  comboboxOptionCreateIconRoot,\n  comboboxOptions,\n  comboboxRoot,\n  comboboxScrollAreaAutosize,\n  comboboxTextInput,\n  comboboxTextInputDescription,\n  comboboxTextInputError,\n  comboboxTextInputInput,\n  comboboxTextInputLabel,\n  comboboxTextInputRequired,\n  comboboxTextInputRoot,\n  comboboxTextInputSection,\n  comboboxTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport type { ComboboxCreatableOptionProps } from './ComboboxCreatableOption';\nimport type { ComboboxEmptyOptionProps } from './ComboboxEmptyOption';\nimport { ComboboxOptions } from './ComboboxOptions';\nimport { ComboboxTarget, type ComboboxTargetProps } from './ComboboxTarget';\n\nexport type ComboboxProps = Omit<\n  DropdownProps,\n  'classNames' | 'target' | 'children'\n> & {\n  label?: string;\n  placeholder?: string;\n  creatable?: boolean;\n  emptyText?: string;\n  clearButtonText?: string;\n  classNames?: DropdownProps['classNames'] & {\n    creatable?: ComboboxCreatableOptionProps['classNames'];\n    empty?: ComboboxEmptyOptionProps['classNames'];\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n      chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n    };\n    scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n  };\n};\n\nexport const Combobox = ({\n  label,\n  placeholder,\n  creatable,\n  clearButtonText,\n  emptyText = 'No results',\n  classNames,\n  ...props\n}: ComboboxProps) => {\n  const {\n    creatable: creatableClassNames,\n    empty: emptyClassNames,\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const {\n    clearButton: clearButtonClassNames,\n    chevron: chevronClassNames,\n    ...restTargetClassNames\n  } = targetClassNames || {};\n\n  const targetProps = {\n    placeholder,\n    label,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? comboboxTextInput(),\n      root: restTargetClassNames?.root ?? comboboxTextInputRoot(),\n      label: restTargetClassNames?.label ?? comboboxTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? comboboxTextInputDescription(),\n      error: restTargetClassNames?.error ?? comboboxTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? comboboxTextInputWrapper(),\n      input: restTargetClassNames?.input ?? comboboxTextInputInput(),\n      section: restTargetClassNames?.section ?? comboboxTextInputSection(),\n      required: restTargetClassNames?.required ?? comboboxTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton:\n          clearButtonClassNames?.clearButton ?? comboboxClearButton(),\n        root: clearButtonClassNames?.root ?? comboboxClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? comboboxClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            comboboxClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            comboboxClearButtonIconRawRoot(),\n        },\n      },\n    },\n    chevronProps: {\n      classNames: {\n        chevron: chevronClassNames?.chevron ?? comboboxChevron(),\n        root: chevronClassNames?.root ?? comboboxChevronRoot(),\n        open: {\n          iconRaw: chevronClassNames?.open?.iconRaw ?? comboboxChevronIcon(),\n          root: chevronClassNames?.open?.root ?? comboboxChevronIconRoot(),\n        },\n        close: {\n          iconRaw: chevronClassNames?.close?.iconRaw ?? comboboxChevronIcon(),\n          root:\n            chevronClassNames?.close?.root ??\n            comboboxChevronIconRoot({ invert: true }),\n        },\n      },\n    },\n  };\n\n  const dropdownClassName = dropdownClassNames?.dropdown ?? combobox();\n  const rootClassName = dropdownClassNames?.root ?? comboboxRoot();\n  const optionsClassName = dropdownClassNames?.options ?? comboboxOptions();\n  const optionClassName = dropdownClassNames?.option ?? comboboxOption();\n  const emptyClassName = emptyClassNames?.empty ?? comboboxEmpty();\n  const searchClassName = dropdownClassNames?.search;\n\n  const emptyProps = {\n    emptyText,\n    classNames: {\n      empty: emptyClassNames?.empty ?? emptyClassName,\n    },\n  };\n\n  const creatableProps = {\n    creatable: creatable ?? false,\n    classNames: {\n      create: creatableClassNames?.create,\n      createIcon: {\n        createIcon:\n          creatableClassNames?.createIcon?.createIcon ??\n          comboboxOptionCreateIcon(),\n        root:\n          creatableClassNames?.createIcon?.root ??\n          comboboxOptionCreateIconRoot(),\n        iconRaw: {\n          iconRaw:\n            creatableClassNames?.createIcon?.iconRaw?.iconRaw ??\n            comboboxOptionCreateIconIconRaw(),\n          root:\n            creatableClassNames?.createIcon?.iconRaw?.root ??\n            comboboxOptionCreateIconIconRawRoot(),\n        },\n      },\n    },\n  };\n\n  return (\n    <Dropdown\n      classNames={{\n        dropdown: dropdownClassName,\n        root: rootClassName,\n        options: optionsClassName,\n        option: optionClassName,\n        empty: emptyClassName,\n        search: searchClassName,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            comboboxScrollAreaAutosize(),\n        },\n      }}\n      target={<ComboboxTarget {...targetProps} />}\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={emptyProps}\n        creatableProps={creatableProps}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"s/BA2DA,MAAa,GAAY,CACvB,QACA,cACA,YACA,kBACA,YAAY,aACZ,aACA,GAAG,KACgB,CACnB,GAAM,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CAEpB,EAAc,CAClB,cACA,QACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAmB,CAChE,KAAM,GAAsB,MAAQ,GAAuB,CAC3D,MAAO,GAAsB,OAAS,GAAwB,CAC9D,YACE,GAAsB,aAAe,GAA8B,CACrE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,SAAU,GAAsB,UAAY,GAA2B,CACxE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAqB,CAC7D,KAAM,GAAuB,MAAQ,GAAyB,CAC9D,KAAM,GAAuB,MAAQ,GAAyB,CAC9D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA4B,CAC9B,KACE,GAAuB,SAAS,MAChC,GAAgC,CACnC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAiB,CACxD,KAAM,GAAmB,MAAQ,GAAqB,CACtD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAqB,CAClE,KAAM,GAAmB,MAAM,MAAQ,GAAyB,CACjE,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAqB,CACnE,KACE,GAAmB,OAAO,MAC1B,EAAwB,CAAE,OAAQ,GAAM,CAAC,CAC5C,CACF,CACF,CACF,CAEK,EAAoB,GAAoB,UAAY,GAAU,CAC9D,EAAgB,GAAoB,MAAQ,GAAc,CAC1D,EAAmB,GAAoB,SAAW,GAAiB,CACnE,EAAkB,GAAoB,QAAU,GAAgB,CAChE,EAAiB,GAAiB,OAAS,GAAe,CAC1D,EAAkB,GAAoB,OAEtC,EAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,EAClC,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,WAAY,CACV,OAAQ,GAAqB,OAC7B,WAAY,CACV,WACE,GAAqB,YAAY,YACjC,GAA0B,CAC5B,KACE,GAAqB,YAAY,MACjC,GAA8B,CAChC,QAAS,CACP,QACE,GAAqB,YAAY,SAAS,SAC1C,GAAiC,CACnC,KACE,GAAqB,YAAY,SAAS,MAC1C,GAAqC,CACxC,CACF,CACF,CACF,CAED,OACE,EAAC,EAAA,CACC,WAAY,CACV,SAAU,EACV,KAAM,EACN,QAAS,EACT,OAAQ,EACR,MAAO,EACP,OAAQ,EACT,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA4B,CAC/B,CACF,CACD,OAAQ,EAAC,GAAA,CAAe,GAAI,EAAA,CAAe,CAC3C,GAAI,WAEJ,EAAC,EAAA,CACa,aACI,mBAChB,EACO"}

package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.d.mts

@@ -0,0 +1,21 @@
+import "react/jsx-runtime";
+
+//#region src/components/controls/dropdown/combobox/ComboboxCreatableOption.d.ts
+type ComboboxCreatableOptionProps = {
+  creatable: boolean;
+  createText?: string;
+  classNames?: {
+    create?: string;
+    createIcon?: {
+      createIcon?: string;
+      root?: string;
+      iconRaw?: {
+        iconRaw?: string;
+        root?: string;
+      };
+    };
+  };
+};
+//#endregion
+export { ComboboxCreatableOptionProps };
+//# sourceMappingURL=ComboboxCreatableOption.d.mts.map

package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxCreatableOption.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/ComboboxCreatableOption.tsx"],"mappings":";;;KAcY,4BAAA;EACV,SAAA;EACA,UAAA;EACA,UAAA;IACE,MAAA;IACA,UAAA;MACE,UAAA;MACA,IAAA;MACA,OAAA;QACE,OAAA;QACA,IAAA;MAAA;IAAA;EAAA;AAAA"}

package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.mjs

@@ -0,0 +1,2 @@
+import{Icon as e}from"../../../data-display/icons/icon/Icon.mjs";import{useDropdownContext as t}from"../DropdownContextProvider.mjs";import{Dropdown as n}from"../Dropdown.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{comboboxOptionCreate as i,comboboxOptionCreateCreate as a,comboboxOptionCreateIcon as o,comboboxOptionCreateIconIconRaw as s,comboboxOptionCreateIconIconRawRoot as c,comboboxOptionCreateIconRoot as l}from"@mage-ui/styled-system/recipes";import{jsx as u,jsxs as d}from"react/jsx-runtime";const f=({creatable:f,createText:p,classNames:m})=>{let{query:h,options:g}=t();return!f||!h||h.trim().length===0||g.some(e=>e.value?.toString().toLowerCase().trim()===h?.toLowerCase().trim())?null:d(n.Option,{value:h,onMouseDown:e=>e.preventDefault(),classNames:{option:r(m?.create??i(),a())},children:[u(e,{path:`/icons/sprite-mage.svg`,name:`mage-combobox-plus`,classNames:{icon:m?.createIcon?.createIcon??o(),root:m?.createIcon?.root??l(),iconRaw:{iconRaw:m?.createIcon?.iconRaw?.iconRaw??s(),root:m?.createIcon?.iconRaw?.root??c()}}}),p??`Create`,` `,`'${h}'`]})};export{f as ComboboxCreatableOption};
+//# sourceMappingURL=ComboboxCreatableOption.mjs.map

package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxCreatableOption.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/ComboboxCreatableOption.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport {\n  comboboxOptionCreate,\n  comboboxOptionCreateCreate,\n  comboboxOptionCreateIcon,\n  comboboxOptionCreateIconIconRaw,\n  comboboxOptionCreateIconIconRawRoot,\n  comboboxOptionCreateIconRoot,\n} from '@mage-ui/styled-system/recipes';\nimport { Icon } from '@/components/data-display';\n\nimport { Dropdown } from '../Dropdown';\nimport { useDropdownContext } from '../DropdownContextProvider';\n\nexport type ComboboxCreatableOptionProps = {\n  creatable: boolean;\n  createText?: string;\n  classNames?: {\n    create?: string;\n    createIcon?: {\n      createIcon?: string;\n      root?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n};\n\nexport const ComboboxCreatableOption = ({\n  creatable,\n  createText,\n  classNames,\n}: ComboboxCreatableOptionProps) => {\n  const { query, options } = useDropdownContext();\n\n  if (!creatable || !query || query.trim().length === 0) {\n    return null;\n  }\n\n  const isFound = options.some(\n    (item) =>\n      item.value?.toString().toLowerCase().trim() ===\n      query?.toLowerCase().trim(),\n  );\n\n  if (isFound) {\n    return null;\n  }\n\n  return (\n    <Dropdown.Option\n      value={query}\n      onMouseDown={(e) => e.preventDefault()}\n      classNames={{\n        option: cx(\n          classNames?.create ?? comboboxOptionCreate(),\n          comboboxOptionCreateCreate(),\n        ),\n      }}\n    >\n      <Icon\n        path='/icons/sprite-mage.svg'\n        name='mage-combobox-plus'\n        classNames={{\n          icon:\n            classNames?.createIcon?.createIcon ?? comboboxOptionCreateIcon(),\n          root: classNames?.createIcon?.root ?? comboboxOptionCreateIconRoot(),\n          iconRaw: {\n            iconRaw:\n              classNames?.createIcon?.iconRaw?.iconRaw ??\n              comboboxOptionCreateIconIconRaw(),\n            root:\n              classNames?.createIcon?.iconRaw?.root ??\n              comboboxOptionCreateIconIconRawRoot(),\n          },\n        }}\n      />\n      {createText ?? 'Create'} {`'${query}'`}\n    </Dropdown.Option>\n  );\n};\n"],"mappings":"sgBA8BA,MAAa,GAA2B,CACtC,YACA,aACA,gBACkC,CAClC,GAAM,CAAE,QAAO,WAAY,GAAoB,CAgB/C,MAdI,CAAC,GAAa,CAAC,GAAS,EAAM,MAAM,CAAC,SAAW,GAIpC,EAAQ,KACrB,GACC,EAAK,OAAO,UAAU,CAAC,aAAa,CAAC,MAAM,GAC3C,GAAO,aAAa,CAAC,MAAM,CAC9B,CAGQ,KAIP,EAAC,EAAS,OAAA,CACR,MAAO,EACP,YAAc,GAAM,EAAE,gBAAgB,CACtC,WAAY,CACV,OAAQ,EACN,GAAY,QAAU,GAAsB,CAC5C,GAA4B,CAC7B,CACF,WAED,EAAC,EAAA,CACC,KAAK,yBACL,KAAK,qBACL,WAAY,CACV,KACE,GAAY,YAAY,YAAc,GAA0B,CAClE,KAAM,GAAY,YAAY,MAAQ,GAA8B,CACpE,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAAiC,CACnC,KACE,GAAY,YAAY,SAAS,MACjC,GAAqC,CACxC,CACF,EACD,CACD,GAAc,SAAS,IAAE,IAAI,EAAM,KACpB"}