@itcase/ui 1.2.35 → 1.3.0

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 (353) hide show
  1. package/dist/Badge-B9tt2YPa.js +76 -0
  2. package/dist/{Badge-MPtjfQS8.js → Badge-DMRagi5O.js} +7 -45
  3. package/dist/Button-CX3x7Z6Q.js +99 -0
  4. package/dist/Button-P0c3lMg1.js +103 -0
  5. package/dist/Divider-DBvDCUqP.js +30 -0
  6. package/dist/Divider-Goh6mpPK.js +34 -0
  7. package/dist/DropdownItem-BuMJdUAk.js +92 -0
  8. package/dist/DropdownItem-DaN20LFe.js +97 -0
  9. package/dist/Group-B9L2NTgM.js +34 -0
  10. package/dist/Group-D6CXN4hS.js +38 -0
  11. package/dist/Icon-CZrDqG76.js +61 -0
  12. package/dist/Icon-hqYZoh4h.js +65 -0
  13. package/dist/Image-6dFSePnG.js +17 -0
  14. package/dist/Image-Dx4AWHLO.js +15 -0
  15. package/dist/Input-BrV5_NoV.js +95 -0
  16. package/dist/Input-ffioh1sj.js +100 -0
  17. package/dist/Label-DQyB2ThM.js +93 -0
  18. package/dist/Label-HKRKV3mn.js +97 -0
  19. package/dist/Link-DGj-cNje.js +53 -0
  20. package/dist/{Link-CeQuavin.js → Link-_A9ZfNln.js} +6 -52
  21. package/dist/Loader-Dn036JwE.js +56 -0
  22. package/dist/Loader-K_DJmah6.js +52 -0
  23. package/dist/MenuItem-Dokk3UXj.js +40 -0
  24. package/dist/MenuItem-LyqjzhjP.js +44 -0
  25. package/dist/Overlay-Dy6JQwJn.js +15 -0
  26. package/dist/Overlay-HlYxCGtp.js +17 -0
  27. package/dist/Text-Beslj4Ns.js +34 -0
  28. package/dist/Text-JayJa3hj.js +30 -0
  29. package/dist/Title-CHgrIarR.js +48 -0
  30. package/dist/Title-DBaHcpvB.js +52 -0
  31. package/dist/Tooltip-1Jbub0K6.js +89 -0
  32. package/dist/Tooltip-CNua1g76.js +93 -0
  33. package/dist/cjs/components/Accordion.js +13 -65
  34. package/dist/cjs/components/Avatar.js +13 -28
  35. package/dist/cjs/components/Badge.js +4 -3
  36. package/dist/cjs/components/Breadcrumbs.js +16 -48
  37. package/dist/cjs/components/Button.js +9 -9
  38. package/dist/cjs/components/Caption.js +5 -14
  39. package/dist/cjs/components/Card.js +7 -12
  40. package/dist/cjs/components/Cell.js +11 -61
  41. package/dist/cjs/components/Checkbox.js +13 -61
  42. package/dist/cjs/components/Chips.js +9 -55
  43. package/dist/cjs/components/Choice.js +19 -85
  44. package/dist/cjs/components/Code.js +8 -80
  45. package/dist/cjs/components/CookiesWarning.js +13 -22
  46. package/dist/cjs/components/DadataHintField.js +4 -4
  47. package/dist/cjs/components/DatePicker.js +19 -23
  48. package/dist/cjs/components/Divider.js +3 -2
  49. package/dist/cjs/components/Dot.js +5 -22
  50. package/dist/cjs/components/Drawer.js +3 -3
  51. package/dist/cjs/components/Dropdown.js +6 -6
  52. package/dist/cjs/components/Flex.js +8 -95
  53. package/dist/cjs/components/Grid.js +12 -125
  54. package/dist/cjs/components/Group.js +3 -2
  55. package/dist/cjs/components/HTMLContent.js +5 -74
  56. package/dist/cjs/components/Icon.js +6 -6
  57. package/dist/cjs/components/Image.js +3 -2
  58. package/dist/cjs/components/Input.js +3 -2
  59. package/dist/cjs/components/InputMask.js +27 -109
  60. package/dist/cjs/components/InputPassword.js +18 -83
  61. package/dist/cjs/components/Label.js +6 -5
  62. package/dist/cjs/components/Link.js +2 -2
  63. package/dist/cjs/components/List.js +15 -31
  64. package/dist/cjs/components/Loader.js +4 -3
  65. package/dist/cjs/components/Logo.js +8 -21
  66. package/dist/cjs/components/Menu.js +9 -23
  67. package/dist/cjs/components/MenuItem.js +5 -5
  68. package/dist/cjs/components/Modal.js +10 -43
  69. package/dist/cjs/components/ModalSheetBottom.js +4 -15
  70. package/dist/cjs/components/Notification.js +9 -18
  71. package/dist/cjs/components/Overlay.js +3 -2
  72. package/dist/cjs/components/Pagination.js +15 -36
  73. package/dist/cjs/components/Panel.js +10 -78
  74. package/dist/cjs/components/Radio.js +15 -61
  75. package/dist/cjs/components/RangeSlider.js +7 -39
  76. package/dist/cjs/components/Response.js +20 -65
  77. package/dist/cjs/components/SVGContent.js +5 -10
  78. package/dist/cjs/components/ScrollOnDrag.js +5 -35
  79. package/dist/cjs/components/ScrollToView.js +5 -46
  80. package/dist/cjs/components/Search.js +18 -81
  81. package/dist/cjs/components/Segmented.js +10 -53
  82. package/dist/cjs/components/Select.js +42 -160
  83. package/dist/cjs/components/SiteMenu.js +12 -15
  84. package/dist/cjs/components/Swiper.js +9 -22
  85. package/dist/cjs/components/Switch.js +4 -2
  86. package/dist/cjs/components/Tab.js +16 -112
  87. package/dist/cjs/components/Text.js +3 -2
  88. package/dist/cjs/components/Textarea.js +15 -76
  89. package/dist/cjs/components/Tile.js +10 -46
  90. package/dist/cjs/components/Title.js +3 -2
  91. package/dist/cjs/components/Tooltip.js +5 -4
  92. package/dist/cjs/components/Video.js +5 -5
  93. package/dist/cjs/components/Wrapper.js +5 -30
  94. package/dist/cjs/hooks/useDeviceTargetClassGenerator.interface.js +2 -0
  95. package/dist/cjs/hooks/useDeviceTargetClassGenerator.js +97 -0
  96. package/dist/components/Accordion.js +13 -65
  97. package/dist/components/Avatar.js +13 -28
  98. package/dist/components/Badge.js +4 -3
  99. package/dist/components/Breadcrumbs.js +16 -48
  100. package/dist/components/Button.js +9 -9
  101. package/dist/components/Caption.js +5 -14
  102. package/dist/components/Card.js +7 -12
  103. package/dist/components/Cell.js +11 -61
  104. package/dist/components/Checkbox.js +13 -61
  105. package/dist/components/Chips.js +9 -55
  106. package/dist/components/Choice.js +19 -85
  107. package/dist/components/Code.js +8 -80
  108. package/dist/components/CookiesWarning.js +13 -22
  109. package/dist/components/DadataHintField.js +4 -4
  110. package/dist/components/DatePicker.js +19 -23
  111. package/dist/components/Divider.js +3 -2
  112. package/dist/components/Dot.js +5 -22
  113. package/dist/components/Drawer.js +3 -3
  114. package/dist/components/Dropdown.js +6 -6
  115. package/dist/components/Flex.js +8 -95
  116. package/dist/components/Grid.js +12 -125
  117. package/dist/components/Group.js +3 -2
  118. package/dist/components/HTMLContent.js +5 -74
  119. package/dist/components/Icon.js +6 -6
  120. package/dist/components/Image.js +3 -2
  121. package/dist/components/Input.js +3 -2
  122. package/dist/components/InputMask.js +28 -110
  123. package/dist/components/InputPassword.js +18 -83
  124. package/dist/components/Label.js +6 -5
  125. package/dist/components/Link.js +2 -2
  126. package/dist/components/List.js +15 -31
  127. package/dist/components/Loader.js +4 -3
  128. package/dist/components/Logo.js +8 -21
  129. package/dist/components/Menu.js +9 -23
  130. package/dist/components/MenuItem.js +5 -5
  131. package/dist/components/Modal.js +10 -43
  132. package/dist/components/ModalSheetBottom.js +4 -15
  133. package/dist/components/Notification.js +9 -18
  134. package/dist/components/Overlay.js +3 -2
  135. package/dist/components/Pagination.js +15 -36
  136. package/dist/components/Panel.js +10 -78
  137. package/dist/components/Radio.js +15 -61
  138. package/dist/components/RangeSlider.js +7 -39
  139. package/dist/components/Response.js +20 -65
  140. package/dist/components/SVGContent.js +5 -10
  141. package/dist/components/ScrollOnDrag.js +5 -35
  142. package/dist/components/ScrollToView.js +5 -46
  143. package/dist/components/Search.js +18 -81
  144. package/dist/components/Segmented.js +10 -53
  145. package/dist/components/Select.js +43 -161
  146. package/dist/components/SiteMenu.js +12 -15
  147. package/dist/components/Swiper.js +10 -23
  148. package/dist/components/Switch.js +4 -2
  149. package/dist/components/Tab.js +16 -112
  150. package/dist/components/Text.js +3 -2
  151. package/dist/components/Textarea.js +15 -76
  152. package/dist/components/Tile.js +10 -46
  153. package/dist/components/Title.js +3 -2
  154. package/dist/components/Tooltip.js +5 -4
  155. package/dist/components/Video.js +5 -5
  156. package/dist/components/Wrapper.js +5 -30
  157. package/dist/css/components/Avatar/Avatar.css +7 -6
  158. package/dist/css/components/Code/Code.css +0 -8
  159. package/dist/css/components/Code/Code.tokens.css +3 -0
  160. package/dist/hooks/useDeviceTargetClassGenerator.interface.js +1 -0
  161. package/dist/hooks/useDeviceTargetClassGenerator.js +95 -0
  162. package/dist/stories/Appearance.stories.js +2 -3
  163. package/dist/stories/Badge.stories.js +1 -1
  164. package/dist/stories/Button.stories.js +1 -2
  165. package/dist/stories/Group.stories.js +2 -3
  166. package/dist/stories/Icon.stories.js +2 -4
  167. package/dist/stories/Size.stories.js +1 -2
  168. package/dist/stories/State.stories.js +1 -2
  169. package/dist/stories/Tile.stories.js +1 -2
  170. package/dist/stories/appearance.mdx +6 -11
  171. package/dist/types/components/Accordion/Accordion.interface.d.ts +2 -0
  172. package/dist/types/components/Avatar/Avatar.d.ts +2 -2
  173. package/dist/types/components/Avatar/Avatar.interface.d.ts +8 -5
  174. package/dist/types/components/Badge/Badge.d.ts +3 -3
  175. package/dist/types/components/Badge/Badge.interface.d.ts +10 -7
  176. package/dist/types/components/Breadcrumbs/Breadcrumbs.d.ts +2 -2
  177. package/dist/types/components/Breadcrumbs/Breadcrumbs.interface.d.ts +11 -9
  178. package/dist/types/components/Breadcrumbs/BreadcrumbsItem.d.ts +2 -2
  179. package/dist/types/components/Button/Button.appearance.d.ts +2 -2
  180. package/dist/types/components/Button/Button.d.ts +3 -3
  181. package/dist/types/components/Button/Button.interface.d.ts +18 -15
  182. package/dist/types/components/Caption/Caption.d.ts +2 -2
  183. package/dist/types/components/Caption/Caption.interface.d.ts +7 -6
  184. package/dist/types/components/Card/Card.d.ts +2 -2
  185. package/dist/types/components/Card/Card.interface.d.ts +11 -10
  186. package/dist/types/components/Cell/Cell.d.ts +2 -2
  187. package/dist/types/components/Cell/Cell.interface.d.ts +5 -4
  188. package/dist/types/components/Checkbox/Checkbox.interface.d.ts +4 -1
  189. package/dist/types/components/Chips/Chips.interface.d.ts +4 -1
  190. package/dist/types/components/Choice/Choice.d.ts +2 -2
  191. package/dist/types/components/Choice/Choice.interface.d.ts +3 -0
  192. package/dist/types/components/Code/Code.d.ts +2 -2
  193. package/dist/types/components/Code/Code.interface.d.ts +8 -5
  194. package/dist/types/components/CookiesWarning/CookiesWarning.d.ts +2 -2
  195. package/dist/types/components/CookiesWarning/CookiesWarning.interface.d.ts +6 -5
  196. package/dist/types/components/DadataHintField/DadataHintField.d.ts +2 -2
  197. package/dist/types/components/DadataHintField/DadataHintField.interface.d.ts +4 -4
  198. package/dist/types/components/DatePicker/DatePicker.d.ts +3 -3
  199. package/dist/types/components/DatePicker/DatePicker.interface.d.ts +11 -8
  200. package/dist/types/components/Divider/Divider.d.ts +2 -2
  201. package/dist/types/components/Divider/Divider.interface.d.ts +8 -5
  202. package/dist/types/components/Dot/Dot.d.ts +2 -2
  203. package/dist/types/components/Dot/Dot.interface.d.ts +4 -3
  204. package/dist/types/components/Dropdown/Dropdown.d.ts +2 -2
  205. package/dist/types/components/Dropdown/Dropdown.interface.d.ts +9 -5
  206. package/dist/types/components/Dropdown/DropdownItem.d.ts +2 -2
  207. package/dist/types/components/Flex/Flex.d.ts +2 -2
  208. package/dist/types/components/Flex/Flex.interface.d.ts +5 -3
  209. package/dist/types/components/Flex/FlexItem.d.ts +2 -2
  210. package/dist/types/components/Grid/Grid.d.ts +2 -2
  211. package/dist/types/components/Grid/Grid.interface.d.ts +7 -4
  212. package/dist/types/components/Grid/GridItem.d.ts +2 -2
  213. package/dist/types/components/Grid/GridRow.d.ts +2 -2
  214. package/dist/types/components/Group/Group.d.ts +3 -3
  215. package/dist/types/components/Group/Group.interface.d.ts +8 -5
  216. package/dist/types/components/HTMLContent/HTMLContent.d.ts +2 -2
  217. package/dist/types/components/HTMLContent/HTMLContent.interface.d.ts +3 -2
  218. package/dist/types/components/Icon/Icon.d.ts +1 -1
  219. package/dist/types/components/Icon/Icon.interface.d.ts +1 -0
  220. package/dist/types/components/Image/Image.d.ts +2 -2
  221. package/dist/types/components/Image/Image.interface.d.ts +3 -2
  222. package/dist/types/components/Input/Input.d.ts +1 -1
  223. package/dist/types/components/Input/Input.interface.d.ts +4 -1
  224. package/dist/types/components/InputMask/Input.d.ts +2 -2
  225. package/dist/types/components/InputMask/Input.interface.d.ts +10 -7
  226. package/dist/types/components/InputPassword/InputPassword.d.ts +3 -3
  227. package/dist/types/components/InputPassword/InputPassword.interface.d.ts +9 -6
  228. package/dist/types/components/Label/Label.d.ts +3 -3
  229. package/dist/types/components/Label/Label.interface.d.ts +10 -7
  230. package/dist/types/components/Link/Link.d.ts +4 -4
  231. package/dist/types/components/Link/Link.interface.d.ts +7 -6
  232. package/dist/types/components/List/List.d.ts +2 -2
  233. package/dist/types/components/List/List.interface.d.ts +5 -3
  234. package/dist/types/components/List/ListItem.d.ts +2 -2
  235. package/dist/types/components/Loader/Loader.d.ts +3 -3
  236. package/dist/types/components/Loader/Loader.interface.d.ts +9 -6
  237. package/dist/types/components/Logo/Logo.d.ts +3 -3
  238. package/dist/types/components/Logo/Logo.interface.d.ts +10 -7
  239. package/dist/types/components/Menu/Menu.d.ts +2 -2
  240. package/dist/types/components/Menu/Menu.interface.d.ts +3 -2
  241. package/dist/types/components/MenuItem/MenuItem.d.ts +3 -3
  242. package/dist/types/components/MenuItem/MenuItem.interface.d.ts +9 -6
  243. package/dist/types/components/Modal/Modal.d.ts +2 -2
  244. package/dist/types/components/Modal/Modal.interface.d.ts +8 -5
  245. package/dist/types/components/Modal/ModalLoader.d.ts +1 -1
  246. package/dist/types/components/ModalSheetBottom/ModalSheetBottom.d.ts +1 -1
  247. package/dist/types/components/ModalSheetBottom/ModalSheetBottom.interface.d.ts +3 -0
  248. package/dist/types/components/Notification/Notification.interface.d.ts +10 -7
  249. package/dist/types/components/Notification/NotificationItem.d.ts +3 -3
  250. package/dist/types/components/Notification/NotificationList.d.ts +2 -2
  251. package/dist/types/components/Overlay/Overlay.d.ts +1 -1
  252. package/dist/types/components/Overlay/Overlay.interface.d.ts +1 -0
  253. package/dist/types/components/Pagination/Pagination.d.ts +2 -2
  254. package/dist/types/components/Pagination/Pagination.interface.d.ts +9 -6
  255. package/dist/types/components/Panel/Panel.d.ts +3 -3
  256. package/dist/types/components/Panel/Panel.interface.d.ts +9 -6
  257. package/dist/types/components/Radio/Radio.d.ts +3 -3
  258. package/dist/types/components/Radio/Radio.interface.d.ts +13 -10
  259. package/dist/types/components/RangeSlider/RangeSlider.d.ts +2 -2
  260. package/dist/types/components/RangeSlider/RangeSlider.interface.d.ts +3 -2
  261. package/dist/types/components/Response/Response.d.ts +3 -3
  262. package/dist/types/components/Response/Response.interface.d.ts +11 -8
  263. package/dist/types/components/SVGContent/SVGContent.d.ts +2 -2
  264. package/dist/types/components/SVGContent/SVGContent.interface.d.ts +2 -1
  265. package/dist/types/components/ScrollOnDrag/ScrollOnDrag.d.ts +2 -2
  266. package/dist/types/components/ScrollOnDrag/ScrollOnDrag.interface.d.ts +3 -2
  267. package/dist/types/components/Scrollbar/Scrollbar.d.ts +2 -2
  268. package/dist/types/components/Scrollbar/Scrollbar.interface.d.ts +2 -2
  269. package/dist/types/components/Search/Search.interface.d.ts +11 -7
  270. package/dist/types/components/Search/SearchInput.d.ts +3 -3
  271. package/dist/types/components/Search/SearchResult.d.ts +1 -2
  272. package/dist/types/components/Segmented/Segmented.d.ts +3 -3
  273. package/dist/types/components/Segmented/Segmented.interface.d.ts +15 -9
  274. package/dist/types/components/Select/Select.interface.d.ts +2 -0
  275. package/dist/types/components/Select/SelectContainer.d.ts +4 -3
  276. package/dist/types/components/Select/index.d.ts +1 -3
  277. package/dist/types/components/SiteMenu/SiteMenu.d.ts +2 -2
  278. package/dist/types/components/SiteMenu/SiteMenu.interface.d.ts +9 -6
  279. package/dist/types/components/SiteMenu/SiteMenuButton.d.ts +2 -2
  280. package/dist/types/components/Swiper/Swiper.d.ts +2 -2
  281. package/dist/types/components/Swiper/Swiper.interface.d.ts +9 -8
  282. package/dist/types/components/Switch/Switch.d.ts +2 -2
  283. package/dist/types/components/Switch/Switch.interface.d.ts +4 -4
  284. package/dist/types/components/Tab/Tab.d.ts +1 -1
  285. package/dist/types/components/Tab/Tab.interface.d.ts +4 -0
  286. package/dist/types/components/Tab/TabGroup.d.ts +1 -1
  287. package/dist/types/components/Text/Text.interface.d.ts +4 -1
  288. package/dist/types/components/Textarea/Textarea.d.ts +3 -3
  289. package/dist/types/components/Textarea/Textarea.interface.d.ts +13 -10
  290. package/dist/types/components/Tile/Tile.d.ts +2 -2
  291. package/dist/types/components/Tile/Tile.interface.d.ts +8 -5
  292. package/dist/types/components/Title/Title.d.ts +3 -3
  293. package/dist/types/components/Title/Title.interface.d.ts +17 -14
  294. package/dist/types/components/Tooltip/Tooltip.d.ts +3 -3
  295. package/dist/types/components/Tooltip/Tooltip.interface.d.ts +9 -6
  296. package/dist/types/components/Video/Video.d.ts +2 -2
  297. package/dist/types/components/Video/Video.interface.d.ts +1 -1
  298. package/dist/types/components/Wrapper/Wrapper.d.ts +2 -2
  299. package/dist/types/components/Wrapper/Wrapper.interface.d.ts +4 -3
  300. package/dist/types/hooks/useDeviceTargetClassGenerator.d.ts +3 -0
  301. package/dist/types/hooks/useDeviceTargetClassGenerator.interface.d.ts +20 -0
  302. package/dist/types/types/componentProps/appearanceKeys.d.ts +1 -1
  303. package/package.json +5 -4
  304. package/dist/Badge-BZf2D83-.js +0 -114
  305. package/dist/Button-BmE4TGuv.js +0 -154
  306. package/dist/Button-f0zWwezF.js +0 -150
  307. package/dist/Divider-Bdz66wfW.js +0 -71
  308. package/dist/Divider-CYvszcff.js +0 -75
  309. package/dist/DropdownItem-BjtWmVFs.js +0 -182
  310. package/dist/DropdownItem-DPBYY3cR.js +0 -187
  311. package/dist/Group-Bf2uSl3S.js +0 -140
  312. package/dist/Group-D95Sf0X0.js +0 -136
  313. package/dist/Icon-21rsw8YW.js +0 -119
  314. package/dist/Icon-gTZ0QO8I.js +0 -123
  315. package/dist/Image-8t6PvsaZ.js +0 -65
  316. package/dist/Image-DrUlRMHa.js +0 -67
  317. package/dist/Input--x3hPBiN.js +0 -188
  318. package/dist/Input-DG5yWwpp.js +0 -193
  319. package/dist/Label-Ddjf4F18.js +0 -139
  320. package/dist/Label-Rq2ptfUd.js +0 -135
  321. package/dist/Link-CqWzwh8V.js +0 -99
  322. package/dist/Loader-1ZnukBPK.js +0 -86
  323. package/dist/Loader-CuxFXcNG.js +0 -82
  324. package/dist/MenuItem-Buu-c29L.js +0 -101
  325. package/dist/MenuItem-Cqt0EcgC.js +0 -105
  326. package/dist/Overlay-CFXouKnl.js +0 -27
  327. package/dist/Overlay-DO5dnSRE.js +0 -25
  328. package/dist/Text-C-scXvy7.js +0 -85
  329. package/dist/Text-DGEJa_FL.js +0 -81
  330. package/dist/Title-BatSai-G.js +0 -115
  331. package/dist/Title-Bp-4wxkT.js +0 -111
  332. package/dist/Tooltip-BsMYxi_I.js +0 -150
  333. package/dist/Tooltip-CUL79Nsx.js +0 -154
  334. package/dist/cjs/components/ContextMenu.js +0 -52
  335. package/dist/cjs/components/LanguageSelector.js +0 -33
  336. package/dist/cjs/components/Page.js +0 -48
  337. package/dist/components/ContextMenu.js +0 -49
  338. package/dist/components/LanguageSelector.js +0 -31
  339. package/dist/components/Page.js +0 -46
  340. package/dist/css/components/ContextMenu/ContextMenu.css +0 -38
  341. package/dist/css/components/ContextMenu/css/__item/context-menu__item.css +0 -9
  342. package/dist/css/components/Page/Page.css +0 -8
  343. package/dist/types/components/ContextMenu/ContextMenu.d.ts +0 -3
  344. package/dist/types/components/ContextMenu/ContextMenu.interface.d.ts +0 -36
  345. package/dist/types/components/ContextMenu/ContextMenuItem.d.ts +0 -3
  346. package/dist/types/components/ContextMenu/index.d.ts +0 -3
  347. package/dist/types/components/LanguageSelector/Label.interface.d.ts +0 -20
  348. package/dist/types/components/LanguageSelector/LanguageSelector.d.ts +0 -3
  349. package/dist/types/components/LanguageSelector/index.d.ts +0 -1
  350. package/dist/types/components/Page/Page.d.ts +0 -3
  351. package/dist/types/components/Page/Page.interface.d.ts +0 -18
  352. package/dist/types/components/Page/index.d.ts +0 -1
  353. package/dist/types/hooks/useDeviceTargetClass.d.ts +0 -1
