@lumx/react 3.20.1-alpha.13 → 3.20.1-alpha.14

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 (697) hide show
  1. package/_internal/Falsy.d.ts +7 -0
  2. package/_internal/index.js +236 -0
  3. package/_internal/index.js.map +1 -0
  4. package/index.d.ts +352 -7
  5. package/index.js +14486 -65
  6. package/index.js.map +1 -1
  7. package/package.json +11 -3
  8. package/src/components/alert-dialog/AlertDialog.stories.tsx +127 -0
  9. package/src/components/alert-dialog/AlertDialog.test.tsx +34 -0
  10. package/src/components/alert-dialog/AlertDialog.tsx +189 -0
  11. package/src/components/alert-dialog/index.ts +1 -0
  12. package/src/components/autocomplete/Autocomplete.stories.tsx +75 -0
  13. package/src/components/autocomplete/Autocomplete.test.tsx +99 -0
  14. package/src/components/autocomplete/Autocomplete.tsx +294 -0
  15. package/src/components/autocomplete/AutocompleteMultiple.stories.tsx +167 -0
  16. package/src/components/autocomplete/AutocompleteMultiple.test.tsx +61 -0
  17. package/src/components/autocomplete/AutocompleteMultiple.tsx +156 -0
  18. package/src/components/autocomplete/__mockData__/index.ts +39 -0
  19. package/src/components/autocomplete/index.ts +2 -0
  20. package/src/components/avatar/Avatar.stories.tsx +119 -0
  21. package/src/components/avatar/Avatar.test.tsx +32 -0
  22. package/src/components/avatar/Avatar.tsx +114 -0
  23. package/src/components/avatar/index.ts +1 -0
  24. package/src/components/badge/Badge.stories.tsx +69 -0
  25. package/src/components/badge/Badge.test.tsx +45 -0
  26. package/src/components/badge/Badge.tsx +58 -0
  27. package/src/components/badge/BadgeWrapper.stories.tsx +75 -0
  28. package/src/components/badge/BadgeWrapper.test.tsx +47 -0
  29. package/src/components/badge/BadgeWrapper.tsx +37 -0
  30. package/src/components/badge/index.ts +2 -0
  31. package/src/components/button/Button.stories.tsx +355 -0
  32. package/src/components/button/Button.test.tsx +125 -0
  33. package/src/components/button/Button.tsx +101 -0
  34. package/src/components/button/ButtonGroup.stories.tsx +52 -0
  35. package/src/components/button/ButtonGroup.test.tsx +41 -0
  36. package/src/components/button/ButtonGroup.tsx +50 -0
  37. package/src/components/button/ButtonRoot.tsx +163 -0
  38. package/src/components/button/IconButton.stories.tsx +52 -0
  39. package/src/components/button/IconButton.test.tsx +66 -0
  40. package/src/components/button/IconButton.tsx +91 -0
  41. package/src/components/button/index.ts +4 -0
  42. package/src/components/checkbox/Checkbox.stories.tsx +64 -0
  43. package/src/components/checkbox/Checkbox.test.tsx +154 -0
  44. package/src/components/checkbox/Checkbox.tsx +164 -0
  45. package/src/components/checkbox/index.ts +1 -0
  46. package/src/components/chip/Chip.stories.tsx +164 -0
  47. package/src/components/chip/Chip.test.tsx +243 -0
  48. package/src/components/chip/Chip.tsx +168 -0
  49. package/src/components/chip/ChipGroup.stories.tsx +47 -0
  50. package/src/components/chip/ChipGroup.test.tsx +37 -0
  51. package/src/components/chip/ChipGroup.tsx +60 -0
  52. package/src/components/chip/index.ts +2 -0
  53. package/src/components/comment-block/CommentBlock.stories.tsx +91 -0
  54. package/src/components/comment-block/CommentBlock.test.tsx +28 -0
  55. package/src/components/comment-block/CommentBlock.tsx +172 -0
  56. package/src/components/comment-block/index.ts +1 -0
  57. package/src/components/date-picker/DatePicker.stories.tsx +118 -0
  58. package/src/components/date-picker/DatePicker.test.tsx +34 -0
  59. package/src/components/date-picker/DatePicker.tsx +52 -0
  60. package/src/components/date-picker/DatePickerControlled.test.tsx +91 -0
  61. package/src/components/date-picker/DatePickerControlled.tsx +259 -0
  62. package/src/components/date-picker/DatePickerField.stories.tsx +100 -0
  63. package/src/components/date-picker/DatePickerField.test.tsx +70 -0
  64. package/src/components/date-picker/DatePickerField.tsx +135 -0
  65. package/src/components/date-picker/constants.ts +11 -0
  66. package/src/components/date-picker/index.ts +4 -0
  67. package/src/components/date-picker/types.ts +28 -0
  68. package/src/components/dialog/Dialog.stories.tsx +318 -0
  69. package/src/components/dialog/Dialog.test.tsx +97 -0
  70. package/src/components/dialog/Dialog.tsx +288 -0
  71. package/src/components/dialog/index.ts +1 -0
  72. package/src/components/divider/Divider.test.tsx +51 -0
  73. package/src/components/divider/Divider.tsx +50 -0
  74. package/src/components/divider/index.ts +1 -0
  75. package/src/components/drag-handle/DragHandle.test.tsx +36 -0
  76. package/src/components/drag-handle/DragHandle.tsx +51 -0
  77. package/src/components/drag-handle/index.ts +1 -0
  78. package/src/components/dropdown/Dropdown.stories.tsx +31 -0
  79. package/src/components/dropdown/Dropdown.test.tsx +66 -0
  80. package/src/components/dropdown/Dropdown.tsx +186 -0
  81. package/src/components/dropdown/index.ts +1 -0
  82. package/src/components/expansion-panel/ExpansionPanel.stories.tsx +91 -0
  83. package/src/components/expansion-panel/ExpansionPanel.test.tsx +185 -0
  84. package/src/components/expansion-panel/ExpansionPanel.tsx +195 -0
  85. package/src/components/expansion-panel/index.ts +1 -0
  86. package/src/components/flag/Flag.stories.tsx +48 -0
  87. package/src/components/flag/Flag.test.tsx +62 -0
  88. package/src/components/flag/Flag.tsx +52 -0
  89. package/src/components/flag/index.ts +1 -0
  90. package/src/components/flex-box/FlexBox.stories.tsx +156 -0
  91. package/src/components/flex-box/FlexBox.test.tsx +24 -0
  92. package/src/components/flex-box/FlexBox.tsx +100 -0
  93. package/src/components/flex-box/index.ts +1 -0
  94. package/src/components/generic-block/GenericBlock.stories.jsx +128 -0
  95. package/src/components/generic-block/GenericBlock.test.tsx +156 -0
  96. package/src/components/generic-block/GenericBlock.tsx +225 -0
  97. package/src/components/generic-block/constants.ts +9 -0
  98. package/src/components/generic-block/index.ts +2 -0
  99. package/src/components/grid/Grid.tsx +83 -0
  100. package/src/components/grid/GridItem.tsx +55 -0
  101. package/src/components/grid/index.ts +2 -0
  102. package/src/components/grid-column/GridColumn.stories.tsx +45 -0
  103. package/src/components/grid-column/GridColumn.test.jsx +56 -0
  104. package/src/components/grid-column/GridColumn.tsx +83 -0
  105. package/src/components/grid-column/index.ts +1 -0
  106. package/src/components/heading/Heading.stories.tsx +69 -0
  107. package/src/components/heading/Heading.test.tsx +82 -0
  108. package/src/components/heading/Heading.tsx +65 -0
  109. package/src/components/heading/HeadingLevelProvider.tsx +30 -0
  110. package/src/components/heading/constants.ts +16 -0
  111. package/src/components/heading/context.tsx +13 -0
  112. package/src/components/heading/index.ts +3 -0
  113. package/src/components/heading/useHeadingLevel.tsx +8 -0
  114. package/src/components/icon/Icon.stories.tsx +73 -0
  115. package/src/components/icon/Icon.test.tsx +125 -0
  116. package/src/components/icon/Icon.tsx +133 -0
  117. package/src/components/icon/index.ts +1 -0
  118. package/src/components/image-block/ImageBlock.stories.tsx +117 -0
  119. package/src/components/image-block/ImageBlock.test.tsx +58 -0
  120. package/src/components/image-block/ImageBlock.tsx +142 -0
  121. package/src/components/image-block/ImageCaption.tsx +115 -0
  122. package/src/components/image-block/index.ts +1 -0
  123. package/src/components/image-lightbox/ImageLightbox.stories.tsx +160 -0
  124. package/src/components/image-lightbox/ImageLightbox.test.tsx +254 -0
  125. package/src/components/image-lightbox/ImageLightbox.tsx +90 -0
  126. package/src/components/image-lightbox/constants.ts +11 -0
  127. package/src/components/image-lightbox/index.ts +2 -0
  128. package/src/components/image-lightbox/internal/ImageSlide.tsx +107 -0
  129. package/src/components/image-lightbox/internal/ImageSlideshow.tsx +164 -0
  130. package/src/components/image-lightbox/internal/useAnimateScroll.ts +55 -0
  131. package/src/components/image-lightbox/internal/usePointerZoom.ts +148 -0
  132. package/src/components/image-lightbox/types.ts +48 -0
  133. package/src/components/image-lightbox/useImageLightbox.tsx +141 -0
  134. package/src/components/inline-list/InlineList.stories.tsx +77 -0
  135. package/src/components/inline-list/InlineList.test.tsx +52 -0
  136. package/src/components/inline-list/InlineList.tsx +96 -0
  137. package/src/components/inline-list/index.ts +1 -0
  138. package/src/components/input-helper/InputHelper.stories.tsx +35 -0
  139. package/src/components/input-helper/InputHelper.test.tsx +55 -0
  140. package/src/components/input-helper/InputHelper.tsx +65 -0
  141. package/src/components/input-helper/constants.ts +11 -0
  142. package/src/components/input-helper/index.ts +1 -0
  143. package/src/components/input-label/InputLabel.stories.tsx +45 -0
  144. package/src/components/input-label/InputLabel.test.tsx +59 -0
  145. package/src/components/input-label/InputLabel.tsx +69 -0
  146. package/src/components/input-label/index.ts +1 -0
  147. package/src/components/lightbox/Lightbox.stories.tsx +101 -0
  148. package/src/components/lightbox/Lightbox.test.tsx +53 -0
  149. package/src/components/lightbox/Lightbox.tsx +180 -0
  150. package/src/components/lightbox/index.ts +1 -0
  151. package/src/components/link/Link.stories.tsx +195 -0
  152. package/src/components/link/Link.test.tsx +127 -0
  153. package/src/components/link/Link.tsx +106 -0
  154. package/src/components/link/index.ts +1 -0
  155. package/src/components/link-preview/LinkPreview.stories.tsx +61 -0
  156. package/src/components/link-preview/LinkPreview.test.tsx +105 -0
  157. package/src/components/link-preview/LinkPreview.tsx +158 -0
  158. package/src/components/link-preview/index.ts +1 -0
  159. package/src/components/list/List.stories.tsx +116 -0
  160. package/src/components/list/List.test.tsx +18 -0
  161. package/src/components/list/List.tsx +104 -0
  162. package/src/components/list/ListDivider.stories.tsx +12 -0
  163. package/src/components/list/ListDivider.test.tsx +22 -0
  164. package/src/components/list/ListDivider.tsx +35 -0
  165. package/src/components/list/ListItem.stories.tsx +66 -0
  166. package/src/components/list/ListItem.test.tsx +93 -0
  167. package/src/components/list/ListItem.tsx +157 -0
  168. package/src/components/list/ListSubheader.stories.tsx +11 -0
  169. package/src/components/list/ListSubheader.test.tsx +21 -0
  170. package/src/components/list/ListSubheader.tsx +44 -0
  171. package/src/components/list/index.ts +4 -0
  172. package/src/components/list/useInteractiveList.tsx +202 -0
  173. package/src/components/message/Message.stories.tsx +72 -0
  174. package/src/components/message/Message.test.tsx +76 -0
  175. package/src/components/message/Message.tsx +100 -0
  176. package/src/components/message/index.ts +1 -0
  177. package/src/components/mosaic/Mosaic.stories.tsx +89 -0
  178. package/src/components/mosaic/Mosaic.test.tsx +77 -0
  179. package/src/components/mosaic/Mosaic.tsx +98 -0
  180. package/src/components/mosaic/index.ts +1 -0
  181. package/src/components/navigation/Navigation.stories.tsx +234 -0
  182. package/src/components/navigation/Navigation.test.tsx +65 -0
  183. package/src/components/navigation/Navigation.tsx +79 -0
  184. package/src/components/navigation/NavigationItem.test.tsx +35 -0
  185. package/src/components/navigation/NavigationItem.tsx +82 -0
  186. package/src/components/navigation/NavigationSection.test.tsx +137 -0
  187. package/src/components/navigation/NavigationSection.tsx +108 -0
  188. package/src/components/navigation/context.tsx +7 -0
  189. package/src/components/navigation/index.ts +1 -0
  190. package/src/components/notification/Notification.test.tsx +94 -0
  191. package/src/components/notification/Notification.tsx +138 -0
  192. package/src/components/notification/Notifications.stories.tsx +92 -0
  193. package/src/components/notification/constants.ts +28 -0
  194. package/src/components/notification/index.ts +1 -0
  195. package/src/components/popover/Popover.stories.tsx +264 -0
  196. package/src/components/popover/Popover.test.tsx +62 -0
  197. package/src/components/popover/Popover.tsx +201 -0
  198. package/src/components/popover/constants.ts +62 -0
  199. package/src/components/popover/index.ts +3 -0
  200. package/src/components/popover/usePopoverStyle.tsx +184 -0
  201. package/src/components/popover/useRestoreFocusOnClose.tsx +47 -0
  202. package/src/components/popover-dialog/PopoverDialog.stories.tsx +64 -0
  203. package/src/components/popover-dialog/PopoverDialog.test.tsx +139 -0
  204. package/src/components/popover-dialog/PopoverDialog.tsx +74 -0
  205. package/src/components/popover-dialog/index.tsx +1 -0
  206. package/src/components/post-block/PostBlock.test.tsx +27 -0
  207. package/src/components/post-block/PostBlock.tsx +122 -0
  208. package/src/components/post-block/index.ts +1 -0
  209. package/src/components/progress/Progress.tsx +68 -0
  210. package/src/components/progress/ProgressCircular.stories.tsx +43 -0
  211. package/src/components/progress/ProgressCircular.test.tsx +46 -0
  212. package/src/components/progress/ProgressCircular.tsx +82 -0
  213. package/src/components/progress/ProgressLinear.stories.tsx +12 -0
  214. package/src/components/progress/ProgressLinear.test.tsx +30 -0
  215. package/src/components/progress/ProgressLinear.tsx +50 -0
  216. package/src/components/progress/index.ts +3 -0
  217. package/src/components/progress-tracker/ProgressTracker.stories.tsx +145 -0
  218. package/src/components/progress-tracker/ProgressTracker.test.tsx +42 -0
  219. package/src/components/progress-tracker/ProgressTracker.tsx +87 -0
  220. package/src/components/progress-tracker/ProgressTrackerProvider.test.tsx +65 -0
  221. package/src/components/progress-tracker/ProgressTrackerProvider.tsx +67 -0
  222. package/src/components/progress-tracker/ProgressTrackerStep.test.tsx +36 -0
  223. package/src/components/progress-tracker/ProgressTrackerStep.tsx +159 -0
  224. package/src/components/progress-tracker/ProgressTrackerStepPanel.test.tsx +34 -0
  225. package/src/components/progress-tracker/ProgressTrackerStepPanel.tsx +67 -0
  226. package/src/components/progress-tracker/index.ts +4 -0
  227. package/src/components/radio-button/RadioButton.stories.tsx +71 -0
  228. package/src/components/radio-button/RadioButton.test.tsx +143 -0
  229. package/src/components/radio-button/RadioButton.tsx +143 -0
  230. package/src/components/radio-button/RadioGroup.stories.tsx +39 -0
  231. package/src/components/radio-button/RadioGroup.test.tsx +29 -0
  232. package/src/components/radio-button/RadioGroup.tsx +44 -0
  233. package/src/components/radio-button/index.ts +2 -0
  234. package/src/components/select/Select.stories.tsx +385 -0
  235. package/src/components/select/Select.test.tsx +199 -0
  236. package/src/components/select/Select.tsx +199 -0
  237. package/src/components/select/SelectMultiple.stories.tsx +315 -0
  238. package/src/components/select/SelectMultiple.test.tsx +213 -0
  239. package/src/components/select/SelectMultiple.tsx +206 -0
  240. package/src/components/select/WithSelectContext.tsx +147 -0
  241. package/src/components/select/constants.ts +55 -0
  242. package/src/components/select/index.ts +2 -0
  243. package/src/components/side-navigation/SideNavigation.stories.tsx +191 -0
  244. package/src/components/side-navigation/SideNavigation.test.tsx +37 -0
  245. package/src/components/side-navigation/SideNavigation.tsx +52 -0
  246. package/src/components/side-navigation/SideNavigationItem.stories.tsx +133 -0
  247. package/src/components/side-navigation/SideNavigationItem.test.tsx +136 -0
  248. package/src/components/side-navigation/SideNavigationItem.tsx +165 -0
  249. package/src/components/side-navigation/index.ts +2 -0
  250. package/src/components/skeleton/SkeletonCircle.stories.tsx +41 -0
  251. package/src/components/skeleton/SkeletonCircle.test.tsx +27 -0
  252. package/src/components/skeleton/SkeletonCircle.tsx +52 -0
  253. package/src/components/skeleton/SkeletonRectangle.stories.tsx +82 -0
  254. package/src/components/skeleton/SkeletonRectangle.test.tsx +27 -0
  255. package/src/components/skeleton/SkeletonRectangle.tsx +88 -0
  256. package/src/components/skeleton/SkeletonTypography.stories.tsx +19 -0
  257. package/src/components/skeleton/SkeletonTypography.test.tsx +27 -0
  258. package/src/components/skeleton/SkeletonTypography.tsx +59 -0
  259. package/src/components/skeleton/index.ts +3 -0
  260. package/src/components/slider/Slider.stories.tsx +45 -0
  261. package/src/components/slider/Slider.test.tsx +29 -0
  262. package/src/components/slider/Slider.tsx +299 -0
  263. package/src/components/slider/index.ts +2 -0
  264. package/src/components/slideshow/Slides.tsx +130 -0
  265. package/src/components/slideshow/Slideshow.stories.tsx +179 -0
  266. package/src/components/slideshow/Slideshow.test.tsx +35 -0
  267. package/src/components/slideshow/Slideshow.tsx +173 -0
  268. package/src/components/slideshow/SlideshowControls.stories.tsx +100 -0
  269. package/src/components/slideshow/SlideshowControls.tsx +243 -0
  270. package/src/components/slideshow/SlideshowItem.tsx +44 -0
  271. package/src/components/slideshow/SlideshowItemGroup.tsx +60 -0
  272. package/src/components/slideshow/constants.ts +24 -0
  273. package/src/components/slideshow/index.ts +4 -0
  274. package/src/components/slideshow/useKeyNavigate.ts +28 -0
  275. package/src/components/slideshow/usePaginationVisibleRange.ts +37 -0
  276. package/src/components/slideshow/useSlideFocusManagement.tsx +92 -0
  277. package/src/components/slideshow/useSwipeNavigate.ts +18 -0
  278. package/src/components/switch/Switch.stories.tsx +49 -0
  279. package/src/components/switch/Switch.test.tsx +144 -0
  280. package/src/components/switch/Switch.tsx +145 -0
  281. package/src/components/switch/index.ts +1 -0
  282. package/src/components/table/Table.test.tsx +29 -0
  283. package/src/components/table/Table.tsx +59 -0
  284. package/src/components/table/TableBody.test.tsx +30 -0
  285. package/src/components/table/TableBody.tsx +42 -0
  286. package/src/components/table/TableCell.test.tsx +72 -0
  287. package/src/components/table/TableCell.tsx +130 -0
  288. package/src/components/table/TableHeader.test.tsx +30 -0
  289. package/src/components/table/TableHeader.tsx +48 -0
  290. package/src/components/table/TableRow.test.tsx +40 -0
  291. package/src/components/table/TableRow.tsx +71 -0
  292. package/src/components/table/index.ts +5 -0
  293. package/src/components/tabs/Tab.test.tsx +50 -0
  294. package/src/components/tabs/Tab.tsx +133 -0
  295. package/src/components/tabs/TabList.test.tsx +49 -0
  296. package/src/components/tabs/TabList.tsx +94 -0
  297. package/src/components/tabs/TabPanel.test.tsx +37 -0
  298. package/src/components/tabs/TabPanel.tsx +67 -0
  299. package/src/components/tabs/TabProvider.test.tsx +161 -0
  300. package/src/components/tabs/TabProvider.tsx +67 -0
  301. package/src/components/tabs/Tabs.stories.tsx +170 -0
  302. package/src/components/tabs/index.ts +4 -0
  303. package/src/components/tabs/state.ts +114 -0
  304. package/src/components/tabs/test-utils.ts +39 -0
  305. package/src/components/text/Text.stories.tsx +177 -0
  306. package/src/components/text/Text.test.tsx +92 -0
  307. package/src/components/text/Text.tsx +139 -0
  308. package/src/components/text/index.ts +1 -0
  309. package/src/components/text-field/TextField.stories.tsx +180 -0
  310. package/src/components/text-field/TextField.test.tsx +298 -0
  311. package/src/components/text-field/TextField.tsx +493 -0
  312. package/src/components/text-field/index.ts +1 -0
  313. package/src/components/thumbnail/Thumbnail.stories.tsx +448 -0
  314. package/src/components/thumbnail/Thumbnail.test.tsx +88 -0
  315. package/src/components/thumbnail/Thumbnail.tsx +248 -0
  316. package/src/components/thumbnail/index.ts +3 -0
  317. package/src/components/thumbnail/types.ts +48 -0
  318. package/src/components/thumbnail/useFocusPointStyle.test.ts +92 -0
  319. package/src/components/thumbnail/useFocusPointStyle.tsx +107 -0
  320. package/src/components/thumbnail/useImageLoad.ts +40 -0
  321. package/src/components/toolbar/Toolbar.tsx +68 -0
  322. package/src/components/toolbar/index.ts +1 -0
  323. package/src/components/tooltip/Tooltip.stories.tsx +118 -0
  324. package/src/components/tooltip/Tooltip.test.tsx +417 -0
  325. package/src/components/tooltip/Tooltip.tsx +165 -0
  326. package/src/components/tooltip/constants.ts +8 -0
  327. package/src/components/tooltip/context.tsx +17 -0
  328. package/src/components/tooltip/index.ts +1 -0
  329. package/src/components/tooltip/useInjectTooltipRef.tsx +55 -0
  330. package/src/components/tooltip/useTooltipOpen.tsx +143 -0
  331. package/src/components/uploader/Uploader.stories.tsx +109 -0
  332. package/src/components/uploader/Uploader.test.tsx +146 -0
  333. package/src/components/uploader/Uploader.tsx +177 -0
  334. package/src/components/uploader/index.ts +1 -0
  335. package/src/components/user-block/UserBlock.stories.tsx +133 -0
  336. package/src/components/user-block/UserBlock.test.tsx +106 -0
  337. package/src/components/user-block/UserBlock.tsx +193 -0
  338. package/src/components/user-block/index.ts +1 -0
  339. package/src/constants.ts +27 -0
  340. package/src/hooks/useBooleanState.tsx +13 -0
  341. package/src/hooks/useCallbackOnEscape.ts +34 -0
  342. package/src/hooks/useChipGroupNavigation.tsx +75 -0
  343. package/src/hooks/useClickAway.tsx +48 -0
  344. package/src/hooks/useDisableBodyScroll.ts +28 -0
  345. package/src/hooks/useEventCallback.tsx +17 -0
  346. package/src/hooks/useFocus.tsx +21 -0
  347. package/src/hooks/useFocusTrap.ts +93 -0
  348. package/src/hooks/useFocusWithin.ts +33 -0
  349. package/src/hooks/useId.test.tsx +22 -0
  350. package/src/hooks/useId.ts +15 -0
  351. package/src/hooks/useImageSize.ts +17 -0
  352. package/src/hooks/useInfiniteScroll.tsx +60 -0
  353. package/src/hooks/useIntersectionObserver.tsx +43 -0
  354. package/src/hooks/useInterval.tsx +31 -0
  355. package/src/hooks/useKeyboardListNavigation.tsx +204 -0
  356. package/src/hooks/useListenFocus.tsx +26 -0
  357. package/src/hooks/useOverflowTooltipLabel.tsx +32 -0
  358. package/src/hooks/usePopper.ts +12 -0
  359. package/src/hooks/usePreviousValue.ts +12 -0
  360. package/src/hooks/useRovingTabIndex.tsx +90 -0
  361. package/src/hooks/useSizeOnWindowResize.ts +30 -0
  362. package/src/hooks/useSlideshowControls.ts +246 -0
  363. package/src/hooks/useStopPropagation.ts +21 -0
  364. package/src/hooks/useTransitionVisibility.ts +48 -0
  365. package/src/index.ts +63 -0
  366. package/src/stories/controls/color.ts +7 -0
  367. package/src/stories/controls/element.ts +6 -0
  368. package/src/stories/controls/focusPoint.ts +1 -0
  369. package/src/stories/controls/icons.ts +126 -0
  370. package/src/stories/controls/image.ts +84 -0
  371. package/src/stories/controls/selectArgType.ts +8 -0
  372. package/src/stories/controls/theme.ts +3 -0
  373. package/src/stories/controls/typography.ts +5 -0
  374. package/src/stories/controls/withUndefined.ts +1 -0
  375. package/src/stories/decorators/withChromaticForceScreenSize.tsx +7 -0
  376. package/src/stories/decorators/withCombinations.tsx +132 -0
  377. package/src/stories/decorators/withNestedProps.tsx +22 -0
  378. package/src/stories/decorators/withResizableBox.tsx +21 -0
  379. package/src/stories/decorators/withThemedBackground.tsx +16 -0
  380. package/src/stories/decorators/withValueOnChange.tsx +18 -0
  381. package/src/stories/decorators/withWrapper.tsx +19 -0
  382. package/src/stories/generated/Autocomplete/Demos.stories.tsx +7 -0
  383. package/src/stories/generated/Avatar/Demos.stories.tsx +7 -0
  384. package/src/stories/generated/Badge/Demos.stories.tsx +9 -0
  385. package/src/stories/generated/Button/Demos.stories.tsx +11 -0
  386. package/src/stories/generated/Checkbox/Demos.stories.tsx +6 -0
  387. package/src/stories/generated/Chip/Demos.stories.tsx +11 -0
  388. package/src/stories/generated/CommentBlock/Demos.stories.tsx +8 -0
  389. package/src/stories/generated/DatePicker/Demos.stories.tsx +8 -0
  390. package/src/stories/generated/Dialog/Demos.stories.tsx +10 -0
  391. package/src/stories/generated/Divider/Demos.stories.tsx +6 -0
  392. package/src/stories/generated/Dropdown/Demos.stories.tsx +8 -0
  393. package/src/stories/generated/ExpansionPanel/Demos.stories.tsx +9 -0
  394. package/src/stories/generated/Flag/Demos.stories.tsx +6 -0
  395. package/src/stories/generated/GenericBlock/Demos.stories.tsx +8 -0
  396. package/src/stories/generated/Heading/Demos.stories.tsx +6 -0
  397. package/src/stories/generated/Icon/Demos.stories.tsx +8 -0
  398. package/src/stories/generated/ImageBlock/Demos.stories.tsx +9 -0
  399. package/src/stories/generated/ImageLightbox/Demos.stories.tsx +6 -0
  400. package/src/stories/generated/Lightbox/Demos.stories.tsx +6 -0
  401. package/src/stories/generated/LinkPreview/Demos.stories.tsx +7 -0
  402. package/src/stories/generated/List/Demos.stories.tsx +11 -0
  403. package/src/stories/generated/Message/Demos.stories.tsx +11 -0
  404. package/src/stories/generated/Mosaic/Demos.stories.tsx +10 -0
  405. package/src/stories/generated/Notification/Demos.stories.tsx +6 -0
  406. package/src/stories/generated/Popover/Demos.stories.tsx +11 -0
  407. package/src/stories/generated/PopoverDialog/Demos.stories.tsx +6 -0
  408. package/src/stories/generated/PostBlock/Demos.stories.tsx +6 -0
  409. package/src/stories/generated/Progress/Demos.stories.tsx +7 -0
  410. package/src/stories/generated/ProgressTracker/Demos.stories.tsx +9 -0
  411. package/src/stories/generated/RadioButton/Demos.stories.tsx +6 -0
  412. package/src/stories/generated/Select/Demos.stories.tsx +14 -0
  413. package/src/stories/generated/SideNavigation/Demos.stories.tsx +10 -0
  414. package/src/stories/generated/Skeleton/Demos.stories.tsx +9 -0
  415. package/src/stories/generated/Slider/Demos.stories.tsx +9 -0
  416. package/src/stories/generated/Slideshow/Demos.stories.tsx +8 -0
  417. package/src/stories/generated/Switch/Demos.stories.tsx +6 -0
  418. package/src/stories/generated/Table/Demos.stories.tsx +7 -0
  419. package/src/stories/generated/Tabs/Demos.stories.tsx +8 -0
  420. package/src/stories/generated/TextField/Demos.stories.tsx +20 -0
  421. package/src/stories/generated/Thumbnail/Demos.stories.tsx +12 -0
  422. package/src/stories/generated/Toolbar/Demos.stories.tsx +10 -0
  423. package/src/stories/generated/Tooltip/Demos.stories.tsx +8 -0
  424. package/src/stories/generated/Uploader/Demos.stories.tsx +8 -0
  425. package/src/stories/generated/UserBlock/Demos.stories.tsx +11 -0
  426. package/src/stories/utils/CustomLink.tsx +12 -0
  427. package/src/stories/utils/concatPath.tsx +17 -0
  428. package/src/stories/utils/disableArgTypes.ts +3 -0
  429. package/src/stories/utils/initDemoShadowDOMPortal.ts +10 -0
  430. package/src/stories/utils/lorem.ts +59 -0
  431. package/src/stories/utils/theming.tsx +166 -0
  432. package/src/stories/utils/toFlattenProps.ts +28 -0
  433. package/src/stories/utils/withCategory.ts +12 -0
  434. package/src/testing/utils/ThemeSentinel.tsx +10 -0
  435. package/src/testing/utils/commonTestsSuiteRTL.tsx +193 -0
  436. package/src/testing/utils/index.ts +1 -0
  437. package/src/testing/utils/queries.ts +19 -0
  438. package/src/untypped-modules.d.ts +9 -0
  439. package/src/utils/ClickAwayProvider/ClickAwayProvider.stories.jsx +70 -0
  440. package/src/utils/ClickAwayProvider/ClickAwayProvider.tsx +69 -0
  441. package/src/utils/ClickAwayProvider/index.ts +1 -0
  442. package/src/utils/MaterialThemeSwitcher/MaterialThemeSwitcher.tsx +54 -0
  443. package/src/utils/MaterialThemeSwitcher/index.ts +1 -0
  444. package/src/utils/Portal/Portal.test.tsx +31 -0
  445. package/src/utils/Portal/Portal.tsx +33 -0
  446. package/src/utils/Portal/PortalProvider.stories.jsx +22 -0
  447. package/src/utils/Portal/PortalProvider.test.tsx +72 -0
  448. package/src/utils/Portal/PortalProvider.tsx +24 -0
  449. package/src/utils/Portal/index.tsx +2 -0
  450. package/src/utils/browser/DOM/findImage.tsx +3 -0
  451. package/src/utils/browser/DOM/startViewTransition.ts +68 -0
  452. package/src/utils/browser/focus/constants.ts +7 -0
  453. package/src/utils/browser/focus/getFirstAndLastFocusable.test.ts +134 -0
  454. package/src/utils/browser/focus/getFirstAndLastFocusable.ts +21 -0
  455. package/src/utils/browser/focus/getFocusableElements.test.ts +151 -0
  456. package/src/utils/browser/focus/getFocusableElements.ts +7 -0
  457. package/src/utils/browser/isFocusVisible.ts +9 -0
  458. package/src/utils/browser/isHoverNotSupported.test.js +24 -0
  459. package/src/utils/browser/isHoverNotSupported.ts +2 -0
  460. package/src/utils/browser/isReducedMotion.ts +6 -0
  461. package/src/utils/date/addMonthResetDay.test.ts +13 -0
  462. package/src/utils/date/addMonthResetDay.ts +9 -0
  463. package/src/utils/date/formatDayNumber.test.ts +12 -0
  464. package/src/utils/date/formatDayNumber.ts +5 -0
  465. package/src/utils/date/getFirstDayOfWeek.test.ts +20 -0
  466. package/src/utils/date/getFirstDayOfWeek.ts +59 -0
  467. package/src/utils/date/getMonthCalendar.test.ts +127 -0
  468. package/src/utils/date/getMonthCalendar.ts +69 -0
  469. package/src/utils/date/getWeekDays.test.ts +48 -0
  470. package/src/utils/date/getWeekDays.ts +34 -0
  471. package/src/utils/date/getYearDisplayName.test.ts +20 -0
  472. package/src/utils/date/getYearDisplayName.ts +12 -0
  473. package/src/utils/date/isDateValid.test.ts +15 -0
  474. package/src/utils/date/isDateValid.ts +4 -0
  475. package/src/utils/date/isSameDay.test.ts +37 -0
  476. package/src/utils/date/isSameDay.ts +11 -0
  477. package/src/utils/disabled/DisabledStateContext.tsx +29 -0
  478. package/src/utils/disabled/DisabledStateProvider.stories.tsx +92 -0
  479. package/src/utils/disabled/index.ts +2 -0
  480. package/src/utils/disabled/useDisableStateProps.test.tsx +74 -0
  481. package/src/utils/disabled/useDisableStateProps.tsx +37 -0
  482. package/src/utils/function/makeListenerTowerContext.ts +32 -0
  483. package/src/utils/index.ts +7 -0
  484. package/src/utils/locale/getCurrentLocale.ts +4 -0
  485. package/src/utils/locale/parseLocale.test.ts +17 -0
  486. package/src/utils/locale/parseLocale.ts +23 -0
  487. package/src/utils/locale/types.ts +8 -0
  488. package/src/utils/number/clamp.ts +17 -0
  489. package/src/utils/object/isEqual.test.ts +25 -0
  490. package/src/utils/object/isEqual.ts +11 -0
  491. package/src/utils/partitionMulti.test.ts +27 -0
  492. package/{_internal/partitionMulti-4daccdd5.js → src/utils/partitionMulti.ts} +9 -5
  493. package/src/utils/react/OnBeforeUnmount.tsx +20 -0
  494. package/src/utils/react/RawClickable.test.tsx +153 -0
  495. package/src/utils/react/RawClickable.tsx +65 -0
  496. package/src/utils/react/flattenChildren.ts +32 -0
  497. package/src/utils/react/forwardRef.ts +11 -0
  498. package/src/utils/react/forwardRefPolymorphic.ts +9 -0
  499. package/src/utils/react/mergeRefs.ts +33 -0
  500. package/src/utils/react/renderLink.tsx +17 -0
  501. package/src/utils/react/skipRender.tsx +18 -0
  502. package/src/utils/react/unref.ts +7 -0
  503. package/src/utils/react/wrapChildrenIconWithSpaces.test.tsx +37 -0
  504. package/src/utils/react/wrapChildrenIconWithSpaces.tsx +22 -0
  505. package/src/utils/theme/ThemeContext.ts +16 -0
  506. package/src/utils/theme/invertTheme.ts +4 -0
  507. package/src/utils/type/Comp.ts +14 -0
  508. package/src/utils/type/ComponentRef.ts +16 -0
  509. package/src/utils/type/HasAriaDisabled.ts +6 -0
  510. package/src/utils/type/HasPolymorphicAs.ts +6 -0
  511. package/src/utils/type/HasRequiredLinkHref.ts +1 -0
  512. package/src/utils/type/MaybeElementOrRef.ts +6 -0
  513. package/src/utils/type/index.ts +9 -0
  514. package/src/utils/type/isComponent.ts +33 -0
  515. package/src/utils/type/isComponentType.ts +9 -0
  516. package/utils/index.d.ts +1 -1
  517. package/utils/index.js +1 -3
  518. package/utils/index.js.map +1 -1
  519. package/_internal/Button-f19e18df.js +0 -96
  520. package/_internal/Button-f19e18df.js.map +0 -1
  521. package/_internal/ButtonRoot-ab633b1d.js +0 -115
  522. package/_internal/ButtonRoot-ab633b1d.js.map +0 -1
  523. package/_internal/Chip-4c572eec.js +0 -149
  524. package/_internal/Chip-4c572eec.js.map +0 -1
  525. package/_internal/ClickAwayProvider-bcce6ceb.js +0 -93
  526. package/_internal/ClickAwayProvider-bcce6ceb.js.map +0 -1
  527. package/_internal/DisabledStateContext-077b7bef.js +0 -29
  528. package/_internal/DisabledStateContext-077b7bef.js.map +0 -1
  529. package/_internal/HeadingLevelProvider-e4817816.js +0 -59
  530. package/_internal/HeadingLevelProvider-e4817816.js.map +0 -1
  531. package/_internal/IconButton-10585058.js +0 -72
  532. package/_internal/IconButton-10585058.js.map +0 -1
  533. package/_internal/ImageCaption-4279b2b6.js +0 -65
  534. package/_internal/ImageCaption-4279b2b6.js.map +0 -1
  535. package/_internal/List-d5f5d465.js +0 -791
  536. package/_internal/List-d5f5d465.js.map +0 -1
  537. package/_internal/PopoverDialog-21e5c9dd.js +0 -647
  538. package/_internal/PopoverDialog-21e5c9dd.js.map +0 -1
  539. package/_internal/Portal-c43d098b.js +0 -42
  540. package/_internal/Portal-c43d098b.js.map +0 -1
  541. package/_internal/RawClickable-c76bbc4c.js +0 -50
  542. package/_internal/RawClickable-c76bbc4c.js.map +0 -1
  543. package/_internal/Slides-01f513ce.js +0 -675
  544. package/_internal/Slides-01f513ce.js.map +0 -1
  545. package/_internal/ThemeContext-3181f000.js +0 -14
  546. package/_internal/ThemeContext-3181f000.js.map +0 -1
  547. package/_internal/Thumbnail-30d2a781.js +0 -312
  548. package/_internal/Thumbnail-30d2a781.js.map +0 -1
  549. package/_internal/components/alert-dialog-8f1c163c.js +0 -147
  550. package/_internal/components/alert-dialog-8f1c163c.js.map +0 -1
  551. package/_internal/components/autocomplete-bfbdeb3c.js +0 -264
  552. package/_internal/components/autocomplete-bfbdeb3c.js.map +0 -1
  553. package/_internal/components/avatar-6990e3e9.js +0 -87
  554. package/_internal/components/avatar-6990e3e9.js.map +0 -1
  555. package/_internal/components/badge-81543bc7.js +0 -81
  556. package/_internal/components/badge-81543bc7.js.map +0 -1
  557. package/_internal/components/button-927abe71.js +0 -49
  558. package/_internal/components/button-927abe71.js.map +0 -1
  559. package/_internal/components/checkbox-dc4caec8.js +0 -131
  560. package/_internal/components/checkbox-dc4caec8.js.map +0 -1
  561. package/_internal/components/chip-fb3d0c76.js +0 -104
  562. package/_internal/components/chip-fb3d0c76.js.map +0 -1
  563. package/_internal/components/comment-block-b84c4694.js +0 -121
  564. package/_internal/components/comment-block-b84c4694.js.map +0 -1
  565. package/_internal/components/date-picker-a425534c.js +0 -2
  566. package/_internal/components/date-picker-a425534c.js.map +0 -1
  567. package/_internal/components/dialog-7dbcb485.js +0 -226
  568. package/_internal/components/dialog-7dbcb485.js.map +0 -1
  569. package/_internal/components/divider-12e9b6a0.js +0 -53
  570. package/_internal/components/divider-12e9b6a0.js.map +0 -1
  571. package/_internal/components/drag-handle-a38ff757.js +0 -53
  572. package/_internal/components/drag-handle-a38ff757.js.map +0 -1
  573. package/_internal/components/dropdown-38b0b6a0.js +0 -148
  574. package/_internal/components/dropdown-38b0b6a0.js.map +0 -1
  575. package/_internal/components/expansion-panel-c4b93653.js +0 -158
  576. package/_internal/components/expansion-panel-c4b93653.js.map +0 -1
  577. package/_internal/components/flag-c5e2f5f0.js +0 -55
  578. package/_internal/components/flag-c5e2f5f0.js.map +0 -1
  579. package/_internal/components/flex-box-c8701a85.js +0 -58
  580. package/_internal/components/flex-box-c8701a85.js.map +0 -1
  581. package/_internal/components/generic-block-0d6ad5a6.js +0 -115
  582. package/_internal/components/generic-block-0d6ad5a6.js.map +0 -1
  583. package/_internal/components/grid-3b194fe8.js +0 -109
  584. package/_internal/components/grid-3b194fe8.js.map +0 -1
  585. package/_internal/components/grid-column-985b9327.js +0 -60
  586. package/_internal/components/grid-column-985b9327.js.map +0 -1
  587. package/_internal/components/heading-5e954dfc.js +0 -54
  588. package/_internal/components/heading-5e954dfc.js.map +0 -1
  589. package/_internal/components/icon-2e7345ad.js +0 -103
  590. package/_internal/components/icon-2e7345ad.js.map +0 -1
  591. package/_internal/components/image-block-8d21dd7e.js +0 -109
  592. package/_internal/components/image-block-8d21dd7e.js.map +0 -1
  593. package/_internal/components/image-lightbox-4a5ab962.js +0 -743
  594. package/_internal/components/image-lightbox-4a5ab962.js.map +0 -1
  595. package/_internal/components/inline-list-4884f004.js +0 -74
  596. package/_internal/components/inline-list-4884f004.js.map +0 -1
  597. package/_internal/components/input-helper-e644e05e.js +0 -73
  598. package/_internal/components/input-helper-e644e05e.js.map +0 -1
  599. package/_internal/components/input-label-5e509a1b.js +0 -61
  600. package/_internal/components/input-label-5e509a1b.js.map +0 -1
  601. package/_internal/components/lightbox-bec1b95f.js +0 -149
  602. package/_internal/components/lightbox-bec1b95f.js.map +0 -1
  603. package/_internal/components/link-9637b9e4.js +0 -70
  604. package/_internal/components/link-9637b9e4.js.map +0 -1
  605. package/_internal/components/link-preview-7a4a6e4b.js +0 -108
  606. package/_internal/components/link-preview-7a4a6e4b.js.map +0 -1
  607. package/_internal/components/list-5c8f7122.js +0 -77
  608. package/_internal/components/list-5c8f7122.js.map +0 -1
  609. package/_internal/components/message-a67067d9.js +0 -96
  610. package/_internal/components/message-a67067d9.js.map +0 -1
  611. package/_internal/components/mosaic-92b66c80.js +0 -92
  612. package/_internal/components/mosaic-92b66c80.js.map +0 -1
  613. package/_internal/components/navigation-4fd3917d.js +0 -210
  614. package/_internal/components/navigation-4fd3917d.js.map +0 -1
  615. package/_internal/components/notification-9063c963.js +0 -140
  616. package/_internal/components/notification-9063c963.js.map +0 -1
  617. package/_internal/components/popover-3c4c54bd.js +0 -3
  618. package/_internal/components/popover-3c4c54bd.js.map +0 -1
  619. package/_internal/components/post-block-0cfc2206.js +0 -99
  620. package/_internal/components/post-block-0cfc2206.js.map +0 -1
  621. package/_internal/components/progress-eaf5b33d.js +0 -188
  622. package/_internal/components/progress-eaf5b33d.js.map +0 -1
  623. package/_internal/components/progress-tracker-4a65718d.js +0 -309
  624. package/_internal/components/progress-tracker-4a65718d.js.map +0 -1
  625. package/_internal/components/radio-button-3ef8a325.js +0 -148
  626. package/_internal/components/radio-button-3ef8a325.js.map +0 -1
  627. package/_internal/components/select-d46cfe35.js +0 -404
  628. package/_internal/components/select-d46cfe35.js.map +0 -1
  629. package/_internal/components/side-navigation-75b22f19.js +0 -159
  630. package/_internal/components/side-navigation-75b22f19.js.map +0 -1
  631. package/_internal/components/skeleton-361ce335.js +0 -174
  632. package/_internal/components/skeleton-361ce335.js.map +0 -1
  633. package/_internal/components/slider-8094cb5c.js +0 -305
  634. package/_internal/components/slider-8094cb5c.js.map +0 -1
  635. package/_internal/components/slideshow-2e8cd372.js +0 -150
  636. package/_internal/components/slideshow-2e8cd372.js.map +0 -1
  637. package/_internal/components/switch-5516949b.js +0 -118
  638. package/_internal/components/switch-5516949b.js.map +0 -1
  639. package/_internal/components/table-fa198ee6.js +0 -299
  640. package/_internal/components/table-fa198ee6.js.map +0 -1
  641. package/_internal/components/tabs-bb9bc2a5.js +0 -298
  642. package/_internal/components/tabs-bb9bc2a5.js.map +0 -1
  643. package/_internal/components/text-289c0526.js +0 -2
  644. package/_internal/components/text-289c0526.js.map +0 -1
  645. package/_internal/components/text-field-82733568.js +0 -346
  646. package/_internal/components/text-field-82733568.js.map +0 -1
  647. package/_internal/components/thumbnail-e3acff82.js +0 -42
  648. package/_internal/components/thumbnail-e3acff82.js.map +0 -1
  649. package/_internal/components/toolbar-155562be.js +0 -60
  650. package/_internal/components/toolbar-155562be.js.map +0 -1
  651. package/_internal/components/tooltip-84ffb4f9.js +0 -318
  652. package/_internal/components/tooltip-84ffb4f9.js.map +0 -1
  653. package/_internal/components/uploader-896a1d89.js +0 -150
  654. package/_internal/components/uploader-896a1d89.js.map +0 -1
  655. package/_internal/components/user-block-8fd15895.js +0 -143
  656. package/_internal/components/user-block-8fd15895.js.map +0 -1
  657. package/_internal/constants-b9e57936.js +0 -2155
  658. package/_internal/constants-b9e57936.js.map +0 -1
  659. package/_internal/constants-d0e3f49e.js +0 -24
  660. package/_internal/constants-d0e3f49e.js.map +0 -1
  661. package/_internal/context-21aeb1c7.js +0 -19
  662. package/_internal/context-21aeb1c7.js.map +0 -1
  663. package/_internal/forwardRef-49d2bb84.js +0 -80
  664. package/_internal/forwardRef-49d2bb84.js.map +0 -1
  665. package/_internal/getFocusableElements-230173a8.js +0 -13
  666. package/_internal/getFocusableElements-230173a8.js.map +0 -1
  667. package/_internal/index-b4d256e7.js +0 -118
  668. package/_internal/index-b4d256e7.js.map +0 -1
  669. package/_internal/index-f415b08e.js +0 -430
  670. package/_internal/index-f415b08e.js.map +0 -1
  671. package/_internal/isComponent-78df9309.js +0 -20
  672. package/_internal/isComponent-78df9309.js.map +0 -1
  673. package/_internal/isComponentType-e806b848.js +0 -9
  674. package/_internal/isComponentType-e806b848.js.map +0 -1
  675. package/_internal/mergeRefs-f0d7d6ea.js +0 -30
  676. package/_internal/mergeRefs-f0d7d6ea.js.map +0 -1
  677. package/_internal/partitionMulti-4daccdd5.js.map +0 -1
  678. package/_internal/state-db358714.js +0 -130
  679. package/_internal/state-db358714.js.map +0 -1
  680. package/_internal/useBooleanState-2a3d237c.js +0 -12
  681. package/_internal/useBooleanState-2a3d237c.js.map +0 -1
  682. package/_internal/useCallbackOnEscape-ea4d9eb4.js +0 -62
  683. package/_internal/useCallbackOnEscape-ea4d9eb4.js.map +0 -1
  684. package/_internal/useDisableBodyScroll-36bd7352.js +0 -219
  685. package/_internal/useDisableBodyScroll-36bd7352.js.map +0 -1
  686. package/_internal/useDisableStateProps-fffc365f.js +0 -36
  687. package/_internal/useDisableStateProps-fffc365f.js.map +0 -1
  688. package/_internal/useFocusTrap-c3c6378b.js +0 -112
  689. package/_internal/useFocusTrap-c3c6378b.js.map +0 -1
  690. package/_internal/useId-3a1facc0.js +0 -18
  691. package/_internal/useId-3a1facc0.js.map +0 -1
  692. package/_internal/useRovingTabIndex-7daf0f24.js +0 -77
  693. package/_internal/useRovingTabIndex-7daf0f24.js.map +0 -1
  694. package/_internal/useTransitionVisibility-321fdbfa.js +0 -50
  695. package/_internal/useTransitionVisibility-321fdbfa.js.map +0 -1
  696. package/_internal/wrapChildrenIconWithSpaces-f86106ce.js +0 -20
  697. package/_internal/wrapChildrenIconWithSpaces-f86106ce.js.map +0 -1
