@mage-ui/components 1.0.63 → 1.0.65

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (182) hide show
  1. package/dist/components/buttons/button-icon/ButtonIcon.d.mts +4 -5
  2. package/dist/components/buttons/button-icon/ButtonIcon.d.mts.map +1 -1
  3. package/dist/components/buttons/button-icon/ButtonIcon.mjs +1 -1
  4. package/dist/components/buttons/button-icon/ButtonIcon.mjs.map +1 -1
  5. package/dist/components/controls/dropdown/Dropdown.d.mts +19 -63
  6. package/dist/components/controls/dropdown/Dropdown.d.mts.map +1 -1
  7. package/dist/components/controls/dropdown/Dropdown.mjs +1 -1
  8. package/dist/components/controls/dropdown/Dropdown.mjs.map +1 -1
  9. package/dist/components/controls/dropdown/DropdownChevron.d.mts +23 -0
  10. package/dist/components/controls/dropdown/DropdownChevron.d.mts.map +1 -0
  11. package/dist/components/controls/dropdown/DropdownChevron.mjs +2 -0
  12. package/dist/components/controls/dropdown/DropdownChevron.mjs.map +1 -0
  13. package/dist/components/controls/dropdown/DropdownClearButton.d.mts +15 -0
  14. package/dist/components/controls/dropdown/DropdownClearButton.d.mts.map +1 -0
  15. package/dist/components/controls/dropdown/DropdownClearButton.mjs +2 -0
  16. package/dist/components/controls/dropdown/DropdownClearButton.mjs.map +1 -0
  17. package/dist/components/controls/dropdown/DropdownContextProvider.d.mts +11 -0
  18. package/dist/components/controls/dropdown/DropdownContextProvider.d.mts.map +1 -0
  19. package/dist/components/controls/dropdown/DropdownContextProvider.mjs +2 -0
  20. package/dist/components/controls/dropdown/DropdownContextProvider.mjs.map +1 -0
  21. package/dist/components/controls/dropdown/DropdownEndSlot.mjs +2 -0
  22. package/dist/components/controls/dropdown/DropdownEndSlot.mjs.map +1 -0
  23. package/dist/components/controls/dropdown/DropdownTargetTextInput.d.mts +19 -0
  24. package/dist/components/controls/dropdown/DropdownTargetTextInput.d.mts.map +1 -0
  25. package/dist/components/controls/dropdown/DropdownTargetTextInput.mjs +2 -0
  26. package/dist/components/controls/dropdown/DropdownTargetTextInput.mjs.map +1 -0
  27. package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts +40 -0
  28. package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts.map +1 -0
  29. package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs +2 -0
  30. package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs.map +1 -0
  31. package/dist/components/controls/dropdown/autocomplete/AutocompleteLoader.mjs +2 -0
  32. package/dist/components/controls/dropdown/autocomplete/AutocompleteLoader.mjs.map +1 -0
  33. package/dist/components/controls/dropdown/autocomplete/AutocompleteTarget.mjs +2 -0
  34. package/dist/components/controls/dropdown/autocomplete/AutocompleteTarget.mjs.map +1 -0
  35. package/dist/components/controls/dropdown/combobox/Combobox.d.mts +35 -0
  36. package/dist/components/controls/dropdown/combobox/Combobox.d.mts.map +1 -0
  37. package/dist/components/controls/dropdown/combobox/Combobox.mjs +2 -0
  38. package/dist/components/controls/dropdown/combobox/Combobox.mjs.map +1 -0
  39. package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.d.mts +21 -0
  40. package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.d.mts.map +1 -0
  41. package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.mjs +2 -0
  42. package/dist/components/controls/dropdown/combobox/ComboboxCreatableOption.mjs.map +1 -0
  43. package/dist/components/controls/dropdown/combobox/ComboboxEmptyOption.d.mts +12 -0
  44. package/dist/components/controls/dropdown/combobox/ComboboxEmptyOption.d.mts.map +1 -0
  45. package/dist/components/controls/dropdown/combobox/ComboboxEmptyOption.mjs +2 -0
  46. package/dist/components/controls/dropdown/combobox/ComboboxEmptyOption.mjs.map +1 -0
  47. package/dist/components/controls/dropdown/combobox/ComboboxOptions.mjs +2 -0
  48. package/dist/components/controls/dropdown/combobox/ComboboxOptions.mjs.map +1 -0
  49. package/dist/components/controls/dropdown/combobox/ComboboxTarget.d.mts +8 -0
  50. package/dist/components/controls/dropdown/combobox/ComboboxTarget.d.mts.map +1 -0
  51. package/dist/components/controls/dropdown/combobox/ComboboxTarget.mjs +2 -0
  52. package/dist/components/controls/dropdown/combobox/ComboboxTarget.mjs.map +1 -0
  53. package/dist/components/controls/dropdown/select/Select.d.mts +38 -0
  54. package/dist/components/controls/dropdown/select/Select.d.mts.map +1 -0
  55. package/dist/components/controls/dropdown/select/Select.mjs +2 -0
  56. package/dist/components/controls/dropdown/select/Select.mjs.map +1 -0
  57. package/dist/components/controls/dropdown/select/SelectSearch.mjs +2 -0
  58. package/dist/components/controls/dropdown/select/SelectSearch.mjs.map +1 -0
  59. package/dist/components/controls/index.d.mts +5 -12
  60. package/dist/components/controls/text-input/TextInput.d.mts +1 -0
  61. package/dist/components/controls/text-input/TextInput.d.mts.map +1 -1
  62. package/dist/components/controls/text-input/TextInput.mjs.map +1 -1
  63. package/dist/components/data-display/description-list/DescriptionList.d.mts +36 -0
  64. package/dist/components/data-display/description-list/DescriptionList.d.mts.map +1 -0
  65. package/dist/components/data-display/description-list/DescriptionList.mjs +2 -0
  66. package/dist/components/data-display/description-list/DescriptionList.mjs.map +1 -0
  67. package/dist/components/data-display/icons/icon-raw/IconRaw.d.mts +4 -3
  68. package/dist/components/data-display/icons/icon-raw/IconRaw.d.mts.map +1 -1
  69. package/dist/components/data-display/icons/icon-raw/IconRaw.mjs +1 -1
  70. package/dist/components/data-display/icons/icon-raw/IconRaw.mjs.map +1 -1
  71. package/dist/components/data-display/index.d.mts +12 -0
  72. package/dist/components/data-display/kanban/Kanban.d.mts +63 -0
  73. package/dist/components/data-display/kanban/Kanban.d.mts.map +1 -0
  74. package/dist/components/data-display/kanban/Kanban.mjs +2 -0
  75. package/dist/components/data-display/kanban/Kanban.mjs.map +1 -0
  76. package/dist/components/data-display/kanban/KanbanCard.d.mts +21 -0
  77. package/dist/components/data-display/kanban/KanbanCard.d.mts.map +1 -0
  78. package/dist/components/data-display/kanban/KanbanCard.mjs +2 -0
  79. package/dist/components/data-display/kanban/KanbanCard.mjs.map +1 -0
  80. package/dist/components/data-display/kanban/KanbanCardDragIndicator.mjs +2 -0
  81. package/dist/components/data-display/kanban/KanbanCardDragIndicator.mjs.map +1 -0
  82. package/dist/components/data-display/kanban/KanbanColumnHeader.mjs +2 -0
  83. package/dist/components/data-display/kanban/KanbanColumnHeader.mjs.map +1 -0
  84. package/dist/components/data-display/kanban/KanbanListFooter.mjs +2 -0
  85. package/dist/components/data-display/kanban/KanbanListFooter.mjs.map +1 -0
  86. package/dist/components/data-display/table/Table.d.mts +51 -0
  87. package/dist/components/data-display/table/Table.d.mts.map +1 -0
  88. package/dist/components/data-display/table/Table.mjs +2 -0
  89. package/dist/components/data-display/table/Table.mjs.map +1 -0
  90. package/dist/components/data-display/table/TableBody.d.mts +11 -0
  91. package/dist/components/data-display/table/TableBody.d.mts.map +1 -0
  92. package/dist/components/data-display/table/TableBody.mjs +2 -0
  93. package/dist/components/data-display/table/TableBody.mjs.map +1 -0
  94. package/dist/components/data-display/table/TableCaption.d.mts +11 -0
  95. package/dist/components/data-display/table/TableCaption.d.mts.map +1 -0
  96. package/dist/components/data-display/table/TableCaption.mjs +2 -0
  97. package/dist/components/data-display/table/TableCaption.mjs.map +1 -0
  98. package/dist/components/data-display/table/TableCell.d.mts +12 -0
  99. package/dist/components/data-display/table/TableCell.d.mts.map +1 -0
  100. package/dist/components/data-display/table/TableCell.mjs +2 -0
  101. package/dist/components/data-display/table/TableCell.mjs.map +1 -0
  102. package/dist/components/data-display/table/TableContext.mjs +2 -0
  103. package/dist/components/data-display/table/TableContext.mjs.map +1 -0
  104. package/dist/components/data-display/table/TableFoot.d.mts +11 -0
  105. package/dist/components/data-display/table/TableFoot.d.mts.map +1 -0
  106. package/dist/components/data-display/table/TableFoot.mjs +2 -0
  107. package/dist/components/data-display/table/TableFoot.mjs.map +1 -0
  108. package/dist/components/data-display/table/TableHead.d.mts +12 -0
  109. package/dist/components/data-display/table/TableHead.d.mts.map +1 -0
  110. package/dist/components/data-display/table/TableHead.mjs +2 -0
  111. package/dist/components/data-display/table/TableHead.mjs.map +1 -0
  112. package/dist/components/data-display/table/TableHeaderCell.d.mts +11 -0
  113. package/dist/components/data-display/table/TableHeaderCell.d.mts.map +1 -0
  114. package/dist/components/data-display/table/TableHeaderCell.mjs +2 -0
  115. package/dist/components/data-display/table/TableHeaderCell.mjs.map +1 -0
  116. package/dist/components/data-display/table/TableRoot.mjs +2 -0
  117. package/dist/components/data-display/table/TableRoot.mjs.map +1 -0
  118. package/dist/components/data-display/table/TableRow.d.mts +12 -0
  119. package/dist/components/data-display/table/TableRow.d.mts.map +1 -0
  120. package/dist/components/data-display/table/TableRow.mjs +2 -0
  121. package/dist/components/data-display/table/TableRow.mjs.map +1 -0
  122. package/dist/components/data-display/table/TableScroll.d.mts +14 -0
  123. package/dist/components/data-display/table/TableScroll.d.mts.map +1 -0
  124. package/dist/components/data-display/table/TableScroll.mjs +2 -0
  125. package/dist/components/data-display/table/TableScroll.mjs.map +1 -0
  126. package/dist/components/data-display/table/TableTypes.d.mts +33 -0
  127. package/dist/components/data-display/table/TableTypes.d.mts.map +1 -0
  128. package/dist/components/index.d.mts +23 -15
  129. package/dist/components/misc/index.d.mts +2 -1
  130. package/dist/components/misc/scroll-area/ScrollArea.d.mts +16 -16
  131. package/dist/components/misc/scroll-area/ScrollArea.d.mts.map +1 -1
  132. package/dist/components/misc/scroll-area/ScrollArea.mjs +1 -1
  133. package/dist/components/misc/scroll-area/ScrollArea.mjs.map +1 -1
  134. package/dist/components/misc/scroll-area-autosize/ScrollAreaAutosize.d.mts +2 -5
  135. package/dist/components/misc/scroll-area-autosize/ScrollAreaAutosize.d.mts.map +1 -1
  136. package/dist/components/misc/scroll-area-autosize/ScrollAreaAutosize.mjs +1 -1
  137. package/dist/components/misc/scroll-area-autosize/ScrollAreaAutosize.mjs.map +1 -1
  138. package/dist/components/misc/virtual/Virtual.d.mts +29 -0
  139. package/dist/components/misc/virtual/Virtual.d.mts.map +1 -0
  140. package/dist/components/misc/virtual/Virtual.mjs +2 -0
  141. package/dist/components/misc/virtual/Virtual.mjs.map +1 -0
  142. package/dist/components/navigations/index.d.mts +1 -1
  143. package/dist/components/overlays/modal/Modal.mjs +1 -1
  144. package/dist/components/overlays/modal/Modal.mjs.map +1 -1
  145. package/dist/components/overlays/modal/modal-core.mjs +1 -1
  146. package/dist/components/overlays/modal/modal-core.mjs.map +1 -1
  147. package/dist/index.d.mts +23 -15
  148. package/dist/index.mjs +1 -1
  149. package/package.json +9 -5
  150. package/dist/components/controls/autocomplete/Autocomplete.d.mts +0 -35
  151. package/dist/components/controls/autocomplete/Autocomplete.d.mts.map +0 -1
  152. package/dist/components/controls/autocomplete/Autocomplete.mjs +0 -2
  153. package/dist/components/controls/autocomplete/Autocomplete.mjs.map +0 -1
  154. package/dist/components/controls/combobox/Combobox.d.mts +0 -58
  155. package/dist/components/controls/combobox/Combobox.d.mts.map +0 -1
  156. package/dist/components/controls/combobox/Combobox.mjs +0 -2
  157. package/dist/components/controls/combobox/Combobox.mjs.map +0 -1
  158. package/dist/components/controls/multi-select/MultiSelect.d.mts +0 -45
  159. package/dist/components/controls/multi-select/MultiSelect.d.mts.map +0 -1
  160. package/dist/components/controls/multi-select/MultiSelect.mjs +0 -2
  161. package/dist/components/controls/multi-select/MultiSelect.mjs.map +0 -1
  162. package/dist/components/controls/multi-select/MultiSelectTags.d.mts +0 -63
  163. package/dist/components/controls/multi-select/MultiSelectTags.d.mts.map +0 -1
  164. package/dist/components/controls/multi-select/MultiSelectTags.mjs +0 -2
  165. package/dist/components/controls/multi-select/MultiSelectTags.mjs.map +0 -1
  166. package/dist/components/controls/password-input-strength/oldPasswordInputStrength.d.mts +0 -43
  167. package/dist/components/controls/password-input-strength/oldPasswordInputStrength.d.mts.map +0 -1
  168. package/dist/components/controls/password-input-strength/oldPasswordInputStrength.mjs +0 -2
  169. package/dist/components/controls/password-input-strength/oldPasswordInputStrength.mjs.map +0 -1
  170. package/dist/components/controls/select/Select.d.mts +0 -38
  171. package/dist/components/controls/select/Select.d.mts.map +0 -1
  172. package/dist/components/controls/select/Select.mjs +0 -2
  173. package/dist/components/controls/select/Select.mjs.map +0 -1
  174. package/dist/components/controls/utils/chevron/Chevron.d.mts +0 -27
  175. package/dist/components/controls/utils/chevron/Chevron.d.mts.map +0 -1
  176. package/dist/components/controls/utils/chevron/Chevron.mjs +0 -2
  177. package/dist/components/controls/utils/chevron/Chevron.mjs.map +0 -1
  178. package/dist/components/controls/utils/clear-button/ClearButton.d.mts +0 -26
  179. package/dist/components/controls/utils/clear-button/ClearButton.d.mts.map +0 -1
  180. package/dist/components/controls/utils/clear-button/ClearButton.mjs +0 -2
  181. package/dist/components/controls/utils/clear-button/ClearButton.mjs.map +0 -1
  182. package/dist/components/controls/utils/index.d.mts +0 -2