@@ -0,0 +1,52 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var React = require('react');
5
+ var clsx = require('clsx');
6
+ var UIContext = require('./cjs/context/UIContext.js');
7
+ var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
8
+ var useStyles = require('./cjs/hooks/useStyles.js');
9
+
10
+ var titleAppearance = {
11
+ dev: {
12
+ textColor: 'surfaceTextPrimary',
13
+ },
14
+ };
15
+
16
+ var titleConfig = {
17
+ appearance: titleAppearance,
18
+ setAppearance: function (newComponent) {
19
+ titleConfig.appearance = newComponent;
20
+ },
21
+ };
22
+ function Title(props) {
23
+ var children = props.children, after = props.after, afterWrapper = props.afterWrapper, appearance = props.appearance, before = props.before, beforeWrapper = props.beforeWrapper, className = props.className, dataTour = props.dataTour, mode = props.mode, _a = props.size, size = _a === void 0 ? 'h3' : _a, sizeDesktop = props.sizeDesktop, sizeMobile = props.sizeMobile, sizeTablet = props.sizeTablet, _b = props.tag, tag = _b === void 0 ? 'span' : _b, text = props.text, textWrap = props.textWrap, onClick = props.onClick;
24
+ var _c = UIContext.useUserDeviceContext(), isMobile = _c.isMobile, isTablet = _c.isTablet, isDesktop = _c.isDesktop;
25
+ // @ts-expect-error
26
+ var appearanceConfig = titleConfig.appearance && titleConfig.appearance[appearance];
27
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
28
+ var directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, heightClass = classGenerator.heightClass, svgFillClass = classGenerator.svgFillClass, svgFillHoverClass = classGenerator.svgFillHoverClass, textAlignClass = classGenerator.textAlignClass, textColorActiveClass = classGenerator.textColorActiveClass, textColorClass = classGenerator.textColorClass, textColorGradientClass = classGenerator.textColorGradientClass, textColorHoverClass = classGenerator.textColorHoverClass, textStyleClass = classGenerator.textStyleClass, textTruncateClass = classGenerator.textTruncateClass, textWeightClass = classGenerator.textWeightClass, typeClass = classGenerator.typeClass, widthClass = classGenerator.widthClass, wrapperDirectionClass = classGenerator.wrapperDirectionClass;
29
+ // @ts-expect-error
30
+ var _d = useStyles.useStyles(props), titleStyles = _d.styles, titleWrapperStyles = _d.wrapper;
31
+ // Element type (h1, h2, ..., h6)
32
+ var Tag = React.useMemo(function () {
33
+ if (tag) {
34
+ return tag;
35
+ }
36
+ if (isMobile && sizeMobile) {
37
+ return sizeMobile;
38
+ }
39
+ if (isTablet && sizeTablet) {
40
+ return sizeTablet;
41
+ }
42
+ if (isDesktop && sizeDesktop) {
43
+ return sizeDesktop;
44
+ }
45
+ return size ? size : 'span';
46
+ }, [isMobile, isTablet, isDesktop]);
47
+ return (jsxRuntime.jsxs(Tag, { className: clsx(className, 'title', fillClass && "fill_".concat(fillClass), svgFillClass && "svg_fill_".concat(svgFillClass), svgFillHoverClass && "svg_fill_hover_".concat(svgFillHoverClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), size && "title_size_".concat(size), mode && "title_mode_".concat(mode), directionClass && "title_direction_".concat(directionClass), 'text', textColorClass && "text-color_".concat(textColorClass), textColorActiveClass && "text-color_active_".concat(textColorActiveClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), typeClass && "title_type_".concat(typeClass), textColorGradientClass && "text-gradient_".concat(textColorGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), textWrap && "word-wrap_".concat(textWrap)), "data-tour": dataTour, style: titleStyles, onClick: onClick, children: [before, jsxRuntime.jsxs("span", { className: clsx(textAlignClass && "text-align_".concat(textAlignClass), wrapperDirectionClass && "title-direction_".concat(wrapperDirectionClass), 'title__wrapper', textTruncateClass && "text-truncate_".concat(textTruncateClass)), style: titleWrapperStyles, children: [beforeWrapper, children || text, afterWrapper] }), after] }));
48
+ }
49
+
50
+ exports.Title = Title;
51
+ exports.titleAppearance = titleAppearance;
52
+ exports.titleConfig = titleConfig;
@@ -0,0 +1,89 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import React, { useRef, useState, useCallback, useImperativeHandle } from 'react';
3
+ import clsx from 'clsx';
4
+ import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
5
+ import { useStyles } from './hooks/useStyles.js';
6
+ import { T as Text } from './Text-JayJa3hj.js';
7
+ import { T as Title } from './Title-CHgrIarR.js';
8
+
9
+ var tooltipAppearance = {
10
+ surfacePrimary: {
11
+ fill: 'surfacePrimary',
12
+ textColor: 'surfaceTextPrimary',
13
+ titleTextColor: 'surfaceTextPrimary',
14
+ },
15
+ surfaceSecondary: {
16
+ fill: 'surfaceSecondary',
17
+ textColor: 'surfaceTextPrimary',
18
+ titleTextColor: 'surfaceTextPrimary',
19
+ },
20
+ surfaceTertiary: {
21
+ fill: 'surfaceTertiary',
22
+ textColor: 'surfaceTextPrimary',
23
+ titleTextColor: 'surfaceTextPrimary',
24
+ },
25
+ };
26
+
27
+ var tooltipConfig = {
28
+ appearance: tooltipAppearance,
29
+ setAppearance: function (newComponent) {
30
+ tooltipConfig.appearance = newComponent;
31
+ },
32
+ };
33
+ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
34
+ var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a === void 0 ? 500 : _a, _b = props.closeTimeoutDelay, closeTimeoutDelay = _b === void 0 ? 250 : _b;
35
+ var tooltipElementRef = useRef(null);
36
+ var tooltipTimeoutHideRef = useRef(null);
37
+ var tooltipTimeoutShowRef = useRef(null);
38
+ var isTooltipCloseAnimationInProgressRef = useRef(false);
39
+ // TODO: rename to open?
40
+ var _c = useState(initialIsVisible), isTooltipVisible = _c[0], setIsTooltipVisible = _c[1];
41
+ // TODO: or rename to show/hide?
42
+ var openTooltip = useCallback(function () {
43
+ if (!isTooltipCloseAnimationInProgressRef.current) {
44
+ if (tooltipTimeoutHideRef.current) {
45
+ clearTimeout(tooltipTimeoutHideRef.current);
46
+ }
47
+ tooltipTimeoutShowRef.current = setTimeout(function () {
48
+ setIsTooltipVisible(true);
49
+ }, openTimeoutDelay);
50
+ }
51
+ }, [openTimeoutDelay]);
52
+ var closeTooltip = useCallback(function () {
53
+ if (tooltipTimeoutShowRef.current) {
54
+ clearTimeout(tooltipTimeoutShowRef.current);
55
+ }
56
+ // Make a small delay to be able to move cursor on the tooltip without
57
+ // triggering a close, because the label and the tooltip have space between
58
+ tooltipTimeoutHideRef.current = setTimeout(function () {
59
+ // @ts-expect-error
60
+ setIsTooltipVisible(function (prevState) {
61
+ var newState = false;
62
+ if (prevState === true) {
63
+ isTooltipCloseAnimationInProgressRef.current = true;
64
+ }
65
+ return newState;
66
+ });
67
+ }, closeTimeoutDelay);
68
+ }, [closeTimeoutDelay]);
69
+ var onAnimationEnd = useCallback(function () {
70
+ isTooltipCloseAnimationInProgressRef.current = false;
71
+ }, []);
72
+ useImperativeHandle(ref, function () { return ({
73
+ get tooltipElement() {
74
+ return tooltipElementRef.current;
75
+ },
76
+ isTooltipVisible: isTooltipVisible,
77
+ closeTooltip: closeTooltip,
78
+ openTooltip: openTooltip,
79
+ }); }, [isTooltipVisible, openTooltip, closeTooltip]);
80
+ // @ts-expect-error
81
+ var appearanceConfig = tooltipConfig.appearance && tooltipConfig.appearance[appearance];
82
+ var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
83
+ var borderWidthClass = classGenerator.borderWidthClass, borderTypeClass = classGenerator.borderTypeClass, widthClass = classGenerator.widthClass, fillClass = classGenerator.fillClass, shapeClass = classGenerator.shapeClass, alignDirectionClass = classGenerator.alignDirectionClass, alignClass = classGenerator.alignClass, alignmentClass = classGenerator.alignmentClass, borderColorClass = classGenerator.borderColorClass, elevationClass = classGenerator.elevationClass, sizeClass = classGenerator.sizeClass;
84
+ // @ts-expect-error
85
+ var tooltipStyles = useStyles(props).styles;
86
+ return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), sizeClass && "tooltip_size_".concat(sizeClass), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
87
+ });
88
+
89
+ export { Tooltip as T, tooltipAppearance as a, tooltipConfig as t };
@@ -0,0 +1,93 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var React = require('react');
5
+ var clsx = require('clsx');
6
+ var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
7
+ var useStyles = require('./cjs/hooks/useStyles.js');
8
+ var Text = require('./Text-Beslj4Ns.js');
9
+ var Title = require('./Title-DBaHcpvB.js');
10
+
11
+ var tooltipAppearance = {
12
+ surfacePrimary: {
13
+ fill: 'surfacePrimary',
14
+ textColor: 'surfaceTextPrimary',
15
+ titleTextColor: 'surfaceTextPrimary',
16
+ },
17
+ surfaceSecondary: {
18
+ fill: 'surfaceSecondary',
19
+ textColor: 'surfaceTextPrimary',
20
+ titleTextColor: 'surfaceTextPrimary',
21
+ },
22
+ surfaceTertiary: {
23
+ fill: 'surfaceTertiary',
24
+ textColor: 'surfaceTextPrimary',
25
+ titleTextColor: 'surfaceTextPrimary',
26
+ },
27
+ };
28
+
29
+ var tooltipConfig = {
30
+ appearance: tooltipAppearance,
31
+ setAppearance: function (newComponent) {
32
+ tooltipConfig.appearance = newComponent;
33
+ },
34
+ };
35
+ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
36
+ var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a === void 0 ? 500 : _a, _b = props.closeTimeoutDelay, closeTimeoutDelay = _b === void 0 ? 250 : _b;
37
+ var tooltipElementRef = React.useRef(null);
38
+ var tooltipTimeoutHideRef = React.useRef(null);
39
+ var tooltipTimeoutShowRef = React.useRef(null);
40
+ var isTooltipCloseAnimationInProgressRef = React.useRef(false);
41
+ // TODO: rename to open?
42
+ var _c = React.useState(initialIsVisible), isTooltipVisible = _c[0], setIsTooltipVisible = _c[1];
43
+ // TODO: or rename to show/hide?
44
+ var openTooltip = React.useCallback(function () {
45
+ if (!isTooltipCloseAnimationInProgressRef.current) {
46
+ if (tooltipTimeoutHideRef.current) {
47
+ clearTimeout(tooltipTimeoutHideRef.current);
48
+ }
49
+ tooltipTimeoutShowRef.current = setTimeout(function () {
50
+ setIsTooltipVisible(true);
51
+ }, openTimeoutDelay);
52
+ }
53
+ }, [openTimeoutDelay]);
54
+ var closeTooltip = React.useCallback(function () {
55
+ if (tooltipTimeoutShowRef.current) {
56
+ clearTimeout(tooltipTimeoutShowRef.current);
57
+ }
58
+ // Make a small delay to be able to move cursor on the tooltip without
59
+ // triggering a close, because the label and the tooltip have space between
60
+ tooltipTimeoutHideRef.current = setTimeout(function () {
61
+ // @ts-expect-error
62
+ setIsTooltipVisible(function (prevState) {
63
+ var newState = false;
64
+ if (prevState === true) {
65
+ isTooltipCloseAnimationInProgressRef.current = true;
66
+ }
67
+ return newState;
68
+ });
69
+ }, closeTimeoutDelay);
70
+ }, [closeTimeoutDelay]);
71
+ var onAnimationEnd = React.useCallback(function () {
72
+ isTooltipCloseAnimationInProgressRef.current = false;
73
+ }, []);
74
+ React.useImperativeHandle(ref, function () { return ({
75
+ get tooltipElement() {
76
+ return tooltipElementRef.current;
77
+ },
78
+ isTooltipVisible: isTooltipVisible,
79
+ closeTooltip: closeTooltip,
80
+ openTooltip: openTooltip,
81
+ }); }, [isTooltipVisible, openTooltip, closeTooltip]);
82
+ // @ts-expect-error
83
+ var appearanceConfig = tooltipConfig.appearance && tooltipConfig.appearance[appearance];
84
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
85
+ var borderWidthClass = classGenerator.borderWidthClass, borderTypeClass = classGenerator.borderTypeClass, widthClass = classGenerator.widthClass, fillClass = classGenerator.fillClass, shapeClass = classGenerator.shapeClass, alignDirectionClass = classGenerator.alignDirectionClass, alignClass = classGenerator.alignClass, alignmentClass = classGenerator.alignmentClass, borderColorClass = classGenerator.borderColorClass, elevationClass = classGenerator.elevationClass, sizeClass = classGenerator.sizeClass;
86
+ // @ts-expect-error
87
+ var tooltipStyles = useStyles.useStyles(props).styles;
88
+ return (jsxRuntime.jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), sizeClass && "tooltip_size_".concat(sizeClass), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title.Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "tooltip__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
89
+ });
90
+
91
+ exports.Tooltip = Tooltip;
92
+ exports.tooltipAppearance = tooltipAppearance;
93
+ exports.tooltipConfig = tooltipConfig;
@@ -5,12 +5,12 @@ var jsxRuntime = require('react/jsx-runtime');
5
5
  var React = require('react');
