@lumx/react 3.0.2 → 3.0.3

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 (391) hide show
  1. package/{esm/_internal/_rollupPluginBabelHelpers.js → _internal/ClickAwayProvider.js} +107 -2
  2. package/_internal/ClickAwayProvider.js.map +1 -0
  3. package/_internal/types.d.ts +271 -0
  4. package/index.d.ts +2686 -0
  5. package/index.js +12533 -0
  6. package/index.js.map +1 -0
  7. package/package.json +7 -6
  8. package/src/components/alert-dialog/AlertDialog.tsx +2 -1
  9. package/src/components/autocomplete/Autocomplete.tsx +2 -2
  10. package/src/components/autocomplete/AutocompleteMultiple.tsx +2 -1
  11. package/src/components/avatar/Avatar.tsx +2 -1
  12. package/src/components/badge/Badge.test.tsx +1 -1
  13. package/src/components/badge/Badge.tsx +2 -1
  14. package/src/components/button/Button.test.tsx +1 -1
  15. package/src/components/button/Button.tsx +2 -1
  16. package/src/components/button/ButtonGroup.tsx +2 -1
  17. package/src/components/button/ButtonRoot.test.tsx +1 -1
  18. package/src/components/button/ButtonRoot.tsx +2 -1
  19. package/src/components/button/IconButton.tsx +2 -1
  20. package/src/components/checkbox/Checkbox.test.tsx +1 -1
  21. package/src/components/checkbox/Checkbox.tsx +2 -1
  22. package/src/components/chip/Chip.test.tsx +1 -1
  23. package/src/components/chip/Chip.tsx +3 -1
  24. package/src/components/chip/ChipGroup.tsx +2 -1
  25. package/src/components/comment-block/CommentBlock.tsx +2 -1
  26. package/src/components/date-picker/DatePicker.tsx +1 -1
  27. package/src/components/date-picker/DatePickerControlled.tsx +1 -1
  28. package/src/components/date-picker/DatePickerField.tsx +1 -1
  29. package/src/components/date-picker/constants.ts +1 -1
  30. package/src/components/date-picker/types.ts +1 -1
  31. package/src/components/dialog/Dialog.tsx +4 -8
  32. package/src/components/divider/Divider.test.tsx +1 -1
  33. package/src/components/divider/Divider.tsx +3 -2
  34. package/src/components/drag-handle/DragHandle.tsx +2 -1
  35. package/src/components/dropdown/Dropdown.tsx +2 -1
  36. package/src/components/expansion-panel/ExpansionPanel.test.tsx +1 -1
  37. package/src/components/expansion-panel/ExpansionPanel.tsx +3 -10
  38. package/src/components/flag/Flag.test.tsx +1 -1
  39. package/src/components/flag/Flag.tsx +2 -1
  40. package/src/components/flex-box/FlexBox.stories.tsx +8 -0
  41. package/src/components/flex-box/FlexBox.tsx +7 -3
  42. package/src/components/flex-box/__snapshots__/FlexBox.test.tsx.snap +16 -0
  43. package/src/components/generic-block/GenericBlock.stories.jsx +23 -1
  44. package/src/components/generic-block/GenericBlock.tsx +18 -4
  45. package/src/components/generic-block/constants.ts +9 -0
  46. package/src/components/generic-block/index.ts +1 -0
  47. package/src/components/grid/Grid.tsx +2 -1
  48. package/src/components/grid/GridItem.tsx +2 -1
  49. package/src/components/heading/Heading.tsx +2 -1
  50. package/src/components/heading/HeadingLevelProvider.tsx +1 -1
  51. package/src/components/heading/context.tsx +1 -1
  52. package/src/components/icon/Icon.test.tsx +1 -1
  53. package/src/components/icon/Icon.tsx +2 -1
  54. package/src/components/image-block/ImageBlock.tsx +2 -1
  55. package/src/components/index.ts +1 -1
  56. package/src/components/inline-list/InlineList.stories.tsx +40 -0
  57. package/src/components/inline-list/InlineList.test.tsx +41 -0
  58. package/src/components/inline-list/InlineList.tsx +80 -0
  59. package/src/components/inline-list/index.ts +1 -0
  60. package/src/components/input-helper/InputHelper.tsx +2 -1
  61. package/src/components/input-label/InputLabel.tsx +2 -1
  62. package/src/components/lightbox/Lightbox.tsx +2 -1
  63. package/src/components/link/Link.tsx +2 -1
  64. package/src/components/link-preview/LinkPreview.test.tsx +1 -1
  65. package/src/components/link-preview/LinkPreview.tsx +2 -1
  66. package/src/components/list/List.tsx +2 -1
  67. package/src/components/list/ListDivider.tsx +2 -1
  68. package/src/components/list/ListItem.tsx +3 -8
  69. package/src/components/list/ListSubheader.tsx +2 -1
  70. package/src/components/list/useInteractiveList.tsx +1 -1
  71. package/src/components/message/Message.test.tsx +1 -1
  72. package/src/components/message/Message.tsx +2 -1
  73. package/src/components/mosaic/Mosaic.tsx +2 -1
  74. package/src/components/notification/Notification.tsx +2 -1
  75. package/src/components/popover/Popover.tsx +2 -1
  76. package/src/components/post-block/PostBlock.tsx +2 -1
  77. package/src/components/progress/Progress.tsx +2 -1
  78. package/src/components/progress-tracker/ProgressTracker.tsx +2 -1
  79. package/src/components/progress-tracker/ProgressTrackerStep.test.tsx +1 -1
  80. package/src/components/progress-tracker/ProgressTrackerStep.tsx +2 -1
  81. package/src/components/progress-tracker/ProgressTrackerStepPanel.tsx +2 -1
  82. package/src/components/radio-button/RadioButton.test.tsx +1 -1
  83. package/src/components/radio-button/RadioButton.tsx +2 -1
  84. package/src/components/radio-button/RadioGroup.tsx +2 -1
  85. package/src/components/select/Select.test.tsx +1 -1
  86. package/src/components/select/Select.tsx +2 -1
  87. package/src/components/select/SelectMultiple.test.tsx +1 -1
  88. package/src/components/select/SelectMultiple.tsx +2 -1
  89. package/src/components/select/WithSelectContext.tsx +1 -1
  90. package/src/components/select/constants.ts +1 -1
  91. package/src/components/side-navigation/SideNavigation.tsx +2 -1
  92. package/src/components/side-navigation/SideNavigationItem.test.tsx +1 -1
  93. package/src/components/side-navigation/SideNavigationItem.tsx +3 -9
  94. package/src/components/skeleton/SkeletonCircle.tsx +2 -1
  95. package/src/components/skeleton/SkeletonRectangle.tsx +2 -1
  96. package/src/components/skeleton/SkeletonTypography.tsx +2 -1
  97. package/src/components/slider/Slider.tsx +2 -1
  98. package/src/components/slideshow/Slides.tsx +2 -1
  99. package/src/components/slideshow/Slideshow.tsx +1 -1
  100. package/src/components/slideshow/SlideshowControls.tsx +2 -1
  101. package/src/components/slideshow/SlideshowItem.tsx +2 -1
  102. package/src/components/slideshow/SlideshowItemGroup.tsx +2 -1
  103. package/src/components/switch/Switch.test.tsx +1 -1
  104. package/src/components/switch/Switch.tsx +2 -1
  105. package/src/components/table/Table.tsx +2 -1
  106. package/src/components/table/TableBody.tsx +2 -1
  107. package/src/components/table/TableCell.tsx +3 -1
  108. package/src/components/table/TableHeader.tsx +2 -1
  109. package/src/components/table/TableRow.tsx +2 -1
  110. package/src/components/tabs/Tab.test.tsx +1 -1
  111. package/src/components/tabs/Tab.tsx +2 -1
  112. package/src/components/tabs/TabList.test.tsx +1 -1
  113. package/src/components/tabs/TabList.tsx +2 -1
  114. package/src/components/tabs/TabPanel.tsx +2 -1
  115. package/src/components/text/{Text.stories.tsx → Text.stories.jsx} +23 -28
  116. package/src/components/text/Text.test.tsx +15 -1
  117. package/src/components/text/Text.tsx +38 -12
  118. package/src/components/text-field/TextField.test.tsx +1 -1
  119. package/src/components/text-field/TextField.tsx +2 -1
  120. package/src/components/thumbnail/Thumbnail.tsx +2 -1
  121. package/src/components/thumbnail/types.ts +1 -1
  122. package/src/components/toolbar/Toolbar.tsx +2 -1
  123. package/src/components/tooltip/Tooltip.tsx +2 -1
  124. package/src/components/tooltip/useTooltipOpen.tsx +1 -1
  125. package/src/components/uploader/Uploader.test.tsx +1 -1
  126. package/src/components/uploader/Uploader.tsx +2 -1
  127. package/src/components/user-block/UserBlock.tsx +2 -1
  128. package/src/hooks/useCallbackOnEscape.ts +2 -1
  129. package/src/hooks/useClickAway.tsx +1 -1
  130. package/src/hooks/useDisableBodyScroll.ts +1 -1
  131. package/src/hooks/useFocusTrap.ts +1 -1
  132. package/src/hooks/useInterval.tsx +1 -1
  133. package/src/hooks/useOnResize.ts +1 -1
  134. package/src/index.ts +5 -0
  135. package/src/stories/generated/GenericBlock/Demos.stories.tsx +3 -1
  136. package/src/stories/generated/Heading/Demos.stories.tsx +6 -0
  137. package/src/stories/withResizableBox.tsx +18 -0
  138. package/src/testing/utils/commonTestsSuite.ts +1 -1
  139. package/src/utils/{getRootClassName.ts → className.ts} +19 -0
  140. package/src/utils/event.ts +1 -0
  141. package/src/utils/index.ts +5 -0
  142. package/src/utils/type.ts +3 -0
  143. package/src/utils/utils.test.ts +1 -1
  144. package/types.d.ts +68 -11
  145. package/utils/index.d.ts +29 -0
  146. package/utils/index.js +2 -0
  147. package/utils/index.js.map +1 -0
  148. package/esm/_internal/AlertDialog.js +0 -141
  149. package/esm/_internal/AlertDialog.js.map +0 -1
  150. package/esm/_internal/AutocompleteMultiple.js +0 -257
  151. package/esm/_internal/AutocompleteMultiple.js.map +0 -1
  152. package/esm/_internal/Avatar2.js +0 -82
  153. package/esm/_internal/Avatar2.js.map +0 -1
  154. package/esm/_internal/Badge2.js +0 -54
  155. package/esm/_internal/Badge2.js.map +0 -1
  156. package/esm/_internal/Button2.js +0 -84
  157. package/esm/_internal/Button2.js.map +0 -1
  158. package/esm/_internal/ButtonGroup.js +0 -51
  159. package/esm/_internal/ButtonGroup.js.map +0 -1
  160. package/esm/_internal/ButtonRoot.js +0 -135
  161. package/esm/_internal/ButtonRoot.js.map +0 -1
  162. package/esm/_internal/Checkbox2.js +0 -116
  163. package/esm/_internal/Checkbox2.js.map +0 -1
  164. package/esm/_internal/Chip2.js +0 -118
  165. package/esm/_internal/Chip2.js.map +0 -1
  166. package/esm/_internal/ChipGroup.js +0 -122
  167. package/esm/_internal/ChipGroup.js.map +0 -1
  168. package/esm/_internal/ClickAwayProvider.js +0 -217
  169. package/esm/_internal/ClickAwayProvider.js.map +0 -1
  170. package/esm/_internal/CommentBlock.js +0 -124
  171. package/esm/_internal/CommentBlock.js.map +0 -1
  172. package/esm/_internal/DatePickerField.js +0 -347
  173. package/esm/_internal/DatePickerField.js.map +0 -1
  174. package/esm/_internal/Dialog2.js +0 -274
  175. package/esm/_internal/Dialog2.js.map +0 -1
  176. package/esm/_internal/Divider2.js +0 -53
  177. package/esm/_internal/Divider2.js.map +0 -1
  178. package/esm/_internal/DragHandle.js +0 -50
  179. package/esm/_internal/DragHandle.js.map +0 -1
  180. package/esm/_internal/Dropdown2.js +0 -157
  181. package/esm/_internal/Dropdown2.js.map +0 -1
  182. package/esm/_internal/ExpansionPanel.js +0 -156
  183. package/esm/_internal/ExpansionPanel.js.map +0 -1
  184. package/esm/_internal/Flag2.js +0 -48
  185. package/esm/_internal/Flag2.js.map +0 -1
  186. package/esm/_internal/FlexBox.js +0 -55
  187. package/esm/_internal/FlexBox.js.map +0 -1
  188. package/esm/_internal/GenericBlock.js +0 -125
  189. package/esm/_internal/GenericBlock.js.map +0 -1
  190. package/esm/_internal/GridItem.js +0 -96
  191. package/esm/_internal/GridItem.js.map +0 -1
  192. package/esm/_internal/HeadingLevelProvider.js +0 -112
  193. package/esm/_internal/HeadingLevelProvider.js.map +0 -1
  194. package/esm/_internal/Icon2.js +0 -120
  195. package/esm/_internal/Icon2.js.map +0 -1
  196. package/esm/_internal/IconButton.js +0 -74
  197. package/esm/_internal/IconButton.js.map +0 -1
  198. package/esm/_internal/ImageBlock.js +0 -101
  199. package/esm/_internal/ImageBlock.js.map +0 -1
  200. package/esm/_internal/InputHelper.js +0 -72
  201. package/esm/_internal/InputHelper.js.map +0 -1
  202. package/esm/_internal/InputLabel.js +0 -58
  203. package/esm/_internal/InputLabel.js.map +0 -1
  204. package/esm/_internal/Lightbox2.js +0 -123
  205. package/esm/_internal/Lightbox2.js.map +0 -1
  206. package/esm/_internal/Link2.js +0 -122
  207. package/esm/_internal/Link2.js.map +0 -1
  208. package/esm/_internal/LinkPreview.js +0 -105
  209. package/esm/_internal/LinkPreview.js.map +0 -1
  210. package/esm/_internal/List2.js +0 -799
  211. package/esm/_internal/List2.js.map +0 -1
  212. package/esm/_internal/ListSubheader.js +0 -79
  213. package/esm/_internal/ListSubheader.js.map +0 -1
  214. package/esm/_internal/Message2.js +0 -78
  215. package/esm/_internal/Message2.js.map +0 -1
  216. package/esm/_internal/Mosaic2.js +0 -89
  217. package/esm/_internal/Mosaic2.js.map +0 -1
  218. package/esm/_internal/Notification2.js +0 -133
  219. package/esm/_internal/Notification2.js.map +0 -1
  220. package/esm/_internal/Popover2.js +0 -2473
  221. package/esm/_internal/Popover2.js.map +0 -1
  222. package/esm/_internal/PostBlock.js +0 -96
  223. package/esm/_internal/PostBlock.js.map +0 -1
  224. package/esm/_internal/Progress2.js +0 -81
  225. package/esm/_internal/Progress2.js.map +0 -1
  226. package/esm/_internal/ProgressTrackerStepPanel.js +0 -313
  227. package/esm/_internal/ProgressTrackerStepPanel.js.map +0 -1
  228. package/esm/_internal/RadioGroup.js +0 -147
  229. package/esm/_internal/RadioGroup.js.map +0 -1
  230. package/esm/_internal/SelectMultiple.js +0 -424
  231. package/esm/_internal/SelectMultiple.js.map +0 -1
  232. package/esm/_internal/SideNavigationItem.js +0 -151
  233. package/esm/_internal/SideNavigationItem.js.map +0 -1
  234. package/esm/_internal/SkeletonTypography.js +0 -168
  235. package/esm/_internal/SkeletonTypography.js.map +0 -1
  236. package/esm/_internal/Slider2.js +0 -327
  237. package/esm/_internal/Slider2.js.map +0 -1
  238. package/esm/_internal/Slides.js +0 -864
  239. package/esm/_internal/Slides.js.map +0 -1
  240. package/esm/_internal/Switch2.js +0 -116
  241. package/esm/_internal/Switch2.js.map +0 -1
  242. package/esm/_internal/TabPanel.js +0 -280
  243. package/esm/_internal/TabPanel.js.map +0 -1
  244. package/esm/_internal/TableRow.js +0 -291
  245. package/esm/_internal/TableRow.js.map +0 -1
  246. package/esm/_internal/Text2.js +0 -63
  247. package/esm/_internal/Text2.js.map +0 -1
  248. package/esm/_internal/TextField.js +0 -322
  249. package/esm/_internal/TextField.js.map +0 -1
  250. package/esm/_internal/Thumbnail2.js +0 -301
  251. package/esm/_internal/Thumbnail2.js.map +0 -1
  252. package/esm/_internal/Toolbar2.js +0 -60
  253. package/esm/_internal/Toolbar2.js.map +0 -1
  254. package/esm/_internal/Tooltip2.js +0 -282
  255. package/esm/_internal/Tooltip2.js.map +0 -1
  256. package/esm/_internal/Uploader2.js +0 -84
  257. package/esm/_internal/Uploader2.js.map +0 -1
  258. package/esm/_internal/UserBlock.js +0 -132
  259. package/esm/_internal/UserBlock.js.map +0 -1
  260. package/esm/_internal/_rollupPluginBabelHelpers.js.map +0 -1
  261. package/esm/_internal/alert-dialog.js +0 -34
  262. package/esm/_internal/alert-dialog.js.map +0 -1
  263. package/esm/_internal/autocomplete.js +0 -32
  264. package/esm/_internal/autocomplete.js.map +0 -1
  265. package/esm/_internal/avatar.js +0 -13
  266. package/esm/_internal/avatar.js.map +0 -1
  267. package/esm/_internal/badge.js +0 -10
  268. package/esm/_internal/badge.js.map +0 -1
  269. package/esm/_internal/button.js +0 -25
  270. package/esm/_internal/button.js.map +0 -1
  271. package/esm/_internal/checkbox.js +0 -14
  272. package/esm/_internal/checkbox.js.map +0 -1
  273. package/esm/_internal/chip.js +0 -12
  274. package/esm/_internal/chip.js.map +0 -1
  275. package/esm/_internal/comment-block.js +0 -24
  276. package/esm/_internal/comment-block.js.map +0 -1
  277. package/esm/_internal/components.js +0 -156
  278. package/esm/_internal/components.js.map +0 -1
  279. package/esm/_internal/constants.js +0 -13
  280. package/esm/_internal/constants.js.map +0 -1
  281. package/esm/_internal/date-picker.js +0 -32
  282. package/esm/_internal/date-picker.js.map +0 -1
  283. package/esm/_internal/dialog.js +0 -27
  284. package/esm/_internal/dialog.js.map +0 -1
  285. package/esm/_internal/divider.js +0 -10
  286. package/esm/_internal/divider.js.map +0 -1
  287. package/esm/_internal/drag-handle.js +0 -11
  288. package/esm/_internal/drag-handle.js.map +0 -1
  289. package/esm/_internal/dropdown.js +0 -21
  290. package/esm/_internal/dropdown.js.map +0 -1
  291. package/esm/_internal/expansion-panel.js +0 -32
  292. package/esm/_internal/expansion-panel.js.map +0 -1
  293. package/esm/_internal/flag.js +0 -11
  294. package/esm/_internal/flag.js.map +0 -1
  295. package/esm/_internal/flex-box.js +0 -11
  296. package/esm/_internal/flex-box.js.map +0 -1
  297. package/esm/_internal/generic-block.js +0 -20
  298. package/esm/_internal/generic-block.js.map +0 -1
  299. package/esm/_internal/getRootClassName.js +0 -346
  300. package/esm/_internal/getRootClassName.js.map +0 -1
  301. package/esm/_internal/grid.js +0 -10
  302. package/esm/_internal/grid.js.map +0 -1
  303. package/esm/_internal/heading.js +0 -11
  304. package/esm/_internal/heading.js.map +0 -1
  305. package/esm/_internal/icon.js +0 -10
  306. package/esm/_internal/icon.js.map +0 -1
  307. package/esm/_internal/image-block.js +0 -14
  308. package/esm/_internal/image-block.js.map +0 -1
  309. package/esm/_internal/input-helper.js +0 -10
  310. package/esm/_internal/input-helper.js.map +0 -1
  311. package/esm/_internal/input-label.js +0 -10
  312. package/esm/_internal/input-label.js.map +0 -1
  313. package/esm/_internal/lightbox.js +0 -27
  314. package/esm/_internal/lightbox.js.map +0 -1
  315. package/esm/_internal/link-preview.js +0 -15
  316. package/esm/_internal/link-preview.js.map +0 -1
  317. package/esm/_internal/link.js +0 -12
  318. package/esm/_internal/link.js.map +0 -1
  319. package/esm/_internal/list.js +0 -15
  320. package/esm/_internal/list.js.map +0 -1
  321. package/esm/_internal/mergeRefs.js +0 -25
  322. package/esm/_internal/mergeRefs.js.map +0 -1
  323. package/esm/_internal/message.js +0 -11
  324. package/esm/_internal/message.js.map +0 -1
  325. package/esm/_internal/mosaic.js +0 -14
  326. package/esm/_internal/mosaic.js.map +0 -1
  327. package/esm/_internal/notification.js +0 -18
  328. package/esm/_internal/notification.js.map +0 -1
  329. package/esm/_internal/partitionMulti.js +0 -27
  330. package/esm/_internal/partitionMulti.js.map +0 -1
  331. package/esm/_internal/popover.js +0 -15
  332. package/esm/_internal/popover.js.map +0 -1
  333. package/esm/_internal/post-block.js +0 -15
  334. package/esm/_internal/post-block.js.map +0 -1
  335. package/esm/_internal/progress-tracker.js +0 -17
  336. package/esm/_internal/progress-tracker.js.map +0 -1
  337. package/esm/_internal/progress.js +0 -10
  338. package/esm/_internal/progress.js.map +0 -1
  339. package/esm/_internal/radio-button.js +0 -13
  340. package/esm/_internal/radio-button.js.map +0 -1
  341. package/esm/_internal/renderLink.js +0 -25
  342. package/esm/_internal/renderLink.js.map +0 -1
  343. package/esm/_internal/select.js +0 -31
  344. package/esm/_internal/select.js.map +0 -1
  345. package/esm/_internal/side-navigation.js +0 -25
  346. package/esm/_internal/side-navigation.js.map +0 -1
  347. package/esm/_internal/skeleton.js +0 -10
  348. package/esm/_internal/skeleton.js.map +0 -1
  349. package/esm/_internal/slider.js +0 -13
  350. package/esm/_internal/slider.js.map +0 -1
  351. package/esm/_internal/slideshow.js +0 -29
  352. package/esm/_internal/slideshow.js.map +0 -1
  353. package/esm/_internal/state.js +0 -145
  354. package/esm/_internal/state.js.map +0 -1
  355. package/esm/_internal/switch.js +0 -13
  356. package/esm/_internal/switch.js.map +0 -1
  357. package/esm/_internal/table.js +0 -12
  358. package/esm/_internal/table.js.map +0 -1
  359. package/esm/_internal/tabs.js +0 -15
  360. package/esm/_internal/tabs.js.map +0 -1
  361. package/esm/_internal/text-field.js +0 -26
  362. package/esm/_internal/text-field.js.map +0 -1
  363. package/esm/_internal/text.js +0 -10
  364. package/esm/_internal/text.js.map +0 -1
  365. package/esm/_internal/thumbnail.js +0 -13
  366. package/esm/_internal/thumbnail.js.map +0 -1
  367. package/esm/_internal/toolbar.js +0 -9
  368. package/esm/_internal/toolbar.js.map +0 -1
  369. package/esm/_internal/tooltip.js +0 -18
  370. package/esm/_internal/tooltip.js.map +0 -1
  371. package/esm/_internal/type.js +0 -40
  372. package/esm/_internal/type.js.map +0 -1
  373. package/esm/_internal/types.js +0 -23
  374. package/esm/_internal/types.js.map +0 -1
  375. package/esm/_internal/uploader.js +0 -11
  376. package/esm/_internal/uploader.js.map +0 -1
  377. package/esm/_internal/useDelayedVisibility.js +0 -47
  378. package/esm/_internal/useDelayedVisibility.js.map +0 -1
  379. package/esm/_internal/useDisableBodyScroll.js +0 -220
  380. package/esm/_internal/useDisableBodyScroll.js.map +0 -1
  381. package/esm/_internal/useFocusTrap.js +0 -86
  382. package/esm/_internal/useFocusTrap.js.map +0 -1
  383. package/esm/_internal/useRovingTabIndex.js +0 -87
  384. package/esm/_internal/useRovingTabIndex.js.map +0 -1
  385. package/esm/_internal/user-block.js +0 -17
  386. package/esm/_internal/user-block.js.map +0 -1
  387. package/esm/index.js +0 -95
  388. package/esm/index.js.map +0 -1
  389. package/esm/index2.js +0 -16
  390. package/esm/index2.js.map +0 -1
  391. package/src/utils/index.tsx +0 -7
