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

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 (320) hide show
  1. package/_internal/Button-f19e18df.js +96 -0
  2. package/_internal/Button-f19e18df.js.map +1 -0
  3. package/_internal/{cdddaed8.js → ButtonRoot-ab633b1d.js} +19 -20
  4. package/_internal/ButtonRoot-ab633b1d.js.map +1 -0
  5. package/_internal/{85e3a5ca.js → Chip-4c572eec.js} +38 -34
  6. package/_internal/Chip-4c572eec.js.map +1 -0
  7. package/_internal/{7093ba23.js → ClickAwayProvider-bcce6ceb.js} +4 -6
  8. package/_internal/ClickAwayProvider-bcce6ceb.js.map +1 -0
  9. package/_internal/{ea04260d.js → DisabledStateContext-077b7bef.js} +6 -6
  10. package/_internal/DisabledStateContext-077b7bef.js.map +1 -0
  11. package/_internal/{370bdaed.js → HeadingLevelProvider-e4817816.js} +5 -7
  12. package/_internal/HeadingLevelProvider-e4817816.js.map +1 -0
  13. package/_internal/IconButton-10585058.js +72 -0
  14. package/_internal/IconButton-10585058.js.map +1 -0
  15. package/_internal/ImageCaption-4279b2b6.js +65 -0
  16. package/_internal/ImageCaption-4279b2b6.js.map +1 -0
  17. package/_internal/{f5508d3d.js → List-d5f5d465.js} +55 -56
  18. package/_internal/List-d5f5d465.js.map +1 -0
  19. package/_internal/{b1af5979.js → PopoverDialog-21e5c9dd.js} +165 -171
  20. package/_internal/PopoverDialog-21e5c9dd.js.map +1 -0
  21. package/_internal/{3f86608e.js → Portal-c43d098b.js} +2 -5
  22. package/_internal/Portal-c43d098b.js.map +1 -0
  23. package/_internal/{2c2b6a89.js → RawClickable-c76bbc4c.js} +7 -9
  24. package/_internal/RawClickable-c76bbc4c.js.map +1 -0
  25. package/_internal/{34c59f5b.js → Slides-01f513ce.js} +106 -112
  26. package/_internal/Slides-01f513ce.js.map +1 -0
  27. package/_internal/{3181f000.js → ThemeContext-3181f000.js} +1 -1
  28. package/_internal/ThemeContext-3181f000.js.map +1 -0
  29. package/_internal/{628468c4.js → Thumbnail-30d2a781.js} +50 -51
  30. package/_internal/Thumbnail-30d2a781.js.map +1 -0
  31. package/_internal/{3a4e4636.js → components/alert-dialog-8f1c163c.js} +39 -54
  32. package/_internal/components/alert-dialog-8f1c163c.js.map +1 -0
  33. package/_internal/{179a84d1.js → components/autocomplete-bfbdeb3c.js} +72 -67
  34. package/_internal/components/autocomplete-bfbdeb3c.js.map +1 -0
  35. package/_internal/components/avatar-6990e3e9.js +87 -0
  36. package/_internal/components/avatar-6990e3e9.js.map +1 -0
  37. package/_internal/{9c9df5f2.js → components/badge-81543bc7.js} +20 -19
  38. package/_internal/components/badge-81543bc7.js.map +1 -0
  39. package/_internal/{f93fe83e.js → components/button-927abe71.js} +14 -11
  40. package/_internal/components/button-927abe71.js.map +1 -0
  41. package/_internal/components/checkbox-dc4caec8.js +131 -0
  42. package/_internal/{f0900583.js.map → components/checkbox-dc4caec8.js.map} +1 -1
  43. package/_internal/{c0414b89.js → components/chip-fb3d0c76.js} +13 -10
  44. package/_internal/components/chip-fb3d0c76.js.map +1 -0
  45. package/_internal/components/comment-block-b84c4694.js +121 -0
  46. package/_internal/components/comment-block-b84c4694.js.map +1 -0
  47. package/_internal/components/date-picker-a425534c.js +2 -0
  48. package/_internal/components/date-picker-a425534c.js.map +1 -0
  49. package/_internal/{2f1716fa.js → components/dialog-7dbcb485.js} +69 -80
  50. package/_internal/components/dialog-7dbcb485.js.map +1 -0
  51. package/_internal/{3e653144.js → components/divider-12e9b6a0.js} +13 -9
  52. package/_internal/components/divider-12e9b6a0.js.map +1 -0
  53. package/_internal/components/drag-handle-a38ff757.js +53 -0
  54. package/_internal/components/drag-handle-a38ff757.js.map +1 -0
  55. package/_internal/{1ea72630.js → components/dropdown-38b0b6a0.js} +19 -17
  56. package/_internal/components/dropdown-38b0b6a0.js.map +1 -0
  57. package/_internal/{68c10f98.js → components/expansion-panel-c4b93653.js} +46 -54
  58. package/_internal/components/expansion-panel-c4b93653.js.map +1 -0
  59. package/_internal/{c2388b10.js → components/flag-c5e2f5f0.js} +19 -22
  60. package/_internal/components/flag-c5e2f5f0.js.map +1 -0
  61. package/_internal/{329b5f12.js → components/flex-box-c8701a85.js} +13 -10
  62. package/_internal/components/flex-box-c8701a85.js.map +1 -0
  63. package/_internal/{a84f4981.js → components/generic-block-0d6ad5a6.js} +30 -37
  64. package/_internal/components/generic-block-0d6ad5a6.js.map +1 -0
  65. package/_internal/{2f6c7f84.js → components/grid-3b194fe8.js} +22 -16
  66. package/_internal/components/grid-3b194fe8.js.map +1 -0
  67. package/_internal/{501f2f9f.js → components/grid-column-985b9327.js} +10 -8
  68. package/_internal/components/grid-column-985b9327.js.map +1 -0
  69. package/_internal/{193521fa.js → components/heading-5e954dfc.js} +13 -11
  70. package/_internal/components/heading-5e954dfc.js.map +1 -0
  71. package/_internal/{8ab42752.js → components/icon-2e7345ad.js} +29 -29
  72. package/_internal/components/icon-2e7345ad.js.map +1 -0
  73. package/_internal/components/image-block-8d21dd7e.js +109 -0
  74. package/_internal/components/image-block-8d21dd7e.js.map +1 -0
  75. package/_internal/{7f54e947.js → components/image-lightbox-4a5ab962.js} +105 -120
  76. package/_internal/components/image-lightbox-4a5ab962.js.map +1 -0
  77. package/_internal/{15eab19b.js → components/inline-list-4884f004.js} +25 -26
  78. package/_internal/components/inline-list-4884f004.js.map +1 -0
  79. package/_internal/{5f8f9454.js → components/input-helper-e644e05e.js} +14 -11
  80. package/_internal/components/input-helper-e644e05e.js.map +1 -0
  81. package/_internal/{b0a7a999.js → components/input-label-5e509a1b.js} +14 -12
  82. package/_internal/components/input-label-5e509a1b.js.map +1 -0
  83. package/_internal/{86aa4aa4.js → components/lightbox-bec1b95f.js} +59 -64
  84. package/_internal/components/lightbox-bec1b95f.js.map +1 -0
  85. package/_internal/components/link-9637b9e4.js +70 -0
  86. package/_internal/components/link-9637b9e4.js.map +1 -0
  87. package/_internal/components/link-preview-7a4a6e4b.js +108 -0
  88. package/_internal/components/link-preview-7a4a6e4b.js.map +1 -0
  89. package/_internal/{95cfd814.js → components/list-5c8f7122.js} +21 -14
  90. package/_internal/components/list-5c8f7122.js.map +1 -0
  91. package/_internal/{0be1006e.js → components/message-a67067d9.js} +27 -28
  92. package/_internal/components/message-a67067d9.js.map +1 -0
  93. package/_internal/components/mosaic-92b66c80.js +92 -0
  94. package/_internal/components/mosaic-92b66c80.js.map +1 -0
  95. package/_internal/components/navigation-4fd3917d.js +210 -0
  96. package/_internal/components/navigation-4fd3917d.js.map +1 -0
  97. package/_internal/{5ec059fe.js → components/notification-9063c963.js} +47 -52
  98. package/_internal/components/notification-9063c963.js.map +1 -0
  99. package/_internal/components/popover-3c4c54bd.js +3 -0
  100. package/_internal/components/popover-3c4c54bd.js.map +1 -0
  101. package/_internal/components/post-block-0cfc2206.js +99 -0
  102. package/_internal/components/post-block-0cfc2206.js.map +1 -0
  103. package/_internal/{f23cdf84.js → components/progress-eaf5b33d.js} +53 -46
  104. package/_internal/components/progress-eaf5b33d.js.map +1 -0
  105. package/_internal/{edab29ce.js → components/progress-tracker-4a65718d.js} +70 -69
  106. package/_internal/components/progress-tracker-4a65718d.js.map +1 -0
  107. package/_internal/components/radio-button-3ef8a325.js +148 -0
  108. package/_internal/components/radio-button-3ef8a325.js.map +1 -0
  109. package/_internal/components/select-d46cfe35.js +404 -0
  110. package/_internal/components/select-d46cfe35.js.map +1 -0
  111. package/_internal/{b477da26.js → components/side-navigation-75b22f19.js} +62 -67
  112. package/_internal/components/side-navigation-75b22f19.js.map +1 -0
  113. package/_internal/{6da19518.js → components/skeleton-361ce335.js} +34 -25
  114. package/_internal/components/skeleton-361ce335.js.map +1 -0
  115. package/_internal/{db4fdc7b.js → components/slider-8094cb5c.js} +60 -65
  116. package/_internal/components/slider-8094cb5c.js.map +1 -0
  117. package/_internal/{eaa8b1d8.js → components/slideshow-2e8cd372.js} +41 -41
  118. package/_internal/components/slideshow-2e8cd372.js.map +1 -0
  119. package/_internal/components/switch-5516949b.js +118 -0
  120. package/_internal/components/switch-5516949b.js.map +1 -0
  121. package/_internal/{be6da9b0.js → components/table-fa198ee6.js} +76 -73
  122. package/_internal/components/table-fa198ee6.js.map +1 -0
  123. package/_internal/{65f91970.js → components/tabs-bb9bc2a5.js} +48 -47
  124. package/_internal/components/tabs-bb9bc2a5.js.map +1 -0
  125. package/_internal/components/text-289c0526.js +2 -0
  126. package/_internal/components/text-289c0526.js.map +1 -0
  127. package/_internal/{b0b2e33d.js → components/text-field-82733568.js} +109 -122
  128. package/_internal/components/text-field-82733568.js.map +1 -0
  129. package/_internal/{76be70dd.js → components/thumbnail-e3acff82.js} +3 -3
  130. package/_internal/components/thumbnail-e3acff82.js.map +1 -0
  131. package/_internal/{bae266a9.js → components/toolbar-155562be.js} +18 -19
  132. package/_internal/components/toolbar-155562be.js.map +1 -0
  133. package/_internal/{9a4dfad0.js → components/tooltip-84ffb4f9.js} +42 -50
  134. package/_internal/components/tooltip-84ffb4f9.js.map +1 -0
  135. package/_internal/{9fdc715b.js → components/uploader-896a1d89.js} +38 -40
  136. package/_internal/components/uploader-896a1d89.js.map +1 -0
  137. package/_internal/{0d1a078c.js → components/user-block-8fd15895.js} +44 -45
  138. package/_internal/components/user-block-8fd15895.js.map +1 -0
  139. package/_internal/{4cd870a5.js → constants-b9e57936.js} +2 -2
  140. package/_internal/constants-b9e57936.js.map +1 -0
  141. package/_internal/{478b5c92.js → constants-d0e3f49e.js} +2 -2
  142. package/_internal/constants-d0e3f49e.js.map +1 -0
  143. package/_internal/{9d1336a1.js → context-21aeb1c7.js} +6 -6
  144. package/_internal/context-21aeb1c7.js.map +1 -0
  145. package/_internal/forwardRef-49d2bb84.js +80 -0
  146. package/_internal/forwardRef-49d2bb84.js.map +1 -0
  147. package/_internal/{230173a8.js → getFocusableElements-230173a8.js} +1 -1
  148. package/_internal/getFocusableElements-230173a8.js.map +1 -0
  149. package/_internal/{0420e67b.js → index-b4d256e7.js} +14 -15
  150. package/_internal/index-b4d256e7.js.map +1 -0
  151. package/_internal/{84dfe68f.js → index-f415b08e.js} +46 -52
  152. package/_internal/index-f415b08e.js.map +1 -0
  153. package/_internal/{78df9309.js → isComponent-78df9309.js} +1 -1
  154. package/_internal/isComponent-78df9309.js.map +1 -0
  155. package/_internal/{e806b848.js → isComponentType-e806b848.js} +1 -1
  156. package/_internal/isComponentType-e806b848.js.map +1 -0
  157. package/_internal/{f0d7d6ea.js → mergeRefs-f0d7d6ea.js} +1 -1
  158. package/_internal/mergeRefs-f0d7d6ea.js.map +1 -0
  159. package/_internal/{4daccdd5.js → partitionMulti-4daccdd5.js} +1 -1
  160. package/_internal/partitionMulti-4daccdd5.js.map +1 -0
  161. package/_internal/{825ac334.js → state-db358714.js} +2 -2
  162. package/_internal/state-db358714.js.map +1 -0
  163. package/_internal/{2a3d237c.js → useBooleanState-2a3d237c.js} +1 -1
  164. package/_internal/useBooleanState-2a3d237c.js.map +1 -0
  165. package/_internal/{d5f316cb.js → useCallbackOnEscape-ea4d9eb4.js} +3 -3
  166. package/_internal/useCallbackOnEscape-ea4d9eb4.js.map +1 -0
  167. package/_internal/{36bd7352.js → useDisableBodyScroll-36bd7352.js} +1 -1
  168. package/_internal/useDisableBodyScroll-36bd7352.js.map +1 -0
  169. package/_internal/{b8667090.js → useDisableStateProps-fffc365f.js} +2 -2
  170. package/_internal/useDisableStateProps-fffc365f.js.map +1 -0
  171. package/_internal/{5fe09341.js → useFocusTrap-c3c6378b.js} +4 -4
  172. package/_internal/useFocusTrap-c3c6378b.js.map +1 -0
  173. package/_internal/{3a1facc0.js → useId-3a1facc0.js} +1 -1
  174. package/_internal/useId-3a1facc0.js.map +1 -0
  175. package/_internal/{7daf0f24.js → useRovingTabIndex-7daf0f24.js} +1 -1
  176. package/_internal/useRovingTabIndex-7daf0f24.js.map +1 -0
  177. package/_internal/{e6dd117e.js → useTransitionVisibility-321fdbfa.js} +2 -2
  178. package/_internal/useTransitionVisibility-321fdbfa.js.map +1 -0
  179. package/_internal/{37b007a4.js → wrapChildrenIconWithSpaces-f86106ce.js} +3 -3
  180. package/_internal/wrapChildrenIconWithSpaces-f86106ce.js.map +1 -0
  181. package/index.d.ts +7 -352
  182. package/index.js +65 -111
  183. package/index.js.map +1 -1
  184. package/package.json +3 -3
  185. package/utils/index.d.ts +1 -1
  186. package/utils/index.js +3 -3
  187. package/_internal/0420e67b.js.map +0 -1
  188. package/_internal/0a490b07.js +0 -75
  189. package/_internal/0a490b07.js.map +0 -1
  190. package/_internal/0b9c76cb.js +0 -6
  191. package/_internal/0b9c76cb.js.map +0 -1
  192. package/_internal/0be1006e.js.map +0 -1
  193. package/_internal/0d1a078c.js.map +0 -1
  194. package/_internal/15eab19b.js.map +0 -1
  195. package/_internal/179a84d1.js.map +0 -1
  196. package/_internal/193521fa.js.map +0 -1
  197. package/_internal/1a90ea3d.js +0 -51
  198. package/_internal/1a90ea3d.js.map +0 -1
  199. package/_internal/1deba7d7.js +0 -224
  200. package/_internal/1deba7d7.js.map +0 -1
  201. package/_internal/1ea72630.js.map +0 -1
  202. package/_internal/21b83d16.js +0 -137
  203. package/_internal/21b83d16.js.map +0 -1
  204. package/_internal/230173a8.js.map +0 -1
  205. package/_internal/297bed8f.js +0 -457
  206. package/_internal/297bed8f.js.map +0 -1
  207. package/_internal/2a3d237c.js.map +0 -1
  208. package/_internal/2c2b6a89.js.map +0 -1
  209. package/_internal/2f1716fa.js.map +0 -1
  210. package/_internal/2f6c7f84.js.map +0 -1
  211. package/_internal/3181f000.js.map +0 -1
  212. package/_internal/329b5f12.js.map +0 -1
  213. package/_internal/332e9844.js +0 -2
  214. package/_internal/332e9844.js.map +0 -1
  215. package/_internal/34c59f5b.js.map +0 -1
  216. package/_internal/36bd7352.js.map +0 -1
  217. package/_internal/370bdaed.js.map +0 -1
  218. package/_internal/37b007a4.js.map +0 -1
  219. package/_internal/3a1facc0.js.map +0 -1
  220. package/_internal/3a4e4636.js.map +0 -1
  221. package/_internal/3e653144.js.map +0 -1
  222. package/_internal/3f86608e.js.map +0 -1
  223. package/_internal/478b5c92.js.map +0 -1
  224. package/_internal/4962be5b.js +0 -121
  225. package/_internal/4962be5b.js.map +0 -1
  226. package/_internal/49bbeed3.js +0 -6
  227. package/_internal/49bbeed3.js.map +0 -1
  228. package/_internal/4cd870a5.js.map +0 -1
  229. package/_internal/4daccdd5.js.map +0 -1
  230. package/_internal/501f2f9f.js.map +0 -1
  231. package/_internal/5e7b90e2.js +0 -2
  232. package/_internal/5e7b90e2.js.map +0 -1
  233. package/_internal/5ec059fe.js.map +0 -1
  234. package/_internal/5f8f9454.js.map +0 -1
  235. package/_internal/5fe09341.js.map +0 -1
  236. package/_internal/628468c4.js.map +0 -1
  237. package/_internal/6589b796.js +0 -280
  238. package/_internal/6589b796.js.map +0 -1
  239. package/_internal/65f91970.js.map +0 -1
  240. package/_internal/66f691d3.js +0 -74
  241. package/_internal/66f691d3.js.map +0 -1
  242. package/_internal/68c10f98.js.map +0 -1
  243. package/_internal/690ca33e.js +0 -109
  244. package/_internal/690ca33e.js.map +0 -1
  245. package/_internal/6ca04271.js +0 -108
  246. package/_internal/6ca04271.js.map +0 -1
  247. package/_internal/6da19518.js.map +0 -1
  248. package/_internal/7093ba23.js.map +0 -1
  249. package/_internal/74a4a214.js +0 -82
  250. package/_internal/74a4a214.js.map +0 -1
  251. package/_internal/76be70dd.js.map +0 -1
  252. package/_internal/78df9309.js.map +0 -1
  253. package/_internal/7b221b05.js +0 -9
  254. package/_internal/7b221b05.js.map +0 -1
  255. package/_internal/7daf0f24.js.map +0 -1
  256. package/_internal/7f54e947.js.map +0 -1
  257. package/_internal/825ac334.js.map +0 -1
  258. package/_internal/827b804a.js +0 -6
  259. package/_internal/827b804a.js.map +0 -1
  260. package/_internal/84dfe68f.js.map +0 -1
  261. package/_internal/85e3a5ca.js.map +0 -1
  262. package/_internal/86aa4aa4.js.map +0 -1
  263. package/_internal/88ec77c2.js +0 -130
  264. package/_internal/88ec77c2.js.map +0 -1
  265. package/_internal/8ab42752.js.map +0 -1
  266. package/_internal/95cfd814.js.map +0 -1
  267. package/_internal/9a4dfad0.js.map +0 -1
  268. package/_internal/9c9df5f2.js.map +0 -1
  269. package/_internal/9d1336a1.js.map +0 -1
  270. package/_internal/9fdc715b.js.map +0 -1
  271. package/_internal/a003602b.js +0 -116
  272. package/_internal/a003602b.js.map +0 -1
  273. package/_internal/a34639bd.js +0 -97
  274. package/_internal/a34639bd.js.map +0 -1
  275. package/_internal/a84f4981.js.map +0 -1
  276. package/_internal/b0a7a999.js.map +0 -1
  277. package/_internal/b0b2e33d.js.map +0 -1
  278. package/_internal/b1af5979.js.map +0 -1
  279. package/_internal/b477da26.js.map +0 -1
  280. package/_internal/b8667090.js.map +0 -1
  281. package/_internal/bae266a9.js.map +0 -1
  282. package/_internal/be6da9b0.js.map +0 -1
  283. package/_internal/c0414b89.js.map +0 -1
  284. package/_internal/c2388b10.js.map +0 -1
  285. package/_internal/c459a04d.js +0 -148
  286. package/_internal/c459a04d.js.map +0 -1
  287. package/_internal/c6ca7494.js +0 -2
  288. package/_internal/c6ca7494.js.map +0 -1
  289. package/_internal/cdddaed8.js.map +0 -1
  290. package/_internal/d0dd1815.js +0 -10
  291. package/_internal/d0dd1815.js.map +0 -1
  292. package/_internal/d45e3f16.js +0 -15
  293. package/_internal/d45e3f16.js.map +0 -1
  294. package/_internal/d5f316cb.js.map +0 -1
  295. package/_internal/d95844c1.d.ts +0 -7
  296. package/_internal/db4fdc7b.js.map +0 -1
  297. package/_internal/dbe0cf24.js +0 -75
  298. package/_internal/dbe0cf24.js.map +0 -1
  299. package/_internal/de24f857.js +0 -4
  300. package/_internal/de24f857.js.map +0 -1
  301. package/_internal/e2afb13f.js +0 -75
  302. package/_internal/e2afb13f.js.map +0 -1
  303. package/_internal/e52f0d3f.js +0 -94
  304. package/_internal/e52f0d3f.js.map +0 -1
  305. package/_internal/e6dd117e.js.map +0 -1
  306. package/_internal/e806b848.js.map +0 -1
  307. package/_internal/ea04260d.js.map +0 -1
  308. package/_internal/eaa8b1d8.js.map +0 -1
  309. package/_internal/eaf6c45a.js +0 -4
  310. package/_internal/eaf6c45a.js.map +0 -1
  311. package/_internal/edab29ce.js.map +0 -1
  312. package/_internal/ef5d1aac.js +0 -4
  313. package/_internal/ef5d1aac.js.map +0 -1
  314. package/_internal/f0900583.js +0 -142
  315. package/_internal/f0d7d6ea.js.map +0 -1
  316. package/_internal/f23cdf84.js.map +0 -1
  317. package/_internal/f52e979e.js +0 -3
  318. package/_internal/f52e979e.js.map +0 -1
  319. package/_internal/f5508d3d.js.map +0 -1
  320. package/_internal/f93fe83e.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Thumbnail-30d2a781.js","sources":["../../src/components/thumbnail/useImageLoad.ts","../../src/components/thumbnail/useFocusPointStyle.tsx","../../src/components/thumbnail/Thumbnail.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type LoadingState = 'isLoading' | 'isLoaded' | 'hasError';\n\nfunction getState(img: HTMLImageElement | null | undefined, event?: Event) {\n // Error event occurred or image has no source.\n if (event?.type === 'error' || (img?.complete && !img.getAttribute('src'))) {\n return 'hasError';\n }\n // Image is undefined or incomplete.\n if (!img || !img.complete) {\n return 'isLoading';\n }\n // Else loaded.\n return 'isLoaded';\n}\n\nexport function useImageLoad(imageURL: string, imgRef?: HTMLImageElement): LoadingState {\n const [state, setState] = useState<LoadingState>(getState(imgRef));\n\n // Update state when changing image URL or DOM reference.\n useEffect(() => {\n setState(getState(imgRef));\n }, [imageURL, imgRef]);\n\n // Listen to `load` and `error` event on image\n useEffect(() => {\n const img = imgRef;\n if (!img) return undefined;\n const update = (event?: Event) => setState(getState(img, event));\n img.addEventListener('load', update);\n img.addEventListener('error', update);\n return () => {\n img.removeEventListener('load', update);\n img.removeEventListener('error', update);\n };\n }, [imgRef, imgRef?.src]);\n\n return state;\n}\n","import { CSSProperties, useEffect, useMemo, useState } from 'react';\nimport { AspectRatio } from '@lumx/core/js/constants';\nimport { ThumbnailProps } from '@lumx/react/components/thumbnail/Thumbnail';\nimport { RectSize } from '@lumx/react/utils/type';\n\n// Calculate shift to center the focus point in the container.\nexport function shiftPosition({\n scale,\n focusPoint,\n imageSize,\n containerSize,\n}: {\n scale: number;\n focusPoint: number;\n imageSize: number;\n containerSize: number;\n}) {\n const scaledSize = imageSize / scale;\n if (scaledSize === containerSize) return 0;\n\n const scaledFocusHeight = focusPoint * scaledSize;\n const startFocus = scaledFocusHeight - containerSize / 2;\n const shift = startFocus / (scaledSize - containerSize);\n\n return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);\n}\n\n// Compute CSS properties to apply the focus point.\nexport const useFocusPointStyle = (\n { image, aspectRatio, focusPoint, imgProps: { width, height } = {} }: ThumbnailProps,\n element: HTMLImageElement | undefined,\n isLoaded: boolean,\n): CSSProperties => {\n // Get natural image size from imgProps or img element.\n const imageSize: RectSize | undefined = useMemo(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) return undefined;\n if (typeof width === 'number' && typeof height === 'number') return { width, height };\n if (element && isLoaded) return { width: element.naturalWidth, height: element.naturalHeight };\n return undefined;\n }, [aspectRatio, element, focusPoint?.x, focusPoint?.y, height, image, isLoaded, width]);\n\n // Get container size (dependant on imageSize).\n const [containerSize, setContainerSize] = useState<RectSize | undefined>(undefined);\n useEffect(\n function updateContainerSize() {\n const cWidth = element?.offsetWidth;\n const cHeight = element?.offsetHeight;\n if (cWidth && cHeight) {\n // Update only if needed.\n setContainerSize((oldContainerSize) =>\n oldContainerSize?.width === cWidth && oldContainerSize.height === cHeight\n ? oldContainerSize\n : { width: cWidth, height: cHeight },\n );\n } else if (imageSize) {\n // Wait for a render (in case the container size is dependent on the image size).\n requestAnimationFrame(updateContainerSize);\n }\n },\n [element?.offsetHeight, element?.offsetWidth, imageSize],\n );\n\n // Compute style.\n const style: CSSProperties = useMemo(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) {\n return {};\n }\n if (!element || !imageSize) {\n // Focus point can be computed but now right now (image size unknown).\n return { visibility: 'hidden' };\n }\n if (!containerSize || !imageSize.height || !imageSize.width) {\n // Missing container or image size abort focus point compute.\n return {};\n }\n\n const heightScale = imageSize.height / containerSize.height;\n const widthScale = imageSize.width / containerSize.width;\n const scale = Math.min(widthScale, heightScale);\n\n // Focus Y relative to the top (instead of the center)\n const focusPointFromTop = Math.abs((focusPoint?.y || 0) - 1) / 2;\n const y = shiftPosition({\n scale,\n focusPoint: focusPointFromTop,\n imageSize: imageSize.height,\n containerSize: containerSize.height,\n });\n\n // Focus X relative to the left (instead of the center)\n const focusPointFromLeft = Math.abs((focusPoint?.x || 0) + 1) / 2;\n const x = shiftPosition({\n scale,\n focusPoint: focusPointFromLeft,\n imageSize: imageSize.width,\n containerSize: containerSize.width,\n });\n\n const objectPosition = `${x}% ${y}%`;\n\n return { objectPosition };\n }, [aspectRatio, containerSize, element, focusPoint?.x, focusPoint?.y, image, imageSize]);\n\n return style;\n};\n","import React, {\n CSSProperties,\n ImgHTMLAttributes,\n KeyboardEventHandler,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n Ref,\n useState,\n} from 'react';\n\nimport classNames from 'classnames';\n\nimport { AspectRatio, HorizontalAlignment, Icon, Size, Theme, ThumbnailObjectFit } from '@lumx/react';\nimport { Falsy, GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { mdiImageBroken } from '@lumx/icons';\nimport { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { useImageLoad } from '@lumx/react/components/thumbnail/useImageLoad';\nimport { useFocusPointStyle } from '@lumx/react/components/thumbnail/useFocusPointStyle';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useDisableStateProps } from '@lumx/react/utils/disabled';\nimport { RawClickable } from '@lumx/react/utils/react/RawClickable';\nimport { FocusPoint, ThumbnailSize, ThumbnailVariant } from './types';\n\ntype ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ThumbnailProps extends GenericProps, HasTheme {\n /** Alignment of the thumbnail in it's parent (requires flex parent). */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Image aspect ratio. */\n aspectRatio?: AspectRatio;\n /** Badge. */\n badge?: ReactElement | Falsy;\n /** Image cross origin resource policy. */\n crossOrigin?: ImgHTMLProps['crossOrigin'];\n /** Fallback icon (SVG path) or react node when image fails to load. */\n fallback?: string | ReactNode;\n /** Whether the thumbnail should fill it's parent size (requires flex parent) or not. */\n fillHeight?: boolean;\n /** Apply relative vertical and horizontal shift (from -1 to 1) on the image position inside the thumbnail. */\n focusPoint?: FocusPoint;\n /** Image URL. */\n image: string;\n /** Props to inject into the native <img> element. */\n imgProps?: ImgHTMLProps;\n /** Reference to the native <img> element. */\n imgRef?: Ref<HTMLImageElement>;\n /** Set to true to force the display of the loading skeleton. */\n isLoading?: boolean;\n /** Set how the image should fit when its aspect ratio is constrained */\n objectFit?: ThumbnailObjectFit;\n /** Size variant of the component. */\n size?: ThumbnailSize;\n /** Image loading mode. */\n loading?: ImgHTMLProps['loading'];\n /** Ref of an existing placeholder image to display while loading. */\n loadingPlaceholderImageRef?: React.RefObject<HTMLImageElement>;\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Variant of the component. */\n variant?: ThumbnailVariant;\n /** Props to pass to the link wrapping the thumbnail. */\n linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Thumbnail';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ThumbnailProps> = {\n fallback: mdiImageBroken,\n loading: 'lazy',\n};\n\n/**\n * Thumbnail component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Thumbnail = forwardRef<ThumbnailProps>((props, ref) => {\n const { isAnyDisabled, otherProps, disabledStateProps } = useDisableStateProps(props);\n const defaultTheme = useTheme() || Theme.light;\n const {\n align,\n alt,\n aspectRatio = AspectRatio.original,\n badge,\n className,\n crossOrigin,\n fallback = DEFAULT_PROPS.fallback,\n fillHeight,\n // `focusPoint` needs to be here to remove it from `forwardedProps`.\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n focusPoint,\n image,\n imgProps,\n imgRef: propImgRef,\n isLoading: isLoadingProp,\n objectFit,\n loading = DEFAULT_PROPS.loading,\n loadingPlaceholderImageRef,\n size,\n theme = defaultTheme,\n variant,\n linkProps,\n linkAs,\n ...forwardedProps\n } = otherProps;\n const [imgElement, setImgElement] = useState<HTMLImageElement>();\n\n // Image loading state.\n const loadingState = useImageLoad(image, imgElement);\n const isLoaded = loadingState === 'isLoaded';\n const isLoading = isLoadingProp || loadingState === 'isLoading';\n const hasError = loadingState === 'hasError';\n\n // Focus point.\n const focusPointStyle = useFocusPointStyle(props, imgElement, isLoaded);\n\n const hasIconErrorFallback = hasError && typeof fallback === 'string';\n const hasCustomErrorFallback = hasError && !hasIconErrorFallback;\n const imageErrorStyle: CSSProperties = {};\n if (hasIconErrorFallback) {\n // Keep the image layout on icon fallback.\n imageErrorStyle.visibility = 'hidden';\n } else if (hasCustomErrorFallback) {\n // Remove the image on custom fallback.\n imageErrorStyle.display = 'none';\n }\n\n const isLink = Boolean(linkProps?.href || linkAs);\n const isClickable = !isAnyDisabled && Boolean(isLink || !!forwardedProps.onClick);\n\n const Wrapper: any = isClickable ? RawClickable : 'div';\n const wrapperProps = { ...forwardedProps };\n if (isClickable) {\n Object.assign(wrapperProps, { as: linkAs || (linkProps?.href ? 'a' : 'button') }, disabledStateProps);\n if (isLink) {\n Object.assign(wrapperProps, linkProps);\n } else {\n wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;\n }\n }\n\n // If we have a loading placeholder image that is really loaded (complete)\n const loadingPlaceholderImage =\n (isLoading && loadingPlaceholderImageRef?.current?.complete && loadingPlaceholderImageRef?.current) ||\n undefined;\n\n // Set loading placeholder image as background\n const loadingStyle = loadingPlaceholderImage\n ? { backgroundImage: `url(${loadingPlaceholderImage.src})` }\n : undefined;\n\n return (\n <Wrapper\n {...wrapperProps}\n ref={ref}\n className={classNames(\n linkProps?.className,\n className,\n handleBasicClasses({\n align,\n aspectRatio,\n prefix: CLASSNAME,\n size,\n theme,\n variant,\n isClickable,\n hasError,\n hasIconErrorFallback,\n hasCustomErrorFallback,\n isLoading,\n objectFit,\n hasBadge: !!badge,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <span className={`${CLASSNAME}__background`}>\n <img\n // Use placeholder image size\n width={loadingPlaceholderImage?.naturalWidth}\n height={loadingPlaceholderImage?.naturalHeight}\n {...imgProps}\n style={{\n // Reserve space while loading (when possible)\n width: isLoading ? imgProps?.width || loadingPlaceholderImage?.naturalWidth : undefined,\n ...imgProps?.style,\n ...imageErrorStyle,\n ...focusPointStyle,\n ...loadingStyle,\n }}\n ref={useMergeRefs(setImgElement, propImgRef)}\n className={classNames(\n handleBasicClasses({\n prefix: `${CLASSNAME}__image`,\n isLoading,\n hasDefinedSize: Boolean(imgProps?.height && imgProps.width),\n }),\n imgProps?.className,\n )}\n crossOrigin={crossOrigin}\n src={image}\n alt={alt}\n loading={loading}\n />\n {!isLoading && hasError && (\n <span className={`${CLASSNAME}__fallback`}>\n {hasIconErrorFallback ? (\n <Icon icon={fallback as string} size={Size.xxs} theme={theme} />\n ) : (\n fallback\n )}\n </span>\n )}\n </span>\n {badge &&\n React.cloneElement(badge, { className: classNames(`${CLASSNAME}__badge`, badge.props.className) })}\n </Wrapper>\n );\n});\nThumbnail.displayName = COMPONENT_NAME;\nThumbnail.className = CLASSNAME;\nThumbnail.defaultProps = DEFAULT_PROPS;\n"],"names":["getState","img","event","type","complete","getAttribute","useImageLoad","imageURL","imgRef","state","setState","useState","useEffect","undefined","update","addEventListener","removeEventListener","src","shiftPosition","scale","focusPoint","imageSize","containerSize","scaledSize","scaledFocusHeight","startFocus","shift","Math","floor","max","min","useFocusPointStyle","image","aspectRatio","imgProps","width","height","element","isLoaded","useMemo","AspectRatio","original","x","y","naturalWidth","naturalHeight","setContainerSize","updateContainerSize","cWidth","offsetWidth","cHeight","offsetHeight","oldContainerSize","requestAnimationFrame","style","visibility","heightScale","widthScale","focusPointFromTop","abs","focusPointFromLeft","objectPosition","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","fallback","mdiImageBroken","loading","Thumbnail","forwardRef","props","ref","isAnyDisabled","otherProps","disabledStateProps","useDisableStateProps","defaultTheme","useTheme","Theme","light","align","alt","badge","className","crossOrigin","fillHeight","propImgRef","isLoading","isLoadingProp","objectFit","loadingPlaceholderImageRef","size","theme","variant","linkProps","linkAs","forwardedProps","imgElement","setImgElement","loadingState","hasError","focusPointStyle","hasIconErrorFallback","hasCustomErrorFallback","imageErrorStyle","display","isLink","Boolean","href","isClickable","onClick","Wrapper","RawClickable","wrapperProps","Object","assign","as","loadingPlaceholderImage","current","loadingStyle","backgroundImage","React","createElement","_extends","classNames","handleBasicClasses","prefix","hasBadge","useMergeRefs","hasDefinedSize","Icon","icon","Size","xxs","cloneElement","displayName","defaultProps"],"mappings":"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"}
@@ -1,14 +1,13 @@
1
+ import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
1
2
  import React__default from 'react';
2
- import { K as Kind, j as ColorPalette, m as getRootClassName, c as Size, n as forwardRef, l as classNames, d as Emphasis } from './6589b796.js';
3
- import { h as handleBasicClasses } from './e2afb13f.js';
4
- import { u as useId } from './3a1facc0.js';
5
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
6
- import { m as mdiAlert, a as mdiInformation } from './49bbeed3.js';
7
- import { m as mdiCheckCircle } from './de24f857.js';
8
- import { m as mdiAlertCircle, I as Icon } from './8ab42752.js';
9
- import { Dialog } from './2f1716fa.js';
10
- import { Toolbar } from './bae266a9.js';
11
- import { a as Button } from './a34639bd.js';
3
+ import { mdiAlert, mdiInformation, mdiCheckCircle, mdiAlertCircle } from '@lumx/icons';
4
+ import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
5
+ import { u as useId } from '../useId-3a1facc0.js';
6
+ import { Dialog } from './dialog-7dbcb485.js';
7
+ import { Toolbar } from './toolbar-155562be.js';
8
+ import { Icon } from './icon-2e7345ad.js';
9
+ import { a as Button } from '../Button-f19e18df.js';
10
+ import { Kind, ColorPalette, Size, Emphasis } from '@lumx/core/js/constants';
12
11
 
13
12
  /**
14
13
  * Associative map from message kind to color and icon.
@@ -97,7 +96,7 @@ const AlertDialog = forwardRef((props, ref) => {
97
96
  onClick: cancelOnClick,
98
97
  ...forwardedCancelProps
99
98
  } = cancelProps || {};
100
- return /*#__PURE__*/jsxs(Dialog, {
99
+ return /*#__PURE__*/React__default.createElement(Dialog, _extends({
101
100
  ref: ref,
102
101
  focusElement: cancelProps ? cancelButtonRef : confirmationButtonRef,
103
102
  size: size,
@@ -111,52 +110,38 @@ const AlertDialog = forwardRef((props, ref) => {
111
110
  className: classNames(className, handleBasicClasses({
112
111
  kind,
113
112
  prefix: CLASSNAME
114
- })),
115
- ...forwardedProps,
116
- children: [/*#__PURE__*/jsx("header", {
117
- children: /*#__PURE__*/jsx(Toolbar, {
118
- className: "lumx-spacing-margin-horizontal",
119
- before: /*#__PURE__*/jsx(Icon, {
120
- icon: icon,
121
- size: Size.s,
122
- color: color
123
- }),
124
- label: /*#__PURE__*/jsx("h2", {
125
- id: titleId,
126
- className: "lumx-typography-title",
127
- children: title
128
- })
129
- })
130
- }), children && /*#__PURE__*/jsx(DescriptionElement, {
131
- id: descriptionId,
132
- className: "lumx-typography-body2 lumx-spacing-padding-vertical-big lumx-spacing-padding-horizontal-huge",
133
- children: children
134
- }), /*#__PURE__*/jsx("footer", {
135
- children: /*#__PURE__*/jsx(Toolbar, {
136
- className: "lumx-spacing-margin-horizontal",
137
- after: /*#__PURE__*/jsxs(Fragment, {
138
- children: [cancelProps && /*#__PURE__*/jsx(Button, {
139
- ...forwardedCancelProps,
140
- ref: cancelButtonRef,
141
- emphasis: Emphasis.medium,
142
- onClick: cancelOnClick,
143
- children: cancelLabel
144
- }), /*#__PURE__*/jsx(Button, {
145
- ...forwardedConfirmProps,
146
- ref: confirmationButtonRef,
147
- color: color,
148
- className: "lumx-spacing-margin-left-regular",
149
- onClick: confirmOnClick,
150
- children: confirmLabel
151
- })]
152
- })
153
- })
154
- })]
155
- });
113
+ }))
114
+ }, forwardedProps), /*#__PURE__*/React__default.createElement("header", null, /*#__PURE__*/React__default.createElement(Toolbar, {
115
+ className: "lumx-spacing-margin-horizontal",
116
+ before: /*#__PURE__*/React__default.createElement(Icon, {
117
+ icon: icon,
118
+ size: Size.s,
119
+ color: color
120
+ }),
121
+ label: /*#__PURE__*/React__default.createElement("h2", {
122
+ id: titleId,
123
+ className: "lumx-typography-title"
124
+ }, title)
125
+ })), children && /*#__PURE__*/React__default.createElement(DescriptionElement, {
126
+ id: descriptionId,
127
+ className: "lumx-typography-body2 lumx-spacing-padding-vertical-big lumx-spacing-padding-horizontal-huge"
128
+ }, children), /*#__PURE__*/React__default.createElement("footer", null, /*#__PURE__*/React__default.createElement(Toolbar, {
129
+ className: "lumx-spacing-margin-horizontal",
130
+ after: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, cancelProps && /*#__PURE__*/React__default.createElement(Button, _extends({}, forwardedCancelProps, {
131
+ ref: cancelButtonRef,
132
+ emphasis: Emphasis.medium,
133
+ onClick: cancelOnClick
134
+ }), cancelLabel), /*#__PURE__*/React__default.createElement(Button, _extends({}, forwardedConfirmProps, {
135
+ ref: confirmationButtonRef,
136
+ color: color,
137
+ className: "lumx-spacing-margin-left-regular",
138
+ onClick: confirmOnClick
139
+ }), confirmLabel))
140
+ })));
156
141
  });