6
6
  var clsx = require('clsx');
7
7
  var castArray = require('lodash/castArray');
8
- var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
8
+ var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
9
9
  var useStyles = require('../hooks/useStyles.js');
10
10
  var _default = require('@itcase/icons/default');
11
- var Divider = require('../../Divider-CYvszcff.js');
12
- var Icon = require('../../Icon-gTZ0QO8I.js');
13
- var Text = require('../../Text-C-scXvy7.js');
11
+ var Divider = require('../../Divider-Goh6mpPK.js');
12
+ var Icon = require('../../Icon-hqYZoh4h.js');
13
+ var Text = require('../../Text-Beslj4Ns.js');
14
14
  require('lodash/camelCase');
15
15
  require('../context/UIContext.js');
16
16
  require('../hooks/useMediaQueries.js');
@@ -19,9 +19,9 @@ require('lodash/maxBy');
19
19
  require('lodash/upperFirst');
20
20
  require('../hooks/styleAttributes.js');
21
21
  require('react-inlinesvg');
22
- require('../../Link-CqWzwh8V.js');
23
- require('../../Tooltip-CUL79Nsx.js');
24
- require('../../Title-BatSai-G.js');
22
+ require('../../Link-DGj-cNje.js');
23
+ require('../../Tooltip-CNua1g76.js');
24
+ require('../../Title-DBaHcpvB.js');
25
25
 