@@ -1,8 +1,8 @@
1
1
  import * as react_jsx_runtime0 from "react/jsx-runtime";
2
- import { ComponentProps } from "react";
2
+ import { ComponentPropsWithoutRef } from "react";
3
3
 
4
4
  //#region src/components/buttons/button-icon/ButtonIcon.d.ts
5
- type ButtonIconProps = ComponentProps<'button'> & {
5
+ type ButtonIconProps = ComponentPropsWithoutRef<'button'> & {
6
6
  name: string;
7
7
  path: string;
8
8
  label: string;
@@ -20,9 +20,8 @@ declare const ButtonIcon: ({
20
20
  label,
21
21
  name,
22
22
  path,
23
- onClick,
24
- disabled,
25
- classNames
23
+ classNames,
24
+ ...props
26
25
  }: ButtonIconProps) => react_jsx_runtime0.JSX.Element;
27
26
  //#endregion
28
27
  export { ButtonIcon, ButtonIconProps };
@@ -1 +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"}
1
+ {"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"}
@@ -1,2 +1,2 @@
1
- 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};
1
+ 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};
2
2
  //# sourceMappingURL=ButtonIcon.mjs.map
@@ -1 +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"}
1
+ {"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"}
@@ -1,83 +1,39 @@
1
- import { ComboboxStore } from "@mantine/core";
1
+ import { ScrollAreaAutosizeProps } from "../../misc/scroll-area-autosize/ScrollAreaAutosize.mjs";
2
+ import "../../misc/index.mjs";
3
+ import { DropdownValue } from "./DropdownContextProvider.mjs";
4
+ import "@mantine/core";
2
5
  import "react/jsx-runtime";