157
142
  AlertDialog.displayName = COMPONENT_NAME;
158
143
  AlertDialog.className = CLASSNAME;
159
144
  AlertDialog.defaultProps = DEFAULT_PROPS;
160
145
 
161
146
  export { AlertDialog };
162
- //# sourceMappingURL=3a4e4636.js.map
147
+ //# sourceMappingURL=alert-dialog-8f1c163c.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"alert-dialog-8f1c163c.js","sources":["../../../src/components/alert-dialog/AlertDialog.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport {\n DialogProps,\n Dialog,\n Button,\n Emphasis,\n ColorPalette,\n Icon,\n Size,\n Kind,\n Toolbar,\n ButtonProps,\n} from '@lumx/react';\nimport { mdiAlert, mdiAlertCircle, mdiCheckCircle, mdiInformation } from '@lumx/icons';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useId } from '@lumx/react/hooks/useId';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nexport interface AlertDialogProps extends Omit<DialogProps, 'header' | 'footer'> {\n /** Message variant. */\n kind?: Kind;\n /** Dialog title. */\n title?: string;\n /** Props forwarded to the confirm button */\n confirmProps: ButtonProps & {\n onClick(): void;\n label: string;\n };\n /**\n * Props forwarded to the cancel button.\n * Will not render a cancel button if undefined.\n */\n cancelProps?: ButtonProps & {\n onClick(): void;\n label: string;\n };\n /**\n * Children\n */\n children?: React.ReactNode;\n}\n\n/**\n * Associative map from message kind to color and icon.\n */\nconst CONFIG = {\n [Kind.error]: { color: ColorPalette.red, icon: mdiAlert },\n [Kind.info]: { color: ColorPalette.blue, icon: mdiInformation },\n [Kind.success]: { color: ColorPalette.green, icon: mdiCheckCircle },\n [Kind.warning]: { color: ColorPalette.yellow, icon: mdiAlertCircle },\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'AlertDialog';\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<DialogProps> = {\n size: Size.tiny,\n kind: Kind.info,\n};\n\n/**\n * AlertDialog component.\n *\n * An alert dialog is a modal dialog that interrupts the user's workflow to\n * communicate an important message and acquire a response.\n *\n * It should not have a complex content.\n * Children of this component should only be strings, paragraphs or links.\n */\nexport const AlertDialog = forwardRef<AlertDialogProps, HTMLDivElement>((props, ref) => {\n const {\n id,\n title,\n className,\n cancelProps,\n confirmProps,\n kind = DEFAULT_PROPS.kind,\n size = DEFAULT_PROPS.size,\n dialogProps,\n children,\n ...forwardedProps\n } = props;\n\n const cancelButtonRef = React.useRef(null);\n const confirmationButtonRef = React.useRef(null);\n const { color, icon } = CONFIG[kind as Kind] || {};\n\n // Define a unique ID to target title and description for aria attributes.\n const generatedId = useId();\n const uniqueId = id || generatedId;\n const titleId = `${uniqueId}-title`;\n const descriptionId = `${uniqueId}-description`;\n\n // If content is a string, set in a paragraph.\n const DescriptionElement = typeof children === 'string' ? 'p' : 'div';\n\n const { label: confirmLabel, onClick: confirmOnClick, ...forwardedConfirmProps } = confirmProps;\n const { label: cancelLabel, onClick: cancelOnClick, ...forwardedCancelProps } = cancelProps || {};\n\n return (\n <Dialog\n ref={ref}\n focusElement={cancelProps ? cancelButtonRef : confirmationButtonRef}\n size={size}\n dialogProps={{\n id: uniqueId,\n role: 'alertdialog',\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n ...dialogProps,\n }}\n className={classNames(\n className,\n handleBasicClasses({\n kind,\n prefix: CLASSNAME,\n }),\n )}\n {...forwardedProps}\n >\n <header>\n <Toolbar\n className=\"lumx-spacing-margin-horizontal\"\n before={<Icon icon={icon} size={Size.s} color={color} />}\n label={\n <h2 id={titleId} className=\"lumx-typography-title\">\n {title}\n </h2>\n }\n />\n </header>\n\n {children && (\n <DescriptionElement\n id={descriptionId}\n className=\"lumx-typography-body2 lumx-spacing-padding-vertical-big lumx-spacing-padding-horizontal-huge\"\n >\n {children}\n </DescriptionElement>\n )}\n\n <footer>\n <Toolbar\n className=\"lumx-spacing-margin-horizontal\"\n after={\n <>\n {cancelProps && (\n <Button\n {...forwardedCancelProps}\n ref={cancelButtonRef}\n emphasis={Emphasis.medium}\n onClick={cancelOnClick}\n >\n {cancelLabel}\n </Button>\n )}\n <Button\n {...forwardedConfirmProps}\n ref={confirmationButtonRef}\n color={color}\n className=\"lumx-spacing-margin-left-regular\"\n onClick={confirmOnClick}\n >\n {confirmLabel}\n </Button>\n </>\n }\n />\n </footer>\n </Dialog>\n );\n});\n\nAlertDialog.displayName = COMPONENT_NAME;\nAlertDialog.className = CLASSNAME;\nAlertDialog.defaultProps = DEFAULT_PROPS;\n"],"names":["CONFIG","Kind","error","color","ColorPalette","red","icon","mdiAlert","info","blue","mdiInformation","success","green","mdiCheckCircle","warning","yellow","mdiAlertCircle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","tiny","kind","AlertDialog","forwardRef","props","ref","id","title","className","cancelProps","confirmProps","dialogProps","children","forwardedProps","cancelButtonRef","React","useRef","confirmationButtonRef","generatedId","useId","uniqueId","titleId","descriptionId","DescriptionElement","label","confirmLabel","onClick","confirmOnClick","forwardedConfirmProps","cancelLabel","cancelOnClick","forwardedCancelProps","createElement","Dialog","_extends","focusElement","role","classNames","handleBasicClasses","prefix","Toolbar","before","Icon","s","after","Fragment","Button","emphasis","Emphasis","medium","displayName","defaultProps"],"mappings":"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"}
@@ -1,15 +1,20 @@
1
+ import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
1
2
  import { useRef } from 'react';
