@mantine/core 9.0.0 → 9.0.2

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 (474) hide show
  1. package/cjs/components/Accordion/Accordion.cjs.map +1 -1
  2. package/cjs/components/Accordion/Accordion.module.cjs.map +1 -1
  3. package/cjs/components/ActionIcon/ActionIcon.cjs.map +1 -1
  4. package/cjs/components/Affix/Affix.cjs.map +1 -1
  5. package/cjs/components/Alert/Alert.cjs.map +1 -1
  6. package/cjs/components/Anchor/Anchor.cjs.map +1 -1
  7. package/cjs/components/AngleSlider/AngleSlider.cjs.map +1 -1
  8. package/cjs/components/AppShell/AppShell.cjs.map +1 -1
  9. package/cjs/components/AspectRatio/AspectRatio.cjs.map +1 -1
  10. package/cjs/components/Autocomplete/Autocomplete.cjs +1 -1
  11. package/cjs/components/Autocomplete/Autocomplete.cjs.map +1 -1
  12. package/cjs/components/Avatar/Avatar.cjs.map +1 -1
  13. package/cjs/components/BackgroundImage/BackgroundImage.cjs.map +1 -1
  14. package/cjs/components/Badge/Badge.cjs.map +1 -1
  15. package/cjs/components/Badge/Badge.module.cjs.map +1 -1
  16. package/cjs/components/Blockquote/Blockquote.cjs.map +1 -1
  17. package/cjs/components/Breadcrumbs/Breadcrumbs.cjs.map +1 -1
  18. package/cjs/components/Burger/Burger.cjs.map +1 -1
  19. package/cjs/components/Button/Button.cjs.map +1 -1
  20. package/cjs/components/Card/Card.cjs.map +1 -1
  21. package/cjs/components/Center/Center.cjs.map +1 -1
  22. package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
  23. package/cjs/components/Checkbox/CheckboxGroup/CheckboxGroup.cjs.map +1 -1
  24. package/cjs/components/Chip/Chip.cjs.map +1 -1
  25. package/cjs/components/Chip/ChipGroup/ChipGroup.cjs.map +1 -1
  26. package/cjs/components/CloseButton/CloseButton.cjs.map +1 -1
  27. package/cjs/components/Code/Code.cjs.map +1 -1
  28. package/cjs/components/Collapse/Collapse.cjs.map +1 -1
  29. package/cjs/components/ColorInput/ColorInput.cjs.map +1 -1
  30. package/cjs/components/ColorPicker/AlphaSlider/AlphaSlider.cjs.map +1 -1
  31. package/cjs/components/ColorPicker/ColorPicker.cjs.map +1 -1
  32. package/cjs/components/ColorPicker/HueSlider/HueSlider.cjs.map +1 -1
  33. package/cjs/components/ColorSwatch/ColorSwatch.cjs.map +1 -1
  34. package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs +1 -0
  35. package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs.map +1 -1
  36. package/cjs/components/Combobox/use-combobox-target-props/use-combobox-target-props.cjs.map +1 -1
  37. package/cjs/components/Container/Container.cjs.map +1 -1
  38. package/cjs/components/Dialog/Dialog.cjs.map +1 -1
  39. package/cjs/components/Divider/Divider.cjs.map +1 -1
  40. package/cjs/components/Fieldset/Fieldset.cjs.map +1 -1
  41. package/cjs/components/FileButton/FileButton.cjs.map +1 -1
  42. package/cjs/components/FileInput/FileInput.cjs.map +1 -1
  43. package/cjs/components/Flex/Flex.cjs.map +1 -1
  44. package/cjs/components/FloatingIndicator/FloatingIndicator.cjs.map +1 -1
  45. package/cjs/components/FloatingWindow/FloatingWindow.cjs.map +1 -1
  46. package/cjs/components/Grid/Grid.cjs.map +1 -1
  47. package/cjs/components/Group/Group.cjs.map +1 -1
  48. package/cjs/components/Highlight/Highlight.cjs.map +1 -1
  49. package/cjs/components/Image/Image.cjs.map +1 -1
  50. package/cjs/components/Indicator/Indicator.cjs.map +1 -1
  51. package/cjs/components/Input/Input.cjs +3 -2
  52. package/cjs/components/Input/Input.cjs.map +1 -1
  53. package/cjs/components/InputBase/InputBase.cjs.map +1 -1
  54. package/cjs/components/JsonInput/JsonInput.cjs.map +1 -1
  55. package/cjs/components/Kbd/Kbd.cjs.map +1 -1
  56. package/cjs/components/List/List.cjs.map +1 -1
  57. package/cjs/components/Loader/Loader.cjs.map +1 -1
  58. package/cjs/components/LoadingOverlay/LoadingOverlay.cjs +1 -0
  59. package/cjs/components/LoadingOverlay/LoadingOverlay.cjs.map +1 -1
  60. package/cjs/components/Mark/Mark.cjs.map +1 -1
  61. package/cjs/components/Marquee/Marquee.cjs.map +1 -1
  62. package/cjs/components/Menu/Menu.cjs.map +1 -1
  63. package/cjs/components/Modal/Modal.cjs.map +1 -1
  64. package/cjs/components/MultiSelect/MultiSelect.cjs +3 -1
  65. package/cjs/components/MultiSelect/MultiSelect.cjs.map +1 -1
  66. package/cjs/components/NativeSelect/NativeSelect.cjs +4 -1
  67. package/cjs/components/NativeSelect/NativeSelect.cjs.map +1 -1
  68. package/cjs/components/NavLink/NavLink.cjs.map +1 -1
  69. package/cjs/components/Notification/Notification.cjs.map +1 -1
  70. package/cjs/components/NumberInput/NumberInput.cjs +1 -0
  71. package/cjs/components/NumberInput/NumberInput.cjs.map +1 -1
  72. package/cjs/components/OverflowList/OverflowList.cjs.map +1 -1
  73. package/cjs/components/Overlay/Overlay.cjs.map +1 -1
  74. package/cjs/components/Pagination/Pagination.cjs.map +1 -1
  75. package/cjs/components/Paper/Paper.cjs.map +1 -1
  76. package/cjs/components/PasswordInput/PasswordInput.cjs +4 -1
  77. package/cjs/components/PasswordInput/PasswordInput.cjs.map +1 -1
  78. package/cjs/components/Pill/Pill.cjs.map +1 -1
  79. package/cjs/components/PillsInput/PillsInput.cjs.map +1 -1
  80. package/cjs/components/PinInput/PinInput.cjs.map +1 -1
  81. package/cjs/components/Popover/Popover.cjs +9 -0
  82. package/cjs/components/Popover/Popover.cjs.map +1 -1
  83. package/cjs/components/Portal/OptionalPortal.cjs.map +1 -1
  84. package/cjs/components/Portal/Portal.cjs.map +1 -1
  85. package/cjs/components/Progress/Progress.cjs.map +1 -1
  86. package/cjs/components/Radio/Radio.cjs.map +1 -1
  87. package/cjs/components/Radio/RadioGroup/RadioGroup.cjs.map +1 -1
  88. package/cjs/components/Rating/Rating.cjs.map +1 -1
  89. package/cjs/components/RingProgress/RingProgress.cjs +1 -0
  90. package/cjs/components/RingProgress/RingProgress.cjs.map +1 -1
  91. package/cjs/components/ScrollArea/ScrollArea.cjs.map +1 -1
  92. package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs.map +1 -1
  93. package/cjs/components/Scroller/Scroller.cjs.map +1 -1
  94. package/cjs/components/SegmentedControl/SegmentedControl.cjs.map +1 -1
  95. package/cjs/components/Select/Select.cjs +1 -0
  96. package/cjs/components/Select/Select.cjs.map +1 -1
  97. package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs +1 -2
  98. package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs.map +1 -1
  99. package/cjs/components/SimpleGrid/SimpleGrid.cjs.map +1 -1
  100. package/cjs/components/Skeleton/Skeleton.cjs.map +1 -1
  101. package/cjs/components/Slider/RangeSlider/RangeSlider.cjs.map +1 -1
  102. package/cjs/components/Slider/Slider/Slider.cjs.map +1 -1
  103. package/cjs/components/Slider/Slider.module.cjs.map +1 -1
  104. package/cjs/components/Space/Space.cjs.map +1 -1
  105. package/cjs/components/Spoiler/Spoiler.cjs.map +1 -1
  106. package/cjs/components/Stack/Stack.cjs.map +1 -1
  107. package/cjs/components/Stepper/Stepper.cjs.map +1 -1
  108. package/cjs/components/Switch/Switch.cjs.map +1 -1
  109. package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs.map +1 -1
  110. package/cjs/components/Table/Table.cjs.map +1 -1
  111. package/cjs/components/TableOfContents/TableOfContents.cjs.map +1 -1
  112. package/cjs/components/Tabs/Tabs.cjs.map +1 -1
  113. package/cjs/components/TagsInput/TagsInput.cjs +3 -1
  114. package/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
  115. package/cjs/components/Text/Text.cjs.map +1 -1
  116. package/cjs/components/TextInput/TextInput.cjs.map +1 -1
  117. package/cjs/components/Textarea/Autosize.cjs +1 -0
  118. package/cjs/components/Textarea/Autosize.cjs.map +1 -1
  119. package/cjs/components/Textarea/Textarea.cjs.map +1 -1
  120. package/cjs/components/ThemeIcon/ThemeIcon.cjs.map +1 -1
  121. package/cjs/components/Timeline/Timeline.cjs.map +1 -1
  122. package/cjs/components/Title/Title.cjs.map +1 -1
  123. package/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
  124. package/cjs/components/Tree/Tree.cjs.map +1 -1
  125. package/cjs/components/Typography/Typography.cjs.map +1 -1
  126. package/cjs/components/UnstyledButton/UnstyledButton.cjs.map +1 -1
  127. package/cjs/components/VisuallyHidden/VisuallyHidden.cjs.map +1 -1
  128. package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs +3 -4
  129. package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs.map +1 -1
  130. package/cjs/core/MantineProvider/color-scheme-managers/local-storage-manager.cjs.map +1 -1
  131. package/cjs/core/utils/find-element-ancestor/find-element-ancestor.cjs.map +1 -1
  132. package/esm/components/Accordion/Accordion.mjs.map +1 -1
  133. package/esm/components/Accordion/Accordion.module.mjs.map +1 -1
  134. package/esm/components/ActionIcon/ActionIcon.mjs.map +1 -1
  135. package/esm/components/Affix/Affix.mjs.map +1 -1
  136. package/esm/components/Alert/Alert.mjs.map +1 -1
  137. package/esm/components/Anchor/Anchor.mjs.map +1 -1
  138. package/esm/components/AngleSlider/AngleSlider.mjs.map +1 -1
  139. package/esm/components/AppShell/AppShell.mjs.map +1 -1
  140. package/esm/components/AspectRatio/AspectRatio.mjs.map +1 -1
  141. package/esm/components/Autocomplete/Autocomplete.mjs +1 -1
  142. package/esm/components/Autocomplete/Autocomplete.mjs.map +1 -1
  143. package/esm/components/Avatar/Avatar.mjs.map +1 -1
  144. package/esm/components/BackgroundImage/BackgroundImage.mjs.map +1 -1
  145. package/esm/components/Badge/Badge.mjs.map +1 -1
  146. package/esm/components/Badge/Badge.module.mjs.map +1 -1
  147. package/esm/components/Blockquote/Blockquote.mjs.map +1 -1
  148. package/esm/components/Breadcrumbs/Breadcrumbs.mjs.map +1 -1
  149. package/esm/components/Burger/Burger.mjs.map +1 -1
  150. package/esm/components/Button/Button.mjs.map +1 -1
  151. package/esm/components/Card/Card.mjs.map +1 -1
  152. package/esm/components/Center/Center.mjs.map +1 -1
  153. package/esm/components/Checkbox/Checkbox.mjs.map +1 -1
  154. package/esm/components/Checkbox/CheckboxGroup/CheckboxGroup.mjs.map +1 -1
  155. package/esm/components/Chip/Chip.mjs.map +1 -1
  156. package/esm/components/Chip/ChipGroup/ChipGroup.mjs.map +1 -1
  157. package/esm/components/CloseButton/CloseButton.mjs.map +1 -1
  158. package/esm/components/Code/Code.mjs.map +1 -1
  159. package/esm/components/Collapse/Collapse.mjs.map +1 -1
  160. package/esm/components/ColorInput/ColorInput.mjs.map +1 -1
  161. package/esm/components/ColorPicker/AlphaSlider/AlphaSlider.mjs.map +1 -1
  162. package/esm/components/ColorPicker/ColorPicker.mjs.map +1 -1
  163. package/esm/components/ColorPicker/HueSlider/HueSlider.mjs.map +1 -1
  164. package/esm/components/ColorSwatch/ColorSwatch.mjs.map +1 -1
  165. package/esm/components/Combobox/ComboboxTarget/ComboboxTarget.mjs +1 -0
  166. package/esm/components/Combobox/ComboboxTarget/ComboboxTarget.mjs.map +1 -1
  167. package/esm/components/Combobox/use-combobox-target-props/use-combobox-target-props.mjs.map +1 -1
  168. package/esm/components/Container/Container.mjs.map +1 -1
  169. package/esm/components/Dialog/Dialog.mjs.map +1 -1
  170. package/esm/components/Divider/Divider.mjs.map +1 -1
  171. package/esm/components/Fieldset/Fieldset.mjs.map +1 -1
  172. package/esm/components/FileButton/FileButton.mjs.map +1 -1
  173. package/esm/components/FileInput/FileInput.mjs.map +1 -1
  174. package/esm/components/Flex/Flex.mjs.map +1 -1
  175. package/esm/components/FloatingIndicator/FloatingIndicator.mjs.map +1 -1
  176. package/esm/components/FloatingWindow/FloatingWindow.mjs.map +1 -1
  177. package/esm/components/Grid/Grid.mjs.map +1 -1
  178. package/esm/components/Group/Group.mjs.map +1 -1
  179. package/esm/components/Highlight/Highlight.mjs.map +1 -1
  180. package/esm/components/Image/Image.mjs.map +1 -1
  181. package/esm/components/Indicator/Indicator.mjs.map +1 -1
  182. package/esm/components/Input/Input.mjs +3 -2
  183. package/esm/components/Input/Input.mjs.map +1 -1
  184. package/esm/components/InputBase/InputBase.mjs.map +1 -1
  185. package/esm/components/JsonInput/JsonInput.mjs.map +1 -1
  186. package/esm/components/Kbd/Kbd.mjs.map +1 -1
  187. package/esm/components/List/List.mjs.map +1 -1
  188. package/esm/components/Loader/Loader.mjs.map +1 -1
  189. package/esm/components/LoadingOverlay/LoadingOverlay.mjs +1 -0
  190. package/esm/components/LoadingOverlay/LoadingOverlay.mjs.map +1 -1
  191. package/esm/components/Mark/Mark.mjs.map +1 -1
  192. package/esm/components/Marquee/Marquee.mjs.map +1 -1
  193. package/esm/components/Menu/Menu.mjs.map +1 -1
  194. package/esm/components/Modal/Modal.mjs.map +1 -1
  195. package/esm/components/MultiSelect/MultiSelect.mjs +3 -1
  196. package/esm/components/MultiSelect/MultiSelect.mjs.map +1 -1
  197. package/esm/components/NativeSelect/NativeSelect.mjs +4 -1
  198. package/esm/components/NativeSelect/NativeSelect.mjs.map +1 -1
  199. package/esm/components/NavLink/NavLink.mjs.map +1 -1
  200. package/esm/components/Notification/Notification.mjs.map +1 -1
  201. package/esm/components/NumberInput/NumberInput.mjs +1 -0
  202. package/esm/components/NumberInput/NumberInput.mjs.map +1 -1
  203. package/esm/components/OverflowList/OverflowList.mjs.map +1 -1
  204. package/esm/components/Overlay/Overlay.mjs.map +1 -1
  205. package/esm/components/Pagination/Pagination.mjs.map +1 -1
  206. package/esm/components/Paper/Paper.mjs.map +1 -1
  207. package/esm/components/PasswordInput/PasswordInput.mjs +4 -1
  208. package/esm/components/PasswordInput/PasswordInput.mjs.map +1 -1
  209. package/esm/components/Pill/Pill.mjs.map +1 -1
  210. package/esm/components/PillsInput/PillsInput.mjs.map +1 -1
  211. package/esm/components/PinInput/PinInput.mjs.map +1 -1
  212. package/esm/components/Popover/Popover.mjs +9 -0
  213. package/esm/components/Popover/Popover.mjs.map +1 -1
  214. package/esm/components/Portal/OptionalPortal.mjs.map +1 -1
  215. package/esm/components/Portal/Portal.mjs.map +1 -1
  216. package/esm/components/Progress/Progress.mjs.map +1 -1
  217. package/esm/components/Radio/Radio.mjs.map +1 -1
  218. package/esm/components/Radio/RadioGroup/RadioGroup.mjs.map +1 -1
  219. package/esm/components/Rating/Rating.mjs.map +1 -1
  220. package/esm/components/RingProgress/RingProgress.mjs +1 -0
  221. package/esm/components/RingProgress/RingProgress.mjs.map +1 -1
  222. package/esm/components/ScrollArea/ScrollArea.mjs.map +1 -1
  223. package/esm/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.mjs.map +1 -1
  224. package/esm/components/Scroller/Scroller.mjs.map +1 -1
  225. package/esm/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
  226. package/esm/components/Select/Select.mjs +1 -0
  227. package/esm/components/Select/Select.mjs.map +1 -1
  228. package/esm/components/SemiCircleProgress/SemiCircleProgress.mjs +1 -2
  229. package/esm/components/SemiCircleProgress/SemiCircleProgress.mjs.map +1 -1
  230. package/esm/components/SimpleGrid/SimpleGrid.mjs.map +1 -1
  231. package/esm/components/Skeleton/Skeleton.mjs.map +1 -1
  232. package/esm/components/Slider/RangeSlider/RangeSlider.mjs.map +1 -1
  233. package/esm/components/Slider/Slider/Slider.mjs.map +1 -1
  234. package/esm/components/Slider/Slider.module.mjs.map +1 -1
  235. package/esm/components/Space/Space.mjs.map +1 -1
  236. package/esm/components/Spoiler/Spoiler.mjs.map +1 -1
  237. package/esm/components/Stack/Stack.mjs.map +1 -1
  238. package/esm/components/Stepper/Stepper.mjs.map +1 -1
  239. package/esm/components/Switch/Switch.mjs.map +1 -1
  240. package/esm/components/Switch/SwitchGroup/SwitchGroup.mjs.map +1 -1
  241. package/esm/components/Table/Table.mjs.map +1 -1
  242. package/esm/components/TableOfContents/TableOfContents.mjs.map +1 -1
  243. package/esm/components/Tabs/Tabs.mjs.map +1 -1
  244. package/esm/components/TagsInput/TagsInput.mjs +3 -1
  245. package/esm/components/TagsInput/TagsInput.mjs.map +1 -1
  246. package/esm/components/Text/Text.mjs.map +1 -1
  247. package/esm/components/TextInput/TextInput.mjs.map +1 -1
  248. package/esm/components/Textarea/Autosize.mjs +1 -0
  249. package/esm/components/Textarea/Autosize.mjs.map +1 -1
  250. package/esm/components/Textarea/Textarea.mjs.map +1 -1
  251. package/esm/components/ThemeIcon/ThemeIcon.mjs.map +1 -1
  252. package/esm/components/Timeline/Timeline.mjs.map +1 -1
  253. package/esm/components/Title/Title.mjs.map +1 -1
  254. package/esm/components/Tooltip/Tooltip.mjs.map +1 -1
  255. package/esm/components/Tree/Tree.mjs.map +1 -1
  256. package/esm/components/Typography/Typography.mjs.map +1 -1
  257. package/esm/components/UnstyledButton/UnstyledButton.mjs.map +1 -1
  258. package/esm/components/VisuallyHidden/VisuallyHidden.mjs.map +1 -1
  259. package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs +3 -4
  260. package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs.map +1 -1
  261. package/esm/core/MantineProvider/color-scheme-managers/local-storage-manager.mjs.map +1 -1
  262. package/esm/core/utils/find-element-ancestor/find-element-ancestor.mjs.map +1 -1
  263. package/lib/components/Accordion/Accordion.d.ts +21 -3
  264. package/lib/components/Accordion/index.d.ts +0 -17
  265. package/lib/components/ActionIcon/ActionIcon.d.ts +20 -2
  266. package/lib/components/ActionIcon/index.d.ts +0 -18
  267. package/lib/components/Affix/Affix.d.ts +6 -0
  268. package/lib/components/Affix/index.d.ts +0 -6
  269. package/lib/components/Alert/Alert.d.ts +6 -0
  270. package/lib/components/Alert/index.d.ts +0 -6
  271. package/lib/components/Anchor/Anchor.d.ts +7 -0
  272. package/lib/components/Anchor/index.d.ts +0 -8
  273. package/lib/components/AngleSlider/AngleSlider.d.ts +6 -0
  274. package/lib/components/AngleSlider/index.d.ts +0 -6
  275. package/lib/components/AppShell/AppShell.d.ts +30 -6
  276. package/lib/components/AppShell/index.d.ts +0 -24
  277. package/lib/components/AspectRatio/AspectRatio.d.ts +6 -0
  278. package/lib/components/AspectRatio/index.d.ts +0 -6
  279. package/lib/components/Autocomplete/Autocomplete.d.ts +6 -0
  280. package/lib/components/Autocomplete/index.d.ts +0 -6
  281. package/lib/components/Avatar/Avatar.d.ts +15 -1
  282. package/lib/components/Avatar/index.d.ts +0 -14
  283. package/lib/components/BackgroundImage/BackgroundImage.d.ts +6 -0
  284. package/lib/components/BackgroundImage/index.d.ts +0 -6
  285. package/lib/components/Badge/Badge.d.ts +7 -0
  286. package/lib/components/Badge/index.d.ts +0 -7
  287. package/lib/components/Blockquote/Blockquote.d.ts +6 -0
  288. package/lib/components/Blockquote/index.d.ts +0 -6
  289. package/lib/components/Breadcrumbs/Breadcrumbs.d.ts +6 -0
  290. package/lib/components/Breadcrumbs/index.d.ts +0 -7
  291. package/lib/components/Burger/Burger.d.ts +6 -0
  292. package/lib/components/Burger/index.d.ts +0 -6
  293. package/lib/components/Button/Button.d.ts +22 -2
  294. package/lib/components/Button/index.d.ts +0 -20
  295. package/lib/components/Card/Card.d.ts +11 -1
  296. package/lib/components/Card/index.d.ts +0 -10
  297. package/lib/components/Center/Center.d.ts +5 -0
  298. package/lib/components/Center/index.d.ts +0 -5
  299. package/lib/components/Checkbox/Checkbox.d.ts +29 -3
  300. package/lib/components/Checkbox/CheckboxGroup/CheckboxGroup.d.ts +8 -8
  301. package/lib/components/Checkbox/index.d.ts +0 -26
  302. package/lib/components/Chip/Chip.d.ts +12 -1
  303. package/lib/components/Chip/ChipGroup/ChipGroup.d.ts +8 -8
  304. package/lib/components/Chip/index.d.ts +0 -11
  305. package/lib/components/CloseButton/CloseButton.d.ts +7 -0
  306. package/lib/components/CloseButton/index.d.ts +0 -7
  307. package/lib/components/Code/Code.d.ts +6 -0
  308. package/lib/components/Code/index.d.ts +0 -6
  309. package/lib/components/Collapse/Collapse.d.ts +4 -0
  310. package/lib/components/Collapse/index.d.ts +0 -4
  311. package/lib/components/ColorInput/ColorInput.d.ts +6 -0
  312. package/lib/components/ColorInput/index.d.ts +0 -6
  313. package/lib/components/ColorPicker/AlphaSlider/AlphaSlider.d.ts +4 -0
  314. package/lib/components/ColorPicker/ColorPicker.d.ts +6 -0
  315. package/lib/components/ColorPicker/HueSlider/HueSlider.d.ts +4 -0
  316. package/lib/components/ColorPicker/index.d.ts +0 -14
  317. package/lib/components/ColorSwatch/ColorSwatch.d.ts +6 -0
  318. package/lib/components/ColorSwatch/index.d.ts +0 -6
  319. package/lib/components/Container/Container.d.ts +6 -0
  320. package/lib/components/Container/index.d.ts +0 -6
  321. package/lib/components/Dialog/Dialog.d.ts +6 -0
  322. package/lib/components/Dialog/index.d.ts +0 -6
  323. package/lib/components/Divider/Divider.d.ts +7 -0
  324. package/lib/components/Divider/index.d.ts +0 -7
  325. package/lib/components/Fieldset/Fieldset.d.ts +6 -0
  326. package/lib/components/Fieldset/index.d.ts +0 -6
  327. package/lib/components/FileButton/FileButton.d.ts +4 -0
  328. package/lib/components/FileButton/index.d.ts +0 -4
  329. package/lib/components/FileInput/FileInput.d.ts +4 -0
  330. package/lib/components/FileInput/index.d.ts +0 -4
  331. package/lib/components/Flex/Flex.d.ts +5 -0
  332. package/lib/components/Flex/index.d.ts +0 -5
  333. package/lib/components/FloatingIndicator/FloatingIndicator.d.ts +6 -0
  334. package/lib/components/FloatingIndicator/index.d.ts +0 -6
  335. package/lib/components/FloatingWindow/FloatingWindow.d.ts +5 -0
  336. package/lib/components/FloatingWindow/index.d.ts +0 -5
  337. package/lib/components/Grid/Grid.d.ts +13 -2
  338. package/lib/components/Grid/index.d.ts +0 -11
  339. package/lib/components/Group/Group.d.ts +7 -0
  340. package/lib/components/Group/index.d.ts +0 -7
  341. package/lib/components/Highlight/Highlight.d.ts +5 -0
  342. package/lib/components/Highlight/index.d.ts +0 -5
  343. package/lib/components/Image/Image.d.ts +6 -0
  344. package/lib/components/Image/index.d.ts +0 -6
  345. package/lib/components/Indicator/Indicator.d.ts +6 -0
  346. package/lib/components/Indicator/index.d.ts +0 -6
  347. package/lib/components/Input/Input.d.ts +51 -7
  348. package/lib/components/Input/index.d.ts +0 -42
  349. package/lib/components/InputBase/InputBase.d.ts +4 -0
  350. package/lib/components/InputBase/index.d.ts +0 -4
  351. package/lib/components/JsonInput/JsonInput.d.ts +4 -0
  352. package/lib/components/JsonInput/index.d.ts +0 -4
  353. package/lib/components/Kbd/Kbd.d.ts +6 -0
  354. package/lib/components/Kbd/index.d.ts +0 -6
  355. package/lib/components/List/List.d.ts +12 -1
  356. package/lib/components/List/index.d.ts +0 -11
  357. package/lib/components/Loader/Loader.d.ts +6 -0
  358. package/lib/components/Loader/index.d.ts +0 -6
  359. package/lib/components/LoadingOverlay/LoadingOverlay.d.ts +6 -0
  360. package/lib/components/LoadingOverlay/index.d.ts +0 -6
  361. package/lib/components/Mark/Mark.d.ts +6 -0
  362. package/lib/components/Mark/index.d.ts +0 -6
  363. package/lib/components/Marquee/Marquee.d.ts +6 -0
  364. package/lib/components/Marquee/index.d.ts +0 -6
  365. package/lib/components/Menu/Menu.d.ts +43 -6
  366. package/lib/components/Menu/index.d.ts +0 -33
  367. package/lib/components/Modal/Modal.d.ts +37 -7
  368. package/lib/components/Modal/index.d.ts +0 -30
  369. package/lib/components/MultiSelect/MultiSelect.d.ts +5 -0
  370. package/lib/components/MultiSelect/index.d.ts +0 -6
  371. package/lib/components/NativeSelect/NativeSelect.d.ts +5 -0
  372. package/lib/components/NativeSelect/index.d.ts +0 -6
  373. package/lib/components/NavLink/NavLink.d.ts +7 -0
  374. package/lib/components/NavLink/index.d.ts +0 -7
  375. package/lib/components/Notification/Notification.d.ts +6 -0
  376. package/lib/components/Notification/index.d.ts +0 -6
  377. package/lib/components/NumberInput/NumberInput.d.ts +7 -0
  378. package/lib/components/NumberInput/index.d.ts +0 -7
  379. package/lib/components/OverflowList/OverflowList.d.ts +6 -0
  380. package/lib/components/OverflowList/index.d.ts +0 -6
  381. package/lib/components/Overlay/Overlay.d.ts +6 -0
  382. package/lib/components/Overlay/index.d.ts +0 -6
  383. package/lib/components/Pagination/Pagination.d.ts +25 -4
  384. package/lib/components/Pagination/index.d.ts +0 -21
  385. package/lib/components/Paper/Paper.d.ts +7 -0
  386. package/lib/components/Paper/index.d.ts +0 -7
  387. package/lib/components/PasswordInput/PasswordInput.d.ts +6 -0
  388. package/lib/components/PasswordInput/index.d.ts +0 -6
  389. package/lib/components/Pill/Pill.d.ts +14 -1
  390. package/lib/components/Pill/index.d.ts +0 -13
  391. package/lib/components/PillsInput/PillsInput.d.ts +12 -1
  392. package/lib/components/PillsInput/index.d.ts +0 -10
  393. package/lib/components/PinInput/PinInput.d.ts +5 -0
  394. package/lib/components/PinInput/index.d.ts +0 -5
  395. package/lib/components/Popover/Popover.d.ts +9 -0
  396. package/lib/components/Portal/OptionalPortal.d.ts +3 -0
  397. package/lib/components/Portal/Portal.d.ts +3 -0
  398. package/lib/components/Portal/index.d.ts +0 -6
  399. package/lib/components/Progress/Progress.d.ts +19 -3
  400. package/lib/components/Progress/index.d.ts +0 -15
  401. package/lib/components/Radio/Radio.d.ts +29 -3
  402. package/lib/components/Radio/RadioGroup/RadioGroup.d.ts +8 -8
  403. package/lib/components/Radio/index.d.ts +0 -26
  404. package/lib/components/Rating/Rating.d.ts +5 -0
  405. package/lib/components/Rating/index.d.ts +0 -5
  406. package/lib/components/RingProgress/RingProgress.d.ts +7 -0
  407. package/lib/components/RingProgress/index.d.ts +0 -7
  408. package/lib/components/ScrollArea/ScrollArea.d.ts +10 -0
  409. package/lib/components/ScrollArea/index.d.ts +0 -10
  410. package/lib/components/Scroller/Scroller.d.ts +6 -0
  411. package/lib/components/Scroller/index.d.ts +0 -6
  412. package/lib/components/SegmentedControl/SegmentedControl.d.ts +7 -0
  413. package/lib/components/SegmentedControl/index.d.ts +0 -8
  414. package/lib/components/Select/Select.d.ts +5 -0
  415. package/lib/components/Select/index.d.ts +0 -6
  416. package/lib/components/SemiCircleProgress/SemiCircleProgress.d.ts +6 -0
  417. package/lib/components/SemiCircleProgress/index.d.ts +0 -6
  418. package/lib/components/SimpleGrid/SimpleGrid.d.ts +5 -0
  419. package/lib/components/SimpleGrid/index.d.ts +0 -5
  420. package/lib/components/Skeleton/Skeleton.d.ts +6 -0
  421. package/lib/components/Skeleton/index.d.ts +0 -6
  422. package/lib/components/Slider/RangeSlider/RangeSlider.d.ts +8 -0
  423. package/lib/components/Slider/Slider/Slider.d.ts +7 -0
  424. package/lib/components/Slider/index.d.ts +0 -15
  425. package/lib/components/Space/Space.d.ts +4 -0
  426. package/lib/components/Space/index.d.ts +0 -5
  427. package/lib/components/Spoiler/Spoiler.d.ts +6 -0
  428. package/lib/components/Spoiler/index.d.ts +0 -6
  429. package/lib/components/Stack/Stack.d.ts +6 -0
  430. package/lib/components/Stack/index.d.ts +0 -6
  431. package/lib/components/Stepper/Stepper.d.ts +17 -2
  432. package/lib/components/Stepper/index.d.ts +0 -14
  433. package/lib/components/Switch/Switch.d.ts +13 -1
  434. package/lib/components/Switch/SwitchGroup/SwitchGroup.d.ts +8 -8
  435. package/lib/components/Switch/index.d.ts +0 -12
  436. package/lib/components/Table/Table.d.ts +35 -2
  437. package/lib/components/Table/index.d.ts +0 -32
  438. package/lib/components/TableOfContents/TableOfContents.d.ts +7 -0
  439. package/lib/components/TableOfContents/index.d.ts +0 -7
  440. package/lib/components/Tabs/Tabs.d.ts +24 -3
  441. package/lib/components/Tabs/index.d.ts +0 -20
  442. package/lib/components/TagsInput/TagsInput.d.ts +5 -0
  443. package/lib/components/TagsInput/index.d.ts +0 -5
  444. package/lib/components/Text/Text.d.ts +7 -0
  445. package/lib/components/Text/index.d.ts +0 -7
  446. package/lib/components/TextInput/TextInput.d.ts +4 -0
  447. package/lib/components/TextInput/index.d.ts +0 -4
  448. package/lib/components/Textarea/Textarea.d.ts +4 -0
  449. package/lib/components/Textarea/index.d.ts +0 -4
  450. package/lib/components/ThemeIcon/ThemeIcon.d.ts +7 -0
  451. package/lib/components/ThemeIcon/index.d.ts +0 -7
  452. package/lib/components/Timeline/Timeline.d.ts +12 -1
  453. package/lib/components/Timeline/index.d.ts +0 -11
  454. package/lib/components/Title/Title.d.ts +8 -0
  455. package/lib/components/Title/index.d.ts +0 -8
  456. package/lib/components/Tooltip/Tooltip.d.ts +15 -2
  457. package/lib/components/Tooltip/index.d.ts +0 -13
  458. package/lib/components/Tree/Tree.d.ts +7 -0
  459. package/lib/components/Tree/index.d.ts +0 -7
  460. package/lib/components/Typography/Typography.d.ts +5 -0
  461. package/lib/components/Typography/index.d.ts +0 -5
  462. package/lib/components/UnstyledButton/UnstyledButton.d.ts +5 -0
  463. package/lib/components/UnstyledButton/index.d.ts +0 -5
  464. package/lib/components/VisuallyHidden/VisuallyHidden.d.ts +3 -0
  465. package/lib/components/VisuallyHidden/index.d.ts +0 -3
  466. package/package.json +2 -2
  467. package/styles/Accordion.css +0 -4
  468. package/styles/Accordion.layer.css +0 -4
  469. package/styles/Badge.css +0 -2
  470. package/styles/Badge.layer.css +0 -2
  471. package/styles/Slider.css +10 -10
  472. package/styles/Slider.layer.css +10 -10
  473. package/styles.css +10 -16
  474. package/styles.layer.css +10 -16