26
26
  function AccordionItem(props) {
27
27
  var id = props.id, children = props.children, isExpanded = props.isExpanded, afterContent = props.afterContent, beforeContent = props.beforeContent, className = props.className, content = props.content, contentTextColor = props.contentTextColor, contentTextSize = props.contentTextSize, contentTextWeight = props.contentTextWeight, dividerDirection = props.dividerDirection, dividerFill = props.dividerFill, dividerSize = props.dividerSize, icon = props.icon, _a = props.iconFill, iconFill = _a === void 0 ? 'surfaceItemAccent' : _a, showDivider = props.showDivider, size = props.size, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClick = props.onClick;
@@ -35,45 +35,11 @@ function AccordionItem(props) {
35
35
  };
36
36
  onClick && onClick(thisItemData);
37
37
  }, [id, title, content, isExpanded, onClick]);
38
- var borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
39
- prefix: 'border-color_',
40
- propsKey: 'borderColor',
41
- });
42
- var contentBorderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
43
- prefix: 'border-color_',
44
- propsKey: 'contentBorderColor',
45
- });
46
- var titleBorderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
47
- prefix: 'border-color_',
48
- propsKey: 'titleBorderColor',
49
- });
50
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
51
- prefix: 'fill_',
52
- propsKey: 'fill',
53
- });
54
- var fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
55
- prefix: 'fill_hover_',
56
- propsKey: 'fillHover',
57
- });
58
- var contentFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
59
- prefix: 'fill_',
60
- propsKey: 'contentFill',
61
- });
62
- var titleFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
63
- prefix: 'fill_',
64
- propsKey: 'titleFill',
65
- });
66
- var titleFillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
67
- prefix: 'fill_hover_',
68
- propsKey: 'titleFillHover',
69
- });
70
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
71
- prefix: 'accordion-item_shape_',
72
- propsKey: 'shape',
73
- });
38
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props);
39
+ var borderColorClass = classGenerator.borderColorClass, contentBorderColorClass = classGenerator.contentBorderColorClass, contentFillClass = classGenerator.contentFillClass, contentFillHoverClass = classGenerator.contentFillHoverClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass, titleBorderColorClass = classGenerator.titleBorderColorClass, titleFillClass = classGenerator.titleFillClass, titleFillHoverClass = classGenerator.titleFillHoverClass;
74
40
  // @ts-expect-error