2
- import { m as getRootClassName, n as forwardRef, l as classNames, c as Size } from './6589b796.js';
3
- import { u as useFocus } from './84dfe68f.js';
4
- import { m as mergeRefs } from './f0d7d6ea.js';
5
- import { u as useTheme } from './3181f000.js';
6
- import { u as useDisableStateProps } from './b8667090.js';
7
- import { jsxs, jsx } from 'react/jsx-runtime';
8
- import { TextField } from './b0b2e33d.js';
9
- import { Dropdown } from './1ea72630.js';
10
- import { C as Chip } from './85e3a5ca.js';
11
- import { m as mdiClose } from './eaf6c45a.js';
12
- import { I as Icon } from './8ab42752.js';
3
+ import { getRootClassName } from '@lumx/core/js/utils/className';
4
+ import { u as useFocus } from '../index-f415b08e.js';
5
+ import { m as mergeRefs } from '../mergeRefs-f0d7d6ea.js';
6
+ import { u as useTheme } from '../ThemeContext-3181f000.js';
7
+ import { u as useDisableStateProps } from '../useDisableStateProps-fffc365f.js';
8
+ import { TextField } from './text-field-82733568.js';
9
+ import { Dropdown } from './dropdown-38b0b6a0.js';
10
+ import { mdiClose } from '@lumx/icons';
11
+ import { C as Chip } from '../Chip-4c572eec.js';
12
+ import { Icon } from './icon-2e7345ad.js';
13
+ import { Size } from '@lumx/core/js/constants';
14
+
15
+ /**
16
+ * Defines the props of the component.
17
+ */
13
18
 