3
6
  import { ReactNode } from "react";
4
7
 
5
8
  //#region src/components/controls/dropdown/Dropdown.d.ts
6
- type DefaultEndSlotClassNames = {
7
- chevron?: {
8
- iconWrapped?: string;
9
- root?: string;
10
- open?: {
11
- iconRaw?: string;
12
- root?: string;
13
- };
14
- close?: {
15
- iconRaw?: string;
16
- root?: string;
17
- };
18
- };
19
- clearButton?: {
20
- buttonIcon?: string;
21
- root?: string;
22
- icon?: string;
23
- iconRaw?: {
24
- iconRaw?: string;
25
- root?: string;
26
- };
27
- };
28
- };
29
- type DropdownTextInputClassNames = {
30
- textInput?: string;
31
- root?: string;
32
- label?: string;
33
- description?: string;
34
- error?: string;
35
- wrapper?: string;
36
- input?: string;
37
- section?: string;
38
- required?: string;
39
- endSlot?: DefaultEndSlotClassNames;
9
+ type DataAttributes = {
10
+ [key: `data-${string}`]: string | number | boolean | undefined;
40
11
  };
41
12
  type DropdownProps = {
42
- onChange: (event: ComboboxStore, value?: string) => void;
43
- onFocus: (event: ComboboxStore) => void;
44
- onBlur: (event: ComboboxStore) => void;
45
- onClick: (event: ComboboxStore) => void;
46
13
  children: ReactNode;
47
- startSlot?: ReactNode;
48
- endSlot?: ReactNode;
49
- readOnly?: boolean;
50
- name?: string;
51
- label?: ReactNode;
52
- description?: ReactNode;
53
- error?: ReactNode;
54
- disabled?: boolean;
55
- placeholder?: string;
56
14
  withinPortal?: boolean;
57
15
  keepMounted?: boolean;
58
- clearable?: boolean;
59
- chevron?: boolean;
60
- offset?: number;
61
16
  classNames?: {
62
17
  dropdown?: string;
63
18
  root?: string;
64
19
  options?: string;
65
20
  option?: string;
66
21
  empty?: string;
67
- search?: string;
68
- textInput?: DropdownTextInputClassNames;
69
- scrollArea?: {
70
- scrollArea?: string;
22
+ search?: {
23
+ root?: string;
24
+ input?: string;
25
+ };
26
+ };
27
+ target: ReactNode;
28
+ options: DropdownValue[];
29
+ scrollAreaProps?: Partial<Omit<ScrollAreaAutosizeProps, 'children' | 'classNames'>> & {
30
+ classNames?: Omit<NonNullable<ScrollAreaAutosizeProps['classNames']>, 'scrollArea'> & {
31
+ dropdownScrollAreaAutosize?: string;
71
32
  };
72
33
  };
73
- value?: string;
74
- search?: string;
75
- setValue: (value: string | undefined, combobox: ComboboxStore) => void;
76
- store?: ComboboxStore;
77
- target?: ReactNode;
78
- btnClearLabel?: string;
79
34
  dropdownHeight?: number | string;
80
- };
35
+ shouldFilter?: boolean;
36
+ } & DataAttributes;
81
37
  //#endregion
82
- export { DropdownProps, DropdownTextInputClassNames };
38
+ export { DropdownProps };
83
39
  //# sourceMappingURL=Dropdown.d.mts.map
@@ -1 +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"}
1
+ {"version":3,"file":"Dropdown.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/Dropdown.tsx"],"mappings":";;;;;;;;KAoBK,cAAA;EAAA,CACF,GAAA;AAAA;AAAA,KAGS,aAAA;EACV,QAAA,EAAU,SAAA;EACV,YAAA;EACA,WAAA;EACA,UAAA;IACE,QAAA;IACA,IAAA;IACA,OAAA;IACA,MAAA;IACA,KAAA;IACA,MAAA;MACE,IAAA;MACA,KAAA;IAAA;EAAA;EAGJ,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,IACE,cAAA"}
@@ -1,2 +1,2 @@
1
- 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};
1
+ 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(),b=Object.fromEntries(Object.entries(_).filter(([e])=>e.startsWith(`data-`))),x=Object.fromEntries(Object.entries(_).filter(([e])=>!e.startsWith(`data-`)));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:r(p?.search?.root,p?.search?.input)},...x,children:[d(u.Target,{children:m}),d(u.Dropdown,{...b,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};
2
2
  //# sourceMappingURL=Dropdown.mjs.map
@@ -1 +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"}
1
+ {"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\ntype DataAttributes = {\n [key: `data-${string}`]: string | number | boolean | undefined;\n};\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?: {\n root?: string;\n input?: string;\n };\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} & DataAttributes;\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 const dataAttributes = Object.fromEntries(\n Object.entries(props).filter(([key]) => key.startsWith('data-')),\n ) as DataAttributes;\n const comboboxProps = Object.fromEntries(\n Object.entries(props).filter(([key]) => !key.startsWith('data-')),\n );\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: cx(classNames?.search?.root, classNames?.search?.input),\n }}\n {...comboboxProps}\n >\n <MantineCombobox.Target>{target}</MantineCombobox.Target>\n <MantineCombobox.Dropdown {...dataAttributes}>\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":"+eAuDA,MAAM,GAAmB,CACvB,WACA,aACA,SACA,kBACA,iBAAiB,IACjB,GAAG,KACiC,CACpC,GAAM,CAAE,QAAO,YAAa,GAAoB,CAC1C,EAAiB,OAAO,YAC5B,OAAO,QAAQ,EAAM,CAAC,QAAQ,CAAC,KAAS,EAAI,WAAW,QAAQ,CAAC,CACjE,CACK,EAAgB,OAAO,YAC3B,OAAO,QAAQ,EAAM,CAAC,QAAQ,CAAC,KAAS,CAAC,EAAI,WAAW,QAAQ,CAAC,CAClE,CAED,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,EAAG,GAAY,QAAQ,KAAM,GAAY,QAAQ,MAAM,CAChE,CACD,GAAI,YAEJ,EAACA,EAAgB,OAAA,CAAA,SAAQ,EAAA,CAAgC,CACzD,EAACA,EAAgB,SAAA,CAAS,GAAI,WAC5B,EAAC,EAAA,CACC,KAAK,SACL,IAAK,EACL,WAAY,CACV,WACE,GAAiB,YAAY,4BAC7B,GAA4B,CAC/B,CACD,GAAI,EAEH,YACkB,EACI,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"}
@@ -0,0 +1,23 @@
1
+ import "react/jsx-runtime";
2
+
3
+ //#region src/components/controls/dropdown/DropdownChevron.d.ts
4
+ type DropdownChevronProps = {
5
+ chevronOpen?: string;
6
+ chevronClose?: string;
7
+ path?: string;
8
+ classNames?: {
9
+ chevron?: string;
10
+ root?: string;
11
+ open?: {
12
+ iconRaw?: string;
13
+ root?: string;
14
+ };
15
+ close?: {
16
+ iconRaw?: string;
17
+ root?: string;
18
+ };
19
+ };
20
+ };
21
+ //#endregion
22
+ export { DropdownChevronProps };
23
+ //# sourceMappingURL=DropdownChevron.d.mts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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,"data-scope":`close`,classNames:{iconRaw:d?.close?.iconRaw??r(),root:d?.close?.root??i()}})]});export{c as DropdownChevron};
2
+ //# sourceMappingURL=DropdownChevron.mjs.map
@@ -0,0 +1 @@
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 data-scope='close'\n classNames={{\n iconRaw: classNames?.close?.iconRaw ?? dropdownChevronIcon(),\n root: classNames?.close?.root ?? dropdownChevronIconRoot(),\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,aAAW,QACX,WAAY,CACV,QAAS,GAAY,OAAO,SAAW,GAAqB,CAC5D,KAAM,GAAY,OAAO,MAAQ,GAAyB,CAC3D,EACD,CAAA,EACU"}
@@ -0,0 +1,15 @@
1
+ import { ButtonIconProps } from "../../buttons/button-icon/ButtonIcon.mjs";
2
+ import "react/jsx-runtime";
3
+
4
+ //#region src/components/controls/dropdown/DropdownClearButton.d.ts
5
+ type DropdownClearButtonProps = Omit<ButtonIconProps, 'classNames' | 'label' | 'name' | 'path'> & {
6
+ classNames?: Omit<NonNullable<ButtonIconProps['classNames']>, 'buttonIcon'> & {
7
+ clearButton?: string;
8
+ };
9
+ label?: string;
10
+ name?: string;
11
+ path?: string;
12
+ };
13
+ //#endregion
14
+ export { DropdownClearButtonProps };
15
+ //# sourceMappingURL=DropdownClearButton.d.mts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=DropdownClearButton.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,11 @@
1
+ import "@mantine/core";
2
+ import "react/jsx-runtime";
3
+
4
+ //#region src/components/controls/dropdown/DropdownContextProvider.d.ts
5
+ type DropdownValue = {
6
+ id: string | number;
7
+ value: string | number | undefined | null;
8
+ };
9
+ //#endregion
10
+ export { DropdownValue };
11
+ //# sourceMappingURL=DropdownContextProvider.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DropdownContextProvider.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownContextProvider.tsx"],"mappings":";;;;KAIY,aAAA;EACV,EAAA;EACA,KAAA;AAAA"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=DropdownContextProvider.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=DropdownEndSlot.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,19 @@
1
+ import { TextInputProps } from "../text-input/TextInput.mjs";
2
+ import { DropdownChevronProps } from "./DropdownChevron.mjs";
3
+ import { DropdownClearButtonProps } from "./DropdownClearButton.mjs";
4
+ import "react/jsx-runtime";
5
+
6
+ //#region src/components/controls/dropdown/DropdownTargetTextInput.d.ts
7
+ type DropdownTargetTextInputProps = Omit<TextInputProps, 'classNames'> & {
8
+ classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {
9
+ dropdownTextInput?: string;
10
+ };
11
+ clearButtonProps?: DropdownClearButtonProps;
12
+ chevronProps?: DropdownChevronProps;
13
+ showChevron?: boolean;
14
+ clearable?: boolean;
15
+ closeOnBlur?: boolean;
16
+ };
17
+ //#endregion
18
+ export { DropdownTargetTextInputProps };
19
+ //# sourceMappingURL=DropdownTargetTextInput.d.mts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=DropdownTargetTextInput.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,40 @@
1
+ import { DropdownValue } from "../DropdownContextProvider.mjs";
2
+ import { ComboboxTargetProps } from "../combobox/ComboboxTarget.mjs";
3
+ import { ComboboxProps } from "../combobox/Combobox.mjs";
4
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
5
+
6
+ //#region src/components/controls/dropdown/autocomplete/Autocomplete.d.ts
7
+ type AutocompleteProps = Omit<ComboboxProps, 'options' | 'classNames'> & {
8
+ name: string;
9
+ url?: string;
10
+ fetcher: (params: {
11
+ url?: string;
12
+ query: string;
13
+ }) => Promise<DropdownValue[]>;
14
+ threshold?: number;
15
+ debounce?: number;
16
+ query?: string;
17
+ classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {
18
+ target?: ComboboxTargetProps['classNames'] & {
19
+ clearButton?: NonNullable<ComboboxTargetProps['clearButtonProps']>['classNames'];
20
+ };
21
+ };
22
+ };
23
+ declare const Autocomplete: ({
24
+ name,
25
+ label,
26
+ placeholder,
27
+ creatable,
28
+ url,
29
+ fetcher,
30
+ query,
31
+ debounce,
32
+ threshold,
33
+ clearButtonText,
34
+ emptyText,
35
+ classNames,
36
+ ...props
37
+ }: AutocompleteProps) => react_jsx_runtime0.JSX.Element;
38
+ //#endregion
39
+ export { Autocomplete, AutocompleteProps };
40
+ //# sourceMappingURL=Autocomplete.d.mts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=Autocomplete.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=AutocompleteLoader.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=AutocompleteTarget.mjs.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,35 @@
1
+ import { DropdownProps } from "../Dropdown.mjs";
2
+ import { ComboboxCreatableOptionProps } from "./ComboboxCreatableOption.mjs";
3
+ import { ComboboxEmptyOptionProps } from "./ComboboxEmptyOption.mjs";
4
+ import { ComboboxTargetProps } from "./ComboboxTarget.mjs";
5
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
6
+
7
+ //#region src/components/controls/dropdown/combobox/Combobox.d.ts
8
+ type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> & {
9
+ label?: string;
10
+ placeholder?: string;
11
+ creatable?: boolean;
12
+ emptyText?: string;
13
+ clearButtonText?: string;
14
+ classNames?: DropdownProps['classNames'] & {
15
+ creatable?: ComboboxCreatableOptionProps['classNames'];
16
+ empty?: ComboboxEmptyOptionProps['classNames'];
17
+ target?: ComboboxTargetProps['classNames'] & {
18
+ clearButton?: NonNullable<ComboboxTargetProps['clearButtonProps']>['classNames'];
19
+ chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];
20
+ };
21
+ scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];
22
+ };
23
+ };
24
+ declare const Combobox: ({
25
+ label,
26
+ placeholder,
27
+ creatable,
28
+ clearButtonText,
29
+ emptyText,
30
+ classNames,
31
+ ...props
32
+ }: ComboboxProps) => react_jsx_runtime0.JSX.Element;
33
+ //#endregion
34
+ export { Combobox, ComboboxProps };
35
+ //# sourceMappingURL=Combobox.d.mts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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()}}}},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};
2
+ //# sourceMappingURL=Combobox.mjs.map
@@ -0,0 +1 @@
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: chevronClassNames?.close?.root ?? comboboxChevronIconRoot(),\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,KAAM,GAAmB,OAAO,MAAQ,GAAyB,CAClE,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"}
@@ -0,0 +1,21 @@
1
+ import "react/jsx-runtime";
2
+
3
+ //#region src/components/controls/dropdown/combobox/ComboboxCreatableOption.d.ts
4
+ type ComboboxCreatableOptionProps = {
5
+ creatable: boolean;
6
+ createText?: string;
7
+ classNames?: {
8
+ create?: string;
9
+ createIcon?: {
10
+ createIcon?: string;
11
+ root?: string;
12
+ iconRaw?: {
13
+ iconRaw?: string;
14
+ root?: string;
15
+ };
16
+ };
17
+ };
18
+ };
19
+ //#endregion
20
+ export { ComboboxCreatableOptionProps };
21
+ //# sourceMappingURL=ComboboxCreatableOption.d.mts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,2 @@
1
+ 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};
2
+ //# sourceMappingURL=ComboboxCreatableOption.mjs.map