75
41
  var styles = useStyles.useStyles(props).styles;
76
- return (jsxRuntime.jsxs("div", { className: clsx('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntime.jsx(Text.Text, { className: clsx('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntime.jsx("div", { className: clsx('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || jsxRuntime.jsx(Icon.Icon, { iconFill: iconFill, size: "16", SvgImage: _default.icon16.ChevronDown }) }), beforeContent && beforeContent, showDivider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", fill: dividerFill || 'surfaceTertiary', direction: dividerDirection, size: dividerSize })), isExpanded && (jsxRuntime.jsx("div", { className: clsx('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
42
+ return (jsxRuntime.jsxs("div", { className: clsx('accordion-item', className, borderColorClass && "border-color_".concat(borderColorClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "accordion-item_shape_".concat(shapeClass), size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntime.jsx(Text.Text, { className: clsx('accordion-item__title', titleBorderColorClass && "border-color_".concat(titleBorderColorClass), titleFillClass && "fill_".concat(titleFillClass), titleFillHoverClass && "fill_hover_".concat(titleFillHoverClass), 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntime.jsx("div", { className: clsx('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || jsxRuntime.jsx(Icon.Icon, { iconFill: iconFill, size: "16", SvgImage: _default.icon16.ChevronDown }) }), beforeContent && beforeContent, showDivider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", fill: dividerFill || 'surfaceTertiary', direction: dividerDirection, size: dividerSize })), isExpanded && (jsxRuntime.jsx("div", { className: clsx('accordion-item__content', contentBorderColorClass && "border-color_".concat(contentBorderColorClass), contentFillClass && "fill_".concat(contentFillClass), contentFillHoverClass && "fill_hover_".concat(contentFillHoverClass)), children: children ||
77
43
  (content && (jsxRuntime.jsx(Text.Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }))) })), afterContent && afterContent] }));
78
44
  }
79
45
 
@@ -124,26 +90,8 @@ function Accordion(props) {
124
90
  }
125
91
  return [];
126
92
  }, [children, items, expandedItems, onClickAccordionItem]);
127
- var borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
128
- prefix: 'border-color_',
129
- propsKey: 'borderColor',
130
- });
131
- var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
132
- prefix: 'accordion_direction_',
133
- propsKey: 'direction',
134
- });
135
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
136
- prefix: 'fill_',
137
- propsKey: 'fill',
138
- });
139
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
140
- prefix: 'accordion_shape_',
141
- propsKey: 'shape',
142
- });
143
- var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
144
- prefix: 'width_',
145
- propsKey: 'width',
146
- });
93
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props);
94
+ var borderColorClass = classGenerator.borderColorClass, directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, shapeClass = classGenerator.shapeClass, widthClass = classGenerator.widthClass;
147
95
  /*
148
96
  * paddingHorizontalWrapper="16px"
149
97
  * paddingHorizontal - styles (horizontal will be parsed to left/right)
@@ -151,7 +99,7 @@ function Accordion(props) {
151
99
  */