@@ -1 +0,0 @@
1
- {"version":3,"file":"Thumbnail2.js","sources":["../../../src/components/thumbnail/useImageLoad.ts","../../../src/components/thumbnail/useFocusPointStyle.tsx","../../../src/components/thumbnail/Thumbnail.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type LoadingState = 'isLoading' | 'isLoaded' | 'hasError';\n\nfunction getState(img: HTMLImageElement | null | undefined, event?: Event) {\n // Error event occurred or image loaded empty.\n if (event?.type === 'error' || (img?.complete && (img?.naturalWidth === 0 || img?.naturalHeight === 0))) {\n return 'hasError';\n }\n // Image is undefined or incomplete.\n if (!img || !img.complete) {\n return 'isLoading';\n }\n // Else loaded.\n return 'isLoaded';\n}\n\nexport function useImageLoad(imageURL: string, imgRef?: HTMLImageElement): LoadingState {\n const [state, setState] = useState<LoadingState>(getState(imgRef));\n\n // Update state when changing image URL or DOM reference.\n useEffect(() => {\n setState(getState(imgRef));\n }, [imageURL, imgRef]);\n\n // Listen to `load` and `error` event on image\n useEffect(() => {\n const img = imgRef;\n if (!img) return undefined;\n const update = (event?: Event) => setState(getState(img, event));\n img.addEventListener('load', update);\n img.addEventListener('error', update);\n return () => {\n img.removeEventListener('load', update);\n img.removeEventListener('error', update);\n };\n }, [imgRef, imgRef?.src]);\n\n return state;\n}\n","import { CSSProperties, useEffect, useMemo, useState } from 'react';\nimport { AspectRatio } from '@lumx/react/components';\nimport { ThumbnailProps } from '@lumx/react/components/thumbnail/Thumbnail';\n\n// Calculate shift to center the focus point in the container.\nexport function shiftPosition({\n scale,\n focusPoint,\n imageSize,\n containerSize,\n}: {\n scale: number;\n focusPoint: number;\n imageSize: number;\n containerSize: number;\n}) {\n const scaledSize = imageSize / scale;\n if (scaledSize === containerSize) return 0;\n\n const scaledFocusHeight = focusPoint * scaledSize;\n const startFocus = scaledFocusHeight - containerSize / 2;\n const shift = startFocus / (scaledSize - containerSize);\n\n return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);\n}\n\ntype Size = { width: number; height: number };\n\n// Compute CSS properties to apply the focus point.\nexport const useFocusPointStyle = (\n { image, aspectRatio, focusPoint, imgProps: { width, height } = {} }: ThumbnailProps,\n element: HTMLImageElement | undefined,\n isLoaded: boolean,\n): CSSProperties => {\n // Get natural image size from imgProps or img element.\n const imageSize: Size | undefined = useMemo(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) return undefined;\n if (typeof width === 'number' && typeof height === 'number') return { width, height };\n if (element && isLoaded) return { width: element.naturalWidth, height: element.naturalHeight };\n return undefined;\n }, [aspectRatio, element, focusPoint?.x, focusPoint?.y, height, image, isLoaded, width]);\n\n // Get container size (dependant on imageSize).\n const [containerSize, setContainerSize] = useState<Size | undefined>(undefined);\n useEffect(\n function updateContainerSize() {\n const cWidth = element?.offsetWidth;\n const cHeight = element?.offsetHeight;\n if (cWidth && cHeight) {\n // Update only if needed.\n setContainerSize((oldContainerSize) =>\n oldContainerSize?.width === cWidth && oldContainerSize.height === cHeight\n ? oldContainerSize\n : { width: cWidth, height: cHeight },\n );\n } else if (imageSize) {\n // Wait for a render (in case the container size is dependent on the image size).\n requestAnimationFrame(updateContainerSize);\n }\n },\n [element?.offsetHeight, element?.offsetWidth, imageSize],\n );\n\n // Compute style.\n const [style, setStyle] = useState<CSSProperties>({});\n useEffect(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) {\n return;\n }\n if (!element || !imageSize) {\n // Focus point can be computed but now right now (image size unknown).\n setStyle({ visibility: 'hidden' });\n return;\n }\n if (!containerSize) {\n // Missing container size abort focus point compute.\n setStyle({});\n return;\n }\n\n const heightScale = imageSize.height / containerSize.height;\n const widthScale = imageSize.width / containerSize.width;\n const scale = Math.min(widthScale, heightScale);\n\n // Focus Y relative to the top (instead of the center)\n const focusPointFromTop = Math.abs((focusPoint?.y || 0) - 1) / 2;\n const y = shiftPosition({\n scale,\n focusPoint: focusPointFromTop,\n imageSize: imageSize.height,\n containerSize: containerSize.height,\n });\n\n // Focus X relative to the left (instead of the center)\n const focusPointFromLeft = Math.abs((focusPoint?.x || 0) + 1) / 2;\n const x = shiftPosition({\n scale,\n focusPoint: focusPointFromLeft,\n imageSize: imageSize.width,\n containerSize: containerSize.width,\n });\n\n const objectPosition = `${x}% ${y}%`;\n // Update only if needed.\n setStyle((oldStyle) => (oldStyle.objectPosition === objectPosition ? oldStyle : { objectPosition }));\n }, [aspectRatio, containerSize, element, focusPoint?.x, focusPoint?.y, image, imageSize]);\n\n return style;\n};\n","import React, {\n CSSProperties,\n forwardRef,\n ImgHTMLAttributes,\n KeyboardEventHandler,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n Ref,\n useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { AspectRatio, HorizontalAlignment, Icon, Size, Theme } from '@lumx/react';\n\nimport { Comp, Falsy, GenericProps, getRootClassName, handleBasicClasses, HasTheme } from '@lumx/react/utils';\n\nimport { mdiImageBroken } from '@lumx/icons';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport { useImageLoad } from '@lumx/react/components/thumbnail/useImageLoad';\nimport { useFocusPointStyle } from '@lumx/react/components/thumbnail/useFocusPointStyle';\nimport { FocusPoint, ThumbnailSize, ThumbnailVariant } from './types';\n\ntype ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ThumbnailProps extends GenericProps, HasTheme {\n /** Alignment of the thumbnail in it's parent (requires flex parent). */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Image aspect ratio. */\n aspectRatio?: AspectRatio;\n /** Badge. */\n badge?: ReactElement | Falsy;\n /** Image cross origin resource policy. */\n crossOrigin?: ImgHTMLProps['crossOrigin'];\n /** Fallback icon (SVG path) or react node when image fails to load. */\n fallback?: string | ReactNode;\n /** Whether the thumbnail should fill it's parent size (requires flex parent) or not. */\n fillHeight?: boolean;\n /** Apply relative vertical and horizontal shift (from -1 to 1) on the image position inside the thumbnail. */\n focusPoint?: FocusPoint;\n /** Image URL. */\n image: string;\n /** Props to inject into the native <img> element. */\n imgProps?: ImgHTMLProps;\n /** Reference to the native <img> element. */\n imgRef?: Ref<HTMLImageElement>;\n /** Set to true to force the display of the loading skeleton. */\n isLoading?: boolean;\n /** Size variant of the component. */\n size?: ThumbnailSize;\n /** Image loading mode. */\n loading?: ImgHTMLProps['loading'];\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Variant of the component. */\n variant?: ThumbnailVariant;\n /** Props to pass to the link wrapping the thumbnail. */\n linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Thumbnail';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ThumbnailProps> = {\n fallback: mdiImageBroken,\n loading: 'lazy',\n theme: Theme.light,\n};\n\n/**\n * Thumbnail component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Thumbnail: Comp<ThumbnailProps> = forwardRef((props, ref) => {\n const {\n align,\n alt,\n aspectRatio = AspectRatio.original,\n badge,\n className,\n crossOrigin,\n fallback,\n fillHeight,\n // `focusPoint` needs to be here to remove it from `forwardedProps`.\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n focusPoint,\n image,\n imgProps,\n imgRef: propImgRef,\n isLoading: isLoadingProp,\n loading,\n size,\n theme,\n variant,\n linkProps,\n linkAs,\n ...forwardedProps\n } = props;\n const [imgElement, setImgElement] = useState<HTMLImageElement>();\n\n // Image loading state.\n const loadingState = useImageLoad(image, imgElement);\n const isLoaded = loadingState === 'isLoaded';\n const isLoading = isLoadingProp || loadingState === 'isLoading';\n const hasError = loadingState === 'hasError';\n\n // Focus point.\n const focusPointStyle = useFocusPointStyle(props, imgElement, isLoaded);\n\n const hasIconErrorFallback = hasError && typeof fallback === 'string';\n const hasCustomErrorFallback = hasError && !hasIconErrorFallback;\n const imageErrorStyle: CSSProperties = {};\n if (hasIconErrorFallback) {\n // Keep the image layout on icon fallback.\n imageErrorStyle.visibility = 'hidden';\n } else if (hasCustomErrorFallback) {\n // Remove the image on custom fallback.\n imageErrorStyle.display = 'none';\n }\n\n const isLink = Boolean(linkProps?.href || linkAs);\n const isButton = !!forwardedProps.onClick;\n const isClickable = isButton || isLink;\n\n let Wrapper: any = 'div';\n const wrapperProps = { ...forwardedProps };\n if (isLink) {\n Wrapper = linkAs || 'a';\n Object.assign(wrapperProps, linkProps);\n } else if (isButton) {\n Wrapper = 'button';\n wrapperProps.type = forwardedProps.type || 'button';\n wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;\n }\n\n return (\n <Wrapper\n {...wrapperProps}\n ref={ref}\n className={classNames(\n linkProps?.className,\n className,\n handleBasicClasses({\n align,\n aspectRatio,\n prefix: CLASSNAME,\n size,\n theme,\n variant,\n isClickable,\n hasError,\n hasIconErrorFallback,\n hasCustomErrorFallback,\n isLoading,\n hasBadge: !!badge,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <div className={`${CLASSNAME}__background`}>\n <img\n {...imgProps}\n style={{\n ...imgProps?.style,\n ...imageErrorStyle,\n ...focusPointStyle,\n }}\n ref={mergeRefs(setImgElement, propImgRef)}\n className={classNames(\n handleBasicClasses({\n prefix: `${CLASSNAME}__image`,\n isLoading,\n hasDefinedSize: Boolean(imgProps?.height && imgProps.width),\n }),\n imgProps?.className,\n )}\n crossOrigin={crossOrigin}\n src={image}\n alt={alt}\n loading={loading}\n />\n {!isLoading && hasError && (\n <div className={`${CLASSNAME}__fallback`}>\n {hasIconErrorFallback ? (\n <Icon icon={fallback as string} size={Size.xxs} theme={theme} />\n ) : (\n fallback\n )}\n </div>\n )}\n </div>\n {badge &&\n React.cloneElement(badge, { className: classNames(`${CLASSNAME}__badge`, badge.props.className) })}\n </Wrapper>\n );\n});\nThumbnail.displayName = COMPONENT_NAME;\nThumbnail.className = CLASSNAME;\nThumbnail.defaultProps = DEFAULT_PROPS;\n"],"names":["getState","img","event","type","complete","naturalWidth","naturalHeight","useImageLoad","imageURL","imgRef","useState","state","setState","useEffect","undefined","update","addEventListener","removeEventListener","src","shiftPosition","scale","focusPoint","imageSize","containerSize","scaledSize","scaledFocusHeight","startFocus","shift","Math","floor","max","min","useFocusPointStyle","element","isLoaded","image","aspectRatio","imgProps","width","height","useMemo","AspectRatio","original","x","y","setContainerSize","updateContainerSize","cWidth","offsetWidth","cHeight","offsetHeight","oldContainerSize","requestAnimationFrame","style","setStyle","visibility","heightScale","widthScale","focusPointFromTop","abs","focusPointFromLeft","objectPosition","oldStyle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","fallback","mdiImageBroken","loading","theme","Theme","light","Thumbnail","forwardRef","props","ref","align","alt","badge","className","crossOrigin","fillHeight","propImgRef","isLoadingProp","isLoading","size","variant","linkProps","linkAs","forwardedProps","imgElement","setImgElement","loadingState","hasError","focusPointStyle","hasIconErrorFallback","hasCustomErrorFallback","imageErrorStyle","display","isLink","Boolean","href","isButton","onClick","isClickable","Wrapper","wrapperProps","Object","assign","classNames","handleBasicClasses","prefix","hasBadge","mergeRefs","hasDefinedSize","Size","xxs","React","cloneElement","displayName","defaultProps"],"mappings":"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"}
@@ -1,60 +0,0 @@
1
- import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
2
- import React, { forwardRef } from 'react';
3
- import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
4
-
5
- /**
6
- * Defines the props of the component.
7
- */
8
-
9
- /**
10
- * Component display name.
11
- */
12
- var COMPONENT_NAME = 'Toolbar';
13
- /**
14
- * Component default class name and class prefix.
15
- */
16
-
17
- var CLASSNAME = getRootClassName(COMPONENT_NAME);
18
- /**
19
- * Component default props.
20
- */
21
-
22
- var DEFAULT_PROPS = {};
23
- /**
24
- * Toolbar component.
25
- *
26
- * @param props Component props.
27
- * @param ref Component ref.
28
- * @return React element.
29
- */
30
-
31
- var Toolbar = forwardRef(function (props, ref) {
32
- var after = props.after,
33
- before = props.before,
34
- className = props.className,
35
- label = props.label,
36
- forwardedProps = _objectWithoutProperties(props, ["after", "before", "className", "label"]);
37
-
38
- return React.createElement("div", _extends({
39
- ref: ref
40
- }, forwardedProps, {
41
- className: classnames(className, handleBasicClasses({
42
- hasAfter: Boolean(after),
43
- hasBefore: Boolean(before),
44
- hasLabel: Boolean(label),
45
- prefix: CLASSNAME
46
- }))
47
- }), before && React.createElement("div", {
48
- className: "".concat(CLASSNAME, "__before")
49
- }, before), label && React.createElement("div", {
50
- className: "".concat(CLASSNAME, "__label")
51
- }, label), after && React.createElement("div", {
52
- className: "".concat(CLASSNAME, "__after")
53
- }, after));
54
- });
55
- Toolbar.displayName = COMPONENT_NAME;
56
- Toolbar.className = CLASSNAME;
57
- Toolbar.defaultProps = DEFAULT_PROPS;
58
-
59
- export { Toolbar as T };
60
- //# sourceMappingURL=Toolbar2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Toolbar2.js","sources":["../../../src/components/toolbar/Toolbar.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface ToolbarProps extends GenericProps {\n /** After content (placed after the label). */\n after?: ReactNode;\n /** Before content (placed before the label). */\n before?: ReactNode;\n /** Label content. */\n label?: ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Toolbar';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ToolbarProps> = {};\n\n/**\n * Toolbar component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Toolbar: Comp<ToolbarProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { after, before, className, label, ...forwardedProps } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n hasAfter: Boolean(after),\n hasBefore: Boolean(before),\n hasLabel: Boolean(label),\n prefix: CLASSNAME,\n }),\n )}\n >\n {before && <div className={`${CLASSNAME}__before`}>{before}</div>}\n {label && <div className={`${CLASSNAME}__label`}>{label}</div>}\n {after && <div className={`${CLASSNAME}__after`}>{after}</div>}\n </div>\n );\n});\nToolbar.displayName = COMPONENT_NAME;\nToolbar.className = CLASSNAME;\nToolbar.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Toolbar","forwardRef","props","ref","after","before","className","label","forwardedProps","classNames","handleBasicClasses","hasAfter","Boolean","hasBefore","hasLabel","prefix","displayName","defaultProps"],"mappings":";;;;AAMA;;;;AAYA;;;AAGA,IAAMA,cAAc,GAAG,SAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAoC,GAAG,EAA7C;AAEA;;;;;;;;IAOaC,OAA2C,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAC1EC,KAD0E,GACnBF,KADmB,CAC1EE,KAD0E;AAAA,MACnEC,MADmE,GACnBH,KADmB,CACnEG,MADmE;AAAA,MAC3DC,SAD2D,GACnBJ,KADmB,CAC3DI,SAD2D;AAAA,MAChDC,KADgD,GACnBL,KADmB,CAChDK,KADgD;AAAA,MACtCC,cADsC,4BACnBN,KADmB;;AAGlF,SACI;AACI,IAAA,GAAG,EAAEC;AADT,KAEQK,cAFR;AAGI,IAAA,SAAS,EAAEC,UAAU,CACjBH,SADiB,EAEjBI,kBAAkB,CAAC;AACfC,MAAAA,QAAQ,EAAEC,OAAO,CAACR,KAAD,CADF;AAEfS,MAAAA,SAAS,EAAED,OAAO,CAACP,MAAD,CAFH;AAGfS,MAAAA,QAAQ,EAAEF,OAAO,CAACL,KAAD,CAHF;AAIfQ,MAAAA,MAAM,EAAElB;AAJO,KAAD,CAFD;AAHzB,MAaKQ,MAAM,IAAI;AAAK,IAAA,SAAS,YAAKR,SAAL;AAAd,KAAyCQ,MAAzC,CAbf,EAcKE,KAAK,IAAI;AAAK,IAAA,SAAS,YAAKV,SAAL;AAAd,KAAwCU,KAAxC,CAdd,EAeKH,KAAK,IAAI;AAAK,IAAA,SAAS,YAAKP,SAAL;AAAd,KAAwCO,KAAxC,CAfd,CADJ;AAmBH,CAtBoE;AAuBrEJ,OAAO,CAACgB,WAAR,GAAsBpB,cAAtB;AACAI,OAAO,CAACM,SAAR,GAAoBT,SAApB;AACAG,OAAO,CAACiB,YAAR,GAAuBlB,aAAvB;;;;"}
@@ -1,282 +0,0 @@
1
- import { _ as _objectSpread2, c as _extends, d as _slicedToArray, b as _objectWithoutProperties } from './_rollupPluginBabelHelpers.js';
2
- import React, { useMemo, cloneElement, useState, useEffect, forwardRef } from 'react';
3
- import { f as onEscapePressed, T as TOOLTIP_LONG_PRESS_DELAY, i as TOOLTIP_HOVER_DELAY, g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
4
- import { u as uid } from '../index2.js';
5
- import { D as DOCUMENT } from './constants.js';
6
- import get from 'lodash/get';
7
- import { c as usePopper, P as Placement } from './Popover2.js';
8
- import { m as mergeRefs } from './mergeRefs.js';
9
- import { createPortal } from 'react-dom';
10
-
11
- /**
12
- * Add ref and ARIA attribute(s) in tooltip children or wrapped children.
13
- * Button, IconButton, Icon and React HTML elements don't need to be wrapped but any other kind of children (array, fragment, custom components)
14
- * will be wrapped in a <span>.
15
- *
16
- * @param children Original tooltip anchor.
17
- * @param setAnchorElement Set tooltip anchor element.
18
- * @param isOpen Whether the tooltip is open or not.
19
- * @param id Tooltip id.
20
- * @return tooltip anchor.
21
- */
22
-
23
- var useInjectTooltipRef = function useInjectTooltipRef(children, setAnchorElement, isOpen, id) {
24
- return useMemo(function () {
25
- var ariaProps = {
26
- 'aria-describedby': isOpen ? id : undefined
27
- };
28
-
29
- if (children && get(children, '$$typeof') && get(children, 'props.disabled') !== true && get(children, 'props.isDisabled') !== true) {
30
- var element = children;
31
- return cloneElement(element, _objectSpread2({}, element.props, {}, ariaProps, {
32
- ref: mergeRefs(element.ref, setAnchorElement)
33
- }));
34
- }
35
-
36
- return React.createElement("div", _extends({
37
- className: "lumx-tooltip-anchor-wrapper",
38
- ref: setAnchorElement
39
- }, ariaProps), children);
40
- }, [isOpen, id, children, setAnchorElement]);
41
- };
42
-
43
- /** Return true if the browser does not support pointer hover */
44
- var browserDoesNotSupportHover = function browserDoesNotSupportHover() {
45
- var _window$matchMedia, _window;
46
-
47
- return !!((_window$matchMedia = (_window = window).matchMedia) === null || _window$matchMedia === void 0 ? void 0 : _window$matchMedia.call(_window, '(hover: none)').matches);
48
- };
49
-
50
- /**
51
- * Hook controlling tooltip visibility using mouse hover the anchor and delay.
52
- *
53
- * @param delay Delay in millisecond to display the tooltip.
54
- * @param anchorElement Tooltip anchor element.
55
- * @return whether or not to show the tooltip.
56
- */
57
-
58
- function useTooltipOpen(delay, anchorElement) {
59
- var _useState = useState(false),
60
- _useState2 = _slicedToArray(_useState, 2),
61
- isOpen = _useState2[0],
62
- setIsOpen = _useState2[1];
63
-
64
- useEffect(function () {
65
- if (!anchorElement) {
66
- return undefined;
67
- }
68
-
69
- var timer;
70
- var openStartTime;
71
- var shouldOpen; // Run timer to defer updating the isOpen state.
72
-
73
- var deferUpdate = function deferUpdate(duration) {
74
- if (timer) clearTimeout(timer);
75
- timer = setTimeout(function () {
76
- setIsOpen(!!shouldOpen);
77
- }, duration);
78
- };
79
-
80
- var hoverNotSupported = browserDoesNotSupportHover();
81
- var hasTouch = 'ontouchstart' in window; // Adapt open/close delay
82
-
83
- var openDelay = delay || (hoverNotSupported ? TOOLTIP_LONG_PRESS_DELAY.open : TOOLTIP_HOVER_DELAY.open);
84
- var closeDelay = hoverNotSupported ? TOOLTIP_LONG_PRESS_DELAY.close : TOOLTIP_HOVER_DELAY.close; // Open (or/and cancel closing) of tooltip.
85
-
86
- var open = function open() {
87
- if (shouldOpen && !timer) return;
88
- shouldOpen = true;
89
- openStartTime = Date.now();
90
- deferUpdate(openDelay);
91
- }; // Close or cancel opening of tooltip
92
-
93
-
94
- var close = function close() {
95
- var overrideDelay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : closeDelay;
96
- if (!shouldOpen && !timer) return;
97
- shouldOpen = false;
98
- deferUpdate(overrideDelay);
99
- };
100
-
101
- var closeImmediately = function closeImmediately() {
102
- return close(0);
103
- };
104
- /**
105
- * Handle touchend event
106
- * If `touchend` comes before the open delay => cancel tooltip (close immediate).
107
- * Else if `touchend` comes after the open delay => tooltip takes priority, the anchor's default touch end event is prevented.
108
- */
109
-
110
-
111
- var touchEnd = function touchEnd(evt) {
112
- if (!openStartTime) return;
113
-
114
- if (Date.now() - openStartTime >= openDelay) {
115
- // Tooltip take priority, event prevented.
116
- evt.stopPropagation();
117
- evt.preventDefault();
118
- anchorElement.focus(); // Close with delay.
119
-
120
- close();
121
- } else {
122
- // Close immediately.
123
- closeImmediately();
124
- }
125
- }; // Adapt event to browsers with or without `hover` support.
126
-
127
-
128
- var events = hoverNotSupported ? [[anchorElement, hasTouch ? 'touchstart' : 'mousedown', open], [anchorElement, hasTouch ? 'touchend' : 'mouseup', touchEnd]] : [[anchorElement, 'mouseenter', open], [anchorElement, 'mouseleave', close], [anchorElement, 'mouseup', closeImmediately]]; // Events always applied no matter the browser:.
129
-
130
- events.push( // Open on focus.
131
- [anchorElement, 'focusin', open], // Close on lost focus.
132
- [anchorElement, 'focusout', closeImmediately], // Close on ESC keydown
133
- [anchorElement, 'keydown', onEscapePressed(closeImmediately)]); // Attach events
134
-
135
- for (var _i = 0, _events = events; _i < _events.length; _i++) {
136
- var _events$_i = _slicedToArray(_events[_i], 3),
137
- node = _events$_i[0],
138
- eventType = _events$_i[1],
139
- eventHandler = _events$_i[2];
140
-
141
- node.addEventListener(eventType, eventHandler);
142
- }
143
-
144
- return function () {
145
- // Clear pending timers.
146
- if (timer) clearTimeout(timer); // Detach events.
147
-
148
- var _iteratorNormalCompletion = true;
149
- var _didIteratorError = false;
150
- var _iteratorError = undefined;
151
-
152
- try {
153
- for (var _iterator = events[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
154
- var _step$value = _slicedToArray(_step.value, 3),
155
- node = _step$value[0],
156
- eventType = _step$value[1],
157
- eventHandler = _step$value[2];
158
-
159
- node.removeEventListener(eventType, eventHandler);
160
- }
161
- } catch (err) {
162
- _didIteratorError = true;
163
- _iteratorError = err;
164
- } finally {
165
- try {
166
- if (!_iteratorNormalCompletion && _iterator.return != null) {
167
- _iterator.return();
168
- }
169
- } finally {
170
- if (_didIteratorError) {
171
- throw _iteratorError;
172
- }
173
- }
174
- }
175
- };
176
- }, [anchorElement, delay]);
177
- return isOpen;
178
- }
179
-
180
- /** Position of the tooltip relative to the anchor element. */
181
-
182
- /**
183
- * Component display name.
184
- */
185
- var COMPONENT_NAME = 'Tooltip';
186
- /**
187
- * Component default class name and class prefix.
188
- */
189
-
190
- var CLASSNAME = getRootClassName(COMPONENT_NAME);
191
- /**
192
- * Component default props.
193
- */
194
-
195
- var DEFAULT_PROPS = {
196
- placement: Placement.BOTTOM
197
- };
198
- /**
199
- * Arrow size (in pixel).
200
- */
201
-
202
- var ARROW_SIZE = 8;
203
- /**
204
- * Tooltip component.
205
- *
206
- * @param props Component props.
207
- * @param ref Component ref.
208
- * @return React element.
209
- */
210
-
211
- var Tooltip = forwardRef(function (props, ref) {
212
- var _ref, _attributes$popper;
213
-
214
- var label = props.label,
215
- children = props.children,
216
- className = props.className,
217
- delay = props.delay,
218
- placement = props.placement,
219
- forceOpen = props.forceOpen,
220
- forwardedProps = _objectWithoutProperties(props, ["label", "children", "className", "delay", "placement", "forceOpen"]); // Disable in SSR or without a label.
221
-
222
-
223
- if (!DOCUMENT || !label) {
224
- return React.createElement(React.Fragment, null, children);
225
- }
226
-
227
- var id = useMemo(function () {
228
- return "tooltip-".concat(uid());
229
- }, []);
230
-
231
- var _useState = useState(null),
232
- _useState2 = _slicedToArray(_useState, 2),
233
- popperElement = _useState2[0],
234
- setPopperElement = _useState2[1];
235
-
236
- var _useState3 = useState(null),
237
- _useState4 = _slicedToArray(_useState3, 2),
238
- anchorElement = _useState4[0],
239
- setAnchorElement = _useState4[1];
240
-
241
- var _usePopper = usePopper(anchorElement, popperElement, {
242
- placement: placement,
243
- modifiers: [{
244
- name: 'offset',
245
- options: {
246
- offset: [0, ARROW_SIZE]
247
- }
248
- }]
249
- }),
250
- styles = _usePopper.styles,
251
- attributes = _usePopper.attributes;
252
-
253
- var position = (_ref = attributes === null || attributes === void 0 ? void 0 : (_attributes$popper = attributes.popper) === null || _attributes$popper === void 0 ? void 0 : _attributes$popper['data-popper-placement']) !== null && _ref !== void 0 ? _ref : placement;
254
- var isOpen = useTooltipOpen(delay, anchorElement) || forceOpen;
255
- var wrappedChildren = useInjectTooltipRef(children, setAnchorElement, isOpen, id);
256
- return React.createElement(React.Fragment, null, wrappedChildren, isOpen && createPortal(React.createElement("div", _extends({
257
- ref: mergeRefs(ref, setPopperElement)
258
- }, forwardedProps, {
259
- id: id,
260
- role: "tooltip",
261
- "aria-label": label,
262
- className: classnames(className, handleBasicClasses({
263
- prefix: CLASSNAME,
264
- position: position
265
- })),
266
- style: styles.popper
267
- }, attributes.popper), React.createElement("div", {
268
- className: "".concat(CLASSNAME, "__arrow")
269
- }), React.createElement("div", {
270
- className: "".concat(CLASSNAME, "__inner")
271
- }, label.indexOf('\n') !== -1 ? label.split('\n').map(function (sentence) {
272
- return React.createElement("p", {
273
- key: sentence
274
- }, sentence);
275
- }) : label)), document.body));
276
- });
277
- Tooltip.displayName = COMPONENT_NAME;
278
- Tooltip.className = CLASSNAME;
279
- Tooltip.defaultProps = DEFAULT_PROPS;
280
-
281
- export { Tooltip as T };
282
- //# sourceMappingURL=Tooltip2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tooltip2.js","sources":["../../../src/components/tooltip/useInjectTooltipRef.tsx","../../../src/utils/browserDoesNotSupportHover.ts","../../../src/components/tooltip/useTooltipOpen.tsx","../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport get from 'lodash/get';\nimport React, { cloneElement, ReactNode, useMemo } from 'react';\n\n/**\n * Add ref and ARIA attribute(s) in tooltip children or wrapped children.\n * Button, IconButton, Icon and React HTML elements don't need to be wrapped but any other kind of children (array, fragment, custom components)\n * will be wrapped in a <span>.\n *\n * @param children Original tooltip anchor.\n * @param setAnchorElement Set tooltip anchor element.\n * @param isOpen Whether the tooltip is open or not.\n * @param id Tooltip id.\n * @return tooltip anchor.\n */\nexport const useInjectTooltipRef = (\n children: ReactNode,\n setAnchorElement: (e: HTMLDivElement) => void,\n isOpen: boolean,\n id: string,\n): ReactNode => {\n return useMemo(() => {\n const ariaProps = { 'aria-describedby': isOpen ? id : undefined };\n if (\n children &&\n get(children, '$$typeof') &&\n get(children, 'props.disabled') !== true &&\n get(children, 'props.isDisabled') !== true\n ) {\n const element = children as any;\n\n return cloneElement(element, {\n ...element.props,\n ...ariaProps,\n ref: mergeRefs(element.ref, setAnchorElement),\n });\n }\n return (\n <div className=\"lumx-tooltip-anchor-wrapper\" ref={setAnchorElement} {...ariaProps}>\n {children}\n </div>\n );\n }, [isOpen, id, children, setAnchorElement]);\n};\n","/** Return true if the browser does not support pointer hover */\nexport const browserDoesNotSupportHover = (): boolean => !!window.matchMedia?.('(hover: none)').matches;\n","import { onEscapePressed } from '@lumx/react/utils';\nimport { useEffect, useState } from 'react';\nimport { browserDoesNotSupportHover } from '@lumx/react/utils/browserDoesNotSupportHover';\nimport { TOOLTIP_HOVER_DELAY, TOOLTIP_LONG_PRESS_DELAY } from '@lumx/react/constants';\n\n/**\n * Hook controlling tooltip visibility using mouse hover the anchor and delay.\n *\n * @param delay Delay in millisecond to display the tooltip.\n * @param anchorElement Tooltip anchor element.\n * @return whether or not to show the tooltip.\n */\nexport function useTooltipOpen(delay: number | undefined, anchorElement: HTMLElement | null): boolean {\n const [isOpen, setIsOpen] = useState(false);\n\n useEffect(() => {\n if (!anchorElement) {\n return undefined;\n }\n let timer: number | undefined;\n let openStartTime: number | undefined;\n let shouldOpen: boolean | undefined;\n\n // Run timer to defer updating the isOpen state.\n const deferUpdate = (duration: number) => {\n if (timer) clearTimeout(timer);\n timer = setTimeout(() => {\n setIsOpen(!!shouldOpen);\n }, duration) as any;\n };\n\n const hoverNotSupported = browserDoesNotSupportHover();\n const hasTouch = 'ontouchstart' in window;\n\n // Adapt open/close delay\n const openDelay = delay || (hoverNotSupported ? TOOLTIP_LONG_PRESS_DELAY.open : TOOLTIP_HOVER_DELAY.open);\n const closeDelay = hoverNotSupported ? TOOLTIP_LONG_PRESS_DELAY.close : TOOLTIP_HOVER_DELAY.close;\n\n // Open (or/and cancel closing) of tooltip.\n const open = () => {\n if (shouldOpen && !timer) return;\n shouldOpen = true;\n openStartTime = Date.now();\n deferUpdate(openDelay);\n };\n\n // Close or cancel opening of tooltip\n const close = (overrideDelay = closeDelay) => {\n if (!shouldOpen && !timer) return;\n shouldOpen = false;\n deferUpdate(overrideDelay);\n };\n const closeImmediately = () => close(0);\n\n /**\n * Handle touchend event\n * If `touchend` comes before the open delay => cancel tooltip (close immediate).\n * Else if `touchend` comes after the open delay => tooltip takes priority, the anchor's default touch end event is prevented.\n */\n const touchEnd = (evt: Event) => {\n if (!openStartTime) return;\n if (Date.now() - openStartTime >= openDelay) {\n // Tooltip take priority, event prevented.\n evt.stopPropagation();\n evt.preventDefault();\n anchorElement.focus();\n // Close with delay.\n close();\n } else {\n // Close immediately.\n closeImmediately();\n }\n };\n\n // Adapt event to browsers with or without `hover` support.\n const events: Array<[Node, Event['type'], any]> = hoverNotSupported\n ? [\n [anchorElement, hasTouch ? 'touchstart' : 'mousedown', open],\n [anchorElement, hasTouch ? 'touchend' : 'mouseup', touchEnd],\n ]\n : [\n [anchorElement, 'mouseenter', open],\n [anchorElement, 'mouseleave', close],\n [anchorElement, 'mouseup', closeImmediately],\n ];\n\n // Events always applied no matter the browser:.\n events.push(\n // Open on focus.\n [anchorElement, 'focusin', open],\n // Close on lost focus.\n [anchorElement, 'focusout', closeImmediately],\n // Close on ESC keydown\n [anchorElement, 'keydown', onEscapePressed(closeImmediately)],\n );\n\n // Attach events\n for (const [node, eventType, eventHandler] of events) {\n node.addEventListener(eventType, eventHandler);\n }\n return () => {\n // Clear pending timers.\n if (timer) clearTimeout(timer);\n\n // Detach events.\n for (const [node, eventType, eventHandler] of events) {\n node.removeEventListener(eventType, eventHandler);\n }\n };\n }, [anchorElement, delay]);\n\n return isOpen;\n}\n","/* eslint-disable react-hooks/rules-of-hooks */\nimport React, { forwardRef, ReactNode, useMemo, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { usePopper } from 'react-popper';\nimport { uid } from 'uid';\n\nimport classNames from 'classnames';\n\nimport { Placement } from '@lumx/react/components/popover/Popover';\n\nimport { DOCUMENT } from '@lumx/react/constants';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\nimport { useInjectTooltipRef } from './useInjectTooltipRef';\nimport { useTooltipOpen } from './useTooltipOpen';\n\n/** Position of the tooltip relative to the anchor element. */\nexport type TooltipPlacement = Extract<Placement, 'top' | 'right' | 'bottom' | 'left'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface TooltipProps extends GenericProps {\n /** Anchor (element on which we activate the tooltip). */\n children: ReactNode;\n /** Delay (in ms) before closing the tooltip. */\n delay?: number;\n /** Whether the tooltip is displayed even without the mouse hovering the anchor. */\n forceOpen?: boolean;\n /** Label text. */\n label?: string | null | false;\n /** Placement of the tooltip relative to the anchor. */\n placement?: TooltipPlacement;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Tooltip';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TooltipProps> = {\n placement: Placement.BOTTOM,\n};\n\n/**\n * Arrow size (in pixel).\n */\nconst ARROW_SIZE = 8;\n\n/**\n * Tooltip component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Tooltip: Comp<TooltipProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { label, children, className, delay, placement, forceOpen, ...forwardedProps } = props;\n // Disable in SSR or without a label.\n if (!DOCUMENT || !label) {\n return <>{children}</>;\n }\n\n const id = useMemo(() => `tooltip-${uid()}`, []);\n\n const [popperElement, setPopperElement] = useState<null | HTMLElement>(null);\n const [anchorElement, setAnchorElement] = useState<null | HTMLElement>(null);\n const { styles, attributes } = usePopper(anchorElement, popperElement, {\n placement,\n modifiers: [\n {\n name: 'offset',\n options: { offset: [0, ARROW_SIZE] },\n },\n ],\n });\n\n const position = attributes?.popper?.['data-popper-placement'] ?? placement;\n const isOpen = useTooltipOpen(delay, anchorElement) || forceOpen;\n const wrappedChildren = useInjectTooltipRef(children, setAnchorElement, isOpen as boolean, id);\n\n return (\n <>\n {wrappedChildren}\n {isOpen &&\n createPortal(\n <div\n ref={mergeRefs(ref, setPopperElement)}\n {...forwardedProps}\n id={id}\n role=\"tooltip\"\n aria-label={label}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, position }))}\n style={styles.popper}\n {...attributes.popper}\n >\n <div className={`${CLASSNAME}__arrow`} />\n <div className={`${CLASSNAME}__inner`}>\n {label.indexOf('\\n') !== -1\n ? label.split('\\n').map((sentence: string) => <p key={sentence}>{sentence}</p>)\n : label}\n </div>\n </div>,\n document.body,\n )}\n </>\n );\n});\nTooltip.displayName = COMPONENT_NAME;\nTooltip.className = CLASSNAME;\nTooltip.defaultProps = DEFAULT_PROPS;\n"],"names":["useInjectTooltipRef","children","setAnchorElement","isOpen","id","useMemo","ariaProps","undefined","get","element","cloneElement","props","ref","mergeRefs","browserDoesNotSupportHover","window","matchMedia","matches","useTooltipOpen","delay","anchorElement","useState","setIsOpen","useEffect","timer","openStartTime","shouldOpen","deferUpdate","duration","clearTimeout","setTimeout","hoverNotSupported","hasTouch","openDelay","TOOLTIP_LONG_PRESS_DELAY","open","TOOLTIP_HOVER_DELAY","closeDelay","close","Date","now","overrideDelay","closeImmediately","touchEnd","evt","stopPropagation","preventDefault","focus","events","push","onEscapePressed","node","eventType","eventHandler","addEventListener","removeEventListener","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","placement","Placement","BOTTOM","ARROW_SIZE","Tooltip","forwardRef","label","className","forceOpen","forwardedProps","DOCUMENT","uid","popperElement","setPopperElement","usePopper","modifiers","name","options","offset","styles","attributes","position","popper","wrappedChildren","createPortal","classNames","handleBasicClasses","prefix","indexOf","split","map","sentence","document","body","displayName","defaultProps"],"mappings":"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"}
@@ -1,84 +0,0 @@
1
- import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
2
- import { Size, AspectRatio, Theme } from './components.js';
3
- import React, { forwardRef } from 'react';
4
- import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
5
- import { I as Icon } from './Icon2.js';
6
-
7
- /**
8
- * Uploader variants.
9
- */
10
-
11
- var UploaderVariant = {
12
- square: 'square',
13
- rounded: 'rounded',
14
- circle: 'circle'
15
- };
16
-
17
- /**
18
- * Component display name.
19
- */
20
- var COMPONENT_NAME = 'Uploader';
21
- /**
22
- * Component default class name and class prefix.
23
- */
24
-
25
- var CLASSNAME = getRootClassName(COMPONENT_NAME);
26
- /**
27
- * Component default props.
28
- */
29
-
30
- var DEFAULT_PROPS = {
31
- aspectRatio: AspectRatio.horizontal,
32
- size: Size.xl,
33
- theme: Theme.light,
34
- variant: UploaderVariant.square
35
- };
36
- /**
37
- * Uploader component.
38
- *
39
- * @param props Component props.
40
- * @param ref Component ref.
41
- * @return React element.
42
- */
43
-
44
- var Uploader = forwardRef(function (props, ref) {
45
- var aspectRatio = props.aspectRatio,
46
- className = props.className,
47
- label = props.label,
48
- icon = props.icon,
49
- size = props.size,
50
- theme = props.theme,
51
- variant = props.variant,
52
- forwardedProps = _objectWithoutProperties(props, ["aspectRatio", "className", "label", "icon", "size", "theme", "variant"]); // Adjust to square aspect ratio when using circle variants.
53
-
54
-
55
- var adjustedAspectRatio = variant === UploaderVariant.circle ? AspectRatio.square : aspectRatio;
56
- return React.createElement("div", _extends({
57
- ref: ref
58
- }, forwardedProps, {
59
- className: classnames(className, handleBasicClasses({
60
- aspectRatio: adjustedAspectRatio,
61
- prefix: CLASSNAME,
62
- size: size,
63
- theme: theme,
64
- variant: variant
65
- }))
66
- }), React.createElement("div", {
67
- className: "".concat(CLASSNAME, "__background")
68
- }), React.createElement("div", {
69
- className: "".concat(CLASSNAME, "__wrapper")
70
- }, icon && React.createElement("div", {
71
- className: "".concat(CLASSNAME, "__icon")
72
- }, React.createElement(Icon, {
73
- icon: icon,
74
- size: Size.s
75
- })), label && React.createElement("span", {
76
- className: "".concat(CLASSNAME, "__label")
77
- }, label)));
78
- });
79
- Uploader.displayName = COMPONENT_NAME;
80
- Uploader.className = CLASSNAME;
81
- Uploader.defaultProps = DEFAULT_PROPS;
82
-
83
- export { UploaderVariant as U, Uploader as a };
84
- //# sourceMappingURL=Uploader2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Uploader2.js","sources":["../../../src/components/uploader/Uploader.tsx"],"sourcesContent":["import React, { forwardRef, MouseEventHandler } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AspectRatio, Icon, Size, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses, HasTheme, ValueOf } from '@lumx/react/utils';\n\n/**\n * Uploader variants.\n */\nexport const UploaderVariant = {\n square: 'square',\n rounded: 'rounded',\n circle: 'circle',\n} as const;\nexport type UploaderVariant = ValueOf<typeof UploaderVariant>;\n\n/**\n * Uploader sizes.\n */\nexport type UploaderSize = Extract<Size, 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface UploaderProps extends GenericProps, HasTheme {\n /** Image aspect ratio. */\n aspectRatio?: AspectRatio;\n /** Icon (SVG path). */\n icon?: string;\n /** Label text. */\n label?: string;\n /** Size variant. */\n size?: UploaderSize;\n /** Variant. */\n variant?: UploaderVariant;\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Uploader';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<UploaderProps> = {\n aspectRatio: AspectRatio.horizontal,\n size: Size.xl,\n theme: Theme.light,\n variant: UploaderVariant.square,\n};\n\n/**\n * Uploader component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Uploader: Comp<UploaderProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { aspectRatio, className, label, icon, size, theme, variant, ...forwardedProps } = props;\n // Adjust to square aspect ratio when using circle variants.\n const adjustedAspectRatio = variant === UploaderVariant.circle ? AspectRatio.square : aspectRatio;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n aspectRatio: adjustedAspectRatio,\n prefix: CLASSNAME,\n size,\n theme,\n variant,\n }),\n )}\n >\n <div className={`${CLASSNAME}__background`} />\n\n <div className={`${CLASSNAME}__wrapper`}>\n {icon && (\n <div className={`${CLASSNAME}__icon`}>\n <Icon icon={icon} size={Size.s} />\n </div>\n )}\n\n {label && <span className={`${CLASSNAME}__label`}>{label}</span>}\n </div>\n </div>\n );\n});\nUploader.displayName = COMPONENT_NAME;\nUploader.className = CLASSNAME;\nUploader.defaultProps = DEFAULT_PROPS;\n"],"names":["UploaderVariant","square","rounded","circle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","aspectRatio","AspectRatio","horizontal","size","Size","xl","theme","Theme","light","variant","Uploader","forwardRef","props","ref","className","label","icon","forwardedProps","adjustedAspectRatio","classNames","handleBasicClasses","prefix","s","displayName","defaultProps"],"mappings":";;;;;;AAOA;;;;IAGaA,eAAe,GAAG;AAC3BC,EAAAA,MAAM,EAAE,QADmB;AAE3BC,EAAAA,OAAO,EAAE,SAFkB;AAG3BC,EAAAA,MAAM,EAAE;AAHmB;;AA8B/B;;;AAGA,IAAMC,cAAc,GAAG,UAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAqC,GAAG;AAC1CC,EAAAA,WAAW,EAAEC,WAAW,CAACC,UADiB;AAE1CC,EAAAA,IAAI,EAAEC,IAAI,CAACC,EAF+B;AAG1CC,EAAAA,KAAK,EAAEC,KAAK,CAACC,KAH6B;AAI1CC,EAAAA,OAAO,EAAEjB,eAAe,CAACC;AAJiB,CAA9C;AAOA;;;;;;;;IAOaiB,QAA6C,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAC5Eb,WAD4E,GACKY,KADL,CAC5EZ,WAD4E;AAAA,MAC/Dc,SAD+D,GACKF,KADL,CAC/DE,SAD+D;AAAA,MACpDC,KADoD,GACKH,KADL,CACpDG,KADoD;AAAA,MAC7CC,IAD6C,GACKJ,KADL,CAC7CI,IAD6C;AAAA,MACvCb,IADuC,GACKS,KADL,CACvCT,IADuC;AAAA,MACjCG,KADiC,GACKM,KADL,CACjCN,KADiC;AAAA,MAC1BG,OAD0B,GACKG,KADL,CAC1BH,OAD0B;AAAA,MACdQ,cADc,4BACKL,KADL;;;AAGpF,MAAMM,mBAAmB,GAAGT,OAAO,KAAKjB,eAAe,CAACG,MAA5B,GAAqCM,WAAW,CAACR,MAAjD,GAA0DO,WAAtF;AAEA,SACI;AACI,IAAA,GAAG,EAAEa;AADT,KAEQI,cAFR;AAGI,IAAA,SAAS,EAAEE,UAAU,CACjBL,SADiB,EAEjBM,kBAAkB,CAAC;AACfpB,MAAAA,WAAW,EAAEkB,mBADE;AAEfG,MAAAA,MAAM,EAAExB,SAFO;AAGfM,MAAAA,IAAI,EAAJA,IAHe;AAIfG,MAAAA,KAAK,EAALA,KAJe;AAKfG,MAAAA,OAAO,EAAPA;AALe,KAAD,CAFD;AAHzB,MAcI;AAAK,IAAA,SAAS,YAAKZ,SAAL;AAAd,IAdJ,EAgBI;AAAK,IAAA,SAAS,YAAKA,SAAL;AAAd,KACKmB,IAAI,IACD;AAAK,IAAA,SAAS,YAAKnB,SAAL;AAAd,KACI,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEmB,IAAZ;AAAkB,IAAA,IAAI,EAAEZ,IAAI,CAACkB;AAA7B,IADJ,CAFR,EAOKP,KAAK,IAAI;AAAM,IAAA,SAAS,YAAKlB,SAAL;AAAf,KAAyCkB,KAAzC,CAPd,CAhBJ,CADJ;AA4BH,CAjCsE;AAkCvEL,QAAQ,CAACa,WAAT,GAAuB3B,cAAvB;AACAc,QAAQ,CAACI,SAAT,GAAqBjB,SAArB;AACAa,QAAQ,CAACc,YAAT,GAAwBzB,aAAxB;;;;"}