@@ -1,158 +0,0 @@
1
- import { f as forwardRef, c as classNames, _ as _extends } from '../forwardRef-49d2bb84.js';
2
- import React__default, { Children, useRef } from 'react';
3
- import { mdiChevronUp, mdiChevronDown } from '@lumx/icons';
4
- import isEmpty from 'lodash/isEmpty';
5
- import { i as isComponent } from '../isComponent-78df9309.js';
6
- import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
7
- import { p as partitionMulti } from '../partitionMulti-4daccdd5.js';
8
- import { u as useTheme } from '../ThemeContext-3181f000.js';
9
- import { I as IS_BROWSER } from '../constants-d0e3f49e.js';
10
- import { DragHandle } from './drag-handle-a38ff757.js';
11
- import { Theme, ColorPalette, Emphasis } from '@lumx/core/js/constants';
12
- import { I as IconButton } from '../IconButton-10585058.js';
13
-
14
- /**
15
- * Defines the props of the component.
16
- */
17
-
18
- /**
19
- * Component display name.
20
- */
21
- const COMPONENT_NAME = 'ExpansionPanel';
22
-
23
- /**
24
- * Component default class name and class prefix.
25
- */
26
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
27
-
28
- /**
29
- * Component default props.
30
- */
31
- const DEFAULT_PROPS = {
32
- closeMode: 'unmount'
33
- };
34
- const isDragHandle = isComponent(DragHandle);
35
- const isHeader = isComponent('header');
36
- const isFooter = isComponent('footer');
37
-
38
- /**
39
- * ExpansionPanel component.
40
- *
41
- * @param props Component props.
42
- * @param ref Component ref.
43
- * @return React element.
44
- */
45
- const ExpansionPanel = forwardRef((props, ref) => {
46
- const defaultTheme = useTheme() || Theme.light;
47
- const {
48
- className,
49
- closeMode = DEFAULT_PROPS.closeMode,
50
- children: anyChildren,
51
- hasBackground,
52
- hasHeaderDivider,
53
- isOpen,
54
- label,
55
- onClose,
56
- onOpen,
57
- onToggleOpen,
58
- theme = defaultTheme,
59
- toggleButtonProps,
60
- ...forwardedProps
61
- } = props;
62
- const children = Children.toArray(anyChildren);
63
-
64
- // Partition children by types.
65
- const [[dragHandle], [header], [footer], content] = partitionMulti(children, [isDragHandle, isHeader, isFooter]);
66
-
67
- // Either take the header in children or create one with the label.
68
- const headerProps = /*#__PURE__*/React__default.isValidElement(header) ? header.props : {};
69
- const headerContent = !isEmpty(headerProps.children) ? headerProps.children : /*#__PURE__*/React__default.createElement("span", {
70
- className: `${CLASSNAME}__label`
71
- }, label);
72
- const toggleOpen = event => {
73
- const shouldOpen = !isOpen;
74
- if (onOpen && shouldOpen) {
75
- onOpen(event);
76
- }
77
- if (onClose && !shouldOpen) {
78
- onClose(event);
79
- }
80
- if (onToggleOpen) {
81
- onToggleOpen(shouldOpen, event);
82
- }
83
- };
84
- const color = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;
85
- const rootClassName = classNames(className, handleBasicClasses({
86
- hasBackground,
87
- hasHeader: Boolean(!isEmpty(headerProps.children)),
88
- hasHeaderDivider,
89
- isClose: !isOpen,
90
- isDraggable: Boolean(dragHandle),
91
- isOpen,
92
- prefix: CLASSNAME,
93
- theme
94
- }));
95
- const wrapperRef = useRef(null);
96
-
97
- // Children stay visible while the open/close transition is running
98
- const [isChildrenVisible, setChildrenVisible] = React__default.useState(isOpen);
99
- const isOpenRef = React__default.useRef(isOpen);
100
- React__default.useEffect(() => {
101
- if (isOpen || closeMode === 'hide') {
102
- setChildrenVisible(true);
103
- } else if (!IS_BROWSER) {
104
- // Outside a browser we can't wait for the transition
105
- setChildrenVisible(false);
106
- }
107
- isOpenRef.current = isOpen;
108
- }, [closeMode, isOpen]);
109
-
110
- // Change children's visibility on the transition end
111
- React__default.useEffect(() => {
112
- const {
113
- current: wrapper
114
- } = wrapperRef;
115
- if (!IS_BROWSER || !wrapper) {
116
- return undefined;
117
- }
118
- const onTransitionEnd = () => {
119
- setChildrenVisible(isOpenRef.current || closeMode === 'hide');
120
- };
121
- wrapper.addEventListener('transitionend', onTransitionEnd);
122
- return () => wrapper.removeEventListener('transitionend', onTransitionEnd);
123
- }, [closeMode]);
124
- return /*#__PURE__*/React__default.createElement("section", _extends({
125
- ref: ref
126
- }, forwardedProps, {
127
- className: rootClassName
128
- }), /*#__PURE__*/React__default.createElement("header", {
129
- className: `${CLASSNAME}__header`,
130
- onClick: toggleOpen
131
- }, dragHandle && /*#__PURE__*/React__default.createElement("div", {
132
- className: `${CLASSNAME}__header-drag`
133
- }, dragHandle), /*#__PURE__*/React__default.createElement("div", _extends({}, headerProps, {
134
- className: `${CLASSNAME}__header-content`
135
- }), headerContent), /*#__PURE__*/React__default.createElement("div", {
136
- className: `${CLASSNAME}__header-toggle`
137
- }, /*#__PURE__*/React__default.createElement(IconButton, _extends({}, toggleButtonProps, {
138
- color: color,
139
- emphasis: Emphasis.low,
140
- icon: isOpen ? mdiChevronUp : mdiChevronDown,
141
- "aria-expanded": isOpen || 'false'
142
- })))), /*#__PURE__*/React__default.createElement("div", {
143
- className: `${CLASSNAME}__wrapper`,
144
- ref: wrapperRef
145
- }, (isOpen || isChildrenVisible) && /*#__PURE__*/React__default.createElement("div", {
146
- className: `${CLASSNAME}__container`
147
- }, /*#__PURE__*/React__default.createElement("div", {
148
- className: `${CLASSNAME}__content`
149
- }, content), footer && /*#__PURE__*/React__default.createElement("div", {
150
- className: `${CLASSNAME}__footer`
151
- }, footer))));
152
- });
153
- ExpansionPanel.displayName = COMPONENT_NAME;
154
- ExpansionPanel.className = CLASSNAME;
155
- ExpansionPanel.defaultProps = DEFAULT_PROPS;
156
-
157
- export { ExpansionPanel };
158
- //# sourceMappingURL=expansion-panel-c4b93653.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"expansion-panel-c4b93653.js","sources":["../../../src/components/expansion-panel/ExpansionPanel.tsx"],"sourcesContent":["import React, { Children, PropsWithChildren, ReactNode, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiChevronDown, mdiChevronUp } from '@lumx/icons';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport { ColorPalette, DragHandle, Emphasis, IconButton, IconButtonProps, Theme } from '@lumx/react';\nimport { GenericProps, HasCloseMode, HasTheme, isComponent } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { partitionMulti } from '@lumx/react/utils/partitionMulti';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { IS_BROWSER } from '@lumx/react/constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface ExpansionPanelProps extends GenericProps, HasCloseMode, HasTheme {\n /** Whether the expansion panel has a background. */\n hasBackground?: boolean;\n /** Whether the header has a divider. */\n hasHeaderDivider?: boolean;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Label text (overwritten if a `<header>` is provided in the children). */\n label?: string;\n /** On open callback. */\n onOpen?: (event: React.MouseEvent) => void;\n /** On close callback. */\n onClose?: (event: React.MouseEvent) => void;\n /** Props to pass to the toggle button (minus those already set by the ExpansionPanel props). */\n toggleButtonProps: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n /** On toggle open or close callback. */\n onToggleOpen?(shouldOpen: boolean, event: React.MouseEvent): void;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ExpansionPanel';\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<ExpansionPanelProps> = {\n closeMode: 'unmount',\n};\n\nconst isDragHandle = isComponent(DragHandle);\nconst isHeader = isComponent('header');\nconst isFooter = isComponent('footer');\n\n/**\n * ExpansionPanel component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ExpansionPanel = forwardRef<ExpansionPanelProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n className,\n closeMode = DEFAULT_PROPS.closeMode,\n children: anyChildren,\n hasBackground,\n hasHeaderDivider,\n isOpen,\n label,\n onClose,\n onOpen,\n onToggleOpen,\n theme = defaultTheme,\n toggleButtonProps,\n ...forwardedProps\n } = props;\n\n const children: ReactNode[] = Children.toArray(anyChildren);\n\n // Partition children by types.\n const [[dragHandle], [header], [footer], content] = partitionMulti(children, [isDragHandle, isHeader, isFooter]);\n\n // Either take the header in children or create one with the label.\n const headerProps: PropsWithChildren<any> = React.isValidElement(header) ? header.props : {};\n const headerContent = !isEmpty(headerProps.children) ? (\n headerProps.children\n ) : (\n <span className={`${CLASSNAME}__label`}>{label}</span>\n );\n\n const toggleOpen = (event: React.MouseEvent) => {\n const shouldOpen = !isOpen;\n\n if (onOpen && shouldOpen) {\n onOpen(event);\n }\n if (onClose && !shouldOpen) {\n onClose(event);\n }\n if (onToggleOpen) {\n onToggleOpen(shouldOpen, event);\n }\n };\n\n const color = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;\n\n const rootClassName = classNames(\n className,\n handleBasicClasses({\n hasBackground,\n hasHeader: Boolean(!isEmpty(headerProps.children)),\n hasHeaderDivider,\n isClose: !isOpen,\n isDraggable: Boolean(dragHandle),\n isOpen,\n prefix: CLASSNAME,\n theme,\n }),\n );\n\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n // Children stay visible while the open/close transition is running\n const [isChildrenVisible, setChildrenVisible] = React.useState(isOpen);\n\n const isOpenRef = React.useRef(isOpen);\n React.useEffect(() => {\n if (isOpen || closeMode === 'hide') {\n setChildrenVisible(true);\n } else if (!IS_BROWSER) {\n // Outside a browser we can't wait for the transition\n setChildrenVisible(false);\n }\n isOpenRef.current = isOpen;\n }, [closeMode, isOpen]);\n\n // Change children's visibility on the transition end\n React.useEffect(() => {\n const { current: wrapper } = wrapperRef;\n if (!IS_BROWSER || !wrapper) {\n return undefined;\n }\n const onTransitionEnd = () => {\n setChildrenVisible(isOpenRef.current || closeMode === 'hide');\n };\n wrapper.addEventListener('transitionend', onTransitionEnd);\n return () => wrapper.removeEventListener('transitionend', onTransitionEnd);\n }, [closeMode]);\n\n return (\n <section ref={ref} {...forwardedProps} className={rootClassName}>\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n <header className={`${CLASSNAME}__header`} onClick={toggleOpen}>\n {dragHandle && <div className={`${CLASSNAME}__header-drag`}>{dragHandle}</div>}\n\n <div {...headerProps} className={`${CLASSNAME}__header-content`}>\n {headerContent}\n </div>\n\n <div className={`${CLASSNAME}__header-toggle`}>\n <IconButton\n {...toggleButtonProps}\n color={color}\n emphasis={Emphasis.low}\n icon={isOpen ? mdiChevronUp : mdiChevronDown}\n aria-expanded={isOpen || 'false'}\n />\n </div>\n </header>\n\n <div className={`${CLASSNAME}__wrapper`} ref={wrapperRef}>\n {(isOpen || isChildrenVisible) && (\n <div className={`${CLASSNAME}__container`}>\n <div className={`${CLASSNAME}__content`}>{content}</div>\n\n {footer && <div className={`${CLASSNAME}__footer`}>{footer}</div>}\n </div>\n )}\n </div>\n </section>\n );\n});\nExpansionPanel.displayName = COMPONENT_NAME;\nExpansionPanel.className = CLASSNAME;\nExpansionPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","closeMode","isDragHandle","isComponent","DragHandle","isHeader","isFooter","ExpansionPanel","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","children","anyChildren","hasBackground","hasHeaderDivider","isOpen","label","onClose","onOpen","onToggleOpen","theme","toggleButtonProps","forwardedProps","Children","toArray","dragHandle","header","footer","content","partitionMulti","headerProps","React","isValidElement","headerContent","isEmpty","createElement","toggleOpen","event","shouldOpen","color","dark","ColorPalette","rootClassName","classNames","handleBasicClasses","hasHeader","Boolean","isClose","isDraggable","prefix","wrapperRef","useRef","isChildrenVisible","setChildrenVisible","useState","isOpenRef","useEffect","IS_BROWSER","current","wrapper","undefined","onTransitionEnd","addEventListener","removeEventListener","_extends","onClick","IconButton","emphasis","Emphasis","low","icon","mdiChevronUp","mdiChevronDown","displayName","defaultProps"],"mappings":"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"}
@@ -1,55 +0,0 @@
1
- import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
2
- import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
3
- import { u as useTheme } from '../ThemeContext-3181f000.js';
4
- import { Theme, ColorPalette, Size } from '@lumx/core/js/constants';
5
- import { Icon } from './icon-2e7345ad.js';
6
- import { T as Text } from '../index-b4d256e7.js';
7
-
8
- const COMPONENT_NAME = 'Flag';
9
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
10
- const DEFAULT_PROPS = {};
11
-
12
- /**
13
- * Flag component.
14
- *
15
- * @param props Component props.
16
- * @param ref Component ref.
17
- * @return React element.
18
- */
19
- const Flag = forwardRef((props, ref) => {
20
- const defaultTheme = useTheme() || Theme.light;
21
- const {
22
- label,
23
- icon,
24
- color,
25
- className,
26
- theme = defaultTheme,
27
- truncate,
28
- ...forwardedProps
29
- } = props;
30
- const flagColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);
31
- const isTruncated = !!truncate;
32
- return /*#__PURE__*/React.createElement("div", _extends({}, forwardedProps, {
33
- className: classNames(className, handleBasicClasses({
34
- prefix: CLASSNAME,
35
- color: flagColor,
36
- isTruncated
37
- })),
38
- ref: ref
39
- }), icon && /*#__PURE__*/React.createElement(Icon, {
40
- icon: icon,
41
- size: Size.xxs,
42
- className: `${CLASSNAME}__icon`
43
- }), /*#__PURE__*/React.createElement(Text, {
44
- as: "span",
45
- truncate: isTruncated,
46
- typography: "overline",
47
- className: `${CLASSNAME}__label`
48
- }, label));
49
- });
50
- Flag.displayName = COMPONENT_NAME;
51
- Flag.className = CLASSNAME;
52
- Flag.defaultProps = DEFAULT_PROPS;
53
-
54
- export { Flag };
55
- //# sourceMappingURL=flag-c5e2f5f0.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"flag-c5e2f5f0.js","sources":["../../../src/components/flag/Flag.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { ColorPalette, Icon, Size, Theme, Text } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nexport interface FlagProps extends GenericProps, HasTheme {\n /** Color of the component. */\n color?: ColorPalette;\n /** Icon to use before the label. */\n icon?: string;\n /** Text label of the flag. */\n label: React.ReactNode;\n /** Enable text truncate on overflow */\n truncate?: boolean;\n}\n\nconst COMPONENT_NAME = 'Flag';\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\nconst DEFAULT_PROPS: Partial<FlagProps> = {};\n\n/**\n * Flag component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Flag = forwardRef<FlagProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const { label, icon, color, className, theme = defaultTheme, truncate, ...forwardedProps } = props;\n const flagColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);\n const isTruncated = !!truncate;\n\n return (\n <div\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, color: flagColor, isTruncated }))}\n ref={ref}\n >\n {icon && <Icon icon={icon} size={Size.xxs} className={`${CLASSNAME}__icon`} />}\n <Text as=\"span\" truncate={isTruncated} typography=\"overline\" className={`${CLASSNAME}__label`}>\n {label}\n </Text>\n </div>\n );\n});\nFlag.displayName = COMPONENT_NAME;\nFlag.className = CLASSNAME;\nFlag.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Flag","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","label","icon","color","className","theme","truncate","forwardedProps","flagColor","ColorPalette","dark","isTruncated","React","createElement","_extends","classNames","handleBasicClasses","prefix","Icon","size","Size","xxs","Text","as","typography","displayName","defaultProps"],"mappings":";;;;;;;AAmBA,MAAMA,cAAc,GAAG,MAAM,CAAA;AAC7B,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;AAClD,MAAMG,aAAiC,GAAG,EAAE,CAAA;;AAE5C;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,IAAI,GAAGC,UAAU,CAA4B,CAACC,KAAK,EAAEC,GAAG,KAAK;EACtE,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IAAEC,KAAK;IAAEC,IAAI;IAAEC,KAAK;IAAEC,SAAS;AAAEC,IAAAA,KAAK,GAAGR,YAAY;IAAES,QAAQ;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGZ,KAAK,CAAA;AAClG,EAAA,MAAMa,SAAS,GAAGL,KAAK,KAAKE,KAAK,KAAKN,KAAK,CAACC,KAAK,GAAGS,YAAY,CAACC,IAAI,GAAGD,YAAY,CAACT,KAAK,CAAC,CAAA;AAC3F,EAAA,MAAMW,WAAW,GAAG,CAAC,CAACL,QAAQ,CAAA;AAE9B,EAAA,oBACIM,KAAA,CAAAC,aAAA,CAAAC,KAAAA,EAAAA,QAAA,KACQP,cAAc,EAAA;AAClBH,IAAAA,SAAS,EAAEW,UAAU,CAACX,SAAS,EAAEY,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAE3B,SAAS;AAAEa,MAAAA,KAAK,EAAEK,SAAS;AAAEG,MAAAA,WAAAA;AAAY,KAAC,CAAC,CAAE;AAC3Gf,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAA,CAAA,EAERM,IAAI,iBAAIU,KAAA,CAAAC,aAAA,CAACK,IAAI,EAAA;AAAChB,IAAAA,IAAI,EAAEA,IAAK;IAACiB,IAAI,EAAEC,IAAI,CAACC,GAAI;IAACjB,SAAS,EAAE,GAAGd,SAAS,CAAA,MAAA,CAAA;AAAS,GAAE,CAAC,eAC9EsB,KAAA,CAAAC,aAAA,CAACS,IAAI,EAAA;AAACC,IAAAA,EAAE,EAAC,MAAM;AAACjB,IAAAA,QAAQ,EAAEK,WAAY;AAACa,IAAAA,UAAU,EAAC,UAAU;IAACpB,SAAS,EAAE,GAAGd,SAAS,CAAA,OAAA,CAAA;GAC/EW,EAAAA,KACC,CACL,CAAC,CAAA;AAEd,CAAC,EAAC;AACFR,IAAI,CAACgC,WAAW,GAAGpC,cAAc,CAAA;AACjCI,IAAI,CAACW,SAAS,GAAGd,SAAS,CAAA;AAC1BG,IAAI,CAACiC,YAAY,GAAGlC,aAAa;;;;"}
@@ -1,58 +0,0 @@
1
- import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
2
- import castArray from 'lodash/castArray';
3
- import { Orientation } from '@lumx/core/js/constants';
4
- import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
5
-
6
- /**
7
- * Defines the props of the component.
8
- */
9
-
10
- /**
11
- * Component display name.
12
- */
13
- const COMPONENT_NAME = 'FlexBox';
14
-
15
- /**
16
- * Component default class name and class prefix.
17
- */
18
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
19
-
20
- /**
21
- * FlexBox component.
22
- *
23
- * @param props Component props.
24
- * @param ref Component ref.
25
- * @return React element.
26
- */
27
- const FlexBox = forwardRef((props, ref) => {
28
- const {
29
- as: Component = 'div',
30
- children,
31
- className,
32
- fillSpace,
33
- gap,
34
- hAlign,
35
- marginAuto,
36
- noShrink,
37
- orientation,
38
- vAlign,
39
- wrap,
40
- ...forwardedProps
41
- } = props;
42
- return /*#__PURE__*/React.createElement(Component, _extends({
43
- ref: ref
44
- }, forwardedProps, {
45
- className: classNames(className, handleBasicClasses({
46
- prefix: CLASSNAME,
47
- orientation: orientation ?? (wrap || hAlign || vAlign ? Orientation.horizontal : null),
48
- vAlign,
49
- hAlign,
50
- gap
51
- }), wrap && `${CLASSNAME}--wrap`, fillSpace && `${CLASSNAME}--fill-space`, noShrink && `${CLASSNAME}--no-shrink`, marginAuto && castArray(marginAuto).map(align => `${CLASSNAME}--margin-auto-${align}`))
52
- }), children);
53
- });
54
- FlexBox.displayName = COMPONENT_NAME;
55
- FlexBox.className = CLASSNAME;
56
-
57
- export { FlexBox };
58
- //# sourceMappingURL=flex-box-c8701a85.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"flex-box-c8701a85.js","sources":["../../../src/components/flex-box/FlexBox.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport castArray from 'lodash/castArray';\n\nimport { Alignment, Orientation, HorizontalAlignment, Size, VerticalAlignment } from '@lumx/core/js/constants';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nexport type MarginAutoAlignment = Extract<Alignment, 'top' | 'bottom' | 'right' | 'left'>;\nexport type GapSize = Extract<Size, 'tiny' | 'regular' | 'medium' | 'big' | 'huge'>;\ntype SpaceAlignment = Extract<Alignment, 'space-between' | 'space-evenly' | 'space-around'>;\nexport type FlexVerticalAlignment = VerticalAlignment | SpaceAlignment;\nexport type FlexHorizontalAlignment = HorizontalAlignment | SpaceAlignment;\n\n/**\n * Defines the props of the component.\n */\nexport interface FlexBoxProps extends GenericProps {\n /** Customize the root element. */\n as?: React.ElementType;\n /** Children elements. */\n children?: ReactNode;\n /** Whether the \"content filling space\" is enabled or not. */\n fillSpace?: boolean;\n /** Gap space between flexbox items. */\n gap?: GapSize;\n /** Flex horizontal alignment. */\n hAlign?: FlexVerticalAlignment;\n /** Whether the \"auto margin\" is enabled all around or not. */\n marginAuto?: MarginAutoAlignment | MarginAutoAlignment[];\n /** Whether the \"content shrink\" is disabled or not. */\n noShrink?: boolean;\n /** Flex direction. */\n orientation?: Orientation;\n /** Flex vertical alignment. */\n vAlign?: FlexHorizontalAlignment;\n /** Whether the \"flex wrap\" is enabled or not. */\n wrap?: boolean;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'FlexBox';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * FlexBox component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const FlexBox = forwardRef<FlexBoxProps, HTMLDivElement>((props, ref) => {\n const {\n as: Component = 'div',\n children,\n className,\n fillSpace,\n gap,\n hAlign,\n marginAuto,\n noShrink,\n orientation,\n vAlign,\n wrap,\n ...forwardedProps\n } = props;\n\n return (\n <Component\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n orientation: orientation ?? (wrap || hAlign || vAlign ? Orientation.horizontal : null),\n vAlign,\n hAlign,\n gap,\n }),\n wrap && `${CLASSNAME}--wrap`,\n fillSpace && `${CLASSNAME}--fill-space`,\n noShrink && `${CLASSNAME}--no-shrink`,\n marginAuto && castArray(marginAuto).map((align) => `${CLASSNAME}--margin-auto-${align}`),\n )}\n >\n {children}\n </Component>\n );\n});\nFlexBox.displayName = COMPONENT_NAME;\nFlexBox.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","FlexBox","forwardRef","props","ref","as","Component","children","className","fillSpace","gap","hAlign","marginAuto","noShrink","orientation","vAlign","wrap","forwardedProps","React","createElement","_extends","classNames","handleBasicClasses","prefix","Orientation","horizontal","castArray","map","align","displayName"],"mappings":";;;;;AAgBA;AACA;AACA;;AAwBA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,SAAS,CAAA;;AAEhC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,OAAO,GAAGC,UAAU,CAA+B,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC5E,MAAM;IACFC,EAAE,EAAEC,SAAS,GAAG,KAAK;IACrBC,QAAQ;IACRC,SAAS;IACTC,SAAS;IACTC,GAAG;IACHC,MAAM;IACNC,UAAU;IACVC,QAAQ;IACRC,WAAW;IACXC,MAAM;IACNC,IAAI;IACJ,GAAGC,cAAAA;AACP,GAAC,GAAGd,KAAK,CAAA;AAET,EAAA,oBACIe,KAAA,CAAAC,aAAA,CAACb,SAAS,EAAAc,QAAA,CAAA;AACNhB,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAA,EACLa,cAAc,EAAA;AAClBT,IAAAA,SAAS,EAAEa,UAAU,CACjBb,SAAS,EACTc,kBAAkB,CAAC;AACfC,MAAAA,MAAM,EAAExB,SAAS;AACjBe,MAAAA,WAAW,EAAEA,WAAW,KAAKE,IAAI,IAAIL,MAAM,IAAII,MAAM,GAAGS,WAAW,CAACC,UAAU,GAAG,IAAI,CAAC;MACtFV,MAAM;MACNJ,MAAM;AACND,MAAAA,GAAAA;AACJ,KAAC,CAAC,EACFM,IAAI,IAAI,CAAA,EAAGjB,SAAS,CAAQ,MAAA,CAAA,EAC5BU,SAAS,IAAI,GAAGV,SAAS,CAAA,YAAA,CAAc,EACvCc,QAAQ,IAAI,CAAGd,EAAAA,SAAS,CAAa,WAAA,CAAA,EACrCa,UAAU,IAAIc,SAAS,CAACd,UAAU,CAAC,CAACe,GAAG,CAAEC,KAAK,IAAK,CAAG7B,EAAAA,SAAS,CAAiB6B,cAAAA,EAAAA,KAAK,EAAE,CAC3F,CAAA;AAAE,GAAA,CAAA,EAEDrB,QACM,CAAC,CAAA;AAEpB,CAAC,EAAC;AACFN,OAAO,CAAC4B,WAAW,GAAG/B,cAAc,CAAA;AACpCG,OAAO,CAACO,SAAS,GAAGT,SAAS;;;;"}
@@ -1,115 +0,0 @@
1
- import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
2
- import React__default, { Children } from 'react';
3
- import isEmpty from 'lodash/isEmpty';
4
- import noop from 'lodash/noop';
5
- import { i as isComponentType } from '../isComponentType-e806b848.js';
6
- import { getRootClassName } from '@lumx/core/js/utils/className';
7
- import { p as partitionMulti } from '../partitionMulti-4daccdd5.js';
8
- import { Size, Orientation } from '@lumx/core/js/constants';
9
- import { FlexBox } from './flex-box-c8701a85.js';
10
- import pick from 'lodash/pick';
11
-
12
- /**
13
- * Component display name.
14
- */
15
- const COMPONENT_NAME = 'GenericBlock';
16
-
17
- /**
18
- * Component default class name and class prefix.
19
- */
20
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
21
-
22
- /**
23
- * Component default props.
24
- */
25
- const DEFAULT_PROPS = {
26
- gap: Size.big,
27
- orientation: Orientation.horizontal
28
- };
29
- const Figure = noop.bind({});
30
- const isFigure = isComponentType(Figure);
31
- const Content = noop.bind({});
32
- const isContent = isComponentType(Content);
33
- const Actions = noop.bind({});
34
- const isActions = isComponentType(Actions);
35
-
36
- /**
37
- * The GenericBlock is a layout component made of 3 sections that can be
38
- * displayed either horizontally of vertically with the same gap between each section.
39
- *
40
- * The sections are:
41
- * - `Figure` => A visual element to display before the main content.
42
- * - `Content` => The main content displayed
43
- * - `Actions` => One or more actions to set after the element.
44
- *
45
- * @see https://www.figma.com/file/lzzrQmsfaXRaOyRfoEogPZ/DS%3A-playground?node-id=1%3A4076
46
- */
47
- const BaseGenericBlock = forwardRef((props, ref) => {
48
- const {
49
- className,
50
- figure,
51
- figureProps,
52
- children,
53
- actions,
54
- actionsProps,
55
- gap = DEFAULT_PROPS.gap,
56
- orientation = DEFAULT_PROPS.orientation,
57
- contentProps,
58
- ...forwardedProps
59
- } = props;
60
- const sections = React__default.useMemo(() => {
61
- // Split children by section type
62
- const [[figureChild], [contentChild], [actionsChild], ...otherChildren] = partitionMulti(Children.toArray(children), [isFigure, isContent, isActions]);
63
- return {
64
- figureChild,
65
- figureChildProps: figureChild?.props,
66
- contentChild,
67
- contentChildProps: contentChild?.props,
68
- actionsChild,
69
- actionsChildProps: actionsChild?.props,
70
- otherChildren: otherChildren.filter(child => !isEmpty(child))
71
- };
72
- }, [children]);
73
- return /*#__PURE__*/React__default.createElement(FlexBox, _extends({
74
- ref: ref,
75
- className: classNames(className, CLASSNAME),
76
- gap: gap,
77
- orientation: orientation
78
- }, forwardedProps), (figure || sections.figureChildProps?.children) && /*#__PURE__*/React__default.createElement(FlexBox, _extends({
79
- ref: sections.figureChild?.ref,
80
- vAlign: forwardedProps.vAlign,
81
- hAlign: forwardedProps.hAlign
82
- }, figureProps, sections.figureChildProps, {
83
- className: classNames(figureProps?.className, sections.figureChildProps?.className, `${CLASSNAME}__figure`)
84
- }), figure, sections.figureChildProps?.children), (sections.contentChildProps?.children || sections.otherChildren.length > 0) && /*#__PURE__*/React__default.createElement(FlexBox, _extends({
85
- ref: sections.contentChild?.ref,
86
- orientation: Orientation.vertical,
87
- fillSpace: true,
88
- vAlign: forwardedProps.vAlign,
89
- hAlign: forwardedProps.hAlign
90
- }, contentProps, sections.contentChildProps, {
91
- className: classNames(contentProps?.className, sections.contentChildProps?.className, `${CLASSNAME}__content`)
92
- }), sections.contentChildProps?.children, sections.otherChildren), (actions || sections.actionsChildProps?.children) && /*#__PURE__*/React__default.createElement(FlexBox, _extends({
93
- ref: sections.actionsChild?.ref,
94
- vAlign: forwardedProps.vAlign,
95
- hAlign: forwardedProps.hAlign
96
- }, actionsProps, sections.actionsChildProps, {
97
- className: classNames(actionsProps?.className, sections.actionsChildProps?.className, `${CLASSNAME}__actions`)
98
- }), actions, sections.actionsChildProps?.children));
99
- });
100
- BaseGenericBlock.displayName = COMPONENT_NAME;
101
- BaseGenericBlock.className = CLASSNAME;
102
- BaseGenericBlock.defaultProps = DEFAULT_PROPS;
103
- const GenericBlock = Object.assign(BaseGenericBlock, {
104
- Figure,
105
- Content,
106
- Actions
107
- });
108
-
109
- /**
110
- * Accepted gap sizes for the generic block.
111
- */
112
- const GenericBlockGapSize = pick(Size, ['tiny', 'regular', 'medium', 'big', 'huge']);
113
-
114
- export { GenericBlock, GenericBlockGapSize };
115
- //# sourceMappingURL=generic-block-0d6ad5a6.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"generic-block-0d6ad5a6.js","sources":["../../../src/components/generic-block/GenericBlock.tsx","../../../src/components/generic-block/constants.ts"],"sourcesContent":["import React, { Children, ReactElement, ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\nimport noop from 'lodash/noop';\n\nimport { Comp, isComponentType } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { partitionMulti } from '@lumx/react/utils/partitionMulti';\nimport { Orientation, Size, FlexBox, FlexBoxProps } from '@lumx/react';\nimport { GenericBlockGapSize } from '@lumx/react/components/generic-block/constants';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nexport interface GenericBlockProps extends FlexBoxProps {\n /**\n * Component to use as visual element.\n */\n figure?: ReactNode;\n /**\n * Actions to set after the main content.\n */\n actions?: ReactNode;\n /**\n * Main content to display or sections components\n * ({@see GenericBlock.Figure}, {@see GenericBlock.Content} & {@see GenericBlock.Actions})\n */\n children: ReactNode;\n /**\n * Orientation of the 3 sections\n */\n orientation?: FlexBoxProps['orientation'];\n /**\n * Horizontal alignment.\n */\n hAlign?: FlexBoxProps['hAlign'];\n /**\n * Vertical alignment.\n */\n vAlign?: FlexBoxProps['vAlign'];\n /**\n * The props to forward to the content.\n * By default, the content will have the same alignment as wrapper.\n */\n contentProps?: Omit<FlexBoxProps, 'children'>;\n /**\n * props to forward to the actions element.\n */\n actionsProps?: Omit<FlexBoxProps, 'children'>;\n /**\n * props to forward to the figure element.\n */\n figureProps?: Omit<FlexBoxProps, 'children'>;\n /**\n * Gap space between sections.\n */\n gap?: GenericBlockGapSize;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'GenericBlock';\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<GenericBlockProps> = {\n gap: Size.big,\n orientation: Orientation.horizontal,\n};\n\ntype BaseGenericBlock = Comp<GenericBlockProps, HTMLDivElement>;\n\ninterface GenericBlockSectionProps extends FlexBoxProps {\n /**\n * Gap space between items.\n */\n gap?: GenericBlockGapSize;\n}\n\ninterface GenericBlock extends BaseGenericBlock {\n /**\n * Use `GenericBlock.Figure` component as children of the `GenericBlock` component as an alternative way to inject\n * the \"figure\" section of the block (instead of using `figure` and `figureProps` props).\n */\n Figure: Comp<GenericBlockSectionProps>;\n /**\n * Use `GenericBlock.Content` component as children of the `GenericBlock` component as an alternative way to inject\n * the \"content\" section of the block (instead of using `content` and `contentProps` props).\n */\n Content: Comp<GenericBlockSectionProps>;\n /**\n * Use `GenericBlock.Actions` component as children of the `GenericBlock` component as an alternative way to inject\n * the \"actions\" section of the block (instead of using `actions` and `actionsProps` props).\n */\n Actions: Comp<GenericBlockSectionProps>;\n}\n\nconst Figure = noop.bind({}) as Comp<FlexBoxProps>;\nconst isFigure = isComponentType(Figure);\n\nconst Content = noop.bind({}) as Comp<FlexBoxProps>;\nconst isContent = isComponentType(Content);\n\nconst Actions = noop.bind({}) as Comp<FlexBoxProps>;\nconst isActions = isComponentType(Actions);\n\n/**\n * The GenericBlock is a layout component made of 3 sections that can be\n * displayed either horizontally of vertically with the same gap between each section.\n *\n * The sections are:\n * - `Figure` => A visual element to display before the main content.\n * - `Content` => The main content displayed\n * - `Actions` => One or more actions to set after the element.\n *\n * @see https://www.figma.com/file/lzzrQmsfaXRaOyRfoEogPZ/DS%3A-playground?node-id=1%3A4076\n */\nconst BaseGenericBlock: BaseGenericBlock = forwardRef((props, ref) => {\n const {\n className,\n figure,\n figureProps,\n children,\n actions,\n actionsProps,\n gap = DEFAULT_PROPS.gap,\n orientation = DEFAULT_PROPS.orientation,\n contentProps,\n ...forwardedProps\n } = props;\n\n const sections = React.useMemo(() => {\n // Split children by section type\n const [[figureChild], [contentChild], [actionsChild], ...otherChildren] = partitionMulti(\n Children.toArray(children),\n [isFigure, isContent, isActions],\n );\n return {\n figureChild,\n figureChildProps: (figureChild as ReactElement)?.props,\n contentChild,\n contentChildProps: (contentChild as ReactElement)?.props,\n actionsChild,\n actionsChildProps: (actionsChild as ReactElement)?.props,\n otherChildren: otherChildren.filter((child) => !isEmpty(child)),\n };\n }, [children]);\n\n return (\n <FlexBox\n ref={ref}\n className={classNames(className, CLASSNAME)}\n gap={gap}\n orientation={orientation}\n {...forwardedProps}\n >\n {(figure || sections.figureChildProps?.children) && (\n <FlexBox\n ref={(sections.figureChild as any)?.ref}\n vAlign={forwardedProps.vAlign}\n hAlign={forwardedProps.hAlign}\n {...figureProps}\n {...sections.figureChildProps}\n className={classNames(\n figureProps?.className,\n sections.figureChildProps?.className,\n `${CLASSNAME}__figure`,\n )}\n >\n {figure}\n {sections.figureChildProps?.children}\n </FlexBox>\n )}\n\n {(sections.contentChildProps?.children || sections.otherChildren.length > 0) && (\n <FlexBox\n ref={(sections.contentChild as any)?.ref}\n orientation={Orientation.vertical}\n fillSpace\n vAlign={forwardedProps.vAlign}\n hAlign={forwardedProps.hAlign}\n {...contentProps}\n {...sections.contentChildProps}\n className={classNames(\n contentProps?.className,\n sections.contentChildProps?.className,\n `${CLASSNAME}__content`,\n )}\n >\n {sections.contentChildProps?.children}\n {sections.otherChildren}\n </FlexBox>\n )}\n\n {(actions || sections.actionsChildProps?.children) && (\n <FlexBox\n ref={(sections.actionsChild as any)?.ref}\n vAlign={forwardedProps.vAlign}\n hAlign={forwardedProps.hAlign}\n {...actionsProps}\n {...sections.actionsChildProps}\n className={classNames(\n actionsProps?.className,\n sections.actionsChildProps?.className,\n `${CLASSNAME}__actions`,\n )}\n >\n {actions}\n {sections.actionsChildProps?.children}\n </FlexBox>\n )}\n </FlexBox>\n );\n});\nBaseGenericBlock.displayName = COMPONENT_NAME;\nBaseGenericBlock.className = CLASSNAME;\nBaseGenericBlock.defaultProps = DEFAULT_PROPS;\n\nexport const GenericBlock: GenericBlock = Object.assign(BaseGenericBlock, { Figure, Content, Actions });\n","import pick from 'lodash/pick';\nimport { Size } from '@lumx/react';\nimport { ValueOf } from '@lumx/react/utils/type';\n\n/**\n * Accepted gap sizes for the generic block.\n */\nexport const GenericBlockGapSize = pick(Size, ['tiny', 'regular', 'medium', 'big', 'huge']);\nexport type GenericBlockGapSize = ValueOf<typeof GenericBlockGapSize>;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","gap","Size","big","orientation","Orientation","horizontal","Figure","noop","bind","isFigure","isComponentType","Content","isContent","Actions","isActions","BaseGenericBlock","forwardRef","props","ref","className","figure","figureProps","children","actions","actionsProps","contentProps","forwardedProps","sections","React","useMemo","figureChild","contentChild","actionsChild","otherChildren","partitionMulti","Children","toArray","figureChildProps","contentChildProps","actionsChildProps","filter","child","isEmpty","createElement","FlexBox","_extends","classNames","vAlign","hAlign","length","vertical","fillSpace","displayName","defaultProps","GenericBlock","Object","assign","GenericBlockGapSize","pick"],"mappings":"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"}
@@ -1,109 +0,0 @@
1
- import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
2
- import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
3
- import { Orientation } from '@lumx/core/js/constants';
4
-
5
- /**
6
- * Defines the props of the component.
7
- */
8
-
9
- /**
10
- * Component display name.
11
- */
12
- const COMPONENT_NAME$1 = 'Grid';
13
-
14
- /**
15
- * Component default class name and class prefix.
16
- */
17
- const CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1);
18
-
19
- /**
20
- * Component default props.
21
- */
22
- const DEFAULT_PROPS = {
23
- orientation: Orientation.horizontal,
24
- wrap: 'nowrap'
25
- };
26
-
27
- /**
28
- * Grid component.
29
- *
30
- * @param props Component props.
31
- * @param ref Component ref.
32
- * @return React element.
33
- */
34
- const Grid = forwardRef((props, ref) => {
35
- const {
36
- children,
37
- className,
38
- gutter,
39
- hAlign,
40
- orientation = DEFAULT_PROPS.orientation,
41
- vAlign,
42
- wrap = DEFAULT_PROPS.wrap,
43
- ...forwardedProps
44
- } = props;
45
- return /*#__PURE__*/React.createElement("div", _extends({
46
- ref: ref
47
- }, forwardedProps, {
48
- className: classNames(className, `${CLASSNAME$1}-container`, {
49
- [`${CLASSNAME$1}--h-align-${hAlign}`]: hAlign
50
- }, {
51
- [`${CLASSNAME$1}--v-align-${vAlign}`]: vAlign
52
- }, handleBasicClasses({
53
- prefix: CLASSNAME$1,
54
- orientation,
55
- wrap,
56
- gutter
57
- }))
58
- }), children);
59
- });
60
- Grid.displayName = COMPONENT_NAME$1;
61
- Grid.className = CLASSNAME$1;
62
- Grid.defaultProps = DEFAULT_PROPS;
63
-
64
- /**
65
- * Defines the props of the component.
66
- */
67
-
68
- /**
69
- * Component display name.
70
- */
71
- const COMPONENT_NAME = 'GridItem';
72
-
73
- /**
74
- * Component default class name and class prefix.
75
- */
76
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
77
-
78
- /**
79
- * GridItem component.
80
- *
81
- * @param props Component props.
82
- * @param ref Component ref.
83
- * @return React element.
84
- */
85
- const GridItem = forwardRef((props, ref) => {
86
- const {
87
- children,
88
- className,
89
- width,
90
- align,
91
- order,
92
- ...forwardedProps
93
- } = props;
94
- return /*#__PURE__*/React.createElement("div", _extends({
95
- ref: ref
96
- }, forwardedProps, {
97
- className: classNames(className, handleBasicClasses({
98
- prefix: CLASSNAME,
99
- width,
100
- order,
101
- align
102
- }))
103
- }), children);
104
- });
105
- GridItem.displayName = COMPONENT_NAME;
106
- GridItem.className = CLASSNAME;
107
-
108
- export { Grid, GridItem };
109
- //# sourceMappingURL=grid-3b194fe8.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"grid-3b194fe8.js","sources":["../../../src/components/grid/Grid.tsx","../../../src/components/grid/GridItem.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { Alignment, Orientation, Size } from '@lumx/react';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\ntype GridGutterSize = Extract<Size, 'regular' | 'big' | 'huge'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface GridProps extends GenericProps {\n /** Orientation. */\n orientation?: Orientation;\n /** Whether the children are wrapped or not. */\n wrap?: string;\n /** Vertical alignment. */\n vAlign?: Alignment;\n /** Horizontal alignment. */\n hAlign?: Alignment;\n /** Gutter size. */\n gutter?: GridGutterSize;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Grid';\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<GridProps> = {\n orientation: Orientation.horizontal,\n wrap: 'nowrap',\n};\n\n/**\n * Grid component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Grid = forwardRef<GridProps, HTMLDivElement>((props, ref) => {\n const {\n children,\n className,\n gutter,\n hAlign,\n orientation = DEFAULT_PROPS.orientation,\n vAlign,\n wrap = DEFAULT_PROPS.wrap,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n `${CLASSNAME}-container`,\n { [`${CLASSNAME}--h-align-${hAlign}`]: hAlign },\n { [`${CLASSNAME}--v-align-${vAlign}`]: vAlign },\n handleBasicClasses({ prefix: CLASSNAME, orientation, wrap, gutter }),\n )}\n >\n {children}\n </div>\n );\n});\nGrid.displayName = COMPONENT_NAME;\nGrid.className = CLASSNAME;\nGrid.defaultProps = DEFAULT_PROPS;\n","import classNames from 'classnames';\n\nimport { Alignment } from '@lumx/react';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\ntype Columns = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';\n\n/**\n * Defines the props of the component.\n */\nexport interface GridItemProps extends GenericProps {\n /** Alignment. */\n align?: Alignment;\n /** Order. */\n order?: Columns;\n /** Width. */\n width?: Columns;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'GridItem';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * GridItem component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const GridItem = forwardRef<GridItemProps, HTMLDivElement>((props, ref) => {\n const { children, className, width, align, order, ...forwardedProps } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, width, order, align }))}\n >\n {children}\n </div>\n );\n});\nGridItem.displayName = COMPONENT_NAME;\nGridItem.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","orientation","Orientation","horizontal","wrap","Grid","forwardRef","props","ref","children","className","gutter","hAlign","vAlign","forwardedProps","React","createElement","_extends","classNames","handleBasicClasses","prefix","displayName","defaultProps","GridItem","width","align","order"],"mappings":";;;;AASA;AACA;AACA;;AAgBA;AACA;AACA;AACA,MAAMA,gBAAc,GAAG,MAAM,CAAA;;AAE7B;AACA;AACA;AACA,MAAMC,WAAS,GAAGC,gBAAgB,CAACF,gBAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAiC,GAAG;EACtCC,WAAW,EAAEC,WAAW,CAACC,UAAU;AACnCC,EAAAA,IAAI,EAAE,QAAA;AACV,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,IAAI,GAAGC,UAAU,CAA4B,CAACC,KAAK,EAAEC,GAAG,KAAK;EACtE,MAAM;IACFC,QAAQ;IACRC,SAAS;IACTC,MAAM;IACNC,MAAM;IACNX,WAAW,GAAGD,aAAa,CAACC,WAAW;IACvCY,MAAM;IACNT,IAAI,GAAGJ,aAAa,CAACI,IAAI;IACzB,GAAGU,cAAAA;AACP,GAAC,GAAGP,KAAK,CAAA;AAET,EAAA,oBACIQ,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;AACIT,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAA,EACLM,cAAc,EAAA;IAClBJ,SAAS,EAAEQ,UAAU,CACjBR,SAAS,EACT,CAAGZ,EAAAA,WAAS,YAAY,EACxB;AAAE,MAAA,CAAC,CAAGA,EAAAA,WAAS,CAAac,UAAAA,EAAAA,MAAM,EAAE,GAAGA,MAAAA;AAAO,KAAC,EAC/C;AAAE,MAAA,CAAC,CAAGd,EAAAA,WAAS,CAAae,UAAAA,EAAAA,MAAM,EAAE,GAAGA,MAAAA;KAAQ,EAC/CM,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEtB,WAAS;MAAEG,WAAW;MAAEG,IAAI;AAAEO,MAAAA,MAAAA;AAAO,KAAC,CACvE,CAAA;AAAE,GAAA,CAAA,EAEDF,QACA,CAAC,CAAA;AAEd,CAAC,EAAC;AACFJ,IAAI,CAACgB,WAAW,GAAGxB,gBAAc,CAAA;AACjCQ,IAAI,CAACK,SAAS,GAAGZ,WAAS,CAAA;AAC1BO,IAAI,CAACiB,YAAY,GAAGtB,aAAa;;ACzEjC;AACA;AACA;;AAYA;AACA;AACA;AACA,MAAMH,cAAc,GAAG,UAAU,CAAA;;AAEjC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAM0B,QAAQ,GAAGjB,UAAU,CAAgC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC9E,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEc,KAAK;IAAEC,KAAK;IAAEC,KAAK;IAAE,GAAGZ,cAAAA;AAAe,GAAC,GAAGP,KAAK,CAAA;AAE7E,EAAA,oBACIQ,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;AACIT,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAA,EACLM,cAAc,EAAA;AAClBJ,IAAAA,SAAS,EAAEQ,UAAU,CAACR,SAAS,EAAES,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEtB,SAAS;MAAE0B,KAAK;MAAEE,KAAK;AAAED,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAA;AAAE,GAAA,CAAA,EAEhGhB,QACA,CAAC,CAAA;AAEd,CAAC,EAAC;AACFc,QAAQ,CAACF,WAAW,GAAGxB,cAAc,CAAA;AACrC0B,QAAQ,CAACb,SAAS,GAAGZ,SAAS;;;;"}
@@ -1,60 +0,0 @@
1
- import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
2
- import isInteger from 'lodash/isInteger';
3
- import { getRootClassName } from '@lumx/core/js/utils/className';
4
-
5
- /**
6
- * Defines the props of the component.
7
- */
8
-
9
- /**
10
- * Component display name.
11
- */
12
- const COMPONENT_NAME = 'GridColumn';
13
-
14
- /**
15
- * Component default class name and class prefix.
16
- */
17
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
18
-
19
- /**
20
- * Component default props.
21
- */
22
- const DEFAULT_PROPS = {};
23
-
24
- /**
25
- * The GridColumn is a layout component that can display children in a grid
26
- * with custom display properties. It also comes with a responsive design,
27
- * with a number of column that reduce when there is not enough space for each item.
28
- *
29
- * @param props Component props.
30
- * @param ref Component ref.
31
- * @return React element.
32
- */
33
- const GridColumn = forwardRef((props, ref) => {
34
- const {
35
- as: Component = 'div',
36
- gap,
37
- maxColumns,
38
- itemMinWidth,
39
- children,
40
- className,
41
- style = {},
42
- ...forwardedProps
43
- } = props;
44
- return /*#__PURE__*/React.createElement(Component, _extends({}, forwardedProps, {
45
- ref: ref,
46
- className: classNames(className, CLASSNAME),
47
- style: {
48
- ...style,
49
- ['--lumx-grid-column-item-min-width']: isInteger(itemMinWidth) && `${itemMinWidth}px`,
50
- ['--lumx-grid-column-columns']: maxColumns,
51
- ['--lumx-grid-column-gap']: gap && `var(--lumx-spacing-unit-${gap})`
52
- }
53
- }), children);
54
- });
55
- GridColumn.displayName = COMPONENT_NAME;
56
- GridColumn.className = CLASSNAME;
57
- GridColumn.defaultProps = DEFAULT_PROPS;
58
-
59
- export { GridColumn };
60
- //# sourceMappingURL=grid-column-985b9327.js.map