152
100
  // @ts-expect-error
153
101
  var _c = useStyles.useStyles(props), accordionStyles = _c.styles, accordionWrapperStyles = _c.wrapper;
154
- return (jsxRuntime.jsx("div", { className: clsx(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), style: accordionStyles, children: jsxRuntime.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
102
+ return (jsxRuntime.jsx("div", { className: clsx(className, 'accordion', borderColorClass && "border-color_".concat(borderColorClass), directionClass && "accordion_direction_".concat(directionClass), fillClass && "fill_".concat(fillClass), shapeClass && "accordion_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass)), style: accordionStyles, children: jsxRuntime.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
155
103
  }
156
104
 
157
105
  exports.Accordion = Accordion;
@@ -3,24 +3,24 @@
3
3
  var jsxRuntime = require('react/jsx-runtime');
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
- var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
7
- var Icon = require('../../Icon-gTZ0QO8I.js');
8
- var Image = require('../../Image-DrUlRMHa.js');
9
- var Text = require('../../Text-C-scXvy7.js');
6
+ var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
7
+ var Icon = require('../../Icon-hqYZoh4h.js');
8
+ var Image = require('../../Image-6dFSePnG.js');
9
+ var Text = require('../../Text-Beslj4Ns.js');
10
+ require('../../tslib.es6-CCZ3TN_7.js');
10
11
  require('lodash/camelCase');
11
12
  require('lodash/castArray');
12
13
  require('../context/UIContext.js');
13
14
  require('../hooks/useMediaQueries.js');
14
15
  require('react-responsive');
15
- require('../../tslib.es6-CCZ3TN_7.js');
16
16
  require('react-inlinesvg');
17
17
  require('../hooks/useStyles.js');
18
18
  require('lodash/maxBy');
19
19
  require('lodash/upperFirst');
20
20
  require('../hooks/styleAttributes.js');
21
- require('../../Link-CqWzwh8V.js');
22
- require('../../Tooltip-CUL79Nsx.js');
23
- require('../../Title-BatSai-G.js');
21
+ require('../../Link-DGj-cNje.js');
22
+ require('../../Tooltip-CNua1g76.js');
23
+ require('../../Title-DBaHcpvB.js');
24
24
 
25
25
  var avatarAppearance = {
26
26
  dev: {},
@@ -34,31 +34,16 @@ var avatarConfig = {
34
34
  };
35
35
  function Avatar(props) {
36
36
  var after = props.after, appearance = props.appearance, before = props.before, className = props.className, Dot = props.Dot, _a = props.firstName, firstName = _a === void 0 ? '' : _a, icon = props.icon, iconFill = props.iconFill, iconFillHover = props.iconFillHover, iconFillSize = props.iconFillSize, iconItemFill = props.iconItemFill, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, mode = props.mode, _b = props.secondName, secondName = _b === void 0 ? '' : _b, _c = props.size, size = _c === void 0 ? '96' : _c, src = props.src, _d = props.textColor, textColor = _d === void 0 ? 'surfaceTextTertiary' : _d, _e = props.textSize, textSize = _e === void 0 ? 'l' : _e, _f = props.textWeight, textWeight = _f === void 0 ? '600' : _f, type = props.type, onClick = props.onClick;
37
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
38
- prefix: 'fill_',
39
- propsKey: 'fill',
40
- });
41
- var fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
42
- prefix: 'fill_hover_',
43
- propsKey: 'fillHover',
44
- });
45
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
46
- prefix: 'avatar_shape_',
47
- propsKey: 'shape',
48
- });
49
37
  var avatarChars = React.useMemo(function () {
50
38
  var firstChar = ((firstName === null || firstName === void 0 ? void 0 : firstName[0]) || '').toUpperCase();
51
39
  var secondChar = ((secondName === null || secondName === void 0 ? void 0 : secondName[0]) || '').toUpperCase();
52
40
  return "".concat(firstChar).concat(secondChar);
53
41
  }, [firstName, secondName]);
54
- var appearanceConfig = appearance && avatarConfig.appearance && avatarConfig.appearance[appearance];
55
- return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass ||
56
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
57
- "avatar_shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass ||
58
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
59
- "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
60
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
61
- "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase())), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", shape: "geometric", src: src })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textWeight: textWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textWeight), children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), fillHover: iconFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillHover), fillSize: iconFillSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillSize), iconFill: iconItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconItemFill), iconSize: iconSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSize), imageSrc: iconSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSrc), shape: iconShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconShape), SvgImage: icon || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.icon) })), Dot, after] }) }));
42
+ // @ts-expect-error
43
+ var appearanceConfig = avatarConfig.appearance && avatarConfig.appearance[appearance];
44
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
45
+ var fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass;
46
+ return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass && "avatar_shape_".concat(shapeClass), mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", shape: "geometric", src: src })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textWeight: textWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textWeight), children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), fillHover: iconFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillHover), fillSize: iconFillSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillSize), iconFill: iconItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconItemFill), iconSize: iconSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSize), imageSrc: iconSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSrc), shape: iconShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconShape), SvgImage: icon || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.icon) })), Dot, after] }) }));
62
47
  }