14
19
  /**
15
20
  * Component display name.
@@ -83,53 +88,54 @@ const Autocomplete = forwardRef((props, ref) => {
83
88
  const inputAnchorRef = useRef(null);
84
89
  const textFieldRef = useRef(null);
85
90
  useFocus(inputAnchorRef.current, !isOpen && shouldFocusOnClose);
86
- return /*#__PURE__*/jsxs("div", {
87
- ref: ref,
88
- ...forwardedProps,
89
- className: classNames(className, CLASSNAME$1),
90
- children: [/*#__PURE__*/jsx(TextField, {
91
- ...textFieldProps,
92
- chips: chips,
93
- error: error,
94
- hasError: hasError,
95
- helper: helper,
96
- icon: icon,
97
- inputRef: mergeRefs(inputAnchorRef, inputRef),
98
- clearButtonProps: clearButtonProps,
99
- ...disabledStateProps,
100
- isRequired: isRequired,
101
- isValid: isValid,
102
- label: label,
103
- name: name,
104
- onBlur: onBlur,
105
- onChange: onChange,
106
- onFocus: onFocus,
107
- placeholder: placeholder,
108
- textFieldRef: textFieldRef,
109
- theme: theme,
110
- value: value
111
- }), /*#__PURE__*/jsx(Dropdown, {
112
- anchorRef: anchorToInput ? inputAnchorRef : textFieldRef,
113
- closeOnClick: closeOnClick,
114
- closeOnClickAway: closeOnClickAway,
115
- closeOnEscape: closeOnEscape,
116
- focusAnchorOnClose: focusAnchorOnClose,
117
- fitToAnchorWidth: fitToAnchorWidth,
118
- isOpen: isOpen,
119
- offset: offset,
120
- onClose: onClose,
121
- onInfiniteScroll: onInfiniteScroll,
122
- placement: placement,
123
- shouldFocusOnOpen: false,
124
- theme: theme,
125
- children: children
126
- })]
127
- });
91
+ return /*#__PURE__*/React.createElement("div", _extends({
92
+ ref: ref
93
+ }, forwardedProps, {
94
+ className: classNames(className, CLASSNAME$1)
95
+ }), /*#__PURE__*/React.createElement(TextField, _extends({}, textFieldProps, {
96
+ chips: chips,
97
+ error: error,
98
+ hasError: hasError,
99
+ helper: helper,
100
+ icon: icon,
101
+ inputRef: mergeRefs(inputAnchorRef, inputRef),
102
+ clearButtonProps: clearButtonProps
103
+ }, disabledStateProps, {
104
+ isRequired: isRequired,
105
+ isValid: isValid,
106
+ label: label,
107
+ name: name,
108
+ onBlur: onBlur,
109
+ onChange: onChange,
110
+ onFocus: onFocus,
111
+ placeholder: placeholder,
112
+ textFieldRef: textFieldRef,
113
+ theme: theme,
114
+ value: value
115
+ })), /*#__PURE__*/React.createElement(Dropdown, {
116
+ anchorRef: anchorToInput ? inputAnchorRef : textFieldRef,
117
+ closeOnClick: closeOnClick,
118
+ closeOnClickAway: closeOnClickAway,
119
+ closeOnEscape: closeOnEscape,
120
+ focusAnchorOnClose: focusAnchorOnClose,
121
+ fitToAnchorWidth: fitToAnchorWidth,
122
+ isOpen: isOpen,
123
+ offset: offset,
124
+ onClose: onClose,
125
+ onInfiniteScroll: onInfiniteScroll,
126
+ placement: placement,
127
+ shouldFocusOnOpen: false,
128
+ theme: theme
129
+ }, children));
128
130
  });