@@ -1 +1 @@
1
- {"version":3,"file":"Highlight.mjs","names":[],"sources":["../../../src/components/Highlight/Highlight.tsx"],"sourcesContent":["import {\n MantineColor,\n MantineTheme,\n polymorphicFactory,\n PolymorphicFactory,\n useProps,\n} from '../../core';\nimport { Mark } from '../Mark';\nimport { Text, TextProps, TextStylesNames, TextVariant } from '../Text';\nimport { highlighter } from './highlighter/highlighter';\n\nexport interface HighlightTerm {\n /** Text to highlight */\n text: string;\n\n /** Background color for this specific term. Key of `theme.colors` or any valid CSS color */\n color?: MantineColor | string;\n}\n\nexport interface HighlightProps extends Omit<TextProps, 'color'> {\n /**\n * Substring(s) to highlight in `children`. Can be:\n * - string: single term\n * - string[]: multiple terms with same color\n * - HighlightTerm[]: multiple terms with custom colors per term\n *\n * - Matching is case-insensitive\n * - Regex special characters are automatically escaped\n * - When multiple substrings are provided, longer matches take precedence\n * - Empty strings and whitespace-only strings are ignored\n */\n highlight: string | string[] | HighlightTerm[];\n\n /**\n * Default background color for all highlighted text.\n * Key of `theme.colors` or any valid CSS color, passed to `Mark` component.\n * Can be overridden per term when using HighlightTerm objects.\n * @default 'yellow'\n */\n color?: MantineColor | string;\n\n /** Styles applied to `mark` elements */\n highlightStyles?: React.CSSProperties | ((theme: MantineTheme) => React.CSSProperties);\n\n /** String in which to highlight substrings */\n children: string;\n\n /**\n * Only match whole words (adds word boundaries to regex).\n * When enabled, 'the' will not match 'there'.\n * @default false\n */\n wholeWord?: boolean;\n}\n\nexport type HighlightFactory = PolymorphicFactory<{\n props: HighlightProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: TextStylesNames;\n variant: TextVariant;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n wholeWord: false,\n} satisfies Partial<HighlightProps>;\n\nexport const Highlight = polymorphicFactory<HighlightFactory>((_props) => {\n const { unstyled, children, highlight, highlightStyles, color, wholeWord, ...others } = useProps(\n 'Highlight',\n defaultProps,\n _props\n );\n\n const isTermArray = Array.isArray(highlight) && typeof highlight[0] === 'object';\n const colorMap = new Map<string, string>();\n\n let highlightStrings: string[];\n if (isTermArray) {\n highlightStrings = (highlight as HighlightTerm[]).map((term) => {\n if (term.color) {\n colorMap.set(term.text.toLowerCase(), term.color);\n }\n return term.text;\n });\n } else if (Array.isArray(highlight)) {\n highlightStrings = highlight as string[];\n } else {\n highlightStrings = [highlight as string];\n }\n\n const highlightChunks = highlighter(children, highlightStrings, { wholeWord });\n\n return (\n <Text unstyled={unstyled} {...others} __staticSelector=\"Highlight\">\n {highlightChunks.map(({ chunk, highlighted }, i) =>\n highlighted ? (\n <Mark\n unstyled={unstyled}\n key={i}\n color={colorMap.get(chunk.toLowerCase()) || color}\n style={highlightStyles}\n data-highlight={chunk}\n >\n {chunk}\n </Mark>\n ) : (\n <span key={i}>{chunk}</span>\n )\n )}\n </Text>\n );\n});\n\nHighlight.classes = Text.classes;\nHighlight.displayName = '@mantine/core/Highlight';\n"],"mappings":";;;;;;;;AA+DA,MAAM,eAAe;CACnB,OAAO;CACP,WAAW;CACZ;AAED,MAAa,YAAY,oBAAsC,WAAW;CACxE,MAAM,EAAE,UAAU,UAAU,WAAW,iBAAiB,OAAO,WAAW,GAAG,WAAW,SACtF,aACA,cACA,OACD;CAED,MAAM,cAAc,MAAM,QAAQ,UAAU,IAAI,OAAO,UAAU,OAAO;CACxE,MAAM,2BAAW,IAAI,KAAqB;CAE1C,IAAI;AACJ,KAAI,YACF,oBAAoB,UAA8B,KAAK,SAAS;AAC9D,MAAI,KAAK,MACP,UAAS,IAAI,KAAK,KAAK,aAAa,EAAE,KAAK,MAAM;AAEnD,SAAO,KAAK;GACZ;UACO,MAAM,QAAQ,UAAU,CACjC,oBAAmB;KAEnB,oBAAmB,CAAC,UAAoB;CAG1C,MAAM,kBAAkB,YAAY,UAAU,kBAAkB,EAAE,WAAW,CAAC;AAE9E,QACE,oBAAC,MAAD;EAAgB;EAAU,GAAI;EAAQ,kBAAiB;YACpD,gBAAgB,KAAK,EAAE,OAAO,eAAe,MAC5C,cACE,oBAAC,MAAD;GACY;GAEV,OAAO,SAAS,IAAI,MAAM,aAAa,CAAC,IAAI;GAC5C,OAAO;GACP,kBAAgB;aAEf;GACI,EANA,EAMA,GAEP,oBAAC,QAAD,EAAA,UAAe,OAAa,EAAjB,EAAiB,CAE/B;EACI,CAAA;EAET;AAEF,UAAU,UAAU,KAAK;AACzB,UAAU,cAAc"}
1
+ {"version":3,"file":"Highlight.mjs","names":[],"sources":["../../../src/components/Highlight/Highlight.tsx"],"sourcesContent":["import {\n MantineColor,\n MantineTheme,\n polymorphicFactory,\n PolymorphicFactory,\n useProps,\n} from '../../core';\nimport { Mark } from '../Mark';\nimport { Text, TextProps, TextStylesNames, TextVariant } from '../Text';\nimport { highlighter } from './highlighter/highlighter';\n\nexport interface HighlightTerm {\n /** Text to highlight */\n text: string;\n\n /** Background color for this specific term. Key of `theme.colors` or any valid CSS color */\n color?: MantineColor | string;\n}\n\nexport interface HighlightProps extends Omit<TextProps, 'color'> {\n /**\n * Substring(s) to highlight in `children`. Can be:\n * - string: single term\n * - string[]: multiple terms with same color\n * - HighlightTerm[]: multiple terms with custom colors per term\n *\n * - Matching is case-insensitive\n * - Regex special characters are automatically escaped\n * - When multiple substrings are provided, longer matches take precedence\n * - Empty strings and whitespace-only strings are ignored\n */\n highlight: string | string[] | HighlightTerm[];\n\n /**\n * Default background color for all highlighted text.\n * Key of `theme.colors` or any valid CSS color, passed to `Mark` component.\n * Can be overridden per term when using HighlightTerm objects.\n * @default 'yellow'\n */\n color?: MantineColor | string;\n\n /** Styles applied to `mark` elements */\n highlightStyles?: React.CSSProperties | ((theme: MantineTheme) => React.CSSProperties);\n\n /** String in which to highlight substrings */\n children: string;\n\n /**\n * Only match whole words (adds word boundaries to regex).\n * When enabled, 'the' will not match 'there'.\n * @default false\n */\n wholeWord?: boolean;\n}\n\nexport type HighlightFactory = PolymorphicFactory<{\n props: HighlightProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: TextStylesNames;\n variant: TextVariant;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n wholeWord: false,\n} satisfies Partial<HighlightProps>;\n\nexport const Highlight = polymorphicFactory<HighlightFactory>((_props) => {\n const { unstyled, children, highlight, highlightStyles, color, wholeWord, ...others } = useProps(\n 'Highlight',\n defaultProps,\n _props\n );\n\n const isTermArray = Array.isArray(highlight) && typeof highlight[0] === 'object';\n const colorMap = new Map<string, string>();\n\n let highlightStrings: string[];\n if (isTermArray) {\n highlightStrings = (highlight as HighlightTerm[]).map((term) => {\n if (term.color) {\n colorMap.set(term.text.toLowerCase(), term.color);\n }\n return term.text;\n });\n } else if (Array.isArray(highlight)) {\n highlightStrings = highlight as string[];\n } else {\n highlightStrings = [highlight as string];\n }\n\n const highlightChunks = highlighter(children, highlightStrings, { wholeWord });\n\n return (\n <Text unstyled={unstyled} {...others} __staticSelector=\"Highlight\">\n {highlightChunks.map(({ chunk, highlighted }, i) =>\n highlighted ? (\n <Mark\n unstyled={unstyled}\n key={i}\n color={colorMap.get(chunk.toLowerCase()) || color}\n style={highlightStyles}\n data-highlight={chunk}\n >\n {chunk}\n </Mark>\n ) : (\n <span key={i}>{chunk}</span>\n )\n )}\n </Text>\n );\n});\n\nHighlight.classes = Text.classes;\nHighlight.displayName = '@mantine/core/Highlight';\n\nexport namespace Highlight {\n export type Props = HighlightProps;\n export type Factory = HighlightFactory;\n export type Term = HighlightTerm;\n}\n"],"mappings":";;;;;;;;AA+DA,MAAM,eAAe;CACnB,OAAO;CACP,WAAW;CACZ;AAED,MAAa,YAAY,oBAAsC,WAAW;CACxE,MAAM,EAAE,UAAU,UAAU,WAAW,iBAAiB,OAAO,WAAW,GAAG,WAAW,SACtF,aACA,cACA,OACD;CAED,MAAM,cAAc,MAAM,QAAQ,UAAU,IAAI,OAAO,UAAU,OAAO;CACxE,MAAM,2BAAW,IAAI,KAAqB;CAE1C,IAAI;AACJ,KAAI,YACF,oBAAoB,UAA8B,KAAK,SAAS;AAC9D,MAAI,KAAK,MACP,UAAS,IAAI,KAAK,KAAK,aAAa,EAAE,KAAK,MAAM;AAEnD,SAAO,KAAK;GACZ;UACO,MAAM,QAAQ,UAAU,CACjC,oBAAmB;KAEnB,oBAAmB,CAAC,UAAoB;CAG1C,MAAM,kBAAkB,YAAY,UAAU,kBAAkB,EAAE,WAAW,CAAC;AAE9E,QACE,oBAAC,MAAD;EAAgB;EAAU,GAAI;EAAQ,kBAAiB;YACpD,gBAAgB,KAAK,EAAE,OAAO,eAAe,MAC5C,cACE,oBAAC,MAAD;GACY;GAEV,OAAO,SAAS,IAAI,MAAM,aAAa,CAAC,IAAI;GAC5C,OAAO;GACP,kBAAgB;aAEf;GACI,EANA,EAMA,GAEP,oBAAC,QAAD,EAAA,UAAe,OAAa,EAAjB,EAAiB,CAE/B;EACI,CAAA;EAET;AAEF,UAAU,UAAU,KAAK;AACzB,UAAU,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Image.mjs","names":["classes"],"sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n getRadius,\n MantineRadius,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Image.module.css';\n\nexport type ImageStylesNames = 'root';\nexport type ImageCssVariables = {\n root: '--image-radius' | '--image-object-fit';\n};\n\nexport interface ImageProps extends BoxProps, StylesApiProps<ImageFactory> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 0 */\n radius?: MantineRadius;\n\n /** Controls `object-fit` style @default 'cover' */\n fit?: React.CSSProperties['objectFit'];\n\n /** Image url used as a fallback if the image cannot be loaded */\n fallbackSrc?: string;\n\n /** Image url */\n src?: any;\n\n /** Called when image fails to load */\n onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n}\n\nexport type ImageFactory = PolymorphicFactory<{\n props: ImageProps;\n defaultRef: HTMLImageElement;\n defaultComponent: 'img';\n stylesNames: ImageStylesNames;\n vars: ImageCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<ImageFactory>((_, { radius, fit }) => ({\n root: {\n '--image-radius': radius === undefined ? undefined : getRadius(radius),\n '--image-object-fit': fit,\n },\n}));\n\nexport const Image = polymorphicFactory<ImageFactory>((_props) => {\n const props = useProps('Image', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onError,\n src,\n radius,\n fit,\n fallbackSrc,\n mod,\n attributes,\n ...others\n } = props;\n\n const [error, setError] = useState(!src);\n\n useEffect(() => setError(!src), [src]);\n\n const getStyles = useStyles<ImageFactory>({\n name: 'Image',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (error && fallbackSrc) {\n return (\n <Box\n component=\"img\"\n src={fallbackSrc}\n {...getStyles('root')}\n onError={onError}\n mod={['fallback', mod]}\n {...others}\n />\n );\n }\n\n return (\n <Box\n component=\"img\"\n {...getStyles('root')}\n src={src}\n onError={(event) => {\n onError?.(event);\n setError(true);\n }}\n mod={mod}\n {...others}\n />\n );\n});\n\nImage.classes = classes;\nImage.varsResolver = varsResolver;\nImage.displayName = '@mantine/core/Image';\n"],"mappings":";;;;;;;;;;;AA6CA,MAAM,eAAe,oBAAkC,GAAG,EAAE,QAAQ,WAAW,EAC7E,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CACtE,sBAAsB;CACvB,EACF,EAAE;AAEH,MAAa,QAAQ,oBAAkC,WAAW;CAChE,MAAM,QAAQ,SAAS,SAAS,MAAM,OAAO;CAC7C,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,KACA,QACA,KACA,aACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC,IAAI;AAExC,iBAAgB,SAAS,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC;CAEtC,MAAM,YAAY,UAAwB;EACxC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SAAS,YACX,QACE,oBAAC,KAAD;EACE,WAAU;EACV,KAAK;EACL,GAAI,UAAU,OAAO;EACZ;EACT,KAAK,CAAC,YAAY,IAAI;EACtB,GAAI;EACJ,CAAA;AAIN,QACE,oBAAC,KAAD;EACE,WAAU;EACV,GAAI,UAAU,OAAO;EAChB;EACL,UAAU,UAAU;AAClB,aAAU,MAAM;AAChB,YAAS,KAAK;;EAEX;EACL,GAAI;EACJ,CAAA;EAEJ;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
1
+ {"version":3,"file":"Image.mjs","names":["classes"],"sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n getRadius,\n MantineRadius,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Image.module.css';\n\nexport type ImageStylesNames = 'root';\nexport type ImageCssVariables = {\n root: '--image-radius' | '--image-object-fit';\n};\n\nexport interface ImageProps extends BoxProps, StylesApiProps<ImageFactory> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 0 */\n radius?: MantineRadius;\n\n /** Controls `object-fit` style @default 'cover' */\n fit?: React.CSSProperties['objectFit'];\n\n /** Image url used as a fallback if the image cannot be loaded */\n fallbackSrc?: string;\n\n /** Image url */\n src?: any;\n\n /** Called when image fails to load */\n onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n}\n\nexport type ImageFactory = PolymorphicFactory<{\n props: ImageProps;\n defaultRef: HTMLImageElement;\n defaultComponent: 'img';\n stylesNames: ImageStylesNames;\n vars: ImageCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<ImageFactory>((_, { radius, fit }) => ({\n root: {\n '--image-radius': radius === undefined ? undefined : getRadius(radius),\n '--image-object-fit': fit,\n },\n}));\n\nexport const Image = polymorphicFactory<ImageFactory>((_props) => {\n const props = useProps('Image', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onError,\n src,\n radius,\n fit,\n fallbackSrc,\n mod,\n attributes,\n ...others\n } = props;\n\n const [error, setError] = useState(!src);\n\n useEffect(() => setError(!src), [src]);\n\n const getStyles = useStyles<ImageFactory>({\n name: 'Image',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (error && fallbackSrc) {\n return (\n <Box\n component=\"img\"\n src={fallbackSrc}\n {...getStyles('root')}\n onError={onError}\n mod={['fallback', mod]}\n {...others}\n />\n );\n }\n\n return (\n <Box\n component=\"img\"\n {...getStyles('root')}\n src={src}\n onError={(event) => {\n onError?.(event);\n setError(true);\n }}\n mod={mod}\n {...others}\n />\n );\n});\n\nImage.classes = classes;\nImage.varsResolver = varsResolver;\nImage.displayName = '@mantine/core/Image';\n\nexport namespace Image {\n export type Props = ImageProps;\n export type StylesNames = ImageStylesNames;\n export type CssVariables = ImageCssVariables;\n export type Factory = ImageFactory;\n}\n"],"mappings":";;;;;;;;;;;AA6CA,MAAM,eAAe,oBAAkC,GAAG,EAAE,QAAQ,WAAW,EAC7E,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CACtE,sBAAsB;CACvB,EACF,EAAE;AAEH,MAAa,QAAQ,oBAAkC,WAAW;CAChE,MAAM,QAAQ,SAAS,SAAS,MAAM,OAAO;CAC7C,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,KACA,QACA,KACA,aACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC,IAAI;AAExC,iBAAgB,SAAS,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC;CAEtC,MAAM,YAAY,UAAwB;EACxC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SAAS,YACX,QACE,oBAAC,KAAD;EACE,WAAU;EACV,KAAK;EACL,GAAI,UAAU,OAAO;EACZ;EACT,KAAK,CAAC,YAAY,IAAI;EACtB,GAAI;EACJ,CAAA;AAIN,QACE,oBAAC,KAAD;EACE,WAAU;EACV,GAAI,UAAU,OAAO;EAChB;EACL,UAAU,UAAU;AAClB,aAAU,MAAM;AAChB,YAAS,KAAK;;EAEX;EACL,GAAI;EACJ,CAAA;EAEJ;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Indicator.mjs","names":["classes"],"sources":["../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getPositionVariables } from './get-position-variables/get-position-variables';\nimport { IndicatorPosition } from './Indicator.types';\nimport classes from './Indicator.module.css';\n\nexport type IndicatorPositionVariables =\n | '--indicator-top'\n | '--indicator-bottom'\n | '--indicator-left'\n | '--indicator-right'\n | '--indicator-translate-x'\n | '--indicator-translate-y';\n\nexport type IndicatorStylesNames = 'root' | 'indicator';\nexport type IndicatorCssVariables = {\n root:\n | '--indicator-color'\n | '--indicator-text-color'\n | '--indicator-size'\n | '--indicator-radius'\n | '--indicator-z-index'\n | IndicatorPositionVariables;\n};\n\nexport interface IndicatorProps\n extends BoxProps, StylesApiProps<IndicatorFactory>, ElementProps<'div'> {\n /** Indicator position relative to the target element @default 'top-end' */\n position?: IndicatorPosition;\n\n /** Distance in pixels to offset the indicator from its default position, useful for elements with border-radius. Can be a number for uniform offset or an object with `x` and `y` properties for separate horizontal and vertical offsets @default 0 */\n offset?: number | { x: number; y: number };\n\n /** Changes container display from block to inline-block, use when wrapping elements with fixed width @default false */\n inline?: boolean;\n\n /** Indicator width and height @default 10 */\n size?: number | string;\n\n /** Label displayed inside the indicator, for example, notification count */\n label?: React.ReactNode;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 100 */\n radius?: MantineRadius;\n\n /** Key of `theme.colors` or any valid CSS color value @default theme.primaryColor */\n color?: MantineColor;\n\n /** Adds border to the root element */\n withBorder?: boolean;\n\n /** Hides the indicator when set */\n disabled?: boolean;\n\n /** If set, the indicator has processing animation @default false */\n processing?: boolean;\n\n /** Indicator z-index @default 200 */\n zIndex?: string | number;\n\n /** If set, adjusts text color based on background color */\n autoContrast?: boolean;\n\n /** Maximum value to display. If label is a number greater than this value, it will be displayed as `{maxValue}+` */\n maxValue?: number;\n\n /** Determines whether indicator with label `0` should be displayed @default true */\n showZero?: boolean;\n}\n\nexport type IndicatorFactory = Factory<{\n props: IndicatorProps;\n ref: HTMLDivElement;\n stylesNames: IndicatorStylesNames;\n vars: IndicatorCssVariables;\n}>;\n\nconst defaultProps = {\n position: 'top-end',\n offset: 0,\n showZero: true,\n} satisfies Partial<IndicatorProps>;\n\nconst varsResolver = createVarsResolver<IndicatorFactory>(\n (theme, { color, position, offset, size, radius, zIndex, autoContrast }) => ({\n root: {\n '--indicator-color': color ? getThemeColor(color, theme) : undefined,\n '--indicator-text-color': getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n '--indicator-size': rem(size),\n '--indicator-radius': radius === undefined ? undefined : getRadius(radius),\n '--indicator-z-index': zIndex?.toString(),\n ...getPositionVariables(position, offset),\n },\n })\n);\n\nexport const Indicator = factory<IndicatorFactory>((_props) => {\n const props = useProps('Indicator', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n position,\n offset,\n inline,\n label,\n radius,\n color,\n withBorder,\n disabled,\n processing,\n zIndex,\n autoContrast,\n maxValue,\n showZero,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<IndicatorFactory>({\n name: 'Indicator',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const shouldHideZero = !showZero && (label === 0 || label === '0');\n const formattedLabel =\n maxValue !== undefined && typeof label === 'number' && label > maxValue\n ? `${maxValue}+`\n : label;\n\n return (\n <Box {...getStyles('root')} mod={[{ inline }, mod]} {...others}>\n {!disabled && !shouldHideZero && (\n <Box\n mod={{ 'with-label': !!label, 'with-border': withBorder, processing }}\n {...getStyles('indicator')}\n >\n {formattedLabel}\n </Box>\n )}\n {children}\n </Box>\n );\n});\n\nIndicator.classes = classes;\nIndicator.varsResolver = varsResolver;\nIndicator.displayName = '@mantine/core/Indicator';\n"],"mappings":";;;;;;;;;;;;;;;AA6FA,MAAM,eAAe;CACnB,UAAU;CACV,QAAQ;CACR,UAAU;CACX;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,MAAM,QAAQ,QAAQ,oBAAoB,EAC3E,MAAM;CACJ,qBAAqB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CAC3D,0BAA0B,qBAAqB,cAAc,MAAM,GAC/D,iBAAiB;EAAE;EAAO;EAAO;EAAc,CAAC,GAChD,KAAA;CACJ,oBAAoB,IAAI,KAAK;CAC7B,sBAAsB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CAC1E,uBAAuB,QAAQ,UAAU;CACzC,GAAG,qBAAqB,UAAU,OAAO;CAC1C,EACF,EACF;AAED,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,UACA,QACA,QACA,OACA,QACA,OACA,YACA,UACA,YACA,QACA,cACA,UACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,CAAC,aAAa,UAAU,KAAK,UAAU;CAC9D,MAAM,iBACJ,aAAa,KAAA,KAAa,OAAO,UAAU,YAAY,QAAQ,WAC3D,GAAG,SAAS,KACZ;AAEN,QACE,qBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,IAAI;EAAE,GAAI;YAAxD,CACG,CAAC,YAAY,CAAC,kBACb,oBAAC,KAAD;GACE,KAAK;IAAE,cAAc,CAAC,CAAC;IAAO,eAAe;IAAY;IAAY;GACrE,GAAI,UAAU,YAAY;aAEzB;GACG,CAAA,EAEP,SACG;;EAER;AAEF,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
1
+ {"version":3,"file":"Indicator.mjs","names":["classes"],"sources":["../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getPositionVariables } from './get-position-variables/get-position-variables';\nimport { IndicatorPosition } from './Indicator.types';\nimport classes from './Indicator.module.css';\n\nexport type IndicatorPositionVariables =\n | '--indicator-top'\n | '--indicator-bottom'\n | '--indicator-left'\n | '--indicator-right'\n | '--indicator-translate-x'\n | '--indicator-translate-y';\n\nexport type IndicatorStylesNames = 'root' | 'indicator';\nexport type IndicatorCssVariables = {\n root:\n | '--indicator-color'\n | '--indicator-text-color'\n | '--indicator-size'\n | '--indicator-radius'\n | '--indicator-z-index'\n | IndicatorPositionVariables;\n};\n\nexport interface IndicatorProps\n extends BoxProps, StylesApiProps<IndicatorFactory>, ElementProps<'div'> {\n /** Indicator position relative to the target element @default 'top-end' */\n position?: IndicatorPosition;\n\n /** Distance in pixels to offset the indicator from its default position, useful for elements with border-radius. Can be a number for uniform offset or an object with `x` and `y` properties for separate horizontal and vertical offsets @default 0 */\n offset?: number | { x: number; y: number };\n\n /** Changes container display from block to inline-block, use when wrapping elements with fixed width @default false */\n inline?: boolean;\n\n /** Indicator width and height @default 10 */\n size?: number | string;\n\n /** Label displayed inside the indicator, for example, notification count */\n label?: React.ReactNode;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 100 */\n radius?: MantineRadius;\n\n /** Key of `theme.colors` or any valid CSS color value @default theme.primaryColor */\n color?: MantineColor;\n\n /** Adds border to the root element */\n withBorder?: boolean;\n\n /** Hides the indicator when set */\n disabled?: boolean;\n\n /** If set, the indicator has processing animation @default false */\n processing?: boolean;\n\n /** Indicator z-index @default 200 */\n zIndex?: string | number;\n\n /** If set, adjusts text color based on background color */\n autoContrast?: boolean;\n\n /** Maximum value to display. If label is a number greater than this value, it will be displayed as `{maxValue}+` */\n maxValue?: number;\n\n /** Determines whether indicator with label `0` should be displayed @default true */\n showZero?: boolean;\n}\n\nexport type IndicatorFactory = Factory<{\n props: IndicatorProps;\n ref: HTMLDivElement;\n stylesNames: IndicatorStylesNames;\n vars: IndicatorCssVariables;\n}>;\n\nconst defaultProps = {\n position: 'top-end',\n offset: 0,\n showZero: true,\n} satisfies Partial<IndicatorProps>;\n\nconst varsResolver = createVarsResolver<IndicatorFactory>(\n (theme, { color, position, offset, size, radius, zIndex, autoContrast }) => ({\n root: {\n '--indicator-color': color ? getThemeColor(color, theme) : undefined,\n '--indicator-text-color': getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n '--indicator-size': rem(size),\n '--indicator-radius': radius === undefined ? undefined : getRadius(radius),\n '--indicator-z-index': zIndex?.toString(),\n ...getPositionVariables(position, offset),\n },\n })\n);\n\nexport const Indicator = factory<IndicatorFactory>((_props) => {\n const props = useProps('Indicator', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n position,\n offset,\n inline,\n label,\n radius,\n color,\n withBorder,\n disabled,\n processing,\n zIndex,\n autoContrast,\n maxValue,\n showZero,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<IndicatorFactory>({\n name: 'Indicator',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const shouldHideZero = !showZero && (label === 0 || label === '0');\n const formattedLabel =\n maxValue !== undefined && typeof label === 'number' && label > maxValue\n ? `${maxValue}+`\n : label;\n\n return (\n <Box {...getStyles('root')} mod={[{ inline }, mod]} {...others}>\n {!disabled && !shouldHideZero && (\n <Box\n mod={{ 'with-label': !!label, 'with-border': withBorder, processing }}\n {...getStyles('indicator')}\n >\n {formattedLabel}\n </Box>\n )}\n {children}\n </Box>\n );\n});\n\nIndicator.classes = classes;\nIndicator.varsResolver = varsResolver;\nIndicator.displayName = '@mantine/core/Indicator';\n\nexport namespace Indicator {\n export type Props = IndicatorProps;\n export type StylesNames = IndicatorStylesNames;\n export type CssVariables = IndicatorCssVariables;\n export type Factory = IndicatorFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;AA6FA,MAAM,eAAe;CACnB,UAAU;CACV,QAAQ;CACR,UAAU;CACX;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,MAAM,QAAQ,QAAQ,oBAAoB,EAC3E,MAAM;CACJ,qBAAqB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CAC3D,0BAA0B,qBAAqB,cAAc,MAAM,GAC/D,iBAAiB;EAAE;EAAO;EAAO;EAAc,CAAC,GAChD,KAAA;CACJ,oBAAoB,IAAI,KAAK;CAC7B,sBAAsB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CAC1E,uBAAuB,QAAQ,UAAU;CACzC,GAAG,qBAAqB,UAAU,OAAO;CAC1C,EACF,EACF;AAED,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,UACA,QACA,QACA,OACA,QACA,OACA,YACA,UACA,YACA,QACA,cACA,UACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,CAAC,aAAa,UAAU,KAAK,UAAU;CAC9D,MAAM,iBACJ,aAAa,KAAA,KAAa,OAAO,UAAU,YAAY,QAAQ,WAC3D,GAAG,SAAS,KACZ;AAEN,QACE,qBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,IAAI;EAAE,GAAI;YAAxD,CACG,CAAC,YAAY,CAAC,kBACb,oBAAC,KAAD;GACE,KAAK;IAAE,cAAc,CAAC,CAAC;IAAO,eAAe;IAAY;IAAY;GACrE,GAAI,UAAU,YAAY;aAEzB;GACG,CAAA,EAEP,SACG;;EAER;AAEF,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
@@ -45,7 +45,7 @@ const varsResolver = createVarsResolver((_, props, ctx) => ({ wrapper: {
45
45
  } }));
46
46
  const Input = polymorphicFactory((_props) => {
47
47
  const props = useProps("Input", defaultProps, _props);
48
- const { classNames, className, style, styles, unstyled, required, __staticSelector, __stylesApiProps, size, wrapperProps, error, disabled, leftSection, leftSectionProps, leftSectionWidth, rightSection, rightSectionProps, rightSectionWidth, rightSectionPointerEvents, leftSectionPointerEvents, variant, vars, pointer, multiline, radius, id, withAria, withErrorStyles, mod, inputSize, attributes, __clearSection, __clearable, __clearSectionMode, __defaultRightSection, loading, loadingPosition, ...others } = props;
48
+ const { classNames, className, style, styles, unstyled, required, __staticSelector, __stylesApiProps, size, wrapperProps, error, disabled, leftSection, leftSectionProps, leftSectionWidth, rightSection, rightSectionProps, rightSectionWidth, rightSectionPointerEvents, leftSectionPointerEvents, variant, vars, pointer, multiline, radius, id, withAria, withErrorStyles, mod, inputSize, attributes, __clearSection, __clearable, __clearSectionMode, __defaultRightSection, loading, loadingPosition, rootRef, ...others } = props;
49
49
  const { styleProps, rest } = extractStyleProps(others);
50
50
  const ctx = use(InputWrapperContext);
51
51
  const stylesCtx = {
@@ -70,7 +70,7 @@ const Input = polymorphicFactory((_props) => {
70
70
  const ariaAttributes = withAria ? {
71
71
  required,
72
72
  disabled,
73
- "aria-invalid": !!error,
73
+ "aria-invalid": error ? true : void 0,
74
74
  "aria-describedby": ctx?.describedBy,
75
75
  id: ctx?.inputId || id
76
76
  } : {};
@@ -87,6 +87,7 @@ const Input = polymorphicFactory((_props) => {
87
87
  return /* @__PURE__ */ jsx(InputContext, {
88
88
  value: { size: size || "sm" },
89
89
  children: /* @__PURE__ */ jsxs(Box, {
90
+ ref: rootRef,
90
91
  ...getStyles("wrapper"),
91
92
  ...styleProps,
92
93
  ...wrapperProps,
@@ -1 +1 @@
1
- {"version":3,"file":"Input.mjs","names":["classes"],"sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n extractStyleProps,\n getFontSize,\n getRadius,\n getSize,\n MantineRadius,\n MantineSize,\n polymorphicFactory,\n PolymorphicFactory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader } from '../Loader/Loader';\nimport { InputContext } from './Input.context';\nimport { InputClearButton } from './InputClearButton/InputClearButton';\nimport { ClearSectionMode, InputClearSection } from './InputClearSection/InputClearSection';\nimport { InputDescription } from './InputDescription/InputDescription';\nimport { InputError } from './InputError/InputError';\nimport { InputLabel } from './InputLabel/InputLabel';\nimport { InputPlaceholder } from './InputPlaceholder/InputPlaceholder';\nimport { InputWrapperContext } from './InputWrapper.context';\nimport {\n __InputWrapperProps,\n InputWrapper,\n InputWrapperStylesNames,\n} from './InputWrapper/InputWrapper';\nimport classes from './Input.module.css';\n\n// Required to be a separate type for docgen script\ntype WrapperProps = React.ComponentProps<'div'> & DataAttributes;\n\nexport interface __BaseInputProps extends __InputWrapperProps, __InputProps {\n /** Props passed down to the root element */\n wrapperProps?: WrapperProps;\n}\n\nexport type __InputStylesNames = InputStylesNames | InputWrapperStylesNames;\n\nexport type InputStylesNames = 'input' | 'wrapper' | 'section';\nexport type InputVariant = 'default' | 'filled' | 'unstyled';\nexport type InputCssVariables = {\n wrapper:\n | '--input-height'\n | '--input-fz'\n | '--input-radius'\n | '--input-left-section-width'\n | '--input-right-section-width'\n | '--input-left-section-pointer-events'\n | '--input-right-section-pointer-events'\n | '--input-padding-y'\n | '--input-margin-top'\n | '--input-margin-bottom';\n};\n\nexport interface InputStylesCtx {\n offsetTop: boolean | undefined;\n offsetBottom: boolean | undefined;\n}\n\nexport interface __InputProps {\n /** Content section displayed on the left side of the input */\n leftSection?: React.ReactNode;\n\n /** Left section width, used to set `width` of the section and input `padding-left`, by default equals to the input height */\n leftSectionWidth?: React.CSSProperties['width'];\n\n /** Props passed down to the `leftSection` element */\n leftSectionProps?: React.ComponentProps<'div'>;\n\n /** Sets `pointer-events` styles on the `leftSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n leftSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n /** Content section displayed on the right side of the input */\n rightSection?: React.ReactNode;\n\n /** Right section width, used to set `width` of the section and input `padding-right`, by default equals to the input height */\n rightSectionWidth?: React.CSSProperties['width'];\n\n /** Props passed down to the `rightSection` element */\n rightSectionProps?: React.ComponentProps<'div'>;\n\n /** Sets `pointer-events` styles on the `rightSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n rightSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n /** Sets `required` attribute on the `input` element */\n required?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Sets `disabled` attribute on the `input` element */\n disabled?: boolean;\n\n /** Controls input `height`, horizontal `padding`, and `font-size` @default 'sm' */\n size?: MantineSize | (string & {});\n\n /** Determines whether the input should have `cursor: pointer` style. Use when input acts as a button-like trigger (e.g., `component=\"button\"` for Select/DatePicker). @default false */\n pointer?: boolean;\n\n /** Determines whether the input should have red border and red text color when the `error` prop is set @default true */\n withErrorStyles?: boolean;\n\n /** HTML `size` attribute for the input element (number of visible characters) */\n inputSize?: string;\n\n /** Section to be displayed when the input is `__clearable` and `rightSection` is not defined */\n __clearSection?: React.ReactNode;\n\n /** Determines whether the `__clearSection` should be displayed if it is passed to the component, has no effect if `rightSection` is defined */\n __clearable?: boolean;\n\n /** Determines how the clear button and rightSection are rendered @default 'both' */\n __clearSectionMode?: ClearSectionMode;\n\n /** Right section displayed when both `__clearSection` and `rightSection` are not defined */\n __defaultRightSection?: React.ReactNode;\n\n /** Displays loading indicator in the left or right section @default false */\n loading?: boolean;\n\n /** Position of the loading indicator @default 'right' */\n loadingPosition?: 'left' | 'right';\n}\n\nexport interface InputProps extends BoxProps, __InputProps, StylesApiProps<InputFactory> {\n __staticSelector?: string;\n\n /** Props passed to Styles API context, replaces `Input.Wrapper` props */\n __stylesApiProps?: Record<string, any>;\n\n /** Determines whether the input should have error styles and `aria-invalid` attribute */\n error?: React.ReactNode;\n\n /** Adjusts padding and sizing calculations for multiline inputs (use with `component=\"textarea\"`). Does not make the input multiline by itself. @default false */\n multiline?: boolean;\n\n /** Input element id */\n id?: string;\n\n /** Determines whether `aria-` and other accessibility attributes should be added to the input. Only disable when implementing custom accessibility handling. @default true */\n withAria?: boolean;\n\n /** Props passed down to the root element of the `Input` component */\n wrapperProps?: WrapperProps;\n}\n\nexport type InputFactory = PolymorphicFactory<{\n props: InputProps;\n defaultRef: HTMLInputElement;\n defaultComponent: 'input';\n stylesNames: InputStylesNames;\n variant: InputVariant;\n vars: InputCssVariables;\n ctx: InputStylesCtx;\n staticComponents: {\n Label: typeof InputLabel;\n Error: typeof InputError;\n Description: typeof InputDescription;\n Placeholder: typeof InputPlaceholder;\n Wrapper: typeof InputWrapper;\n ClearButton: typeof InputClearButton;\n };\n}>;\n\nconst defaultProps = {\n variant: 'default',\n leftSectionPointerEvents: 'none',\n rightSectionPointerEvents: 'none',\n withAria: true,\n withErrorStyles: true,\n size: 'sm',\n loading: false,\n loadingPosition: 'right',\n} satisfies Partial<InputProps>;\n\nconst varsResolver = createVarsResolver<InputFactory>((_, props, ctx) => ({\n wrapper: {\n '--input-margin-top': ctx.offsetTop ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n '--input-margin-bottom': ctx.offsetBottom ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n '--input-height': getSize(props.size, 'input-height'),\n '--input-fz': getFontSize(props.size),\n '--input-radius': props.radius === undefined ? undefined : getRadius(props.radius),\n '--input-left-section-width':\n props.leftSectionWidth !== undefined ? rem(props.leftSectionWidth) : undefined,\n '--input-right-section-width':\n props.rightSectionWidth !== undefined ? rem(props.rightSectionWidth) : undefined,\n '--input-padding-y': props.multiline ? getSize(props.size, 'input-padding-y') : undefined,\n '--input-left-section-pointer-events': props.leftSectionPointerEvents,\n '--input-right-section-pointer-events': props.rightSectionPointerEvents,\n },\n}));\n\nexport const Input = polymorphicFactory<InputFactory>((_props) => {\n const props = useProps('Input', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n required,\n __staticSelector,\n __stylesApiProps,\n size,\n wrapperProps,\n error,\n disabled,\n leftSection,\n leftSectionProps,\n leftSectionWidth,\n rightSection,\n rightSectionProps,\n rightSectionWidth,\n rightSectionPointerEvents,\n leftSectionPointerEvents,\n variant,\n vars,\n pointer,\n multiline,\n radius,\n id,\n withAria,\n withErrorStyles,\n mod,\n inputSize,\n attributes,\n __clearSection,\n __clearable,\n __clearSectionMode,\n __defaultRightSection,\n loading,\n loadingPosition,\n ...others\n } = props;\n\n const { styleProps, rest } = extractStyleProps(others);\n const ctx = use(InputWrapperContext);\n const stylesCtx: InputStylesCtx = { offsetBottom: ctx?.offsetBottom, offsetTop: ctx?.offsetTop };\n\n const getStyles = useStyles<InputFactory>({\n name: ['Input', __staticSelector],\n props: __stylesApiProps || props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n stylesCtx,\n rootSelector: 'wrapper',\n vars,\n varsResolver,\n });\n\n const ariaAttributes = withAria\n ? {\n required,\n disabled,\n 'aria-invalid': !!error,\n 'aria-describedby': ctx?.describedBy,\n id: ctx?.inputId || id,\n }\n : {};\n\n const loadingIndicator = loading ? (\n <Loader\n size={\n loadingPosition === 'left'\n ? 'calc(var(--input-left-section-size) / 2)'\n : 'calc(var(--input-right-section-size) / 2)'\n }\n />\n ) : null;\n\n const _leftSection = loading && loadingPosition === 'left' ? loadingIndicator : leftSection;\n const _rightSection: React.ReactNode = InputClearSection({\n __clearable,\n __clearSection,\n rightSection: loading && loadingPosition === 'right' ? loadingIndicator : rightSection,\n __defaultRightSection,\n size,\n __clearSectionMode,\n });\n\n return (\n <InputContext value={{ size: size || 'sm' }}>\n <Box\n {...getStyles('wrapper')}\n {...styleProps}\n {...wrapperProps}\n mod={[\n {\n error: !!error && withErrorStyles,\n pointer,\n disabled,\n multiline,\n 'data-with-right-section': !!_rightSection,\n 'data-with-left-section': !!_leftSection,\n },\n mod,\n ]}\n variant={variant}\n size={size}\n >\n {_leftSection && (\n <div\n {...leftSectionProps}\n data-position=\"left\"\n {...getStyles('section', {\n className: leftSectionProps?.className,\n style: leftSectionProps?.style,\n })}\n >\n {_leftSection}\n </div>\n )}\n\n <Box\n component=\"input\"\n {...rest}\n {...ariaAttributes}\n required={required}\n mod={{ disabled, error: !!error && withErrorStyles }}\n variant={variant}\n __size={inputSize}\n {...getStyles('input')}\n />\n\n {_rightSection && (\n <div\n {...rightSectionProps}\n data-position=\"right\"\n {...getStyles('section', {\n className: rightSectionProps?.className,\n style: rightSectionProps?.style,\n })}\n >\n {_rightSection}\n </div>\n )}\n </Box>\n </InputContext>\n );\n});\n\nInput.classes = classes;\nInput.varsResolver = varsResolver;\nInput.Wrapper = InputWrapper;\nInput.Label = InputLabel;\nInput.Error = InputError;\nInput.Description = InputDescription;\nInput.Placeholder = InputPlaceholder;\nInput.ClearButton = InputClearButton;\nInput.displayName = '@mantine/core/Input';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA2KA,MAAM,eAAe;CACnB,SAAS;CACT,0BAA0B;CAC1B,2BAA2B;CAC3B,UAAU;CACV,iBAAiB;CACjB,MAAM;CACN,SAAS;CACT,iBAAiB;CAClB;AAED,MAAM,eAAe,oBAAkC,GAAG,OAAO,SAAS,EACxE,SAAS;CACP,sBAAsB,IAAI,YAAY,wCAAwC,KAAA;CAC9E,yBAAyB,IAAI,eAAe,wCAAwC,KAAA;CACpF,kBAAkB,QAAQ,MAAM,MAAM,eAAe;CACrD,cAAc,YAAY,MAAM,KAAK;CACrC,kBAAkB,MAAM,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM,OAAO;CAClF,8BACE,MAAM,qBAAqB,KAAA,IAAY,IAAI,MAAM,iBAAiB,GAAG,KAAA;CACvE,+BACE,MAAM,sBAAsB,KAAA,IAAY,IAAI,MAAM,kBAAkB,GAAG,KAAA;CACzE,qBAAqB,MAAM,YAAY,QAAQ,MAAM,MAAM,kBAAkB,GAAG,KAAA;CAChF,uCAAuC,MAAM;CAC7C,wCAAwC,MAAM;CAC/C,EACF,EAAE;AAEH,MAAa,QAAQ,oBAAkC,WAAW;CAChE,MAAM,QAAQ,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,UACA,kBACA,kBACA,MACA,cACA,OACA,UACA,aACA,kBACA,kBACA,cACA,mBACA,mBACA,2BACA,0BACA,SACA,MACA,SACA,WACA,QACA,IACA,UACA,iBACA,KACA,WACA,YACA,gBACA,aACA,oBACA,uBACA,SACA,iBACA,GAAG,WACD;CAEJ,MAAM,EAAE,YAAY,SAAS,kBAAkB,OAAO;CACtD,MAAM,MAAM,IAAI,oBAAoB;CACpC,MAAM,YAA4B;EAAE,cAAc,KAAK;EAAc,WAAW,KAAK;EAAW;CAEhG,MAAM,YAAY,UAAwB;EACxC,MAAM,CAAC,SAAS,iBAAiB;EACjC,OAAO,oBAAoB;EAC3B,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,WACnB;EACE;EACA;EACA,gBAAgB,CAAC,CAAC;EAClB,oBAAoB,KAAK;EACzB,IAAI,KAAK,WAAW;EACrB,GACD,EAAE;CAEN,MAAM,mBAAmB,UACvB,oBAAC,QAAD,EACE,MACE,oBAAoB,SAChB,6CACA,6CAEN,CAAA,GACA;CAEJ,MAAM,eAAe,WAAW,oBAAoB,SAAS,mBAAmB;CAChF,MAAM,gBAAiC,kBAAkB;EACvD;EACA;EACA,cAAc,WAAW,oBAAoB,UAAU,mBAAmB;EAC1E;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,cAAD;EAAc,OAAO,EAAE,MAAM,QAAQ,MAAM;YACzC,qBAAC,KAAD;GACE,GAAI,UAAU,UAAU;GACxB,GAAI;GACJ,GAAI;GACJ,KAAK,CACH;IACE,OAAO,CAAC,CAAC,SAAS;IAClB;IACA;IACA;IACA,2BAA2B,CAAC,CAAC;IAC7B,0BAA0B,CAAC,CAAC;IAC7B,EACD,IACD;GACQ;GACH;aAhBR;IAkBG,gBACC,oBAAC,OAAD;KACE,GAAI;KACJ,iBAAc;KACd,GAAI,UAAU,WAAW;MACvB,WAAW,kBAAkB;MAC7B,OAAO,kBAAkB;MAC1B,CAAC;eAED;KACG,CAAA;IAGR,oBAAC,KAAD;KACE,WAAU;KACV,GAAI;KACJ,GAAI;KACM;KACV,KAAK;MAAE;MAAU,OAAO,CAAC,CAAC,SAAS;MAAiB;KAC3C;KACT,QAAQ;KACR,GAAI,UAAU,QAAQ;KACtB,CAAA;IAED,iBACC,oBAAC,OAAD;KACE,GAAI;KACJ,iBAAc;KACd,GAAI,UAAU,WAAW;MACvB,WAAW,mBAAmB;MAC9B,OAAO,mBAAmB;MAC3B,CAAC;eAED;KACG,CAAA;IAEJ;;EACO,CAAA;EAEjB;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,UAAU;AAChB,MAAM,QAAQ;AACd,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,cAAc;AACpB,MAAM,cAAc;AACpB,MAAM,cAAc"}
1
+ {"version":3,"file":"Input.mjs","names":["classes"],"sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n extractStyleProps,\n getFontSize,\n getRadius,\n getSize,\n MantineRadius,\n MantineSize,\n polymorphicFactory,\n PolymorphicFactory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader } from '../Loader/Loader';\nimport { InputContext } from './Input.context';\nimport {\n InputClearButton,\n type InputClearButtonProps,\n type InputClearButtonFactory,\n} from './InputClearButton/InputClearButton';\nimport {\n ClearSectionMode,\n InputClearSection,\n type InputClearSectionProps,\n} from './InputClearSection/InputClearSection';\nimport {\n InputDescription,\n type InputDescriptionProps,\n type InputDescriptionStylesNames,\n type InputDescriptionCssVariables,\n type InputDescriptionFactory,\n} from './InputDescription/InputDescription';\nimport {\n InputError,\n type InputErrorProps,\n type InputErrorStylesNames,\n type InputErrorCssVariables,\n type InputErrorFactory,\n} from './InputError/InputError';\nimport {\n InputLabel,\n type InputLabelProps,\n type InputLabelStylesNames,\n type InputLabelCssVariables,\n type InputLabelFactory,\n} from './InputLabel/InputLabel';\nimport {\n InputPlaceholder,\n type InputPlaceholderProps,\n type InputPlaceholderStylesNames,\n type InputPlaceholderFactory,\n} from './InputPlaceholder/InputPlaceholder';\nimport { InputWrapperContext } from './InputWrapper.context';\nimport {\n __InputWrapperProps,\n InputWrapper,\n InputWrapperStylesNames,\n type InputWrapperProps,\n type InputWrapperFactory,\n} from './InputWrapper/InputWrapper';\nimport classes from './Input.module.css';\n// Required to be a separate type for docgen script\ntype WrapperProps = React.ComponentProps<'div'> & DataAttributes;\n\nexport interface __BaseInputProps extends __InputWrapperProps, __InputProps {\n /** Props passed down to the root element */\n wrapperProps?: WrapperProps;\n}\n\nexport type __InputStylesNames = InputStylesNames | InputWrapperStylesNames;\n\nexport type InputStylesNames = 'input' | 'wrapper' | 'section';\nexport type InputVariant = 'default' | 'filled' | 'unstyled';\nexport type InputCssVariables = {\n wrapper:\n | '--input-height'\n | '--input-fz'\n | '--input-radius'\n | '--input-left-section-width'\n | '--input-right-section-width'\n | '--input-left-section-pointer-events'\n | '--input-right-section-pointer-events'\n | '--input-padding-y'\n | '--input-margin-top'\n | '--input-margin-bottom';\n};\n\nexport interface InputStylesCtx {\n offsetTop: boolean | undefined;\n offsetBottom: boolean | undefined;\n}\n\nexport interface __InputProps {\n /** Content section displayed on the left side of the input */\n leftSection?: React.ReactNode;\n\n /** Left section width, used to set `width` of the section and input `padding-left`, by default equals to the input height */\n leftSectionWidth?: React.CSSProperties['width'];\n\n /** Props passed down to the `leftSection` element */\n leftSectionProps?: React.ComponentProps<'div'>;\n\n /** Sets `pointer-events` styles on the `leftSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n leftSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n /** Content section displayed on the right side of the input */\n rightSection?: React.ReactNode;\n\n /** Right section width, used to set `width` of the section and input `padding-right`, by default equals to the input height */\n rightSectionWidth?: React.CSSProperties['width'];\n\n /** Props passed down to the `rightSection` element */\n rightSectionProps?: React.ComponentProps<'div'>;\n\n /** Sets `pointer-events` styles on the `rightSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n rightSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n /** Sets `required` attribute on the `input` element */\n required?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Sets `disabled` attribute on the `input` element */\n disabled?: boolean;\n\n /** Controls input `height`, horizontal `padding`, and `font-size` @default 'sm' */\n size?: MantineSize | (string & {});\n\n /** Determines whether the input should have `cursor: pointer` style. Use when input acts as a button-like trigger (e.g., `component=\"button\"` for Select/DatePicker). @default false */\n pointer?: boolean;\n\n /** Determines whether the input should have red border and red text color when the `error` prop is set @default true */\n withErrorStyles?: boolean;\n\n /** HTML `size` attribute for the input element (number of visible characters) */\n inputSize?: string;\n\n /** Section to be displayed when the input is `__clearable` and `rightSection` is not defined */\n __clearSection?: React.ReactNode;\n\n /** Determines whether the `__clearSection` should be displayed if it is passed to the component, has no effect if `rightSection` is defined */\n __clearable?: boolean;\n\n /** Determines how the clear button and rightSection are rendered @default 'both' */\n __clearSectionMode?: ClearSectionMode;\n\n /** Right section displayed when both `__clearSection` and `rightSection` are not defined */\n __defaultRightSection?: React.ReactNode;\n\n /** Displays loading indicator in the left or right section @default false */\n loading?: boolean;\n\n /** Position of the loading indicator @default 'right' */\n loadingPosition?: 'left' | 'right';\n}\n\nexport interface InputProps extends BoxProps, __InputProps, StylesApiProps<InputFactory> {\n __staticSelector?: string;\n\n /** Props passed to Styles API context, replaces `Input.Wrapper` props */\n __stylesApiProps?: Record<string, any>;\n\n /** Determines whether the input should have error styles and `aria-invalid` attribute */\n error?: React.ReactNode;\n\n /** Adjusts padding and sizing calculations for multiline inputs (use with `component=\"textarea\"`). Does not make the input multiline by itself. @default false */\n multiline?: boolean;\n\n /** Input element id */\n id?: string;\n\n /** Determines whether `aria-` and other accessibility attributes should be added to the input. Only disable when implementing custom accessibility handling. @default true */\n withAria?: boolean;\n\n /** Props passed down to the root element of the `Input` component */\n wrapperProps?: WrapperProps;\n\n /** Root element ref */\n rootRef?: React.Ref<HTMLDivElement>;\n}\n\nexport type InputFactory = PolymorphicFactory<{\n props: InputProps;\n defaultRef: HTMLInputElement;\n defaultComponent: 'input';\n stylesNames: InputStylesNames;\n variant: InputVariant;\n vars: InputCssVariables;\n ctx: InputStylesCtx;\n staticComponents: {\n Label: typeof InputLabel;\n Error: typeof InputError;\n Description: typeof InputDescription;\n Placeholder: typeof InputPlaceholder;\n Wrapper: typeof InputWrapper;\n ClearButton: typeof InputClearButton;\n };\n}>;\n\nconst defaultProps = {\n variant: 'default',\n leftSectionPointerEvents: 'none',\n rightSectionPointerEvents: 'none',\n withAria: true,\n withErrorStyles: true,\n size: 'sm',\n loading: false,\n loadingPosition: 'right',\n} satisfies Partial<InputProps>;\n\nconst varsResolver = createVarsResolver<InputFactory>((_, props, ctx) => ({\n wrapper: {\n '--input-margin-top': ctx.offsetTop ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n '--input-margin-bottom': ctx.offsetBottom ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n '--input-height': getSize(props.size, 'input-height'),\n '--input-fz': getFontSize(props.size),\n '--input-radius': props.radius === undefined ? undefined : getRadius(props.radius),\n '--input-left-section-width':\n props.leftSectionWidth !== undefined ? rem(props.leftSectionWidth) : undefined,\n '--input-right-section-width':\n props.rightSectionWidth !== undefined ? rem(props.rightSectionWidth) : undefined,\n '--input-padding-y': props.multiline ? getSize(props.size, 'input-padding-y') : undefined,\n '--input-left-section-pointer-events': props.leftSectionPointerEvents,\n '--input-right-section-pointer-events': props.rightSectionPointerEvents,\n },\n}));\n\nexport const Input = polymorphicFactory<InputFactory>((_props) => {\n const props = useProps('Input', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n required,\n __staticSelector,\n __stylesApiProps,\n size,\n wrapperProps,\n error,\n disabled,\n leftSection,\n leftSectionProps,\n leftSectionWidth,\n rightSection,\n rightSectionProps,\n rightSectionWidth,\n rightSectionPointerEvents,\n leftSectionPointerEvents,\n variant,\n vars,\n pointer,\n multiline,\n radius,\n id,\n withAria,\n withErrorStyles,\n mod,\n inputSize,\n attributes,\n __clearSection,\n __clearable,\n __clearSectionMode,\n __defaultRightSection,\n loading,\n loadingPosition,\n rootRef,\n ...others\n } = props;\n\n const { styleProps, rest } = extractStyleProps(others);\n const ctx = use(InputWrapperContext);\n const stylesCtx: InputStylesCtx = { offsetBottom: ctx?.offsetBottom, offsetTop: ctx?.offsetTop };\n\n const getStyles = useStyles<InputFactory>({\n name: ['Input', __staticSelector],\n props: __stylesApiProps || props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n stylesCtx,\n rootSelector: 'wrapper',\n vars,\n varsResolver,\n });\n\n const ariaAttributes = withAria\n ? {\n required,\n disabled,\n 'aria-invalid': error ? true : undefined,\n 'aria-describedby': ctx?.describedBy,\n id: ctx?.inputId || id,\n }\n : {};\n\n const loadingIndicator = loading ? (\n <Loader\n size={\n loadingPosition === 'left'\n ? 'calc(var(--input-left-section-size) / 2)'\n : 'calc(var(--input-right-section-size) / 2)'\n }\n />\n ) : null;\n\n const _leftSection = loading && loadingPosition === 'left' ? loadingIndicator : leftSection;\n const _rightSection: React.ReactNode = InputClearSection({\n __clearable,\n __clearSection,\n rightSection: loading && loadingPosition === 'right' ? loadingIndicator : rightSection,\n __defaultRightSection,\n size,\n __clearSectionMode,\n });\n\n return (\n <InputContext value={{ size: size || 'sm' }}>\n <Box\n ref={rootRef}\n {...getStyles('wrapper')}\n {...styleProps}\n {...wrapperProps}\n mod={[\n {\n error: !!error && withErrorStyles,\n pointer,\n disabled,\n multiline,\n 'data-with-right-section': !!_rightSection,\n 'data-with-left-section': !!_leftSection,\n },\n mod,\n ]}\n variant={variant}\n size={size}\n >\n {_leftSection && (\n <div\n {...leftSectionProps}\n data-position=\"left\"\n {...getStyles('section', {\n className: leftSectionProps?.className,\n style: leftSectionProps?.style,\n })}\n >\n {_leftSection}\n </div>\n )}\n\n <Box\n component=\"input\"\n {...rest}\n {...ariaAttributes}\n required={required}\n mod={{ disabled, error: !!error && withErrorStyles }}\n variant={variant}\n __size={inputSize}\n {...getStyles('input')}\n />\n\n {_rightSection && (\n <div\n {...rightSectionProps}\n data-position=\"right\"\n {...getStyles('section', {\n className: rightSectionProps?.className,\n style: rightSectionProps?.style,\n })}\n >\n {_rightSection}\n </div>\n )}\n </Box>\n </InputContext>\n );\n});\n\nInput.classes = classes;\nInput.varsResolver = varsResolver;\nInput.Wrapper = InputWrapper;\nInput.Label = InputLabel;\nInput.Error = InputError;\nInput.Description = InputDescription;\nInput.Placeholder = InputPlaceholder;\nInput.ClearButton = InputClearButton;\nInput.displayName = '@mantine/core/Input';\n\nexport namespace Input {\n export type Props = InputProps;\n export type StylesNames = InputStylesNames;\n export type CssVariables = InputCssVariables;\n export type Factory = InputFactory;\n\n export namespace Wrapper {\n export type Props = InputWrapperProps;\n export type StylesNames = InputWrapperStylesNames;\n export type Factory = InputWrapperFactory;\n }\n\n export namespace Description {\n export type Props = InputDescriptionProps;\n export type StylesNames = InputDescriptionStylesNames;\n export type CssVariables = InputDescriptionCssVariables;\n export type Factory = InputDescriptionFactory;\n }\n\n export namespace Error {\n export type Props = InputErrorProps;\n export type StylesNames = InputErrorStylesNames;\n export type CssVariables = InputErrorCssVariables;\n export type Factory = InputErrorFactory;\n }\n\n export namespace Label {\n export type Props = InputLabelProps;\n export type StylesNames = InputLabelStylesNames;\n export type CssVariables = InputLabelCssVariables;\n export type Factory = InputLabelFactory;\n }\n\n export namespace Placeholder {\n export type Props = InputPlaceholderProps;\n export type StylesNames = InputPlaceholderStylesNames;\n export type Factory = InputPlaceholderFactory;\n }\n\n export namespace ClearButton {\n export type Props = InputClearButtonProps;\n export type Factory = InputClearButtonFactory;\n }\n\n export namespace ClearSection {\n export type Props = InputClearSectionProps;\n export type Mode = ClearSectionMode;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA8MA,MAAM,eAAe;CACnB,SAAS;CACT,0BAA0B;CAC1B,2BAA2B;CAC3B,UAAU;CACV,iBAAiB;CACjB,MAAM;CACN,SAAS;CACT,iBAAiB;CAClB;AAED,MAAM,eAAe,oBAAkC,GAAG,OAAO,SAAS,EACxE,SAAS;CACP,sBAAsB,IAAI,YAAY,wCAAwC,KAAA;CAC9E,yBAAyB,IAAI,eAAe,wCAAwC,KAAA;CACpF,kBAAkB,QAAQ,MAAM,MAAM,eAAe;CACrD,cAAc,YAAY,MAAM,KAAK;CACrC,kBAAkB,MAAM,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM,OAAO;CAClF,8BACE,MAAM,qBAAqB,KAAA,IAAY,IAAI,MAAM,iBAAiB,GAAG,KAAA;CACvE,+BACE,MAAM,sBAAsB,KAAA,IAAY,IAAI,MAAM,kBAAkB,GAAG,KAAA;CACzE,qBAAqB,MAAM,YAAY,QAAQ,MAAM,MAAM,kBAAkB,GAAG,KAAA;CAChF,uCAAuC,MAAM;CAC7C,wCAAwC,MAAM;CAC/C,EACF,EAAE;AAEH,MAAa,QAAQ,oBAAkC,WAAW;CAChE,MAAM,QAAQ,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,UACA,kBACA,kBACA,MACA,cACA,OACA,UACA,aACA,kBACA,kBACA,cACA,mBACA,mBACA,2BACA,0BACA,SACA,MACA,SACA,WACA,QACA,IACA,UACA,iBACA,KACA,WACA,YACA,gBACA,aACA,oBACA,uBACA,SACA,iBACA,SACA,GAAG,WACD;CAEJ,MAAM,EAAE,YAAY,SAAS,kBAAkB,OAAO;CACtD,MAAM,MAAM,IAAI,oBAAoB;CACpC,MAAM,YAA4B;EAAE,cAAc,KAAK;EAAc,WAAW,KAAK;EAAW;CAEhG,MAAM,YAAY,UAAwB;EACxC,MAAM,CAAC,SAAS,iBAAiB;EACjC,OAAO,oBAAoB;EAC3B,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,WACnB;EACE;EACA;EACA,gBAAgB,QAAQ,OAAO,KAAA;EAC/B,oBAAoB,KAAK;EACzB,IAAI,KAAK,WAAW;EACrB,GACD,EAAE;CAEN,MAAM,mBAAmB,UACvB,oBAAC,QAAD,EACE,MACE,oBAAoB,SAChB,6CACA,6CAEN,CAAA,GACA;CAEJ,MAAM,eAAe,WAAW,oBAAoB,SAAS,mBAAmB;CAChF,MAAM,gBAAiC,kBAAkB;EACvD;EACA;EACA,cAAc,WAAW,oBAAoB,UAAU,mBAAmB;EAC1E;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,cAAD;EAAc,OAAO,EAAE,MAAM,QAAQ,MAAM;YACzC,qBAAC,KAAD;GACE,KAAK;GACL,GAAI,UAAU,UAAU;GACxB,GAAI;GACJ,GAAI;GACJ,KAAK,CACH;IACE,OAAO,CAAC,CAAC,SAAS;IAClB;IACA;IACA;IACA,2BAA2B,CAAC,CAAC;IAC7B,0BAA0B,CAAC,CAAC;IAC7B,EACD,IACD;GACQ;GACH;aAjBR;IAmBG,gBACC,oBAAC,OAAD;KACE,GAAI;KACJ,iBAAc;KACd,GAAI,UAAU,WAAW;MACvB,WAAW,kBAAkB;MAC7B,OAAO,kBAAkB;MAC1B,CAAC;eAED;KACG,CAAA;IAGR,oBAAC,KAAD;KACE,WAAU;KACV,GAAI;KACJ,GAAI;KACM;KACV,KAAK;MAAE;MAAU,OAAO,CAAC,CAAC,SAAS;MAAiB;KAC3C;KACT,QAAQ;KACR,GAAI,UAAU,QAAQ;KACtB,CAAA;IAED,iBACC,oBAAC,OAAD;KACE,GAAI;KACJ,iBAAc;KACd,GAAI,UAAU,WAAW;MACvB,WAAW,mBAAmB;MAC9B,OAAO,mBAAmB;MAC3B,CAAC;eAED;KACG,CAAA;IAEJ;;EACO,CAAA;EAEjB;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,UAAU;AAChB,MAAM,QAAQ;AACd,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,cAAc;AACpB,MAAM,cAAc;AACpB,MAAM,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"InputBase.mjs","names":[],"sources":["../../../src/components/InputBase/InputBase.tsx"],"sourcesContent":["import {\n BoxProps,\n DataAttributes,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n} from '../../core';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input';\n\nexport interface InputBaseProps\n extends BoxProps, __BaseInputProps, StylesApiProps<InputBaseFactory> {\n __staticSelector?: string;\n __stylesApiProps?: Record<string, any>;\n\n /** Props passed down to the root element (`Input.Wrapper` component) */\n wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n /** If set, the input can have multiple lines, for example when `component=\"textarea\"` @default false */\n multiline?: boolean;\n\n /** If set, `aria-` and other accessibility attributes are added to the input @default true */\n withAria?: boolean;\n}\n\nexport type InputBaseFactory = PolymorphicFactory<{\n props: InputBaseProps;\n defaultRef: HTMLInputElement;\n defaultComponent: 'input';\n stylesNames: __InputStylesNames;\n variant: InputVariant;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'InputBase',\n withAria: true,\n size: 'sm',\n} satisfies Partial<InputBaseProps>;\n\nexport const InputBase = polymorphicFactory<InputBaseFactory>((props) => {\n const { inputProps, wrapperProps, ...others } = useInputProps('InputBase', defaultProps, props);\n return (\n <Input.Wrapper {...wrapperProps}>\n <Input {...inputProps} {...others} />\n </Input.Wrapper>\n );\n});\n\nInputBase.classes = { ...Input.classes, ...Input.Wrapper.classes };\nInputBase.displayName = '@mantine/core/InputBase';\n"],"mappings":";;;;;;AAgCA,MAAM,eAAe;CACnB,kBAAkB;CAClB,UAAU;CACV,MAAM;CACP;AAED,MAAa,YAAY,oBAAsC,UAAU;CACvE,MAAM,EAAE,YAAY,cAAc,GAAG,WAAW,cAAc,aAAa,cAAc,MAAM;AAC/F,QACE,oBAAC,MAAM,SAAP;EAAe,GAAI;YACjB,oBAAC,OAAD;GAAO,GAAI;GAAY,GAAI;GAAU,CAAA;EACvB,CAAA;EAElB;AAEF,UAAU,UAAU;CAAE,GAAG,MAAM;CAAS,GAAG,MAAM,QAAQ;CAAS;AAClE,UAAU,cAAc"}
1
+ {"version":3,"file":"InputBase.mjs","names":[],"sources":["../../../src/components/InputBase/InputBase.tsx"],"sourcesContent":["import {\n BoxProps,\n DataAttributes,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n} from '../../core';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input';\n\nexport interface InputBaseProps\n extends BoxProps, __BaseInputProps, StylesApiProps<InputBaseFactory> {\n __staticSelector?: string;\n __stylesApiProps?: Record<string, any>;\n\n /** Props passed down to the root element (`Input.Wrapper` component) */\n wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n /** If set, the input can have multiple lines, for example when `component=\"textarea\"` @default false */\n multiline?: boolean;\n\n /** If set, `aria-` and other accessibility attributes are added to the input @default true */\n withAria?: boolean;\n}\n\nexport type InputBaseFactory = PolymorphicFactory<{\n props: InputBaseProps;\n defaultRef: HTMLInputElement;\n defaultComponent: 'input';\n stylesNames: __InputStylesNames;\n variant: InputVariant;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'InputBase',\n withAria: true,\n size: 'sm',\n} satisfies Partial<InputBaseProps>;\n\nexport const InputBase = polymorphicFactory<InputBaseFactory>((props) => {\n const { inputProps, wrapperProps, ...others } = useInputProps('InputBase', defaultProps, props);\n return (\n <Input.Wrapper {...wrapperProps}>\n <Input {...inputProps} {...others} />\n </Input.Wrapper>\n );\n});\n\nInputBase.classes = { ...Input.classes, ...Input.Wrapper.classes };\nInputBase.displayName = '@mantine/core/InputBase';\n\nexport namespace InputBase {\n export type Props = InputBaseProps;\n export type Factory = InputBaseFactory;\n}\n"],"mappings":";;;;;;AAgCA,MAAM,eAAe;CACnB,kBAAkB;CAClB,UAAU;CACV,MAAM;CACP;AAED,MAAa,YAAY,oBAAsC,UAAU;CACvE,MAAM,EAAE,YAAY,cAAc,GAAG,WAAW,cAAc,aAAa,cAAc,MAAM;AAC/F,QACE,oBAAC,MAAM,SAAP;EAAe,GAAI;YACjB,oBAAC,OAAD;GAAO,GAAI;GAAY,GAAI;GAAU,CAAA;EACvB,CAAA;EAElB;AAEF,UAAU,UAAU;CAAE,GAAG,MAAM;CAAS,GAAG,MAAM,QAAQ;CAAS;AAClE,UAAU,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"JsonInput.mjs","names":[],"sources":["../../../src/components/JsonInput/JsonInput.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { factory, Factory, useProps } from '../../core';\nimport { __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Textarea, TextareaProps } from '../Textarea';\nimport { validateJson } from './validate-json/validate-json';\n\nexport interface JsonInputProps extends Omit<TextareaProps, 'onChange'> {\n /** Controlled component value */\n value?: string;\n\n /** Uncontrolled component default value */\n defaultValue?: string;\n\n /** Called when value changes */\n onChange?: (value: string) => void;\n\n /** Determines whether the value should be formatted on blur @default false */\n formatOnBlur?: boolean;\n\n /** Error message shown when the input value is invalid JSON (checked on blur). If not provided, a generic error state is shown. Takes precedence over the `error` prop when validation fails. */\n validationError?: React.ReactNode;\n\n /** Function to serialize value into a string for formatting. Called with (value, null, 2) where 2 is the indentation level. @default JSON.stringify */\n serialize?: typeof JSON.stringify;\n\n /** Function to deserialize string value for formatting and validation. Must throw an error if the string is invalid JSON. @default JSON.parse */\n deserialize?: typeof JSON.parse;\n\n /** Number of spaces to use as white space for formatting. Passed as the third argument to `serialize` function. @default 2 */\n indentSpaces?: number;\n}\n\nexport type JsonInputFactory = Factory<{\n props: JsonInputProps;\n ref: HTMLTextAreaElement;\n stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {\n serialize: JSON.stringify,\n deserialize: JSON.parse,\n size: 'sm',\n indentSpaces: 2,\n} satisfies Partial<JsonInputProps>;\n\nexport const JsonInput = factory<JsonInputFactory>((props) => {\n const {\n value,\n defaultValue,\n onChange,\n formatOnBlur,\n validationError,\n serialize,\n deserialize,\n onFocus,\n onBlur,\n readOnly,\n error,\n indentSpaces,\n ...others\n } = useProps('JsonInput', defaultProps, props);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '',\n onChange,\n });\n\n const [valid, setValid] = useState(validateJson(_value, deserialize));\n\n const handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n onFocus?.(event);\n setValid(true);\n };\n\n const handleBlur = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n onBlur?.(event);\n const isValid = validateJson(event.currentTarget.value, deserialize);\n formatOnBlur &&\n !readOnly &&\n isValid &&\n event.currentTarget.value.trim() !== '' &&\n setValue(serialize(deserialize(event.currentTarget.value), null, indentSpaces));\n setValid(isValid);\n };\n\n return (\n <Textarea\n value={_value}\n onChange={(event) => setValue(event.currentTarget.value)}\n onFocus={handleFocus}\n onBlur={handleBlur}\n readOnly={readOnly}\n {...others}\n autoComplete=\"off\"\n __staticSelector=\"JsonInput\"\n error={valid ? error : validationError || true}\n data-monospace\n />\n );\n});\n\nJsonInput.classes = InputBase.classes;\nJsonInput.displayName = '@mantine/core/JsonInput';\n"],"mappings":";;;;;;;;;;AAwCA,MAAM,eAAe;CACnB,WAAW,KAAK;CAChB,aAAa,KAAK;CAClB,MAAM;CACN,cAAc;CACf;AAED,MAAa,YAAY,SAA2B,UAAU;CAC5D,MAAM,EACJ,OACA,cACA,UACA,cACA,iBACA,WACA,aACA,SACA,QACA,UACA,OACA,cACA,GAAG,WACD,SAAS,aAAa,cAAc,MAAM;CAE9C,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY;EACZ;EACD,CAAC;CAEF,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa,QAAQ,YAAY,CAAC;CAErE,MAAM,eAAe,UAAiD;AACpE,YAAU,MAAM;AAChB,WAAS,KAAK;;CAGhB,MAAM,cAAc,UAAiD;AACnE,WAAS,MAAM;EACf,MAAM,UAAU,aAAa,MAAM,cAAc,OAAO,YAAY;AACpE,kBACE,CAAC,YACD,WACA,MAAM,cAAc,MAAM,MAAM,KAAK,MACrC,SAAS,UAAU,YAAY,MAAM,cAAc,MAAM,EAAE,MAAM,aAAa,CAAC;AACjF,WAAS,QAAQ;;AAGnB,QACE,oBAAC,UAAD;EACE,OAAO;EACP,WAAW,UAAU,SAAS,MAAM,cAAc,MAAM;EACxD,SAAS;EACT,QAAQ;EACE;EACV,GAAI;EACJ,cAAa;EACb,kBAAiB;EACjB,OAAO,QAAQ,QAAQ,mBAAmB;EAC1C,kBAAA;EACA,CAAA;EAEJ;AAEF,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}
1
+ {"version":3,"file":"JsonInput.mjs","names":[],"sources":["../../../src/components/JsonInput/JsonInput.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { factory, Factory, useProps } from '../../core';\nimport { __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Textarea, TextareaProps } from '../Textarea';\nimport { validateJson } from './validate-json/validate-json';\n\nexport interface JsonInputProps extends Omit<TextareaProps, 'onChange'> {\n /** Controlled component value */\n value?: string;\n\n /** Uncontrolled component default value */\n defaultValue?: string;\n\n /** Called when value changes */\n onChange?: (value: string) => void;\n\n /** Determines whether the value should be formatted on blur @default false */\n formatOnBlur?: boolean;\n\n /** Error message shown when the input value is invalid JSON (checked on blur). If not provided, a generic error state is shown. Takes precedence over the `error` prop when validation fails. */\n validationError?: React.ReactNode;\n\n /** Function to serialize value into a string for formatting. Called with (value, null, 2) where 2 is the indentation level. @default JSON.stringify */\n serialize?: typeof JSON.stringify;\n\n /** Function to deserialize string value for formatting and validation. Must throw an error if the string is invalid JSON. @default JSON.parse */\n deserialize?: typeof JSON.parse;\n\n /** Number of spaces to use as white space for formatting. Passed as the third argument to `serialize` function. @default 2 */\n indentSpaces?: number;\n}\n\nexport type JsonInputFactory = Factory<{\n props: JsonInputProps;\n ref: HTMLTextAreaElement;\n stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {\n serialize: JSON.stringify,\n deserialize: JSON.parse,\n size: 'sm',\n indentSpaces: 2,\n} satisfies Partial<JsonInputProps>;\n\nexport const JsonInput = factory<JsonInputFactory>((props) => {\n const {\n value,\n defaultValue,\n onChange,\n formatOnBlur,\n validationError,\n serialize,\n deserialize,\n onFocus,\n onBlur,\n readOnly,\n error,\n indentSpaces,\n ...others\n } = useProps('JsonInput', defaultProps, props);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '',\n onChange,\n });\n\n const [valid, setValid] = useState(validateJson(_value, deserialize));\n\n const handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n onFocus?.(event);\n setValid(true);\n };\n\n const handleBlur = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n onBlur?.(event);\n const isValid = validateJson(event.currentTarget.value, deserialize);\n formatOnBlur &&\n !readOnly &&\n isValid &&\n event.currentTarget.value.trim() !== '' &&\n setValue(serialize(deserialize(event.currentTarget.value), null, indentSpaces));\n setValid(isValid);\n };\n\n return (\n <Textarea\n value={_value}\n onChange={(event) => setValue(event.currentTarget.value)}\n onFocus={handleFocus}\n onBlur={handleBlur}\n readOnly={readOnly}\n {...others}\n autoComplete=\"off\"\n __staticSelector=\"JsonInput\"\n error={valid ? error : validationError || true}\n data-monospace\n />\n );\n});\n\nJsonInput.classes = InputBase.classes;\nJsonInput.displayName = '@mantine/core/JsonInput';\n\nexport namespace JsonInput {\n export type Props = JsonInputProps;\n export type Factory = JsonInputFactory;\n}\n"],"mappings":";;;;;;;;;;AAwCA,MAAM,eAAe;CACnB,WAAW,KAAK;CAChB,aAAa,KAAK;CAClB,MAAM;CACN,cAAc;CACf;AAED,MAAa,YAAY,SAA2B,UAAU;CAC5D,MAAM,EACJ,OACA,cACA,UACA,cACA,iBACA,WACA,aACA,SACA,QACA,UACA,OACA,cACA,GAAG,WACD,SAAS,aAAa,cAAc,MAAM;CAE9C,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY;EACZ;EACD,CAAC;CAEF,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa,QAAQ,YAAY,CAAC;CAErE,MAAM,eAAe,UAAiD;AACpE,YAAU,MAAM;AAChB,WAAS,KAAK;;CAGhB,MAAM,cAAc,UAAiD;AACnE,WAAS,MAAM;EACf,MAAM,UAAU,aAAa,MAAM,cAAc,OAAO,YAAY;AACpE,kBACE,CAAC,YACD,WACA,MAAM,cAAc,MAAM,MAAM,KAAK,MACrC,SAAS,UAAU,YAAY,MAAM,cAAc,MAAM,EAAE,MAAM,aAAa,CAAC;AACjF,WAAS,QAAQ;;AAGnB,QACE,oBAAC,UAAD;EACE,OAAO;EACP,WAAW,UAAU,SAAS,MAAM,cAAc,MAAM;EACxD,SAAS;EACT,QAAQ;EACE;EACV,GAAI;EACJ,cAAa;EACb,kBAAiB;EACjB,OAAO,QAAQ,QAAQ,mBAAmB;EAC1C,kBAAA;EACA,CAAA;EAEJ;AAEF,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Kbd.mjs","names":["classes"],"sources":["../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Kbd.module.css';\n\nexport type KbdStylesNames = 'root';\nexport type KbdCssVariables = {\n root: '--kbd-fz';\n};\n\nexport interface KbdProps extends BoxProps, StylesApiProps<KbdFactory>, ElementProps<'kbd'> {\n /** Controls `font-size` and `padding` @default 'sm' */\n size?: MantineSize | number | (string & {});\n}\n\nexport type KbdFactory = Factory<{\n props: KbdProps;\n ref: HTMLElement;\n stylesNames: KbdStylesNames;\n vars: KbdCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<KbdFactory>((_, { size }) => ({\n root: { '--kbd-fz': getSize(size, 'kbd-fz') },\n}));\n\nexport const Kbd = factory<KbdFactory>((_props) => {\n const props = useProps('Kbd', null, _props);\n const { classNames, className, style, styles, unstyled, vars, attributes, ...others } = props;\n\n const getStyles = useStyles<KbdFactory>({\n name: 'Kbd',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"kbd\" {...getStyles('root')} {...others} />;\n});\n\nKbd.classes = classes;\nKbd.varsResolver = varsResolver;\nKbd.displayName = '@mantine/core/Kbd';\n"],"mappings":";;;;;;;;;;AAgCA,MAAM,eAAe,oBAAgC,GAAG,EAAE,YAAY,EACpE,MAAM,EAAE,YAAY,QAAQ,MAAM,SAAS,EAAE,EAC9C,EAAE;AAEH,MAAa,MAAM,SAAqB,WAAW;CACjD,MAAM,QAAQ,SAAS,OAAO,MAAM,OAAO;CAC3C,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,YAAY,GAAG,WAAW;AAgBxF,QAAO,oBAAC,KAAD;EAAK,WAAU;EAAM,GAdV,UAAsB;GACtC,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAEwC,OAAO;EAAE,GAAI;EAAU,CAAA;EACjE;AAEF,IAAI,UAAUA;AACd,IAAI,eAAe;AACnB,IAAI,cAAc"}
1
+ {"version":3,"file":"Kbd.mjs","names":["classes"],"sources":["../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Kbd.module.css';\n\nexport type KbdStylesNames = 'root';\nexport type KbdCssVariables = {\n root: '--kbd-fz';\n};\n\nexport interface KbdProps extends BoxProps, StylesApiProps<KbdFactory>, ElementProps<'kbd'> {\n /** Controls `font-size` and `padding` @default 'sm' */\n size?: MantineSize | number | (string & {});\n}\n\nexport type KbdFactory = Factory<{\n props: KbdProps;\n ref: HTMLElement;\n stylesNames: KbdStylesNames;\n vars: KbdCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<KbdFactory>((_, { size }) => ({\n root: { '--kbd-fz': getSize(size, 'kbd-fz') },\n}));\n\nexport const Kbd = factory<KbdFactory>((_props) => {\n const props = useProps('Kbd', null, _props);\n const { classNames, className, style, styles, unstyled, vars, attributes, ...others } = props;\n\n const getStyles = useStyles<KbdFactory>({\n name: 'Kbd',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"kbd\" {...getStyles('root')} {...others} />;\n});\n\nKbd.classes = classes;\nKbd.varsResolver = varsResolver;\nKbd.displayName = '@mantine/core/Kbd';\n\nexport namespace Kbd {\n export type Props = KbdProps;\n export type StylesNames = KbdStylesNames;\n export type CssVariables = KbdCssVariables;\n export type Factory = KbdFactory;\n}\n"],"mappings":";;;;;;;;;;AAgCA,MAAM,eAAe,oBAAgC,GAAG,EAAE,YAAY,EACpE,MAAM,EAAE,YAAY,QAAQ,MAAM,SAAS,EAAE,EAC9C,EAAE;AAEH,MAAa,MAAM,SAAqB,WAAW;CACjD,MAAM,QAAQ,SAAS,OAAO,MAAM,OAAO;CAC3C,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,YAAY,GAAG,WAAW;AAgBxF,QAAO,oBAAC,KAAD;EAAK,WAAU;EAAM,GAdV,UAAsB;GACtC,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAEwC,OAAO;EAAE,GAAI;EAAU,CAAA;EACjE;AAEF,IAAI,UAAUA;AACd,IAAI,eAAe;AACnB,IAAI,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"List.mjs","names":["classes"],"sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getLineHeight,\n getSpacing,\n MantineSize,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ListProvider } from './List.context';\nimport { ListItem, ListItemStylesNames } from './ListItem/ListItem';\nimport classes from './List.module.css';\n\nexport type ListStylesNames = 'root' | ListItemStylesNames;\nexport type ListCssVariables = {\n root: '--list-fz' | '--list-lh' | '--list-spacing';\n};\n\nexport interface ListProps\n extends BoxProps, StylesApiProps<ListFactory>, ElementProps<'ol', 'type'> {\n /** `List.Item` components */\n children?: React.ReactNode;\n\n /** List type @default 'unordered' */\n type?: 'ordered' | 'unordered';\n\n /** Adds extra horizontal padding to the list, useful for nested lists @default false */\n withPadding?: boolean;\n\n /** Controls `font-size` and `line-height` @default 'md' */\n size?: MantineSize;\n\n /** Icon to replace default list markers. Applied to all items unless overridden on individual List.Item components */\n icon?: React.ReactNode;\n\n /** Key of `theme.spacing` or any valid CSS value to set spacing between items @default 0 */\n spacing?: MantineSpacing;\n\n /** Vertically centers list items with their icons @default false */\n center?: boolean;\n\n /** Controls CSS `list-style-type` property. Overrides the default list marker style based on list type */\n listStyleType?: React.CSSProperties['listStyleType'];\n\n /** Starting value for ordered list numbering (only works with type=\"ordered\") */\n start?: number;\n\n /** Reverses the order of list items (only works with type=\"ordered\") */\n reversed?: boolean;\n}\n\nexport type ListFactory = Factory<{\n props: ListProps;\n ref: HTMLUListElement;\n stylesNames: ListStylesNames;\n vars: ListCssVariables;\n staticComponents: {\n Item: typeof ListItem;\n };\n}>;\n\nconst defaultProps = {\n type: 'unordered',\n} satisfies Partial<ListProps>;\n\nconst varsResolver = createVarsResolver<ListFactory>((_, { size, spacing }) => ({\n root: {\n '--list-fz': getFontSize(size),\n '--list-lh': getLineHeight(size),\n '--list-spacing': getSpacing(spacing),\n },\n}));\n\nexport const List = factory<ListFactory>((_props) => {\n const props = useProps('List', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n type,\n withPadding,\n icon,\n spacing,\n center,\n listStyleType,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ListFactory>({\n name: 'List',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <ListProvider value={{ center, icon, getStyles }}>\n <Box<any>\n {...getStyles('root', { style: { listStyleType } })}\n component={type === 'unordered' ? 'ul' : 'ol'}\n mod={[{ 'with-padding': withPadding, type: icon ? 'none' : listStyleType }, mod]}\n {...others}\n >\n {children}\n </Box>\n </ListProvider>\n );\n});\n\nList.classes = classes;\nList.varsResolver = varsResolver;\nList.displayName = '@mantine/core/List';\nList.Item = ListItem;\n"],"mappings":";;;;;;;;;;;;AAoEA,MAAM,eAAe,EACnB,MAAM,aACP;AAED,MAAM,eAAe,oBAAiC,GAAG,EAAE,MAAM,eAAe,EAC9E,MAAM;CACJ,aAAa,YAAY,KAAK;CAC9B,aAAa,cAAc,KAAK;CAChC,kBAAkB,WAAW,QAAQ;CACtC,EACF,EAAE;AAEH,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,aACA,MACA,SACA,QACA,eACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,cAAD;EAAc,OAAO;GAAE;GAAQ;GAAM;GAAW;YAC9C,oBAAC,KAAD;GACE,GAAI,UAAU,QAAQ,EAAE,OAAO,EAAE,eAAe,EAAE,CAAC;GACnD,WAAW,SAAS,cAAc,OAAO;GACzC,KAAK,CAAC;IAAE,gBAAgB;IAAa,MAAM,OAAO,SAAS;IAAe,EAAE,IAAI;GAChF,GAAI;GAEH;GACG,CAAA;EACO,CAAA;EAEjB;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,OAAO"}
1
+ {"version":3,"file":"List.mjs","names":["classes"],"sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getLineHeight,\n getSpacing,\n MantineSize,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ListProvider } from './List.context';\nimport {\n ListItem,\n ListItemStylesNames,\n type ListItemProps,\n type ListItemFactory,\n} from './ListItem/ListItem';\nimport classes from './List.module.css';\nexport type ListStylesNames = 'root' | ListItemStylesNames;\nexport type ListCssVariables = {\n root: '--list-fz' | '--list-lh' | '--list-spacing';\n};\n\nexport interface ListProps\n extends BoxProps, StylesApiProps<ListFactory>, ElementProps<'ol', 'type'> {\n /** `List.Item` components */\n children?: React.ReactNode;\n\n /** List type @default 'unordered' */\n type?: 'ordered' | 'unordered';\n\n /** Adds extra horizontal padding to the list, useful for nested lists @default false */\n withPadding?: boolean;\n\n /** Controls `font-size` and `line-height` @default 'md' */\n size?: MantineSize;\n\n /** Icon to replace default list markers. Applied to all items unless overridden on individual List.Item components */\n icon?: React.ReactNode;\n\n /** Key of `theme.spacing` or any valid CSS value to set spacing between items @default 0 */\n spacing?: MantineSpacing;\n\n /** Vertically centers list items with their icons @default false */\n center?: boolean;\n\n /** Controls CSS `list-style-type` property. Overrides the default list marker style based on list type */\n listStyleType?: React.CSSProperties['listStyleType'];\n\n /** Starting value for ordered list numbering (only works with type=\"ordered\") */\n start?: number;\n\n /** Reverses the order of list items (only works with type=\"ordered\") */\n reversed?: boolean;\n}\n\nexport type ListFactory = Factory<{\n props: ListProps;\n ref: HTMLUListElement;\n stylesNames: ListStylesNames;\n vars: ListCssVariables;\n staticComponents: {\n Item: typeof ListItem;\n };\n}>;\n\nconst defaultProps = {\n type: 'unordered',\n} satisfies Partial<ListProps>;\n\nconst varsResolver = createVarsResolver<ListFactory>((_, { size, spacing }) => ({\n root: {\n '--list-fz': getFontSize(size),\n '--list-lh': getLineHeight(size),\n '--list-spacing': getSpacing(spacing),\n },\n}));\n\nexport const List = factory<ListFactory>((_props) => {\n const props = useProps('List', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n type,\n withPadding,\n icon,\n spacing,\n center,\n listStyleType,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ListFactory>({\n name: 'List',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <ListProvider value={{ center, icon, getStyles }}>\n <Box<any>\n {...getStyles('root', { style: { listStyleType } })}\n component={type === 'unordered' ? 'ul' : 'ol'}\n mod={[{ 'with-padding': withPadding, type: icon ? 'none' : listStyleType }, mod]}\n {...others}\n >\n {children}\n </Box>\n </ListProvider>\n );\n});\n\nList.classes = classes;\nList.varsResolver = varsResolver;\nList.displayName = '@mantine/core/List';\nList.Item = ListItem;\n\nexport namespace List {\n export type Props = ListProps;\n export type StylesNames = ListStylesNames;\n export type CssVariables = ListCssVariables;\n export type Factory = ListFactory;\n\n export namespace Item {\n export type Props = ListItemProps;\n export type StylesNames = ListItemStylesNames;\n export type Factory = ListItemFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;AAwEA,MAAM,eAAe,EACnB,MAAM,aACP;AAED,MAAM,eAAe,oBAAiC,GAAG,EAAE,MAAM,eAAe,EAC9E,MAAM;CACJ,aAAa,YAAY,KAAK;CAC9B,aAAa,cAAc,KAAK;CAChC,kBAAkB,WAAW,QAAQ;CACtC,EACF,EAAE;AAEH,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,aACA,MACA,SACA,QACA,eACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,cAAD;EAAc,OAAO;GAAE;GAAQ;GAAM;GAAW;YAC9C,oBAAC,KAAD;GACE,GAAI,UAAU,QAAQ,EAAE,OAAO,EAAE,eAAe,EAAE,CAAC;GACnD,WAAW,SAAS,cAAc,OAAO;GACzC,KAAK,CAAC;IAAE,gBAAgB;IAAa,MAAM,OAAO,SAAS;IAAe,EAAE,IAAI;GAChF,GAAI;GAEH;GACG,CAAA;EACO,CAAA;EAEjB;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,OAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"Loader.mjs","names":["classes"],"sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport type { MantineLoader, MantineLoadersRecord } from './Loader.types';\nimport { Bars } from './loaders/Bars';\nimport { Dots } from './loaders/Dots';\nimport { Oval } from './loaders/Oval';\nimport classes from './Loader.module.css';\n\nexport type LoaderStylesNames = 'root';\nexport type LoaderCssVariables = {\n root: '--loader-size' | '--loader-color';\n};\n\nexport interface LoaderProps\n extends BoxProps, StylesApiProps<LoaderFactory>, ElementProps<'svg', 'display' | 'opacity'> {\n /** Controls `width` and `height` of the loader. `Loader` has predefined `xs`-`xl` values. Numbers are converted to rem. @default 'md' */\n size?: MantineSize | (string & {}) | number;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Loader type, key of `loaders` prop @default 'oval' */\n type?: MantineLoader;\n\n /** Object of loaders components, can be customized via default props or inline. */\n loaders?: MantineLoadersRecord;\n\n /** Overrides default loader with given content */\n children?: React.ReactNode;\n}\n\nexport type LoaderFactory = Factory<{\n props: LoaderProps;\n ref: SVGSVGElement;\n stylesNames: LoaderStylesNames;\n vars: LoaderCssVariables;\n staticComponents: {\n defaultLoaders: typeof defaultLoaders;\n };\n}>;\n\nexport const defaultLoaders: MantineLoadersRecord = {\n bars: Bars,\n oval: Oval,\n dots: Dots,\n};\n\nconst defaultProps = {\n loaders: defaultLoaders,\n type: 'oval',\n} satisfies Partial<LoaderProps>;\n\nconst varsResolver = createVarsResolver<LoaderFactory>((theme, { size, color }) => ({\n root: {\n '--loader-size': getSize(size, 'loader-size'),\n '--loader-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const Loader = factory<LoaderFactory>((_props) => {\n const props = useProps('Loader', defaultProps, _props);\n const {\n size,\n color,\n type,\n vars,\n className,\n style,\n classNames,\n styles,\n unstyled,\n loaders,\n variant,\n children,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<LoaderFactory>({\n name: 'Loader',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (children) {\n return (\n <Box {...getStyles('root')} {...(others as any)}>\n {children}\n </Box>\n );\n }\n\n return (\n <Box\n {...getStyles('root')}\n component={loaders[type]}\n variant={variant}\n size={size}\n {...others}\n />\n );\n});\n\nLoader.defaultLoaders = defaultLoaders;\nLoader.classes = classes;\nLoader.varsResolver = varsResolver;\nLoader.displayName = '@mantine/core/Loader';\n"],"mappings":";;;;;;;;;;;;;;AAsDA,MAAa,iBAAuC;CAClD,MAAM;CACN,MAAM;CACN,MAAM;CACP;AAED,MAAM,eAAe;CACnB,SAAS;CACT,MAAM;CACP;AAED,MAAM,eAAe,oBAAmC,OAAO,EAAE,MAAM,aAAa,EAClF,MAAM;CACJ,iBAAiB,QAAQ,MAAM,cAAc;CAC7C,kBAAkB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CACzD,EACF,EAAE;AAEH,MAAa,SAAS,SAAwB,WAAW;CACvD,MAAM,QAAQ,SAAS,UAAU,cAAc,OAAO;CACtD,MAAM,EACJ,MACA,OACA,MACA,MACA,WACA,OACA,YACA,QACA,UACA,SACA,SACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAyB;EACzC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SACF,QACE,oBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,GAAK;EAC9B;EACG,CAAA;AAIV,QACE,oBAAC,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,WAAW,QAAQ;EACV;EACH;EACN,GAAI;EACJ,CAAA;EAEJ;AAEF,OAAO,iBAAiB;AACxB,OAAO,UAAUA;AACjB,OAAO,eAAe;AACtB,OAAO,cAAc"}
1
+ {"version":3,"file":"Loader.mjs","names":["classes"],"sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport type { MantineLoader, MantineLoadersRecord } from './Loader.types';\nimport { Bars } from './loaders/Bars';\nimport { Dots } from './loaders/Dots';\nimport { Oval } from './loaders/Oval';\nimport classes from './Loader.module.css';\n\nexport type LoaderStylesNames = 'root';\nexport type LoaderCssVariables = {\n root: '--loader-size' | '--loader-color';\n};\n\nexport interface LoaderProps\n extends BoxProps, StylesApiProps<LoaderFactory>, ElementProps<'svg', 'display' | 'opacity'> {\n /** Controls `width` and `height` of the loader. `Loader` has predefined `xs`-`xl` values. Numbers are converted to rem. @default 'md' */\n size?: MantineSize | (string & {}) | number;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Loader type, key of `loaders` prop @default 'oval' */\n type?: MantineLoader;\n\n /** Object of loaders components, can be customized via default props or inline. */\n loaders?: MantineLoadersRecord;\n\n /** Overrides default loader with given content */\n children?: React.ReactNode;\n}\n\nexport type LoaderFactory = Factory<{\n props: LoaderProps;\n ref: SVGSVGElement;\n stylesNames: LoaderStylesNames;\n vars: LoaderCssVariables;\n staticComponents: {\n defaultLoaders: typeof defaultLoaders;\n };\n}>;\n\nexport const defaultLoaders: MantineLoadersRecord = {\n bars: Bars,\n oval: Oval,\n dots: Dots,\n};\n\nconst defaultProps = {\n loaders: defaultLoaders,\n type: 'oval',\n} satisfies Partial<LoaderProps>;\n\nconst varsResolver = createVarsResolver<LoaderFactory>((theme, { size, color }) => ({\n root: {\n '--loader-size': getSize(size, 'loader-size'),\n '--loader-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const Loader = factory<LoaderFactory>((_props) => {\n const props = useProps('Loader', defaultProps, _props);\n const {\n size,\n color,\n type,\n vars,\n className,\n style,\n classNames,\n styles,\n unstyled,\n loaders,\n variant,\n children,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<LoaderFactory>({\n name: 'Loader',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (children) {\n return (\n <Box {...getStyles('root')} {...(others as any)}>\n {children}\n </Box>\n );\n }\n\n return (\n <Box\n {...getStyles('root')}\n component={loaders[type]}\n variant={variant}\n size={size}\n {...others}\n />\n );\n});\n\nLoader.defaultLoaders = defaultLoaders;\nLoader.classes = classes;\nLoader.varsResolver = varsResolver;\nLoader.displayName = '@mantine/core/Loader';\n\nexport namespace Loader {\n export type Props = LoaderProps;\n export type StylesNames = LoaderStylesNames;\n export type CssVariables = LoaderCssVariables;\n export type Factory = LoaderFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AAsDA,MAAa,iBAAuC;CAClD,MAAM;CACN,MAAM;CACN,MAAM;CACP;AAED,MAAM,eAAe;CACnB,SAAS;CACT,MAAM;CACP;AAED,MAAM,eAAe,oBAAmC,OAAO,EAAE,MAAM,aAAa,EAClF,MAAM;CACJ,iBAAiB,QAAQ,MAAM,cAAc;CAC7C,kBAAkB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CACzD,EACF,EAAE;AAEH,MAAa,SAAS,SAAwB,WAAW;CACvD,MAAM,QAAQ,SAAS,UAAU,cAAc,OAAO;CACtD,MAAM,EACJ,MACA,OACA,MACA,MACA,WACA,OACA,YACA,QACA,UACA,SACA,SACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAyB;EACzC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SACF,QACE,oBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,GAAK;EAC9B;EACG,CAAA;AAIV,QACE,oBAAC,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,WAAW,QAAQ;EACV;EACH;EACN,GAAI;EACJ,CAAA;EAEJ;AAEF,OAAO,iBAAiB;AACxB,OAAO,UAAUA;AACjB,OAAO,eAAe;AACtB,OAAO,cAAc"}
@@ -68,6 +68,7 @@ const LoadingOverlay = factory((_props) => {
68
68
  className: _overlayProps?.className,
69
69
  style: _overlayProps?.style
70
70
  }),
71
+ darkHidden: true,
71
72
  unstyled,
72
73
  color: overlayProps?.color || theme.white
73
74
  }),
@@ -1 +1 @@
1
- {"version":3,"file":"LoadingOverlay.mjs","names":["classes"],"sources":["../../../src/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader, LoaderProps } from '../Loader';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { Transition, TransitionOverride } from '../Transition';\nimport classes from './LoadingOverlay.module.css';\n\nexport type LoadingOverlayStylesNames = 'root' | 'loader' | 'overlay';\nexport type LoadingOverlayCssVariables = {\n root: '--lo-z-index';\n};\n\nexport interface LoadingOverlayProps\n extends BoxProps, StylesApiProps<LoadingOverlayFactory>, ElementProps<'div'> {\n /** Props passed down to `Transition` component. Set `duration` to create custom transition or override default transition. */\n transitionProps?: TransitionOverride;\n\n /** Props passed down to `Loader` component */\n loaderProps?: LoaderProps;\n\n /** Props passed down to `Overlay` component. Use to customizing blur, opacity, color and other properties. */\n overlayProps?: OverlayProps;\n\n /** Controls overlay visibility. Typically used with state (useState, useDisclosure). @default false */\n visible?: boolean;\n\n /** Controls `z-index` of both the overlay and loader. The loader receives `z-index + 1`. @default 400 */\n zIndex?: string | number;\n\n /** Called when transition starts */\n onEnter?: () => void;\n\n /** Called when transition ends */\n onEntered?: () => void;\n\n /** Called when exit transition starts */\n onExit?: () => void;\n\n /** Called when exit transition ends */\n onExited?: () => void;\n}\n\nexport type LoadingOverlayFactory = Factory<{\n props: LoadingOverlayProps;\n ref: HTMLDivElement;\n stylesNames: LoadingOverlayStylesNames;\n vars: LoadingOverlayCssVariables;\n}>;\n\nconst defaultProps = {\n transitionProps: { transition: 'fade', duration: 0 },\n overlayProps: { backgroundOpacity: 0.75 },\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<LoadingOverlayProps>;\n\nconst varsResolver = createVarsResolver<LoadingOverlayFactory>((_, { zIndex }) => ({\n root: {\n '--lo-z-index': zIndex?.toString(),\n },\n}));\n\nexport const LoadingOverlay = factory<LoadingOverlayFactory>((_props) => {\n const props = useProps('LoadingOverlay', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n transitionProps,\n loaderProps,\n overlayProps,\n visible,\n zIndex,\n attributes,\n onEnter,\n onEntered,\n onExit,\n onExited,\n ...others\n } = props;\n\n const theme = useMantineTheme();\n\n const getStyles = useStyles<LoadingOverlayFactory>({\n name: 'LoadingOverlay',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _overlayProps = { ...defaultProps.overlayProps, ...overlayProps };\n\n return (\n <Transition\n transition=\"fade\"\n {...transitionProps}\n mounted={!!visible}\n onEnter={onEnter}\n onEntered={onEntered}\n onExit={onExit}\n onExited={onExited}\n >\n {(transitionStyles) => (\n <Box {...getStyles('root', { style: transitionStyles })} {...others}>\n <Loader\n unstyled={unstyled}\n {...loaderProps}\n {...getStyles('loader', {\n className: loaderProps?.className,\n style: loaderProps?.style,\n })}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n unstyled={unstyled}\n color={overlayProps?.color || theme.white}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n lightHidden\n unstyled={unstyled}\n color={overlayProps?.color || theme.colors.dark[5]}\n />\n </Box>\n )}\n </Transition>\n );\n});\n\nLoadingOverlay.classes = classes;\nLoadingOverlay.varsResolver = varsResolver;\nLoadingOverlay.displayName = '@mantine/core/LoadingOverlay';\n"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,iBAAiB;EAAE,YAAY;EAAQ,UAAU;EAAG;CACpD,cAAc,EAAE,mBAAmB,KAAM;CACzC,QAAQ,iBAAiB,UAAU;CACpC;AAED,MAAM,eAAe,oBAA2C,GAAG,EAAE,cAAc,EACjF,MAAM,EACJ,gBAAgB,QAAQ,UAAU,EACnC,EACF,EAAE;AAEH,MAAa,iBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,iBACA,aACA,cACA,SACA,QACA,YACA,SACA,WACA,QACA,UACA,GAAG,WACD;CAEJ,MAAM,QAAQ,iBAAiB;CAE/B,MAAM,YAAY,UAAiC;EACjD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,gBAAgB;EAAE,GAAG,aAAa;EAAc,GAAG;EAAc;AAEvE,QACE,oBAAC,YAAD;EACE,YAAW;EACX,GAAI;EACJ,SAAS,CAAC,CAAC;EACF;EACE;EACH;EACE;aAER,qBACA,qBAAC,KAAD;GAAK,GAAI,UAAU,QAAQ,EAAE,OAAO,kBAAkB,CAAC;GAAE,GAAI;aAA7D;IACE,oBAAC,QAAD;KACY;KACV,GAAI;KACJ,GAAI,UAAU,UAAU;MACtB,WAAW,aAAa;MACxB,OAAO,aAAa;MACrB,CAAC;KACF,CAAA;IAEF,oBAAC,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;KACQ;KACV,OAAO,cAAc,SAAS,MAAM;KACpC,CAAA;IAEF,oBAAC,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;KACF,aAAA;KACU;KACV,OAAO,cAAc,SAAS,MAAM,OAAO,KAAK;KAChD,CAAA;IACE;;EAEG,CAAA;EAEf;AAEF,eAAe,UAAUA;AACzB,eAAe,eAAe;AAC9B,eAAe,cAAc"}
1
+ {"version":3,"file":"LoadingOverlay.mjs","names":["classes"],"sources":["../../../src/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader, LoaderProps } from '../Loader';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { Transition, TransitionOverride } from '../Transition';\nimport classes from './LoadingOverlay.module.css';\n\nexport type LoadingOverlayStylesNames = 'root' | 'loader' | 'overlay';\nexport type LoadingOverlayCssVariables = {\n root: '--lo-z-index';\n};\n\nexport interface LoadingOverlayProps\n extends BoxProps, StylesApiProps<LoadingOverlayFactory>, ElementProps<'div'> {\n /** Props passed down to `Transition` component. Set `duration` to create custom transition or override default transition. */\n transitionProps?: TransitionOverride;\n\n /** Props passed down to `Loader` component */\n loaderProps?: LoaderProps;\n\n /** Props passed down to `Overlay` component. Use to customizing blur, opacity, color and other properties. */\n overlayProps?: OverlayProps;\n\n /** Controls overlay visibility. Typically used with state (useState, useDisclosure). @default false */\n visible?: boolean;\n\n /** Controls `z-index` of both the overlay and loader. The loader receives `z-index + 1`. @default 400 */\n zIndex?: string | number;\n\n /** Called when transition starts */\n onEnter?: () => void;\n\n /** Called when transition ends */\n onEntered?: () => void;\n\n /** Called when exit transition starts */\n onExit?: () => void;\n\n /** Called when exit transition ends */\n onExited?: () => void;\n}\n\nexport type LoadingOverlayFactory = Factory<{\n props: LoadingOverlayProps;\n ref: HTMLDivElement;\n stylesNames: LoadingOverlayStylesNames;\n vars: LoadingOverlayCssVariables;\n}>;\n\nconst defaultProps = {\n transitionProps: { transition: 'fade', duration: 0 },\n overlayProps: { backgroundOpacity: 0.75 },\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<LoadingOverlayProps>;\n\nconst varsResolver = createVarsResolver<LoadingOverlayFactory>((_, { zIndex }) => ({\n root: {\n '--lo-z-index': zIndex?.toString(),\n },\n}));\n\nexport const LoadingOverlay = factory<LoadingOverlayFactory>((_props) => {\n const props = useProps('LoadingOverlay', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n transitionProps,\n loaderProps,\n overlayProps,\n visible,\n zIndex,\n attributes,\n onEnter,\n onEntered,\n onExit,\n onExited,\n ...others\n } = props;\n\n const theme = useMantineTheme();\n\n const getStyles = useStyles<LoadingOverlayFactory>({\n name: 'LoadingOverlay',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _overlayProps = { ...defaultProps.overlayProps, ...overlayProps };\n\n return (\n <Transition\n transition=\"fade\"\n {...transitionProps}\n mounted={!!visible}\n onEnter={onEnter}\n onEntered={onEntered}\n onExit={onExit}\n onExited={onExited}\n >\n {(transitionStyles) => (\n <Box {...getStyles('root', { style: transitionStyles })} {...others}>\n <Loader\n unstyled={unstyled}\n {...loaderProps}\n {...getStyles('loader', {\n className: loaderProps?.className,\n style: loaderProps?.style,\n })}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n darkHidden\n unstyled={unstyled}\n color={overlayProps?.color || theme.white}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n lightHidden\n unstyled={unstyled}\n color={overlayProps?.color || theme.colors.dark[5]}\n />\n </Box>\n )}\n </Transition>\n );\n});\n\nLoadingOverlay.classes = classes;\nLoadingOverlay.varsResolver = varsResolver;\nLoadingOverlay.displayName = '@mantine/core/LoadingOverlay';\n\nexport namespace LoadingOverlay {\n export type Props = LoadingOverlayProps;\n export type StylesNames = LoadingOverlayStylesNames;\n export type CssVariables = LoadingOverlayCssVariables;\n export type Factory = LoadingOverlayFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,iBAAiB;EAAE,YAAY;EAAQ,UAAU;EAAG;CACpD,cAAc,EAAE,mBAAmB,KAAM;CACzC,QAAQ,iBAAiB,UAAU;CACpC;AAED,MAAM,eAAe,oBAA2C,GAAG,EAAE,cAAc,EACjF,MAAM,EACJ,gBAAgB,QAAQ,UAAU,EACnC,EACF,EAAE;AAEH,MAAa,iBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,iBACA,aACA,cACA,SACA,QACA,YACA,SACA,WACA,QACA,UACA,GAAG,WACD;CAEJ,MAAM,QAAQ,iBAAiB;CAE/B,MAAM,YAAY,UAAiC;EACjD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,gBAAgB;EAAE,GAAG,aAAa;EAAc,GAAG;EAAc;AAEvE,QACE,oBAAC,YAAD;EACE,YAAW;EACX,GAAI;EACJ,SAAS,CAAC,CAAC;EACF;EACE;EACH;EACE;aAER,qBACA,qBAAC,KAAD;GAAK,GAAI,UAAU,QAAQ,EAAE,OAAO,kBAAkB,CAAC;GAAE,GAAI;aAA7D;IACE,oBAAC,QAAD;KACY;KACV,GAAI;KACJ,GAAI,UAAU,UAAU;MACtB,WAAW,aAAa;MACxB,OAAO,aAAa;MACrB,CAAC;KACF,CAAA;IAEF,oBAAC,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;KACF,YAAA;KACU;KACV,OAAO,cAAc,SAAS,MAAM;KACpC,CAAA;IAEF,oBAAC,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;KACF,aAAA;KACU;KACV,OAAO,cAAc,SAAS,MAAM,OAAO,KAAK;KAChD,CAAA;IACE;;EAEG,CAAA;EAEf;AAEF,eAAe,UAAUA;AACzB,eAAe,eAAe;AAC9B,eAAe,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Mark.mjs","names":["classes"],"sources":["../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n MantineColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getMarkColor } from './get-mark-color';\nimport classes from './Mark.module.css';\n\nexport type MarkStylesNames = 'root';\nexport type MarkCssVariables = {\n root: '--mark-bg-dark' | '--mark-bg-light';\n};\n\nexport interface MarkProps extends BoxProps, StylesApiProps<MarkFactory>, ElementProps<'mark'> {\n /** Key of `theme.colors` or any valid CSS color @default yellow */\n color?: MantineColor;\n}\n\nexport type MarkFactory = Factory<{\n props: MarkProps;\n ref: HTMLElement;\n stylesNames: MarkStylesNames;\n vars: MarkCssVariables;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n} satisfies Partial<MarkProps>;\n\nconst varsResolver = createVarsResolver<MarkFactory>((theme, { color }) => ({\n root: {\n '--mark-bg-dark': getMarkColor({ color, theme, defaultShade: 5 }),\n '--mark-bg-light': getMarkColor({ color, theme, defaultShade: 2 }),\n },\n}));\n\nexport const Mark = factory<MarkFactory>((_props) => {\n const props = useProps('Mark', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n variant,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarkFactory>({\n name: 'Mark',\n props,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"mark\" variant={variant} {...getStyles('root')} {...others} />;\n});\n\nMark.classes = classes;\nMark.varsResolver = varsResolver;\nMark.displayName = '@mantine/core/Mark';\n"],"mappings":";;;;;;;;;;AAgCA,MAAM,eAAe,EACnB,OAAO,UACR;AAED,MAAM,eAAe,oBAAiC,OAAO,EAAE,aAAa,EAC1E,MAAM;CACJ,kBAAkB,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACjE,mBAAmB,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACnE,EACF,EAAE;AAEH,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,YACA,GAAG,WACD;AAgBJ,QAAO,oBAAC,KAAD;EAAK,WAAU;EAAgB;EAAS,GAd7B,UAAuB;GACvC,MAAM;GACN;GACA;GACA;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAE2D,OAAO;EAAE,GAAI;EAAU,CAAA;EACpF;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc"}
1
+ {"version":3,"file":"Mark.mjs","names":["classes"],"sources":["../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n MantineColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getMarkColor } from './get-mark-color';\nimport classes from './Mark.module.css';\n\nexport type MarkStylesNames = 'root';\nexport type MarkCssVariables = {\n root: '--mark-bg-dark' | '--mark-bg-light';\n};\n\nexport interface MarkProps extends BoxProps, StylesApiProps<MarkFactory>, ElementProps<'mark'> {\n /** Key of `theme.colors` or any valid CSS color @default yellow */\n color?: MantineColor;\n}\n\nexport type MarkFactory = Factory<{\n props: MarkProps;\n ref: HTMLElement;\n stylesNames: MarkStylesNames;\n vars: MarkCssVariables;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n} satisfies Partial<MarkProps>;\n\nconst varsResolver = createVarsResolver<MarkFactory>((theme, { color }) => ({\n root: {\n '--mark-bg-dark': getMarkColor({ color, theme, defaultShade: 5 }),\n '--mark-bg-light': getMarkColor({ color, theme, defaultShade: 2 }),\n },\n}));\n\nexport const Mark = factory<MarkFactory>((_props) => {\n const props = useProps('Mark', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n variant,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarkFactory>({\n name: 'Mark',\n props,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"mark\" variant={variant} {...getStyles('root')} {...others} />;\n});\n\nMark.classes = classes;\nMark.varsResolver = varsResolver;\nMark.displayName = '@mantine/core/Mark';\n\nexport namespace Mark {\n export type Props = MarkProps;\n export type StylesNames = MarkStylesNames;\n export type CssVariables = MarkCssVariables;\n export type Factory = MarkFactory;\n}\n"],"mappings":";;;;;;;;;;AAgCA,MAAM,eAAe,EACnB,OAAO,UACR;AAED,MAAM,eAAe,oBAAiC,OAAO,EAAE,aAAa,EAC1E,MAAM;CACJ,kBAAkB,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACjE,mBAAmB,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACnE,EACF,EAAE;AAEH,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,YACA,GAAG,WACD;AAgBJ,QAAO,oBAAC,KAAD;EAAK,WAAU;EAAgB;EAAS,GAd7B,UAAuB;GACvC,MAAM;GACN;GACA;GACA;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAE2D,OAAO;EAAE,GAAI;EAAU,CAAA;EACpF;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Marquee.mjs","names":["classes"],"sources":["../../../src/components/Marquee/Marquee.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Marquee.module.css';\n\nexport type MarqueeStylesNames = 'root' | 'content' | 'group';\nexport type MarqueeCssVariables = {\n root:\n | '--marquee-duration'\n | '--marquee-gap'\n | '--marquee-repeat'\n | '--marquee-fade-color'\n | '--marquee-fade-size';\n};\n\nexport interface MarqueeProps\n extends BoxProps, StylesApiProps<MarqueeFactory>, ElementProps<'div'> {\n /** Reverses animation direction @default false */\n reverse?: boolean;\n\n /** Pauses animation on hover @default false */\n pauseOnHover?: boolean;\n\n /** Content to scroll */\n children: React.ReactNode;\n\n /** Scroll orientation @default 'horizontal' */\n orientation?: 'horizontal' | 'vertical';\n\n /** Number of times children are repeated inline for seamless scrolling @default 4 */\n repeat?: number;\n\n /** Animation duration in ms @default 40000 */\n duration?: number;\n\n /** Gap between repeated children, key of `theme.spacing` or any valid CSS value @default 'md' */\n gap?: MantineSpacing;\n\n /** Whether to show gradient fade on edges, @default true */\n fadeEdges?: boolean;\n\n /** Color of the fade gradient, @default 'var(--mantine-color-body)' */\n fadeEdgeColor?: string;\n\n /** Size of the fade gradient, @default '5%' */\n fadeEdgeSize?: string;\n}\n\nexport type MarqueeFactory = Factory<{\n props: MarqueeProps;\n ref: HTMLDivElement;\n stylesNames: MarqueeStylesNames;\n vars: MarqueeCssVariables;\n}>;\n\nconst defaultProps = {\n repeat: 4,\n duration: 100_000,\n orientation: 'horizontal',\n fadeEdges: true,\n} satisfies Partial<MarqueeProps>;\n\nconst varsResolver = createVarsResolver<MarqueeFactory>(\n (_, { duration, gap, repeat, fadeEdgeColor, fadeEdgeSize }) => ({\n root: {\n '--marquee-duration': `${duration}ms`,\n '--marquee-gap': getSpacing(gap),\n '--marquee-repeat': (repeat ?? 4).toString(),\n '--marquee-fade-color': fadeEdgeColor,\n '--marquee-fade-size': fadeEdgeSize,\n },\n })\n);\n\nexport const Marquee = factory<MarqueeFactory>((_props) => {\n const props = useProps('Marquee', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n reverse,\n pauseOnHover,\n orientation,\n repeat,\n duration,\n gap,\n fadeEdges,\n fadeEdgeColor,\n fadeEdgeSize,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarqueeFactory>({\n name: 'Marquee',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const repeatedChildren = Array(repeat)\n .fill(0)\n .map((_, index) => (\n <div key={index} {...getStyles('group')}>\n {children}\n </div>\n ));\n\n return (\n <Box\n {...getStyles('root')}\n mod={[{ orientation, reverse, pauseOnHover, 'fade-edges': fadeEdges }, mod]}\n {...others}\n >\n <div {...getStyles('content')}>{repeatedChildren}</div>\n </Box>\n );\n});\n\nMarquee.classes = classes;\nMarquee.varsResolver = varsResolver;\nMarquee.displayName = '@mantine/core/Marquee';\n"],"mappings":";;;;;;;;;;AAiEA,MAAM,eAAe;CACnB,QAAQ;CACR,UAAU;CACV,aAAa;CACb,WAAW;CACZ;AAED,MAAM,eAAe,oBAClB,GAAG,EAAE,UAAU,KAAK,QAAQ,eAAe,oBAAoB,EAC9D,MAAM;CACJ,sBAAsB,GAAG,SAAS;CAClC,iBAAiB,WAAW,IAAI;CAChC,qBAAqB,UAAU,GAAG,UAAU;CAC5C,wBAAwB;CACxB,uBAAuB;CACxB,EACF,EACF;AAED,MAAa,UAAU,SAAyB,WAAW;CACzD,MAAM,QAAQ,SAAS,WAAW,cAAc,OAAO;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,cACA,aACA,QACA,UACA,KACA,WACA,eACA,cACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA0B;EAC1C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,mBAAmB,MAAM,OAAO,CACnC,KAAK,EAAE,CACP,KAAK,GAAG,UACP,oBAAC,OAAD;EAAiB,GAAI,UAAU,QAAQ;EACpC;EACG,EAFI,MAEJ,CACN;AAEJ,QACE,oBAAC,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,KAAK,CAAC;GAAE;GAAa;GAAS;GAAc,cAAc;GAAW,EAAE,IAAI;EAC3E,GAAI;YAEJ,oBAAC,OAAD;GAAK,GAAI,UAAU,UAAU;aAAG;GAAuB,CAAA;EACnD,CAAA;EAER;AAEF,QAAQ,UAAUA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc"}
1
+ {"version":3,"file":"Marquee.mjs","names":["classes"],"sources":["../../../src/components/Marquee/Marquee.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Marquee.module.css';\n\nexport type MarqueeStylesNames = 'root' | 'content' | 'group';\nexport type MarqueeCssVariables = {\n root:\n | '--marquee-duration'\n | '--marquee-gap'\n | '--marquee-repeat'\n | '--marquee-fade-color'\n | '--marquee-fade-size';\n};\n\nexport interface MarqueeProps\n extends BoxProps, StylesApiProps<MarqueeFactory>, ElementProps<'div'> {\n /** Reverses animation direction @default false */\n reverse?: boolean;\n\n /** Pauses animation on hover @default false */\n pauseOnHover?: boolean;\n\n /** Content to scroll */\n children: React.ReactNode;\n\n /** Scroll orientation @default 'horizontal' */\n orientation?: 'horizontal' | 'vertical';\n\n /** Number of times children are repeated inline for seamless scrolling @default 4 */\n repeat?: number;\n\n /** Animation duration in ms @default 40000 */\n duration?: number;\n\n /** Gap between repeated children, key of `theme.spacing` or any valid CSS value @default 'md' */\n gap?: MantineSpacing;\n\n /** Whether to show gradient fade on edges, @default true */\n fadeEdges?: boolean;\n\n /** Color of the fade gradient, @default 'var(--mantine-color-body)' */\n fadeEdgeColor?: string;\n\n /** Size of the fade gradient, @default '5%' */\n fadeEdgeSize?: string;\n}\n\nexport type MarqueeFactory = Factory<{\n props: MarqueeProps;\n ref: HTMLDivElement;\n stylesNames: MarqueeStylesNames;\n vars: MarqueeCssVariables;\n}>;\n\nconst defaultProps = {\n repeat: 4,\n duration: 100_000,\n orientation: 'horizontal',\n fadeEdges: true,\n} satisfies Partial<MarqueeProps>;\n\nconst varsResolver = createVarsResolver<MarqueeFactory>(\n (_, { duration, gap, repeat, fadeEdgeColor, fadeEdgeSize }) => ({\n root: {\n '--marquee-duration': `${duration}ms`,\n '--marquee-gap': getSpacing(gap),\n '--marquee-repeat': (repeat ?? 4).toString(),\n '--marquee-fade-color': fadeEdgeColor,\n '--marquee-fade-size': fadeEdgeSize,\n },\n })\n);\n\nexport const Marquee = factory<MarqueeFactory>((_props) => {\n const props = useProps('Marquee', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n reverse,\n pauseOnHover,\n orientation,\n repeat,\n duration,\n gap,\n fadeEdges,\n fadeEdgeColor,\n fadeEdgeSize,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarqueeFactory>({\n name: 'Marquee',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const repeatedChildren = Array(repeat)\n .fill(0)\n .map((_, index) => (\n <div key={index} {...getStyles('group')}>\n {children}\n </div>\n ));\n\n return (\n <Box\n {...getStyles('root')}\n mod={[{ orientation, reverse, pauseOnHover, 'fade-edges': fadeEdges }, mod]}\n {...others}\n >\n <div {...getStyles('content')}>{repeatedChildren}</div>\n </Box>\n );\n});\n\nMarquee.classes = classes;\nMarquee.varsResolver = varsResolver;\nMarquee.displayName = '@mantine/core/Marquee';\n\nexport namespace Marquee {\n export type Props = MarqueeProps;\n export type StylesNames = MarqueeStylesNames;\n export type CssVariables = MarqueeCssVariables;\n export type Factory = MarqueeFactory;\n}\n"],"mappings":";;;;;;;;;;AAiEA,MAAM,eAAe;CACnB,QAAQ;CACR,UAAU;CACV,aAAa;CACb,WAAW;CACZ;AAED,MAAM,eAAe,oBAClB,GAAG,EAAE,UAAU,KAAK,QAAQ,eAAe,oBAAoB,EAC9D,MAAM;CACJ,sBAAsB,GAAG,SAAS;CAClC,iBAAiB,WAAW,IAAI;CAChC,qBAAqB,UAAU,GAAG,UAAU;CAC5C,wBAAwB;CACxB,uBAAuB;CACxB,EACF,EACF;AAED,MAAa,UAAU,SAAyB,WAAW;CACzD,MAAM,QAAQ,SAAS,WAAW,cAAc,OAAO;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,cACA,aACA,QACA,UACA,KACA,WACA,eACA,cACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA0B;EAC1C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,mBAAmB,MAAM,OAAO,CACnC,KAAK,EAAE,CACP,KAAK,GAAG,UACP,oBAAC,OAAD;EAAiB,GAAI,UAAU,QAAQ;EACpC;EACG,EAFI,MAEJ,CACN;AAEJ,QACE,oBAAC,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,KAAK,CAAC;GAAE;GAAa;GAAS;GAAc,cAAc;GAAW,EAAE,IAAI;EAC3E,GAAI;YAEJ,oBAAC,OAAD;GAAK,GAAI,UAAU,UAAU;aAAG;GAAuB,CAAA;EACnD,CAAA;EAER;AAEF,QAAQ,UAAUA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Menu.mjs","names":["classes"],"sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n factory,\n Factory,\n getContextItemIndex,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { useDelayedHover } from '../../utils/Floating';\nimport { __PopoverProps, Popover, PopoverStylesNames } from '../Popover';\nimport { MenuContextProvider } from './Menu.context';\nimport { MenuDivider } from './MenuDivider/MenuDivider';\nimport { MenuDropdown } from './MenuDropdown/MenuDropdown';\nimport { MenuItem } from './MenuItem/MenuItem';\nimport { MenuLabel } from './MenuLabel/MenuLabel';\nimport { MenuSub } from './MenuSub/MenuSub';\nimport { MenuTarget } from './MenuTarget/MenuTarget';\nimport classes from './Menu.module.css';\n\nexport type MenuStylesNames =\n | 'item'\n | 'itemLabel'\n | 'itemSection'\n | 'label'\n | 'divider'\n | 'chevron'\n | PopoverStylesNames;\n\nexport type MenuFactory = Factory<{\n props: MenuProps;\n stylesNames: MenuStylesNames;\n staticComponents: {\n Item: typeof MenuItem;\n Label: typeof MenuLabel;\n Dropdown: typeof MenuDropdown;\n Target: typeof MenuTarget;\n Divider: typeof MenuDivider;\n Sub: typeof MenuSub;\n };\n}>;\n\nexport interface MenuProps extends __PopoverProps, StylesApiProps<MenuFactory> {\n variant?: string;\n\n /** Menu children */\n children?: React.ReactNode;\n\n /** Controlled menu opened state */\n opened?: boolean;\n\n /** Uncontrolled menu initial opened state */\n defaultOpened?: boolean;\n\n /** If set, focus is trapped within the menu dropdown when it is opened */\n trapFocus?: boolean;\n\n /** Called when menu opened state changes */\n onChange?: (opened: boolean) => void;\n\n /** Called when Menu is opened */\n onOpen?: () => void;\n\n /** Called when Menu is closed */\n onClose?: () => void;\n\n /** If set, the Menu is closed when one of the items is clicked. Can be overridden per item with `closeMenuOnClick` prop */\n closeOnItemClick?: boolean;\n\n /** If set, arrow key presses wrap around from last item to first and vice versa */\n loop?: boolean;\n\n /** If set, the dropdown is closed when the `Escape` key is pressed @default true */\n closeOnEscape?: boolean;\n\n /** Event trigger to open menu. Note: 'hover' is not keyboard accessible; prefer 'click-hover' for accessible hover menus */\n trigger?: 'click' | 'hover' | 'click-hover';\n\n /** Open delay in ms, applicable only to `trigger=\"hover\"` variant */\n openDelay?: number;\n\n /** Close delay in ms, applicable only to `trigger=\"hover\"` variant */\n closeDelay?: number;\n\n /** If set, the dropdown is closed on outside clicks */\n closeOnClickOutside?: boolean;\n\n /** Events that trigger outside click detection. Includes mousedown for desktop clicks, touchstart for mobile, and keydown for Escape key handling @default ['mousedown', 'touchstart', 'keydown'] */\n clickOutsideEvents?: string[];\n\n /** Id base to create accessibility connections */\n id?: string;\n\n /** Set the `tabindex` on all menu items. Use `0` to allow Tab key navigation through menu items (required for navigation menus following WAI-ARIA disclosure pattern). @default -1 */\n menuItemTabIndex?: -1 | 0;\n\n /** Adds a hidden focusable element at the start of the dropdown to prevent unexpected focus jumps when opening with keyboard. Set to false if you need custom focus management. @default true */\n withInitialFocusPlaceholder?: boolean;\n\n /** Determines whether focus should be automatically returned to control when dropdown closes @default `true` */\n returnFocus?: boolean;\n}\n\nconst defaultProps = {\n trapFocus: true,\n closeOnItemClick: true,\n withInitialFocusPlaceholder: true,\n clickOutsideEvents: ['mousedown', 'touchstart', 'keydown'],\n loop: true,\n trigger: 'click',\n openDelay: 0,\n closeDelay: 100,\n menuItemTabIndex: -1,\n} satisfies Partial<MenuProps>;\n\nexport const Menu = factory<MenuFactory>((_props) => {\n const props = useProps('Menu', defaultProps, _props);\n const {\n children,\n onOpen,\n onClose,\n opened,\n defaultOpened,\n trapFocus,\n onChange,\n closeOnItemClick,\n loop,\n closeOnEscape,\n trigger,\n openDelay,\n closeDelay,\n classNames,\n styles,\n unstyled,\n variant,\n vars,\n menuItemTabIndex,\n keepMounted,\n withInitialFocusPlaceholder,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MenuFactory>({\n name: 'Menu',\n classes,\n props,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const [_opened, setOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange,\n });\n const [openedViaClick, setOpenedViaClick] = useState(false);\n\n const close = () => {\n setOpened(false);\n setOpenedViaClick(false);\n _opened && onClose?.();\n };\n\n const open = () => {\n setOpened(true);\n !_opened && onOpen?.();\n };\n\n const toggleDropdown = () => {\n _opened ? close() : open();\n };\n\n const { openDropdown, closeDropdown } = useDelayedHover({ open, close, closeDelay, openDelay });\n\n const getItemIndex = (node: HTMLButtonElement) =>\n getContextItemIndex('[data-menu-item]', '[data-menu-dropdown]', node);\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MenuFactory>({\n classNames,\n styles,\n props,\n });\n\n return (\n <MenuContextProvider\n value={{\n getStyles,\n opened: _opened,\n toggleDropdown,\n getItemIndex,\n openedViaClick,\n setOpenedViaClick,\n closeOnItemClick,\n closeDropdown: trigger === 'click' ? close : closeDropdown,\n openDropdown: trigger === 'click' ? open : openDropdown,\n closeDropdownImmediately: close,\n loop,\n trigger,\n unstyled,\n menuItemTabIndex,\n withInitialFocusPlaceholder,\n }}\n >\n <Popover\n returnFocus\n {...others}\n opened={_opened}\n onChange={toggleDropdown}\n defaultOpened={defaultOpened}\n trapFocus={keepMounted ? false : trapFocus}\n closeOnEscape={closeOnEscape}\n __staticSelector=\"Menu\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n variant={variant}\n keepMounted={keepMounted}\n >\n {children}\n </Popover>\n </MenuContextProvider>\n );\n});\n\nMenu.displayName = '@mantine/core/Menu';\nMenu.classes = classes;\nMenu.Item = MenuItem;\nMenu.Label = MenuLabel;\nMenu.Dropdown = MenuDropdown;\nMenu.Target = MenuTarget;\nMenu.Divider = MenuDivider;\nMenu.Sub = MenuSub;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyGA,MAAM,eAAe;CACnB,WAAW;CACX,kBAAkB;CAClB,6BAA6B;CAC7B,oBAAoB;EAAC;EAAa;EAAc;EAAU;CAC1D,MAAM;CACN,SAAS;CACT,WAAW;CACX,YAAY;CACZ,kBAAkB;CACnB;AAED,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,UACA,QACA,SACA,QACA,eACA,WACA,UACA,kBACA,MACA,eACA,SACA,WACA,YACA,YACA,QACA,UACA,SACA,MACA,kBACA,aACA,6BACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,CAAC,SAAS,aAAa,gBAAgB;EAC3C,OAAO;EACP,cAAc;EACd,YAAY;EACZ;EACD,CAAC;CACF,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,MAAM;CAE3D,MAAM,cAAc;AAClB,YAAU,MAAM;AAChB,oBAAkB,MAAM;AACxB,aAAW,WAAW;;CAGxB,MAAM,aAAa;AACjB,YAAU,KAAK;AACf,GAAC,WAAW,UAAU;;CAGxB,MAAM,uBAAuB;AAC3B,YAAU,OAAO,GAAG,MAAM;;CAG5B,MAAM,EAAE,cAAc,kBAAkB,gBAAgB;EAAE;EAAM;EAAO;EAAY;EAAW,CAAC;CAE/F,MAAM,gBAAgB,SACpB,oBAAoB,oBAAoB,wBAAwB,KAAK;CAEvE,MAAM,EAAE,oBAAoB,mBAAmB,qBAAkC;EAC/E;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,qBAAD;EACE,OAAO;GACL;GACA,QAAQ;GACR;GACA;GACA;GACA;GACA;GACA,eAAe,YAAY,UAAU,QAAQ;GAC7C,cAAc,YAAY,UAAU,OAAO;GAC3C,0BAA0B;GAC1B;GACA;GACA;GACA;GACA;GACD;YAED,oBAAC,SAAD;GACE,aAAA;GACA,GAAI;GACJ,QAAQ;GACR,UAAU;GACK;GACf,WAAW,cAAc,QAAQ;GAClB;GACf,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACD;GACI;GAEZ;GACO,CAAA;EACU,CAAA;EAExB;AAEF,KAAK,cAAc;AACnB,KAAK,UAAUA;AACf,KAAK,OAAO;AACZ,KAAK,QAAQ;AACb,KAAK,WAAW;AAChB,KAAK,SAAS;AACd,KAAK,UAAU;AACf,KAAK,MAAM"}
1
+ {"version":3,"file":"Menu.mjs","names":["classes"],"sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n factory,\n Factory,\n getContextItemIndex,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { useDelayedHover } from '../../utils/Floating';\nimport { __PopoverProps, Popover, PopoverStylesNames } from '../Popover';\nimport { MenuContextProvider, type MenuContextValue } from './Menu.context';\nimport { MenuDivider, type MenuDividerProps } from './MenuDivider/MenuDivider';\nimport { MenuDropdown, type MenuDropdownProps } from './MenuDropdown/MenuDropdown';\nimport { MenuItem, type MenuItemProps } from './MenuItem/MenuItem';\nimport { MenuLabel, type MenuLabelProps } from './MenuLabel/MenuLabel';\nimport { MenuSub, type MenuSubProps } from './MenuSub/MenuSub';\nimport { MenuTarget, type MenuTargetProps } from './MenuTarget/MenuTarget';\nimport classes from './Menu.module.css';\nimport type { MenuSubDropdownProps } from './MenuSubDropdown/MenuSubDropdown';\nimport type { MenuSubItemProps } from './MenuSubItem/MenuSubItem';\nimport type { MenuSubTargetProps } from './MenuSubTarget/MenuSubTarget';\n\nexport type MenuStylesNames =\n | 'item'\n | 'itemLabel'\n | 'itemSection'\n | 'label'\n | 'divider'\n | 'chevron'\n | PopoverStylesNames;\n\nexport type MenuFactory = Factory<{\n props: MenuProps;\n stylesNames: MenuStylesNames;\n staticComponents: {\n Item: typeof MenuItem;\n Label: typeof MenuLabel;\n Dropdown: typeof MenuDropdown;\n Target: typeof MenuTarget;\n Divider: typeof MenuDivider;\n Sub: typeof MenuSub;\n };\n}>;\n\nexport interface MenuProps extends __PopoverProps, StylesApiProps<MenuFactory> {\n variant?: string;\n\n /** Menu children */\n children?: React.ReactNode;\n\n /** Controlled menu opened state */\n opened?: boolean;\n\n /** Uncontrolled menu initial opened state */\n defaultOpened?: boolean;\n\n /** If set, focus is trapped within the menu dropdown when it is opened */\n trapFocus?: boolean;\n\n /** Called when menu opened state changes */\n onChange?: (opened: boolean) => void;\n\n /** Called when Menu is opened */\n onOpen?: () => void;\n\n /** Called when Menu is closed */\n onClose?: () => void;\n\n /** If set, the Menu is closed when one of the items is clicked. Can be overridden per item with `closeMenuOnClick` prop */\n closeOnItemClick?: boolean;\n\n /** If set, arrow key presses wrap around from last item to first and vice versa */\n loop?: boolean;\n\n /** If set, the dropdown is closed when the `Escape` key is pressed @default true */\n closeOnEscape?: boolean;\n\n /** Event trigger to open menu. Note: 'hover' is not keyboard accessible; prefer 'click-hover' for accessible hover menus */\n trigger?: 'click' | 'hover' | 'click-hover';\n\n /** Open delay in ms, applicable only to `trigger=\"hover\"` variant */\n openDelay?: number;\n\n /** Close delay in ms, applicable only to `trigger=\"hover\"` variant */\n closeDelay?: number;\n\n /** If set, the dropdown is closed on outside clicks */\n closeOnClickOutside?: boolean;\n\n /** Events that trigger outside click detection. Includes mousedown for desktop clicks, touchstart for mobile, and keydown for Escape key handling @default ['mousedown', 'touchstart', 'keydown'] */\n clickOutsideEvents?: string[];\n\n /** Id base to create accessibility connections */\n id?: string;\n\n /** Set the `tabindex` on all menu items. Use `0` to allow Tab key navigation through menu items (required for navigation menus following WAI-ARIA disclosure pattern). @default -1 */\n menuItemTabIndex?: -1 | 0;\n\n /** Adds a hidden focusable element at the start of the dropdown to prevent unexpected focus jumps when opening with keyboard. Set to false if you need custom focus management. @default true */\n withInitialFocusPlaceholder?: boolean;\n\n /** Determines whether focus should be automatically returned to control when dropdown closes @default `true` */\n returnFocus?: boolean;\n}\n\nconst defaultProps = {\n trapFocus: true,\n closeOnItemClick: true,\n withInitialFocusPlaceholder: true,\n clickOutsideEvents: ['mousedown', 'touchstart', 'keydown'],\n loop: true,\n trigger: 'click',\n openDelay: 0,\n closeDelay: 100,\n menuItemTabIndex: -1,\n} satisfies Partial<MenuProps>;\n\nexport const Menu = factory<MenuFactory>((_props) => {\n const props = useProps('Menu', defaultProps, _props);\n const {\n children,\n onOpen,\n onClose,\n opened,\n defaultOpened,\n trapFocus,\n onChange,\n closeOnItemClick,\n loop,\n closeOnEscape,\n trigger,\n openDelay,\n closeDelay,\n classNames,\n styles,\n unstyled,\n variant,\n vars,\n menuItemTabIndex,\n keepMounted,\n withInitialFocusPlaceholder,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MenuFactory>({\n name: 'Menu',\n classes,\n props,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const [_opened, setOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange,\n });\n const [openedViaClick, setOpenedViaClick] = useState(false);\n\n const close = () => {\n setOpened(false);\n setOpenedViaClick(false);\n _opened && onClose?.();\n };\n\n const open = () => {\n setOpened(true);\n !_opened && onOpen?.();\n };\n\n const toggleDropdown = () => {\n _opened ? close() : open();\n };\n\n const { openDropdown, closeDropdown } = useDelayedHover({ open, close, closeDelay, openDelay });\n\n const getItemIndex = (node: HTMLButtonElement) =>\n getContextItemIndex('[data-menu-item]', '[data-menu-dropdown]', node);\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MenuFactory>({\n classNames,\n styles,\n props,\n });\n\n return (\n <MenuContextProvider\n value={{\n getStyles,\n opened: _opened,\n toggleDropdown,\n getItemIndex,\n openedViaClick,\n setOpenedViaClick,\n closeOnItemClick,\n closeDropdown: trigger === 'click' ? close : closeDropdown,\n openDropdown: trigger === 'click' ? open : openDropdown,\n closeDropdownImmediately: close,\n loop,\n trigger,\n unstyled,\n menuItemTabIndex,\n withInitialFocusPlaceholder,\n }}\n >\n <Popover\n returnFocus\n {...others}\n opened={_opened}\n onChange={toggleDropdown}\n defaultOpened={defaultOpened}\n trapFocus={keepMounted ? false : trapFocus}\n closeOnEscape={closeOnEscape}\n __staticSelector=\"Menu\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n variant={variant}\n keepMounted={keepMounted}\n >\n {children}\n </Popover>\n </MenuContextProvider>\n );\n});\n\nMenu.displayName = '@mantine/core/Menu';\nMenu.classes = classes;\nMenu.Item = MenuItem;\nMenu.Label = MenuLabel;\nMenu.Dropdown = MenuDropdown;\nMenu.Target = MenuTarget;\nMenu.Divider = MenuDivider;\nMenu.Sub = MenuSub;\n\nexport namespace Menu {\n export type Props = MenuProps;\n export type StylesNames = MenuStylesNames;\n export type Factory = MenuFactory;\n export type ContextValue = MenuContextValue;\n\n export namespace Item {\n export type Props = MenuItemProps;\n }\n\n export namespace Label {\n export type Props = MenuLabelProps;\n }\n\n export namespace Divider {\n export type Props = MenuDividerProps;\n }\n\n export namespace Dropdown {\n export type Props = MenuDropdownProps;\n }\n\n export namespace Target {\n export type Props = MenuTargetProps;\n }\n\n export namespace Sub {\n export type Props = MenuSubProps;\n }\n\n export namespace SubDropdown {\n export type Props = MenuSubDropdownProps;\n }\n\n export namespace SubItem {\n export type Props = MenuSubItemProps;\n }\n\n export namespace SubTarget {\n export type Props = MenuSubTargetProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4GA,MAAM,eAAe;CACnB,WAAW;CACX,kBAAkB;CAClB,6BAA6B;CAC7B,oBAAoB;EAAC;EAAa;EAAc;EAAU;CAC1D,MAAM;CACN,SAAS;CACT,WAAW;CACX,YAAY;CACZ,kBAAkB;CACnB;AAED,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,UACA,QACA,SACA,QACA,eACA,WACA,UACA,kBACA,MACA,eACA,SACA,WACA,YACA,YACA,QACA,UACA,SACA,MACA,kBACA,aACA,6BACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,CAAC,SAAS,aAAa,gBAAgB;EAC3C,OAAO;EACP,cAAc;EACd,YAAY;EACZ;EACD,CAAC;CACF,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,MAAM;CAE3D,MAAM,cAAc;AAClB,YAAU,MAAM;AAChB,oBAAkB,MAAM;AACxB,aAAW,WAAW;;CAGxB,MAAM,aAAa;AACjB,YAAU,KAAK;AACf,GAAC,WAAW,UAAU;;CAGxB,MAAM,uBAAuB;AAC3B,YAAU,OAAO,GAAG,MAAM;;CAG5B,MAAM,EAAE,cAAc,kBAAkB,gBAAgB;EAAE;EAAM;EAAO;EAAY;EAAW,CAAC;CAE/F,MAAM,gBAAgB,SACpB,oBAAoB,oBAAoB,wBAAwB,KAAK;CAEvE,MAAM,EAAE,oBAAoB,mBAAmB,qBAAkC;EAC/E;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,qBAAD;EACE,OAAO;GACL;GACA,QAAQ;GACR;GACA;GACA;GACA;GACA;GACA,eAAe,YAAY,UAAU,QAAQ;GAC7C,cAAc,YAAY,UAAU,OAAO;GAC3C,0BAA0B;GAC1B;GACA;GACA;GACA;GACA;GACD;YAED,oBAAC,SAAD;GACE,aAAA;GACA,GAAI;GACJ,QAAQ;GACR,UAAU;GACK;GACf,WAAW,cAAc,QAAQ;GAClB;GACf,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACD;GACI;GAEZ;GACO,CAAA;EACU,CAAA;EAExB;AAEF,KAAK,cAAc;AACnB,KAAK,UAAUA;AACf,KAAK,OAAO;AACZ,KAAK,QAAQ;AACb,KAAK,WAAW;AAChB,KAAK,SAAS;AACd,KAAK,UAAU;AACf,KAAK,MAAM"}
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.mjs","names":["classes"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { ModalBody } from './ModalBody';\nimport { ModalCloseButton } from './ModalCloseButton';\nimport { ModalContent } from './ModalContent';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalOverlay } from './ModalOverlay';\nimport {\n ModalRoot,\n ModalRootCssVariables,\n ModalRootProps,\n ModalRootStylesNames,\n} from './ModalRoot';\nimport { ModalStack, ModalStackContext } from './ModalStack';\nimport { ModalTitle } from './ModalTitle';\nimport classes from './Modal.module.css';\n\nexport type ModalStylesNames = ModalRootStylesNames;\nexport type ModalCssVariables = ModalRootCssVariables;\n\nexport interface ModalProps extends ModalRootProps {\n __staticSelector?: string;\n\n /** Modal title */\n title?: React.ReactNode;\n\n /** If set, the overlay is rendered @default true */\n withOverlay?: boolean;\n\n /** Props passed down to the `Overlay` component, use to configure opacity, `background-color`, styles and other properties */\n overlayProps?: ModalBaseOverlayProps;\n\n /** Modal content */\n children?: React.ReactNode;\n\n /** If set, the close button is rendered @default true */\n withCloseButton?: boolean;\n\n /** Props passed down to the close button */\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /** Id of the modal in the `Modal.Stack` */\n stackId?: string;\n}\n\nexport type ModalFactory = Factory<{\n props: ModalProps;\n ref: HTMLDivElement;\n stylesNames: ModalStylesNames;\n vars: ModalCssVariables;\n staticComponents: {\n Root: typeof ModalRoot;\n Overlay: typeof ModalOverlay;\n Content: typeof ModalContent;\n Body: typeof ModalBody;\n Header: typeof ModalHeader;\n Title: typeof ModalTitle;\n CloseButton: typeof ModalCloseButton;\n Stack: typeof ModalStack;\n };\n}>;\n\nconst defaultProps = {\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<ModalProps>;\n\nexport const Modal = factory<ModalFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n radius,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Modal', defaultProps, _props);\n const ctx = use(ModalStackContext);\n const hasHeader = !!title || withCloseButton;\n const stackProps =\n ctx && stackId\n ? {\n closeOnEscape: ctx.currentId === stackId,\n trapFocus: ctx.currentId === stackId,\n zIndex: ctx.getZIndex(stackId),\n }\n : {};\n\n const overlayVisible =\n withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;\n\n useEffect(() => {\n if (ctx && stackId) {\n opened\n ? ctx.addModal(stackId, zIndex || getDefaultZIndex('modal'))\n : ctx.removeModal(stackId);\n }\n }, [opened, stackId, zIndex]);\n\n return (\n <ModalRoot\n radius={radius}\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <ModalOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <ModalContent\n radius={radius}\n __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}\n >\n {hasHeader && (\n <ModalHeader>\n {title && <ModalTitle>{title}</ModalTitle>}\n {withCloseButton && <ModalCloseButton {...closeButtonProps} />}\n </ModalHeader>\n )}\n\n <ModalBody>{children}</ModalBody>\n </ModalContent>\n </ModalRoot>\n );\n});\n\nModal.classes = classes;\nModal.displayName = '@mantine/core/Modal';\nModal.Root = ModalRoot;\nModal.Overlay = ModalOverlay;\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Header = ModalHeader;\nModal.Title = ModalTitle;\nModal.CloseButton = ModalCloseButton;\nModal.Stack = ModalStack;\n"],"mappings":";;;;;;;;;;;;;;;;AA+DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQ,iBAAiB,QAAQ;CACjC,iBAAiB;EAAE,UAAU;EAAK,YAAY;EAAa;CAC3D,aAAa;CACb,iBAAiB;CAClB;AAED,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,QACA,SACA,QACA,GAAG,WACD,SAAS,SAAS,cAAc,OAAO;CAC3C,MAAM,MAAM,IAAI,kBAAkB;CAClC,MAAM,YAAY,CAAC,CAAC,SAAS;CAC7B,MAAM,aACJ,OAAO,UACH;EACE,eAAe,IAAI,cAAc;EACjC,WAAW,IAAI,cAAc;EAC7B,QAAQ,IAAI,UAAU,QAAQ;EAC/B,GACD,EAAE;CAER,MAAM,iBACJ,gBAAgB,QAAQ,QAAQ,WAAW,MAAM,IAAI,cAAc,UAAU;AAE/E,iBAAgB;AACd,MAAI,OAAO,QACT,UACI,IAAI,SAAS,SAAS,UAAU,iBAAiB,QAAQ,CAAC,GAC1D,IAAI,YAAY,QAAQ;IAE7B;EAAC;EAAQ;EAAS;EAAO,CAAC;AAE7B,QACE,qBAAC,WAAD;EACU;EACA;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,QAAQ,GAAG;EAClD,GAAI;EACJ,GAAI;YALN,CAOG,eACC,oBAAC,cAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,GAAG,GAAG,KAAA;GACpD,GAAI;GACJ,CAAA,EAEJ,qBAAC,cAAD;GACU;GACR,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;aAFnE,CAIG,aACC,qBAAC,aAAD,EAAA,UAAA,CACG,SAAS,oBAAC,YAAD,EAAA,UAAa,OAAmB,CAAA,EACzC,mBAAmB,oBAAC,kBAAD,EAAkB,GAAI,kBAAoB,CAAA,CAClD,EAAA,CAAA,EAGhB,oBAAC,WAAD,EAAY,UAAqB,CAAA,CACpB;KACL;;EAEd;AAEF,MAAM,UAAUA;AAChB,MAAM,cAAc;AACpB,MAAM,OAAO;AACb,MAAM,UAAU;AAChB,MAAM,UAAU;AAChB,MAAM,OAAO;AACb,MAAM,SAAS;AACf,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,QAAQ"}
1
+ {"version":3,"file":"Modal.mjs","names":["classes"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { ModalBody, type ModalBodyProps } from './ModalBody';\nimport { ModalCloseButton, type ModalCloseButtonProps } from './ModalCloseButton';\nimport { ModalContent, type ModalContentProps } from './ModalContent';\nimport { ModalHeader, type ModalHeaderProps } from './ModalHeader';\nimport { ModalOverlay, type ModalOverlayProps } from './ModalOverlay';\nimport {\n ModalRoot,\n ModalRootCssVariables,\n ModalRootProps,\n ModalRootStylesNames,\n} from './ModalRoot';\nimport { ModalStack, ModalStackContext, type ModalStackProps } from './ModalStack';\nimport { ModalTitle, type ModalTitleProps } from './ModalTitle';\nimport classes from './Modal.module.css';\nexport type ModalStylesNames = ModalRootStylesNames;\nexport type ModalCssVariables = ModalRootCssVariables;\n\nexport interface ModalProps extends ModalRootProps {\n __staticSelector?: string;\n\n /** Modal title */\n title?: React.ReactNode;\n\n /** If set, the overlay is rendered @default true */\n withOverlay?: boolean;\n\n /** Props passed down to the `Overlay` component, use to configure opacity, `background-color`, styles and other properties */\n overlayProps?: ModalBaseOverlayProps;\n\n /** Modal content */\n children?: React.ReactNode;\n\n /** If set, the close button is rendered @default true */\n withCloseButton?: boolean;\n\n /** Props passed down to the close button */\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /** Id of the modal in the `Modal.Stack` */\n stackId?: string;\n}\n\nexport type ModalFactory = Factory<{\n props: ModalProps;\n ref: HTMLDivElement;\n stylesNames: ModalStylesNames;\n vars: ModalCssVariables;\n staticComponents: {\n Root: typeof ModalRoot;\n Overlay: typeof ModalOverlay;\n Content: typeof ModalContent;\n Body: typeof ModalBody;\n Header: typeof ModalHeader;\n Title: typeof ModalTitle;\n CloseButton: typeof ModalCloseButton;\n Stack: typeof ModalStack;\n };\n}>;\n\nconst defaultProps = {\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<ModalProps>;\n\nexport const Modal = factory<ModalFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n radius,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Modal', defaultProps, _props);\n const ctx = use(ModalStackContext);\n const hasHeader = !!title || withCloseButton;\n const stackProps =\n ctx && stackId\n ? {\n closeOnEscape: ctx.currentId === stackId,\n trapFocus: ctx.currentId === stackId,\n zIndex: ctx.getZIndex(stackId),\n }\n : {};\n\n const overlayVisible =\n withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;\n\n useEffect(() => {\n if (ctx && stackId) {\n opened\n ? ctx.addModal(stackId, zIndex || getDefaultZIndex('modal'))\n : ctx.removeModal(stackId);\n }\n }, [opened, stackId, zIndex]);\n\n return (\n <ModalRoot\n radius={radius}\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <ModalOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <ModalContent\n radius={radius}\n __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}\n >\n {hasHeader && (\n <ModalHeader>\n {title && <ModalTitle>{title}</ModalTitle>}\n {withCloseButton && <ModalCloseButton {...closeButtonProps} />}\n </ModalHeader>\n )}\n\n <ModalBody>{children}</ModalBody>\n </ModalContent>\n </ModalRoot>\n );\n});\n\nModal.classes = classes;\nModal.displayName = '@mantine/core/Modal';\nModal.Root = ModalRoot;\nModal.Overlay = ModalOverlay;\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Header = ModalHeader;\nModal.Title = ModalTitle;\nModal.CloseButton = ModalCloseButton;\nModal.Stack = ModalStack;\n\nexport namespace Modal {\n export type Props = ModalProps;\n export type StylesNames = ModalStylesNames;\n export type CssVariables = ModalCssVariables;\n export type Factory = ModalFactory;\n\n export namespace Root {\n export type Props = ModalRootProps;\n }\n\n export namespace Body {\n export type Props = ModalBodyProps;\n }\n\n export namespace CloseButton {\n export type Props = ModalCloseButtonProps;\n }\n\n export namespace Content {\n export type Props = ModalContentProps;\n }\n\n export namespace Header {\n export type Props = ModalHeaderProps;\n }\n\n export namespace Overlay {\n export type Props = ModalOverlayProps;\n }\n\n export namespace Title {\n export type Props = ModalTitleProps;\n }\n\n export namespace Stack {\n export type Props = ModalStackProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;AA8DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQ,iBAAiB,QAAQ;CACjC,iBAAiB;EAAE,UAAU;EAAK,YAAY;EAAa;CAC3D,aAAa;CACb,iBAAiB;CAClB;AAED,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,QACA,SACA,QACA,GAAG,WACD,SAAS,SAAS,cAAc,OAAO;CAC3C,MAAM,MAAM,IAAI,kBAAkB;CAClC,MAAM,YAAY,CAAC,CAAC,SAAS;CAC7B,MAAM,aACJ,OAAO,UACH;EACE,eAAe,IAAI,cAAc;EACjC,WAAW,IAAI,cAAc;EAC7B,QAAQ,IAAI,UAAU,QAAQ;EAC/B,GACD,EAAE;CAER,MAAM,iBACJ,gBAAgB,QAAQ,QAAQ,WAAW,MAAM,IAAI,cAAc,UAAU;AAE/E,iBAAgB;AACd,MAAI,OAAO,QACT,UACI,IAAI,SAAS,SAAS,UAAU,iBAAiB,QAAQ,CAAC,GAC1D,IAAI,YAAY,QAAQ;IAE7B;EAAC;EAAQ;EAAS;EAAO,CAAC;AAE7B,QACE,qBAAC,WAAD;EACU;EACA;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,QAAQ,GAAG;EAClD,GAAI;EACJ,GAAI;YALN,CAOG,eACC,oBAAC,cAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,GAAG,GAAG,KAAA;GACpD,GAAI;GACJ,CAAA,EAEJ,qBAAC,cAAD;GACU;GACR,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;aAFnE,CAIG,aACC,qBAAC,aAAD,EAAA,UAAA,CACG,SAAS,oBAAC,YAAD,EAAA,UAAa,OAAmB,CAAA,EACzC,mBAAmB,oBAAC,kBAAD,EAAkB,GAAI,kBAAoB,CAAA,CAClD,EAAA,CAAA,EAGhB,oBAAC,WAAD,EAAY,UAAqB,CAAA,CACpB;KACL;;EAEd;AAEF,MAAM,UAAUA;AAChB,MAAM,cAAc;AACpB,MAAM,OAAO;AACb,MAAM,UAAU;AAChB,MAAM,UAAU;AAChB,MAAM,OAAO;AACb,MAAM,SAAS;AACf,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,QAAQ"}
@@ -35,7 +35,7 @@ const defaultProps = {
35
35
  };
36
36
  const MultiSelect = genericFactory((_props) => {
37
37
  const props = useProps("MultiSelect", defaultProps, _props);
38
- const { classNames, className, style, styles, unstyled, vars, size, value, defaultValue, onChange, onKeyDown, variant, data, dropdownOpened, defaultDropdownOpened, onDropdownOpen, onDropdownClose, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, filter, limit, withScrollArea, maxDropdownHeight, searchValue, defaultSearchValue, onSearchChange, readOnly, disabled, onFocus, onBlur, radius, rightSection, rightSectionWidth, rightSectionPointerEvents, rightSectionProps, leftSection, leftSectionWidth, leftSectionPointerEvents, leftSectionProps, inputContainer, inputWrapperOrder, withAsterisk, labelProps, descriptionProps, errorProps, wrapperProps, description, label, error, maxValues, searchable, nothingFoundMessage, withCheckIcon, withAlignedLabels, checkIconPosition, hidePickedOptions, withErrorStyles, name, form, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, placeholder, hiddenInputValuesDivider, required, mod, renderOption, renderPill, onRemove, onClear, onMaxValues, scrollAreaProps, chevronColor, attributes, clearSearchOnChange, openOnFocus, ...others } = props;
38
+ const { classNames, className, style, styles, unstyled, vars, size, value, defaultValue, onChange, onKeyDown, variant, data, dropdownOpened, defaultDropdownOpened, onDropdownOpen, onDropdownClose, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, filter, limit, withScrollArea, maxDropdownHeight, searchValue, defaultSearchValue, onSearchChange, readOnly, disabled, onFocus, onBlur, radius, rightSection, rightSectionWidth, rightSectionPointerEvents, rightSectionProps, leftSection, leftSectionWidth, leftSectionPointerEvents, leftSectionProps, inputContainer, inputWrapperOrder, withAsterisk, labelProps, descriptionProps, errorProps, wrapperProps, description, label, error, maxValues, searchable, nothingFoundMessage, withCheckIcon, withAlignedLabels, checkIconPosition, hidePickedOptions, withErrorStyles, name, form, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, placeholder, hiddenInputValuesDivider, required, mod, renderOption, renderPill, onRemove, onClear, onMaxValues, scrollAreaProps, chevronColor, attributes, clearSearchOnChange, openOnFocus, loading, loadingPosition, ...others } = props;
39
39
  const _id = useId$1(id);
40
40
  const parsedData = getParsedComboboxData(data);
41
41
  const optionsLockup = getOptionsLockup(parsedData);
@@ -188,6 +188,8 @@ const MultiSelect = genericFactory((_props) => {
188
188
  leftSectionWidth,
189
189
  leftSectionPointerEvents,
190
190
  leftSectionProps,
191
+ loading,
192
+ loadingPosition,
191
193
  inputContainer,
192
194
  inputWrapperOrder,
193
195
  withAsterisk,