63
48
 
64
49
  exports.Avatar = Avatar;
@@ -1,9 +1,10 @@
1
1
  'use strict';
2
2
 
3
- var Badge = require('../../Badge-BZf2D83-.js');
3
+ var Badge = require('../../Badge-B9tt2YPa.js');
4
4
  require('react/jsx-runtime');
5
5
  require('clsx');
6
- require('../hooks/useDeviceTargetClass.js');
6
+ require('../hooks/useDeviceTargetClassGenerator.js');
7
+ require('../../tslib.es6-CCZ3TN_7.js');
7
8
  require('react');
8
9
  require('lodash/camelCase');
9
10
  require('lodash/castArray');
@@ -14,7 +15,7 @@ require('../hooks/useStyles.js');
14
15
  require('lodash/maxBy');
15
16
  require('lodash/upperFirst');
16
17
  require('../hooks/styleAttributes.js');
17
- require('../../Text-C-scXvy7.js');
18
+ require('../../Text-Beslj4Ns.js');
18
19
 
19
20
 
20
21
 
@@ -5,11 +5,11 @@ var jsxRuntime = require('react/jsx-runtime');
5
5
  var React = require('react');
6
6
  var clsx = require('clsx');
7
7
  var camelCase = require('lodash/camelCase');
8
- var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
8
+ var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
9
9
  var useStyles = require('../hooks/useStyles.js');
10
- var Icon = require('../../Icon-gTZ0QO8I.js');
11
- var Link = require('../../Link-CqWzwh8V.js');
12
- var Text = require('../../Text-C-scXvy7.js');
10
+ var Icon = require('../../Icon-hqYZoh4h.js');
11
+ var Link = require('../../Link-DGj-cNje.js');
12
+ var Text = require('../../Text-Beslj4Ns.js');
13
13
  require('lodash/castArray');
14
14
  require('../context/UIContext.js');
15
15
  require('../hooks/useMediaQueries.js');
@@ -18,34 +18,20 @@ require('lodash/maxBy');
18
18
  require('lodash/upperFirst');
19
19
  require('../hooks/styleAttributes.js');
20
20
  require('react-inlinesvg');
21
- require('../../Tooltip-CUL79Nsx.js');
22
- require('../../Title-BatSai-G.js');
21
+ require('../../Tooltip-CNua1g76.js');
22
+ require('../../Title-DBaHcpvB.js');
23
23
 
24
24
  function BreadcrumbsItem(props) {
25
- var children = props.children, className = props.className, cursor = props.cursor, _a = props.set, set = _a === void 0 ? 'default' : _a, text = props.text, textSize = props.textSize, textColor = props.textColor, textColorHover = props.textColorHover, href = props.href, iconAfter = props.iconAfter, iconAfterSize = props.iconAfterSize, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, onClick = props.onClick;
26
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
27
- prefix: 'fill_',
28
- propsKey: 'fill',
29
- });
30
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
31
- prefix: 'breadcrumbs__item_shape_',
32
- propsKey: 'shape',
33
- });
34
- var positionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
35
- prefix: 'position_',
36
- propsKey: 'position',
37
- });
38
- var underlineClass = useDeviceTargetClass.useDeviceTargetClass(props, {
39
- prefix: 'text-decoration_',
40
- propsKey: 'underline',
41
- });
25
+ var children = props.children, cursor = props.cursor, className = props.className, href = props.href, iconAfter = props.iconAfter, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, _a = props.set, set = _a === void 0 ? 'default' : _a, text = props.text, textColor = props.textColor, textColorHover = props.textColorHover, textSize = props.textSize, onClick = props.onClick;
26
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props);
27
+ var fillClass = classGenerator.fillClass, positionClass = classGenerator.positionClass, shapeClass = classGenerator.shapeClass, underlineClass = classGenerator.underlineClass;
42
28
  // @ts-expect-error
43
29
  var itemStyles = useStyles.useStyles(props).styles;