129
131
  Autocomplete.displayName = COMPONENT_NAME$1;
130
132
  Autocomplete.className = CLASSNAME$1;
131
133
  Autocomplete.defaultProps = DEFAULT_PROPS$1;
132
134
 
135
+ /**
136
+ * Defines the props of the component.
137
+ */
138
+
133
139
  /**
134
140
  * Component display name.
135
141
  */
@@ -148,17 +154,17 @@ const DEFAULT_PROPS = {
148
154
  closeOnEscape: true,
149
155
  selectedChipRender(choice, index, onClear, isDisabled) {
150
156
  const onClick = event => onClear && onClear(event, choice);
151
- return /*#__PURE__*/jsx(Chip, {
152
- after: onClear && /*#__PURE__*/jsx(Icon, {
157
+ return /*#__PURE__*/React.createElement(Chip, {
158
+ key: index,
159
+ after: onClear && /*#__PURE__*/React.createElement(Icon, {
153
160
  icon: mdiClose,
154
161
  size: Size.xxs
155
162
  }),
156
163
  isDisabled: isDisabled,
157
164
  size: Size.s,
158
165
  onAfterClick: onClick,
159
- onClick: onClick,
160
- children: choice
161
- }, index);
166
+ onClick: onClick
167
+ }, choice);
162
168
  },
163
169
  values: []
164
170
  };
@@ -214,9 +220,9 @@ const AutocompleteMultiple = forwardRef((props, ref) => {
214
220
  values = DEFAULT_PROPS.values,
215
221
  ...forwardedProps
216
222
  } = otherProps;
217
- return /*#__PURE__*/jsx(Autocomplete, {
218
- ref: ref,
219
- ...forwardedProps,
223
+ return /*#__PURE__*/React.createElement(Autocomplete, _extends({
224
+ ref: ref
225
+ }, forwardedProps, {
220
226
  anchorToInput: anchorToInput,
221
227
  className: classNames(className, CLASSNAME),
222
228
  name: name,
@@ -230,8 +236,8 @@ const AutocompleteMultiple = forwardRef((props, ref) => {
230
236
  helper: helper,
231
237
  icon: icon,
232
238
  inputRef: inputRef,
233
- chips: values && values.map((chip, index) => selectedChipRender?.(chip, index, onClear)),
234
- ...disabledStateProps,
239
+ chips: values && values.map((chip, index) => selectedChipRender?.(chip, index, onClear))
240
+ }, disabledStateProps, {
235
241
  isRequired: isRequired,
236
242
  clearButtonProps: clearButtonProps,
237
243
  isValid: isValid,
@@ -247,13 +253,12 @@ const AutocompleteMultiple = forwardRef((props, ref) => {
247
253
  offset: offset,
248
254
  placement: placement,
249
255
  fitToAnchorWidth: fitToAnchorWidth,
250
- onInfiniteScroll: onInfiniteScroll,
251
- children: children
252
- });
256
+ onInfiniteScroll: onInfiniteScroll
257
+ }), children);
253
258
  });
254
259
  AutocompleteMultiple.displayName = COMPONENT_NAME;
255
260
  AutocompleteMultiple.className = CLASSNAME;
256
261
  AutocompleteMultiple.defaultProps = DEFAULT_PROPS;
257
262
 
258
263
  export { Autocomplete, AutocompleteMultiple };
259
- //# sourceMappingURL=179a84d1.js.map
264
+ //# sourceMappingURL=autocomplete-bfbdeb3c.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"autocomplete-bfbdeb3c.js","sources":["../../../src/components/autocomplete/Autocomplete.tsx","../../../src/components/autocomplete/AutocompleteMultiple.tsx"],"sourcesContent":["import { ReactNode, SyntheticEvent, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Dropdown, DropdownProps, IconButtonProps, Offset, Placement, TextField, TextFieldProps } from '@lumx/react';\n\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { useFocus } from '@lumx/react/hooks/useFocus';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\n\n/**\n * Defines the props of the component.\n */\nexport interface AutocompleteProps extends GenericProps, HasTheme {\n /**\n * Whether the suggestions list should display anchored to the input or to the wrapper.\n * @see {@link DropdownProps#anchorToInput}\n */\n anchorToInput?: boolean;\n /**\n * Props to pass to the clear button (minus those already set by the TextField props).\n * If not specified, the button won't be displayed.\n * @see {@link TextFieldProps#clearButtonProps}\n */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /**\n * Reference to the <input> or <textarea> element.\n * @see {@link TextFieldProps#inputRef}\n */\n inputRef?: TextFieldProps['inputRef'];\n /**\n * The offset that will be applied to the Dropdown position.\n * @see {@link DropdownProps#offset}\n */\n offset?: Offset;\n /**\n * The preferred Dropdown location against the anchor element.\n * @see {@link DropdownProps#placement}\n */\n placement?: Placement;\n /**\n * Manage dropdown width:\n * - `maxWidth`: dropdown not bigger than anchor\n * - `minWidth` or `true`: dropdown not smaller than anchor\n * - `width`: dropdown equal to the anchor.\n * @see {@link DropdownProps#fitToAnchorWidth}\n */\n fitToAnchorWidth?: DropdownProps['fitToAnchorWidth'];\n /**\n * The error related to the component.\n * @see {@link TextFieldProps#error}\n */\n error?: string | ReactNode;\n /**\n * Whether the text field is displayed with error style or not.\n * @see {@link TextFieldProps#hasError}\n */\n hasError?: boolean;\n /**\n * Whether the text box should be focused upon closing the suggestions or not.\n */\n shouldFocusOnClose?: boolean;\n /**\n * The helper message of the text field.\n * @see {@link TextFieldProps#helper}\n */\n helper?: string;\n /**\n * The icon of the text field (SVG path).\n * @see {@link TextFieldProps#icon}\n */\n icon?: string;\n /**\n * Whether the component is disabled or not.\n * @see {@link TextFieldProps#isDisabled}\n */\n isDisabled?: boolean;\n /**\n * Whether the component is required or not.\n * @see {@link TextFieldProps#isRequired}\n */\n isRequired?: boolean;\n /**\n * Whether the text field is displayed with valid style or not.\n * @see {@link TextFieldProps#isValid}\n */\n isValid?: boolean;\n /**\n * The label of the text field displayed in a label tag.\n * @see {@link TextFieldProps#label}\n */\n label?: string;\n /**\n * The placeholder message of the text field.\n * @see {@link TextFieldProps#placeholder}\n */\n placeholder?: string;\n /** List of suggestions to display during autocomplete. */\n children: React.ReactNode;\n /**\n * The list of chips to be displayed before the text field input.\n */\n chips?: React.ReactNode;\n /**\n * The value of the text field.\n * @see {@link TextFieldProps#value}\n */\n value: string;\n /**\n * Whether the suggestions from the autocomplete should be displayed or not.\n * @see {@link DropdownProps#isOpen}\n */\n isOpen: boolean;\n /**\n * The native input name property.\n * @see {@link TextFieldProps#name}\n */\n name?: string;\n /**\n * Whether a click in the Autocomplete dropdown would close it or not.\n * @see {@link DropdownProps#closeOnClick}\n */\n closeOnClick?: boolean;\n /**\n * Whether a click anywhere out of the Autocomplete would close it or not.\n * @see {@link DropdownProps#closeOnClickAway}\n */\n closeOnClickAway?: boolean;\n /**\n * Whether an escape key press would close the Autocomplete or not.\n * @see {@link DropdownProps#closeOnEscape}\n */\n closeOnEscape?: boolean;\n /**\n * Whether the focus should go back on the anchor when dropdown closes and focus is within.\n * @see {@link DropdownProps#focusAnchorOnClose}\n */\n focusAnchorOnClose?: DropdownProps['focusAnchorOnClose'];\n /**\n * The function called on blur.\n * @see {@link TextFieldProps#onBlur}\n */\n onBlur?(event: React.FocusEvent): void;\n /**\n * On change callback.\n * @see {@link TextFieldProps#onChange}\n */\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n /**\n * The function called on close.\n * @see {@link DropdownProps#onClose}\n */\n onClose?(): void;\n /**\n * The function called on focus.\n * @see {@link TextFieldProps#onFocus}\n */\n onFocus?(event: React.FocusEvent): void;\n /**\n * The function called when the bottom of the dropdown is reached.\n * @see {@link DropdownProps#onInfiniteScroll}\n */\n onInfiniteScroll?(): void;\n /**\n * Props forwarded to the underlying TextField component.\n * Only the props not managed by the Autocomplete can be set.\n * @see {@link TextFieldProps}\n */\n textFieldProps?: Partial<TextFieldProps>;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Autocomplete';\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<AutocompleteProps> = {\n anchorToInput: false,\n closeOnClick: false,\n closeOnClickAway: true,\n closeOnEscape: true,\n shouldFocusOnClose: false,\n};\n\n/**\n * Autocomplete component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Autocomplete = forwardRef<AutocompleteProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme();\n const { disabledStateProps, otherProps } = useDisableStateProps(props);\n const {\n anchorToInput = DEFAULT_PROPS.anchorToInput,\n children,\n chips,\n className,\n closeOnClick = DEFAULT_PROPS.closeOnClick,\n closeOnClickAway = DEFAULT_PROPS.closeOnClickAway,\n closeOnEscape = DEFAULT_PROPS.closeOnEscape,\n error,\n fitToAnchorWidth,\n hasError,\n helper,\n icon,\n inputRef,\n clearButtonProps,\n isRequired,\n isOpen,\n isValid,\n label,\n name,\n offset,\n onBlur,\n onChange,\n onClose,\n onFocus,\n onInfiniteScroll,\n placeholder,\n placement,\n shouldFocusOnClose = DEFAULT_PROPS.shouldFocusOnClose,\n theme = defaultTheme,\n value,\n textFieldProps = {},\n focusAnchorOnClose,\n ...forwardedProps\n } = otherProps;\n const inputAnchorRef = useRef<HTMLElement>(null);\n const textFieldRef = useRef(null);\n useFocus(inputAnchorRef.current, !isOpen && shouldFocusOnClose);\n\n return (\n <div ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n <TextField\n {...textFieldProps}\n chips={chips}\n error={error}\n hasError={hasError}\n helper={helper}\n icon={icon}\n inputRef={mergeRefs(inputAnchorRef as React.RefObject<HTMLInputElement>, inputRef)}\n clearButtonProps={clearButtonProps}\n {...disabledStateProps}\n isRequired={isRequired}\n isValid={isValid}\n label={label}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n textFieldRef={textFieldRef}\n theme={theme}\n value={value}\n />\n <Dropdown\n anchorRef={anchorToInput ? inputAnchorRef : textFieldRef}\n closeOnClick={closeOnClick}\n closeOnClickAway={closeOnClickAway}\n closeOnEscape={closeOnEscape}\n focusAnchorOnClose={focusAnchorOnClose}\n fitToAnchorWidth={fitToAnchorWidth}\n isOpen={isOpen}\n offset={offset}\n onClose={onClose}\n onInfiniteScroll={onInfiniteScroll}\n placement={placement}\n shouldFocusOnOpen={false}\n theme={theme}\n >\n {children}\n </Dropdown>\n </div>\n );\n});\nAutocomplete.displayName = COMPONENT_NAME;\nAutocomplete.className = CLASSNAME;\nAutocomplete.defaultProps = DEFAULT_PROPS;\n","import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiClose } from '@lumx/icons';\n\nimport { Autocomplete, AutocompleteProps, Chip, HorizontalAlignment, Icon, Size } from '@lumx/react';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\n\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\n\n/**\n * Defines the props of the component.\n */\nexport interface AutocompleteMultipleProps extends AutocompleteProps {\n /** Selected values. */\n values: any[];\n /** Alignment of the chips in the autocomplete. */\n chipsAlignment?: HorizontalAlignment;\n /** Selected value render function. Default: Renders the value inside of a Chip. */\n selectedChipRender(\n choice: any,\n index: number,\n onClear?: (event: React.MouseEvent, choice: any) => void,\n isDisabled?: boolean,\n ): ReactNode | string;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'AutocompleteMultiple';\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<AutocompleteMultipleProps> = {\n closeOnClickAway: true,\n closeOnEscape: true,\n selectedChipRender(choice, index, onClear, isDisabled) {\n const onClick = (event: React.MouseEvent) => onClear && onClear(event, choice);\n return (\n <Chip\n key={index}\n after={onClear && <Icon icon={mdiClose} size={Size.xxs} />}\n isDisabled={isDisabled}\n size={Size.s}\n onAfterClick={onClick}\n onClick={onClick}\n >\n {choice}\n </Chip>\n );\n },\n values: [],\n};\n\n/**\n * AutocompleteMultiple component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const AutocompleteMultiple = forwardRef<AutocompleteMultipleProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme();\n const { disabledStateProps, otherProps } = useDisableStateProps(props);\n const {\n anchorToInput,\n children,\n // `chipsAlignment` needs to be here to remove it from `forwardedProps`.\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n chipsAlignment,\n className,\n closeOnClickAway = DEFAULT_PROPS.closeOnClickAway,\n closeOnEscape = DEFAULT_PROPS.closeOnEscape,\n fitToAnchorWidth,\n hasError,\n helper,\n icon,\n inputRef,\n clearButtonProps,\n isRequired,\n isOpen,\n isValid,\n label,\n name,\n offset,\n onBlur,\n onChange,\n onClear,\n onClose,\n onFocus,\n onInfiniteScroll,\n onKeyDown,\n placeholder,\n placement,\n selectedChipRender = DEFAULT_PROPS.selectedChipRender,\n shouldFocusOnClose,\n theme = defaultTheme,\n type,\n value,\n values = DEFAULT_PROPS.values,\n ...forwardedProps\n } = otherProps;\n\n return (\n <Autocomplete\n ref={ref}\n {...forwardedProps}\n anchorToInput={anchorToInput}\n className={classNames(className, CLASSNAME)}\n name={name}\n value={value}\n onChange={onChange}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n shouldFocusOnClose={shouldFocusOnClose}\n onFocus={onFocus}\n hasError={hasError}\n helper={helper}\n icon={icon}\n inputRef={inputRef}\n chips={values && values.map((chip: any, index: number) => selectedChipRender?.(chip, index, onClear))}\n {...disabledStateProps}\n isRequired={isRequired}\n clearButtonProps={clearButtonProps}\n isValid={isValid}\n label={label}\n placeholder={placeholder}\n theme={theme}\n type={type}\n isOpen={isOpen}\n closeOnClick={false}\n closeOnClickAway={closeOnClickAway}\n closeOnEscape={closeOnEscape}\n onClose={onClose}\n offset={offset}\n placement={placement}\n fitToAnchorWidth={fitToAnchorWidth}\n onInfiniteScroll={onInfiniteScroll}\n >\n {children}\n </Autocomplete>\n );\n});\nAutocompleteMultiple.displayName = COMPONENT_NAME;\nAutocompleteMultiple.className = CLASSNAME;\nAutocompleteMultiple.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","anchorToInput","closeOnClick","closeOnClickAway","closeOnEscape","shouldFocusOnClose","Autocomplete","forwardRef","props","ref","defaultTheme","useTheme","disabledStateProps","otherProps","useDisableStateProps","children","chips","className","error","fitToAnchorWidth","hasError","helper","icon","inputRef","clearButtonProps","isRequired","isOpen","isValid","label","name","offset","onBlur","onChange","onClose","onFocus","onInfiniteScroll","placeholder","placement","theme","value","textFieldProps","focusAnchorOnClose","forwardedProps","inputAnchorRef","useRef","textFieldRef","useFocus","current","React","createElement","_extends","classNames","TextField","mergeRefs","Dropdown","anchorRef","shouldFocusOnOpen","displayName","defaultProps","selectedChipRender","choice","index","onClear","isDisabled","onClick","event","Chip","key","after","Icon","mdiClose","size","Size","xxs","s","onAfterClick","values","AutocompleteMultiple","chipsAlignment","onKeyDown","type","map","chip"],"mappings":"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"}
@@ -0,0 +1,87 @@
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 { T as Thumbnail } from '../Thumbnail-30d2a781.js';
5
+ import { Size, Theme, AspectRatio } from '@lumx/core/js/constants';
6
+
7
+ /**
8
+ * Avatar sizes.
9
+ */
10
+
11
+ /**
12
+ * Defines the props of the component.
13
+ */
14
+
15
+ /**
16
+ * Component display name.
17
+ */
18
+ const COMPONENT_NAME = 'Avatar';
19
+
20
+ /**
21
+ * Component default class name and class prefix.
22
+ */
23
+ const CLASSNAME = getRootClassName(COMPONENT_NAME);
24
+
25
+ /**
26
+ * Component default props.
27
+ */
28
+ const DEFAULT_PROPS = {
29
+ size: Size.m
30
+ };
31
+
32
+ /**
33
+ * Avatar component.
34
+ *
35
+ * @param props Component props.
36
+ * @param ref Component ref.
37
+ * @return React element.
38
+ */
39
+ const Avatar = forwardRef((props, ref) => {
40
+ const defaultTheme = useTheme() || Theme.light;
41
+ const {
42
+ actions,
43
+ alt,
44
+ badge,
45
+ className,
46
+ image,
47
+ linkProps,
48
+ linkAs,
49
+ onClick,
50
+ onKeyPress,
51
+ size = DEFAULT_PROPS.size,
52
+ theme = defaultTheme,
53
+ thumbnailProps,
54
+ ...forwardedProps
55
+ } = props;
56
+ return /*#__PURE__*/React.createElement("div", _extends({
57
+ ref: ref
58
+ }, forwardedProps, {
59
+ className: classNames(className, handleBasicClasses({
60
+ prefix: CLASSNAME,
61
+ size,
62
+ theme
63
+ }))
64
+ }), /*#__PURE__*/React.createElement(Thumbnail, _extends({
65
+ linkProps: linkProps,
66
+ linkAs: linkAs,
67
+ className: `${CLASSNAME}__thumbnail`,
68
+ onClick: onClick,
69
+ onKeyPress: onKeyPress
70
+ }, thumbnailProps, {
71
+ aspectRatio: AspectRatio.square,
72
+ size: size,
73
+ image: image,
74
+ alt: alt,
75
+ theme: theme
76
+ })), actions && /*#__PURE__*/React.createElement("div", {
77
+ className: `${CLASSNAME}__actions`
78
+ }, actions), badge && /*#__PURE__*/React.createElement("div", {
79
+ className: `${CLASSNAME}__badge`
80
+ }, badge));
81
+ });
82
+ Avatar.displayName = COMPONENT_NAME;
83
+ Avatar.className = CLASSNAME;
84
+ Avatar.defaultProps = DEFAULT_PROPS;
85
+
86
+ export { Avatar };
87
+ //# sourceMappingURL=avatar-6990e3e9.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"avatar-6990e3e9.js","sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import { KeyboardEventHandler, MouseEventHandler, ReactElement, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AspectRatio, Size, Theme, Thumbnail, ThumbnailProps } from '@lumx/react';\n\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\n/**\n * Avatar sizes.\n */\nexport type AvatarSize = Extract<Size, 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface AvatarProps extends GenericProps, HasTheme {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Image alternative text. */\n alt: string;\n /** Badge. */\n badge?: ReactElement;\n /** Image URL. */\n image: string;\n /** Props to pass to the link wrapping the thumbnail. */\n linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Size variant. */\n size?: AvatarSize;\n /** Props to pass to the thumbnail (minus those already set by the Avatar props). */\n thumbnailProps?: Omit<\n ThumbnailProps,\n 'image' | 'alt' | 'size' | 'theme' | 'align' | 'fillHeight' | 'variant' | 'aspectRatio'\n >;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Avatar';\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<AvatarProps> = {\n size: Size.m,\n};\n\n/**\n * Avatar component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Avatar = forwardRef<AvatarProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n actions,\n alt,\n badge,\n className,\n image,\n linkProps,\n linkAs,\n onClick,\n onKeyPress,\n size = DEFAULT_PROPS.size,\n theme = defaultTheme,\n thumbnailProps,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, size, theme }))}\n >\n <Thumbnail\n linkProps={linkProps}\n linkAs={linkAs}\n className={`${CLASSNAME}__thumbnail`}\n onClick={onClick}\n onKeyPress={onKeyPress}\n {...thumbnailProps}\n aspectRatio={AspectRatio.square}\n size={size}\n image={image}\n alt={alt}\n theme={theme}\n />\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n {badge && <div className={`${CLASSNAME}__badge`}>{badge}</div>}\n </div>\n );\n});\nAvatar.displayName = COMPONENT_NAME;\nAvatar.className = CLASSNAME;\nAvatar.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","Avatar","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actions","alt","badge","className","image","linkProps","linkAs","onClick","onKeyPress","theme","thumbnailProps","forwardedProps","React","createElement","_extends","classNames","handleBasicClasses","prefix","Thumbnail","aspectRatio","AspectRatio","square","displayName","defaultProps"],"mappings":";;;;;;AAWA;AACA;AACA;;AAGA;AACA;AACA;;AA2BA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,QAAQ,CAAA;;AAE/B;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAmC,GAAG;EACxCC,IAAI,EAAEC,IAAI,CAACC,CAAAA;AACf,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,MAAM,GAAGC,UAAU,CAA8B,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC1E,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFC,OAAO;IACPC,GAAG;IACHC,KAAK;IACLC,SAAS;IACTC,KAAK;IACLC,SAAS;IACTC,MAAM;IACNC,OAAO;IACPC,UAAU;IACVnB,IAAI,GAAGD,aAAa,CAACC,IAAI;AACzBoB,IAAAA,KAAK,GAAGb,YAAY;IACpBc,cAAc;IACd,GAAGC,cAAAA;AACP,GAAC,GAAGjB,KAAK,CAAA;AAET,EAAA,oBACIkB,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;AACInB,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAA,EACLgB,cAAc,EAAA;AAClBR,IAAAA,SAAS,EAAEY,UAAU,CAACZ,SAAS,EAAEa,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAE/B,SAAS;MAAEG,IAAI;AAAEoB,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAA;AAAE,GAAA,CAAA,eAEzFG,KAAA,CAAAC,aAAA,CAACK,SAAS,EAAAJ,QAAA,CAAA;AACNT,IAAAA,SAAS,EAAEA,SAAU;AACrBC,IAAAA,MAAM,EAAEA,MAAO;IACfH,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAc,WAAA,CAAA;AACrCqB,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,UAAU,EAAEA,UAAAA;AAAW,GAAA,EACnBE,cAAc,EAAA;IAClBS,WAAW,EAAEC,WAAW,CAACC,MAAO;AAChChC,IAAAA,IAAI,EAAEA,IAAK;AACXe,IAAAA,KAAK,EAAEA,KAAM;AACbH,IAAAA,GAAG,EAAEA,GAAI;AACTQ,IAAAA,KAAK,EAAEA,KAAAA;AAAM,GAAA,CAChB,CAAC,EACDT,OAAO,iBAAIY,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKV,SAAS,EAAE,GAAGjB,SAAS,CAAA,SAAA,CAAA;AAAY,GAAA,EAAEc,OAAa,CAAC,EACnEE,KAAK,iBAAIU,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKV,SAAS,EAAE,GAAGjB,SAAS,CAAA,OAAA,CAAA;GAAYgB,EAAAA,KAAW,CAC5D,CAAC,CAAA;AAEd,CAAC,EAAC;AACFV,MAAM,CAAC8B,WAAW,GAAGrC,cAAc,CAAA;AACnCO,MAAM,CAACW,SAAS,GAAGjB,SAAS,CAAA;AAC5BM,MAAM,CAAC+B,YAAY,GAAGnC,aAAa;;;;"}
@@ -1,6 +1,10 @@
1
- import { m as getRootClassName, j as ColorPalette, n as forwardRef, l as classNames } from './6589b796.js';
2
- import { h as handleBasicClasses } from './e2afb13f.js';
3
- import { jsx, jsxs } from 'react/jsx-runtime';
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 { ColorPalette } from '@lumx/core/js/constants';
4
+
5
+ /**
6
+ * Defines the props of the component.
7
+ */
4
8
 
5
9
  /**
6
10
  * Component display name.
@@ -33,15 +37,14 @@ const Badge = forwardRef((props, ref) => {
33
37
  color = DEFAULT_PROPS.color,
34
38
  ...forwardedProps
35
39
  } = props;
36
- return /*#__PURE__*/jsx("div", {
37
- ref: ref,
38
- ...forwardedProps,
40
+ return /*#__PURE__*/React.createElement("div", _extends({
41
+ ref: ref
42
+ }, forwardedProps, {
39
43
  className: classNames(className, handleBasicClasses({
40
44
  prefix: CLASSNAME$1,
41
45
  color
42
- })),
43
- children: children
44
- });
46
+ }))
47
+ }), children);
45
48
  });
46
49
  Badge.displayName = COMPONENT_NAME$1;
47
50
  Badge.className = CLASSNAME$1;
@@ -63,18 +66,16 @@ const BadgeWrapper = forwardRef((props, ref) => {
63
66
  className,
64
67
  ...forwardedProps
65
68
  } = props;
66
- return /*#__PURE__*/jsxs("div", {
67
- ref: ref,
68
- ...forwardedProps,
69
- className: classNames(className, CLASSNAME),
70
- children: [children, badge && /*#__PURE__*/jsx("div", {
71
- className: `${CLASSNAME}__badge`,
72
- children: badge
73
- })]
74
- });
69
+ return /*#__PURE__*/React.createElement("div", _extends({
70
+ ref: ref
71
+ }, forwardedProps, {
72
+ className: classNames(className, CLASSNAME)
73
+ }), children, badge && /*#__PURE__*/React.createElement("div", {
74
+ className: `${CLASSNAME}__badge`
75
+ }, badge));
75
76
  });
76
77
  BadgeWrapper.displayName = 'BadgeWrapper';
77
78
  BadgeWrapper.className = CLASSNAME;
78
79
 
79
80
  export { Badge, BadgeWrapper };
80
- //# sourceMappingURL=9c9df5f2.js.map
81
+ //# sourceMappingURL=badge-81543bc7.js.map