44
- return (jsxRuntime.jsxs(Link.LinkWrapper, { className: clsx(className, 'breadcrumbs__item', set && "breadcrumbs__item_set_".concat(set), fillClass, positionClass, shapeClass, underlineClass, onClick && (cursor || 'cursor_type_pointer')), DefaultComponent: "div", href: href, style: itemStyles, onClick: onClick, children: [jsxRuntime.jsx(Text.Text, { className: "breadcrumbs__item-text", size: textSize, textColor: textColor, textColorHover: textColorHover, children: text || children }), iconAfter && (jsxRuntime.jsx(Icon.Icon, { bgFill: iconAfterBgFill, className: "breadcrumbs__item-icon", fill: iconAfterFill, size: iconAfterSize, SvgImage: iconAfter }))] }));
30
+ return (jsxRuntime.jsxs(Link.LinkWrapper, { className: clsx(className, 'breadcrumbs__item', set && "breadcrumbs__item_set_".concat(set), fillClass && "fill_".concat(fillClass), positionClass && "position_".concat(positionClass), shapeClass && "breadcrumbs__item_shape_".concat(shapeClass), underlineClass && "text-decoration_".concat(underlineClass), onClick && (cursor || 'cursor_type_pointer')), DefaultComponent: "div", href: href, style: itemStyles, onClick: onClick, children: [jsxRuntime.jsx(Text.Text, { className: "breadcrumbs__item-text", size: textSize, textColor: textColor, textColorHover: textColorHover, children: text || children }), iconAfter && (jsxRuntime.jsx(Icon.Icon, { className: "breadcrumbs__item-icon", fill: iconAfterFill, bgFill: iconAfterBgFill, size: iconAfterSize, SvgImage: iconAfter }))] }));
45
31
  }
46
32
 
47
33
  function Breadcrumbs(props) {
48
- var breadcrumbsList = props.breadcrumbsList, children = props.children, className = props.className, iconAfterSize = props.iconAfterSize, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, itemUnderline = props.itemUnderline, itemTextColor = props.itemTextColor, itemTextColorHover = props.itemTextColorHover, set = props.set, otherProps = tslib_es6.__rest(props, ["breadcrumbsList", "children", "className", "iconAfterSize", "iconAfterBgFill", "iconAfterFill", "itemUnderline", "itemTextColor", "itemTextColorHover", "set"]);
34
+ var children = props.children, breadcrumbsList = props.breadcrumbsList, className = props.className, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, itemTextColor = props.itemTextColor, itemTextColorHover = props.itemTextColorHover, itemUnderline = props.itemUnderline, set = props.set, otherProps = tslib_es6.__rest(props, ["children", "breadcrumbsList", "className", "iconAfterBgFill", "iconAfterFill", "iconAfterSize", "itemTextColor", "itemTextColorHover", "itemUnderline", "set"]);
49
35
  var breadcrumbsItemsList = React.useMemo(function () {
50
36
  if (breadcrumbsList) {
51
37
  var itemProps_1 = Object.entries(otherProps).reduce(function (collectedProps, _a) {
@@ -57,38 +43,20 @@ function Breadcrumbs(props) {
57
43
  }
58
44
  return collectedProps;
59
45
  }, {});
60
- return breadcrumbsList.map(function (item, i) { return (jsxRuntime.jsx(BreadcrumbsItem, tslib_es6.__assign({ set: i + 1 !== breadcrumbsList.length ? 'default' : 'current',
46
+ return breadcrumbsList.map(function (item, i) { return (jsxRuntime.jsx(BreadcrumbsItem, tslib_es6.__assign({ href: item.href,
61
47
  // @ts-expect-error
62
- iconAfter: i + 1 !== breadcrumbsList.length ? itemProps_1.iconAfter : null, iconAfterSize: iconAfterSize, iconAfterBgFill: iconAfterBgFill, iconAfterFill: iconAfterFill, text: item.text, textColor: itemTextColor, textColorHover: itemTextColorHover, underline: itemUnderline, href: item.href }, itemProps_1), "breadcrumbsItem_".concat(item.id || item.text))); });
48
+ iconAfter: i + 1 !== breadcrumbsList.length ? itemProps_1.iconAfter : null, iconAfterBgFill: iconAfterBgFill, iconAfterFill: iconAfterFill, iconAfterSize: iconAfterSize, text: item.text, textColor: itemTextColor, textColorHover: itemTextColorHover, underline: itemUnderline, set: i + 1 !== breadcrumbsList.length ? 'default' : 'current' }, itemProps_1), "breadcrumbsItem_".concat(item.id || item.text))); });
63
49
  }
64
50
  if (children) {
65
51
  return children;
66
52
  }
67
53
  return [];
68
54
  }, [children, breadcrumbsList, otherProps]);
69
- var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
70
- prefix: 'direction_',
71
- propsKey: 'direction',
72
- });
73
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
74
- prefix: 'fill_',
75
- propsKey: 'fill',
76
- });
77
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
78
- prefix: 'breadcrumbs_shape_',
79
- propsKey: 'shape',
80
- });
81
- var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
82
- prefix: 'width_',
83
- propsKey: 'width',
84
- });
85
- var positionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
86
- prefix: 'position_',
87
- propsKey: 'position',
88
- });
55
+ var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props);
56
+ var directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, positionClass = classGenerator.positionClass, shapeClass = classGenerator.shapeClass, widthClass = classGenerator.widthClass;
89
57
  // @ts-expect-error
90
58
  var breadcrumbsStyles = useStyles.useStyles(props).styles;
91
- return (jsxRuntime.jsx("div", { className: clsx(className, 'breadcrumbs', widthClass, directionClass, fillClass, positionClass, shapeClass, set && "breadcrumbs_set_".concat(set)), style: breadcrumbsStyles, children: breadcrumbsItemsList }));
59
+ return (jsxRuntime.jsx("div", { className: clsx(className, 'breadcrumbs', widthClass && "width_".concat(widthClass), directionClass && "direction_".concat(directionClass), fillClass && "fill_".concat(fillClass), positionClass && "position_".concat(positionClass), shapeClass && "breadcrumbs_shape_".concat(shapeClass), set && "breadcrumbs_set_".concat(set)), style: breadcrumbsStyles, children: breadcrumbsItemsList }));
92
60
  }
93
61
  Breadcrumbs.defaultProps = {
94
62
  direction: 'horizontal',
@@ -1,10 +1,11 @@
1
1
  'use strict';
2
2
 
3
- var Button = require('../../Button-BmE4TGuv.js');
3
+ var Button = require('../../Button-P0c3lMg1.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
7
- require('../hooks/useDeviceTargetClass.js');
7
+ require('../hooks/useDeviceTargetClassGenerator.js');
8
+ require('../../tslib.es6-CCZ3TN_7.js');
8
9
  require('lodash/camelCase');
9
10
  require('lodash/castArray');
10
11
  require('../context/UIContext.js');
@@ -14,14 +15,13 @@ require('../hooks/useStyles.js');
14
15
  require('lodash/maxBy');
15
16
  require('lodash/upperFirst');
16
17
  require('../hooks/styleAttributes.js');
17
- require('../../Icon-gTZ0QO8I.js');
18
- require('../../tslib.es6-CCZ3TN_7.js');
18
+ require('../../Icon-hqYZoh4h.js');
19
19
  require('react-inlinesvg');
20
- require('../../Link-CqWzwh8V.js');
21
- require('../../Tooltip-CUL79Nsx.js');
22
- require('../../Text-C-scXvy7.js');
23
- require('../../Title-BatSai-G.js');
24
- require('../../Loader-1ZnukBPK.js');
20
+ require('../../Link-DGj-cNje.js');
21
+ require('../../Tooltip-CNua1g76.js');
22
+ require('../../Text-Beslj4Ns.js');
23
+ require('../../Title-DBaHcpvB.js');
24
+ require('../../Loader-Dn036JwE.js');
25
25
 
26
26
 
27
27