@itcase/ui 1.2.34 → 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 (381) hide show
  1. package/dist/Badge-B9tt2YPa.js +76 -0
  2. package/dist/{Badge-DBjlLLfX.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 +14 -65
  34. package/dist/cjs/components/Avatar.js +14 -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 +15 -61
  42. package/dist/cjs/components/Chips.js +9 -55
  43. package/dist/cjs/components/Choice.js +20 -85
  44. package/dist/cjs/components/Code.js +9 -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 +20 -23
  48. package/dist/cjs/components/Divider.js +4 -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 +7 -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 +4 -2
  55. package/dist/cjs/components/HTMLContent.js +5 -74
  56. package/dist/cjs/components/Icon.js +7 -6
  57. package/dist/cjs/components/Image.js +3 -2
  58. package/dist/cjs/components/Input.js +5 -2
  59. package/dist/cjs/components/InputMask.js +27 -109
  60. package/dist/cjs/components/InputPassword.js +20 -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 +5 -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 +6 -5
  68. package/dist/cjs/components/Modal.js +11 -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 +16 -36
  73. package/dist/cjs/components/Panel.js +10 -78
  74. package/dist/cjs/components/Radio.js +17 -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 +19 -81
  81. package/dist/cjs/components/Segmented.js +11 -53
  82. package/dist/cjs/components/Select.js +42 -160
  83. package/dist/cjs/components/SiteMenu.js +13 -15
  84. package/dist/cjs/components/Swiper.js +9 -22
  85. package/dist/cjs/components/Switch.js +5 -2
  86. package/dist/cjs/components/Tab.js +16 -112
  87. package/dist/cjs/components/Text.js +4 -2
  88. package/dist/cjs/components/Textarea.js +17 -76
  89. package/dist/cjs/components/Tile.js +11 -46
  90. package/dist/cjs/components/Title.js +4 -2
  91. package/dist/cjs/components/Tooltip.js +6 -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 +14 -65
  97. package/dist/components/Avatar.js +14 -29
  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 +14 -62
  105. package/dist/components/Chips.js +9 -55
  106. package/dist/components/Choice.js +20 -86
  107. package/dist/components/Code.js +9 -81
  108. package/dist/components/CookiesWarning.js +13 -22
  109. package/dist/components/DadataHintField.js +4 -4
  110. package/dist/components/DatePicker.js +20 -24
  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 +19 -84
  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 +11 -44
  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 +16 -37
  136. package/dist/components/Panel.js +10 -78
  137. package/dist/components/Radio.js +16 -62
  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 +19 -82
  144. package/dist/components/Segmented.js +11 -54
  145. package/dist/components/Select.js +43 -161
  146. package/dist/components/SiteMenu.js +13 -16
  147. package/dist/components/Swiper.js +10 -23
  148. package/dist/components/Switch.js +5 -3
  149. package/dist/components/Tab.js +16 -112
  150. package/dist/components/Text.js +3 -2
  151. package/dist/components/Textarea.js +16 -77
  152. package/dist/components/Tile.js +11 -47
  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/Select.stories.js +69 -6
  168. package/dist/stories/Size.stories.js +1 -2
  169. package/dist/stories/State.stories.js +1 -2
  170. package/dist/stories/Tile.stories.js +1 -2
  171. package/dist/stories/appearance.mdx +6 -11
  172. package/dist/types/components/Accordion/Accordion.interface.d.ts +2 -0
  173. package/dist/types/components/Avatar/Avatar.d.ts +2 -2
  174. package/dist/types/components/Avatar/Avatar.interface.d.ts +8 -5
  175. package/dist/types/components/Avatar/index.d.ts +1 -0
  176. package/dist/types/components/Badge/Badge.d.ts +3 -3
  177. package/dist/types/components/Badge/Badge.interface.d.ts +10 -7
  178. package/dist/types/components/Breadcrumbs/Breadcrumbs.d.ts +2 -2
  179. package/dist/types/components/Breadcrumbs/Breadcrumbs.interface.d.ts +11 -9
  180. package/dist/types/components/Breadcrumbs/BreadcrumbsItem.d.ts +2 -2
  181. package/dist/types/components/Button/Button.appearance.d.ts +2 -2
  182. package/dist/types/components/Button/Button.d.ts +3 -3
  183. package/dist/types/components/Button/Button.interface.d.ts +18 -15
  184. package/dist/types/components/Caption/Caption.d.ts +2 -2
  185. package/dist/types/components/Caption/Caption.interface.d.ts +7 -6
  186. package/dist/types/components/Card/Card.d.ts +2 -2
  187. package/dist/types/components/Card/Card.interface.d.ts +11 -10
  188. package/dist/types/components/Cell/Cell.d.ts +2 -2
  189. package/dist/types/components/Cell/Cell.interface.d.ts +5 -4
  190. package/dist/types/components/Checkbox/Checkbox.interface.d.ts +4 -1
  191. package/dist/types/components/Checkbox/index.d.ts +1 -0
  192. package/dist/types/components/Chips/Chips.interface.d.ts +4 -1
  193. package/dist/types/components/Choice/Choice.d.ts +2 -2
  194. package/dist/types/components/Choice/Choice.interface.d.ts +3 -0
  195. package/dist/types/components/Choice/index.d.ts +1 -0
  196. package/dist/types/components/Code/Code.d.ts +2 -2
  197. package/dist/types/components/Code/Code.interface.d.ts +8 -5
  198. package/dist/types/components/Code/index.d.ts +1 -0
  199. package/dist/types/components/CookiesWarning/CookiesWarning.d.ts +2 -2
  200. package/dist/types/components/CookiesWarning/CookiesWarning.interface.d.ts +6 -5
  201. package/dist/types/components/DadataHintField/DadataHintField.d.ts +2 -2
  202. package/dist/types/components/DadataHintField/DadataHintField.interface.d.ts +4 -4
  203. package/dist/types/components/DatePicker/DatePicker.d.ts +3 -3
  204. package/dist/types/components/DatePicker/DatePicker.interface.d.ts +11 -8
  205. package/dist/types/components/DatePicker/index.d.ts +1 -0
  206. package/dist/types/components/Divider/Divider.d.ts +2 -2
  207. package/dist/types/components/Divider/Divider.interface.d.ts +8 -5
  208. package/dist/types/components/Divider/index.d.ts +1 -0
  209. package/dist/types/components/Dot/Dot.d.ts +2 -2
  210. package/dist/types/components/Dot/Dot.interface.d.ts +4 -3
  211. package/dist/types/components/Dropdown/Dropdown.d.ts +2 -2
  212. package/dist/types/components/Dropdown/Dropdown.interface.d.ts +9 -5
  213. package/dist/types/components/Dropdown/DropdownItem.d.ts +2 -2
  214. package/dist/types/components/Dropdown/index.d.ts +2 -1
  215. package/dist/types/components/Flex/Flex.d.ts +2 -2
  216. package/dist/types/components/Flex/Flex.interface.d.ts +5 -3
  217. package/dist/types/components/Flex/FlexItem.d.ts +2 -2
  218. package/dist/types/components/Grid/Grid.d.ts +2 -2
  219. package/dist/types/components/Grid/Grid.interface.d.ts +7 -4
  220. package/dist/types/components/Grid/GridItem.d.ts +2 -2
  221. package/dist/types/components/Grid/GridRow.d.ts +2 -2
  222. package/dist/types/components/Group/Group.d.ts +3 -3
  223. package/dist/types/components/Group/Group.interface.d.ts +8 -5
  224. package/dist/types/components/Group/index.d.ts +1 -0
  225. package/dist/types/components/HTMLContent/HTMLContent.d.ts +2 -2
  226. package/dist/types/components/HTMLContent/HTMLContent.interface.d.ts +3 -2
  227. package/dist/types/components/Icon/Icon.d.ts +1 -1
  228. package/dist/types/components/Icon/Icon.interface.d.ts +1 -0
  229. package/dist/types/components/Icon/index.d.ts +1 -0
  230. package/dist/types/components/Image/Image.d.ts +2 -2
  231. package/dist/types/components/Image/Image.interface.d.ts +3 -2
  232. package/dist/types/components/Input/Input.d.ts +1 -1
  233. package/dist/types/components/Input/Input.interface.d.ts +4 -1
  234. package/dist/types/components/Input/index.d.ts +1 -0
  235. package/dist/types/components/InputMask/Input.d.ts +2 -2
  236. package/dist/types/components/InputMask/Input.interface.d.ts +10 -7
  237. package/dist/types/components/InputPassword/InputPassword.d.ts +3 -3
  238. package/dist/types/components/InputPassword/InputPassword.interface.d.ts +9 -6
  239. package/dist/types/components/InputPassword/index.d.ts +1 -0
  240. package/dist/types/components/Label/Label.d.ts +3 -3
  241. package/dist/types/components/Label/Label.interface.d.ts +10 -7
  242. package/dist/types/components/Link/Link.d.ts +4 -4
  243. package/dist/types/components/Link/Link.interface.d.ts +7 -6
  244. package/dist/types/components/List/List.d.ts +2 -2
  245. package/dist/types/components/List/List.interface.d.ts +5 -3
  246. package/dist/types/components/List/ListItem.d.ts +2 -2
  247. package/dist/types/components/Loader/Loader.d.ts +3 -3
  248. package/dist/types/components/Loader/Loader.interface.d.ts +9 -6
  249. package/dist/types/components/Loader/index.d.ts +1 -0
  250. package/dist/types/components/Logo/Logo.d.ts +3 -3
  251. package/dist/types/components/Logo/Logo.interface.d.ts +10 -7
  252. package/dist/types/components/Menu/Menu.d.ts +2 -2
  253. package/dist/types/components/Menu/Menu.interface.d.ts +3 -2
  254. package/dist/types/components/MenuItem/MenuItem.d.ts +3 -3
  255. package/dist/types/components/MenuItem/MenuItem.interface.d.ts +9 -6
  256. package/dist/types/components/MenuItem/index.d.ts +1 -0
  257. package/dist/types/components/Modal/Modal.d.ts +2 -2
  258. package/dist/types/components/Modal/Modal.interface.d.ts +8 -5
  259. package/dist/types/components/Modal/ModalLoader.d.ts +1 -1
  260. package/dist/types/components/Modal/index.d.ts +2 -1
  261. package/dist/types/components/ModalSheetBottom/ModalSheetBottom.d.ts +1 -1
  262. package/dist/types/components/ModalSheetBottom/ModalSheetBottom.interface.d.ts +3 -0
  263. package/dist/types/components/Notification/Notification.interface.d.ts +10 -7
  264. package/dist/types/components/Notification/NotificationItem.d.ts +3 -3
  265. package/dist/types/components/Notification/NotificationList.d.ts +2 -2
  266. package/dist/types/components/Overlay/Overlay.d.ts +1 -1
  267. package/dist/types/components/Overlay/Overlay.interface.d.ts +1 -0
  268. package/dist/types/components/Pagination/Pagination.d.ts +2 -2
  269. package/dist/types/components/Pagination/Pagination.interface.d.ts +9 -6
  270. package/dist/types/components/Pagination/index.d.ts +1 -0
  271. package/dist/types/components/Panel/Panel.d.ts +3 -3
  272. package/dist/types/components/Panel/Panel.interface.d.ts +9 -6
  273. package/dist/types/components/Radio/Radio.d.ts +3 -3
  274. package/dist/types/components/Radio/Radio.interface.d.ts +13 -10
  275. package/dist/types/components/Radio/index.d.ts +1 -0
  276. package/dist/types/components/RangeSlider/RangeSlider.d.ts +2 -2
  277. package/dist/types/components/RangeSlider/RangeSlider.interface.d.ts +3 -2
  278. package/dist/types/components/Response/Response.d.ts +3 -3
  279. package/dist/types/components/Response/Response.interface.d.ts +11 -8
  280. package/dist/types/components/SVGContent/SVGContent.d.ts +2 -2
  281. package/dist/types/components/SVGContent/SVGContent.interface.d.ts +2 -1
  282. package/dist/types/components/ScrollOnDrag/ScrollOnDrag.d.ts +2 -2
  283. package/dist/types/components/ScrollOnDrag/ScrollOnDrag.interface.d.ts +3 -2
  284. package/dist/types/components/Scrollbar/Scrollbar.d.ts +2 -2
  285. package/dist/types/components/Scrollbar/Scrollbar.interface.d.ts +2 -2
  286. package/dist/types/components/Search/Search.interface.d.ts +11 -7
  287. package/dist/types/components/Search/SearchInput.d.ts +3 -3
  288. package/dist/types/components/Search/SearchResult.d.ts +1 -2
  289. package/dist/types/components/Search/index.d.ts +2 -1
  290. package/dist/types/components/Segmented/Segmented.d.ts +3 -3
  291. package/dist/types/components/Segmented/Segmented.interface.d.ts +15 -9
  292. package/dist/types/components/Segmented/index.d.ts +1 -0
  293. package/dist/types/components/Select/Select.interface.d.ts +2 -0
  294. package/dist/types/components/Select/SelectContainer.d.ts +4 -3
  295. package/dist/types/components/Select/index.d.ts +1 -3
  296. package/dist/types/components/SiteMenu/SiteMenu.d.ts +2 -2
  297. package/dist/types/components/SiteMenu/SiteMenu.interface.d.ts +9 -6
  298. package/dist/types/components/SiteMenu/SiteMenuButton.d.ts +2 -2
  299. package/dist/types/components/SiteMenu/index.d.ts +2 -1
  300. package/dist/types/components/Swiper/Swiper.d.ts +2 -2
  301. package/dist/types/components/Swiper/Swiper.interface.d.ts +9 -8
  302. package/dist/types/components/Switch/Switch.d.ts +2 -2
  303. package/dist/types/components/Switch/Switch.interface.d.ts +4 -4
  304. package/dist/types/components/Switch/index.d.ts +1 -0
  305. package/dist/types/components/Tab/Tab.d.ts +1 -1
  306. package/dist/types/components/Tab/Tab.interface.d.ts +4 -0
  307. package/dist/types/components/Tab/TabGroup.d.ts +1 -1
  308. package/dist/types/components/Text/Text.interface.d.ts +4 -1
  309. package/dist/types/components/Text/index.d.ts +1 -0
  310. package/dist/types/components/Textarea/Textarea.d.ts +3 -3
  311. package/dist/types/components/Textarea/Textarea.interface.d.ts +13 -10
  312. package/dist/types/components/Textarea/index.d.ts +1 -0
  313. package/dist/types/components/Tile/Tile.d.ts +2 -2
  314. package/dist/types/components/Tile/Tile.interface.d.ts +8 -5
  315. package/dist/types/components/Tile/index.d.ts +1 -0
  316. package/dist/types/components/Title/Title.d.ts +3 -3
  317. package/dist/types/components/Title/Title.interface.d.ts +17 -14
  318. package/dist/types/components/Title/index.d.ts +1 -0
  319. package/dist/types/components/Tooltip/Tooltip.d.ts +3 -3
  320. package/dist/types/components/Tooltip/Tooltip.interface.d.ts +9 -6
  321. package/dist/types/components/Tooltip/index.d.ts +1 -0
  322. package/dist/types/components/Video/Video.d.ts +2 -2
  323. package/dist/types/components/Video/Video.interface.d.ts +1 -1
  324. package/dist/types/components/Wrapper/Wrapper.d.ts +2 -2
  325. package/dist/types/components/Wrapper/Wrapper.interface.d.ts +4 -3
  326. package/dist/types/config/forms/index.d.ts +1 -2
  327. package/dist/types/hooks/useDeviceTargetClassGenerator.d.ts +3 -0
  328. package/dist/types/hooks/useDeviceTargetClassGenerator.interface.d.ts +20 -0
  329. package/dist/types/types/componentProps/appearanceKeys.d.ts +1 -1
  330. package/package.json +8 -7
  331. package/dist/Badge-_xQzAcyN.js +0 -114
  332. package/dist/Button-C8MATksY.js +0 -150
  333. package/dist/Button-ChSAts3j.js +0 -154
  334. package/dist/Divider-BoB-f9Gr.js +0 -74
  335. package/dist/Divider-DHIuQUsH.js +0 -71
  336. package/dist/DropdownItem-B8IMNQww.js +0 -182
  337. package/dist/DropdownItem-E9HkOU63.js +0 -186
  338. package/dist/Group-BCvs5UxK.js +0 -136
  339. package/dist/Group-u6YDbMxn.js +0 -139
  340. package/dist/Icon-C8ACV9r7.js +0 -122
  341. package/dist/Icon-DptCmI_y.js +0 -119
  342. package/dist/Image-8t6PvsaZ.js +0 -65
  343. package/dist/Image-DrUlRMHa.js +0 -67
  344. package/dist/Input-CgjHxZmK.js +0 -188
  345. package/dist/Input-KgHOW5DR.js +0 -191
  346. package/dist/Label-B06hLCqo.js +0 -139
  347. package/dist/Label-zOLL6ePu.js +0 -135
  348. package/dist/Link-CqWzwh8V.js +0 -99
  349. package/dist/Loader-DHNcD09o.js +0 -82
  350. package/dist/Loader-DReoCdZ2.js +0 -85
  351. package/dist/MenuItem-BXogEsbS.js +0 -104
  352. package/dist/MenuItem-C7frDyBO.js +0 -101
  353. package/dist/Overlay-CFXouKnl.js +0 -27
  354. package/dist/Overlay-DO5dnSRE.js +0 -25
  355. package/dist/Text-C4Bg2Mv6.js +0 -81
  356. package/dist/Text-R6XNq6Ca.js +0 -84
  357. package/dist/Title-DWIc05TX.js +0 -114
  358. package/dist/Title-YVzIwk68.js +0 -111
  359. package/dist/Tooltip--c-4Qp04.js +0 -150
  360. package/dist/Tooltip-BswHy19O.js +0 -153
  361. package/dist/cjs/components/ContextMenu.js +0 -52
  362. package/dist/cjs/components/LanguageSelector.js +0 -33
  363. package/dist/cjs/components/Page.js +0 -48
  364. package/dist/components/ContextMenu.js +0 -49
  365. package/dist/components/LanguageSelector.js +0 -31
  366. package/dist/components/Page.js +0 -46
  367. package/dist/css/components/ContextMenu/ContextMenu.css +0 -38
  368. package/dist/css/components/ContextMenu/css/__item/context-menu__item.css +0 -9
  369. package/dist/css/components/Page/Page.css +0 -8
  370. package/dist/types/components/ContextMenu/ContextMenu.d.ts +0 -3
  371. package/dist/types/components/ContextMenu/ContextMenu.interface.d.ts +0 -36
  372. package/dist/types/components/ContextMenu/ContextMenuItem.d.ts +0 -3
  373. package/dist/types/components/ContextMenu/index.d.ts +0 -3
  374. package/dist/types/components/LanguageSelector/Label.interface.d.ts +0 -20
  375. package/dist/types/components/LanguageSelector/LanguageSelector.d.ts +0 -3
  376. package/dist/types/components/LanguageSelector/index.d.ts +0 -1
  377. package/dist/types/components/Page/Page.d.ts +0 -3
  378. package/dist/types/components/Page/Page.interface.d.ts +0 -18
  379. package/dist/types/components/Page/index.d.ts +0 -1
  380. package/dist/types/config/forms/select.d.ts +0 -50
  381. package/dist/types/hooks/useDeviceTargetClass.d.ts +0 -1
@@ -1,4 +1,3 @@
1
1
  import { defaultDatepickerProps } from './datepicker';
2
2
  import { defaultInputProps } from './input';
3
- import { defaultSelectProps } from './select';
4
- export { defaultDatepickerProps, defaultInputProps, defaultSelectProps };
3
+ export { defaultDatepickerProps, defaultInputProps };
@@ -0,0 +1,3 @@
1
+ import type { iAppearanceConfig, iComponentProps, iDeviceTargetClassGenerator } from './useDeviceTargetClassGenerator.interface';
2
+ declare function useDeviceTargetClassGenerator(componentProps: iComponentProps, appearanceConfig?: iAppearanceConfig): iDeviceTargetClassGenerator;
3
+ export { useDeviceTargetClassGenerator };
@@ -0,0 +1,20 @@
1
+ interface iComponentProps {
2
+ [key: string]: number | string;
3
+ }
4
+ interface iAppearanceConfig {
5
+ [key: string]: number | string;
6
+ }
7
+ interface iGeneratorGetClassParams {
8
+ prefix?: string;
9
+ replace?: [RegExp, string];
10
+ }
11
+ type tGetClass = (propsKey: keyof iComponentProps, params?: iGeneratorGetClassParams) => string;
12
+ interface iDeviceTargetClassGenerator {
13
+ [key: string]: string;
14
+ /**
15
+ * Function to create class from props or appearance config by passing key and prefix(optional)
16
+ * @return string: `${prefix}${formattedPropsValue}.toLowerCase()` like "border-color_item-primary"
17
+ */
18
+ getClass: tGetClass;
19
+ }
20
+ export type { iComponentProps, iAppearanceConfig, iGeneratorGetClassParams, iDeviceTargetClassGenerator, };
@@ -1 +1 @@
1
- export type tAppearanceKeysDefault = 'accent' | 'accentSecondary' | 'any' | 'cantLoadData' | 'custom' | 'default' | 'dev' | 'disabled' | 'error' | 'fail' | 'gradientPrimary' | 'l' | 'm' | 'primary' | 'refresh' | 's' | 'search' | 'secondary' | 'success' | 'surface' | 'surfaceDisabled' | 'surfacePrimary' | 'surfaceQuaternary' | 'surfaceSecondary' | 'surfaceTertiary' | 'warning' | 'xl' | 'xs';
1
+ export type tAppearanceKeysDefault = 'accent' | 'accentSecondary' | 'accentTertiary' | 'any' | 'cantLoadData' | 'custom' | 'default' | 'dev' | 'disabled' | 'error' | 'fail' | 'gradientPrimary' | 'l' | 'm' | 'primary' | 'refresh' | 's' | 'search' | 'secondary' | 'success' | 'surface' | 'surfaceDisabled' | 'surfacePrimary' | 'surfaceQuaternary' | 'surfaceSecondary' | 'surfaceTertiary' | 'warning' | 'xl' | 'xs';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.2.34",
3
+ "version": "1.3.0",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",
@@ -41,9 +41,9 @@
41
41
  "import": "./dist/appearance/*.js",
42
42
  "require": "./dist/cjs/appearance/*.js"
43
43
  },
44
- "./types/components/*/*.interface": {
45
- "import": "./dist/types/components/*/*.interface.d.ts",
46
- "types": "./dist/types/components/*/*.interface.d.ts"
44
+ "./types": {
45
+ "import": "./dist/types/types/index.d.ts",
46
+ "types": "./dist/types/types/index.d.ts"
47
47
  },
48
48
  "./components/*": {
49
49
  "types": "./dist/types/components/*/index.d.ts",
@@ -96,10 +96,11 @@
96
96
  "registry": "https://registry.npmjs.org/"
97
97
  },
98
98
  "dependencies": {
99
- "@itcase/common": "^1.2.16",
99
+ "@itcase/common": "^1.2.17",
100
+ "@itcase/icons": "^1.0.7",
100
101
  "clsx": "^2.1.1",
101
102
  "date-fns": "^4.1.0",
102
- "framer-motion": "^11.12.0",
103
+ "framer-motion": "^11.13.5",
103
104
  "js-cookie": "^3.0.5",
104
105
  "lodash": "^4.17.21",
105
106
  "rc-slider": "^11.1.7",
@@ -189,7 +190,7 @@
189
190
  "postcss-preset-env": "^10.1.1",
190
191
  "postcss-pxtorem": "^6.1.0",
191
192
  "postcss-sort-media-queries": "^5.2.0",
192
- "prettier": "^3.4.1",
193
+ "prettier": "^3.4.2",
193
194
  "rollup": "^4.28.0",
194
195
  "rollup-plugin-copy": "^3.5.0",
195
196
  "rollup-plugin-dts": "^6.1.1",
@@ -1,114 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var clsx = require('clsx');
5
- var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
6
- var useStyles = require('./cjs/hooks/useStyles.js');
7
- var Text = require('./Text-R6XNq6Ca.js');
8
-
9
- var badgeAppearance = {
10
- accent: {
11
- fill: 'accentPrimary',
12
- fillHover: 'accentPrimaryHover',
13
- textColor: 'accentTextPrimary',
14
- },
15
- primary: {
16
- fill: 'primaryPrimary',
17
- fillHover: 'primaryPrimaryHover',
18
- textColor: 'primaryTextPrimary',
19
- },
20
- surfacePrimary: {
21
- fill: 'surfacePrimary',
22
- fillHover: 'surfacePrimaryHover',
23
- textColor: 'surfaceTextPrimary',
24
- },
25
- surfaceSecondary: {
26
- fill: 'surfaceSecondary',
27
- fillHover: 'surfaceSecondaryHover',
28
- textColor: 'surfaceTextPrimary',
29
- },
30
- surfaceTertiary: {
31
- fill: 'surfaceTertiary',
32
- fillHover: 'surfaceTertiaryHover',
33
- textColor: 'surfaceTextPrimary',
34
- },
35
- surfaceQuaternary: {
36
- fill: 'surfaceQuaternary',
37
- fillHover: 'surfaceTertiaryHover',
38
- textColor: 'surfaceTextInverse',
39
- },
40
- secondary: {
41
- fill: 'secondaryPrimary',
42
- fillHover: 'secondaryPrimaryHover',
43
- textColor: 'secondaryTextPrimary',
44
- },
45
- disabled: {
46
- fill: 'accentDisabled',
47
- fillHover: 'none',
48
- textColor: 'accentTextDisabled',
49
- },
50
- };
51
-
52
- var badgeConfig = {
53
- appearance: badgeAppearance,
54
- setAppearance: function (newComponent) {
55
- badgeConfig.appearance = newComponent;
56
- },
57
- };
58
- function Badge(props) {
59
- var _a, _b;
60
- var children = props.children, appearance = props.appearance, className = props.className, mode = props.mode, textColor = props.textColor, textSize = props.textSize, value = props.value;
61
- var borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
62
- prefix: 'border-color_',
63
- propsKey: 'borderColor',
64
- });
65
- var borderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
66
- prefix: 'border-color_hover_',
67
- propsKey: 'borderColorHover',
68
- });
69
- var borderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
70
- prefix: 'border-width_',
71
- propsKey: 'borderWidth',
72
- });
73
- var borderTypeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
74
- prefix: 'border_type_',
75
- propsKey: 'borderType',
76
- });
77
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
78
- prefix: 'fill_',
79
- propsKey: 'fill',
80
- });
81
- var fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
82
- prefix: 'fill_hover_',
83
- propsKey: 'fillHover',
84
- });
85
- var positionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
86
- prefix: 'position_',
87
- propsKey: 'position',
88
- });
89
- var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
90
- prefix: 'badge_size_',
91
- propsKey: 'size',
92
- });
93
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
94
- prefix: 'badge_shape_',
95
- propsKey: 'shape',
96
- });
97
- // @ts-expect-error
98
- var badgeStyles = useStyles.useStyles(props).styles;
99
- var appearanceConfig = appearance && badgeConfig.appearance && badgeConfig.appearance[appearance];
100
- return (jsxRuntime.jsx("div", { className: clsx(className, 'badge', !value && 'badge_type_status', mode && "badge_mode_".concat(mode), borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, fillClass ||
101
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
102
- ((_a = "fill_".concat(appearanceConfig.fill)) === null || _a === void 0 ? void 0 : _a.replace(/([A-Z])/g, '-$1').toLowerCase())), fillHoverClass ||
103
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
104
- ((_b = "fill_hover_".concat(appearanceConfig.fillHover)) === null || _b === void 0 ? void 0 : _b.replace(/([A-Z])/g, '-$1').toLowerCase())), positionClass, sizeClass, shapeClass), style: badgeStyles, children: children ||
105
- (value && (jsxRuntime.jsx(Text.Text, { size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: value }))) }));
106
- }
107
- Badge.defaultProps = {
108
- shape: 'circular',
109
- size: 'm',
110
- };
111
-
112
- exports.Badge = Badge;
113
- exports.badgeAppearance = badgeAppearance;
114
- exports.badgeConfig = badgeConfig;
@@ -1,150 +0,0 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import React from 'react';
3
- import clsx from 'clsx';
4
- import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
5
- import { useStyles } from './hooks/useStyles.js';
6
- import { I as Icon } from './Icon-DptCmI_y.js';
7
- import { a as LinkWrapper } from './Link-CeQuavin.js';
8
- import { L as Loader } from './Loader-DHNcD09o.js';
9
- import { T as Text } from './Text-C4Bg2Mv6.js';
10
-
11
- var buttonAppearance = {
12
- dev: {
13
- fill: 'surfaceSecondary',
14
- fillHover: 'surfaceSecondaryHover',
15
- label: 'Button',
16
- labelTextColor: 'surfaceTextPrimary',
17
- labelTextSize: 'l',
18
- shape: 'rounded',
19
- size: 'xxl',
20
- },
21
- accent: {
22
- fill: 'accentPrimary',
23
- fillHover: 'accentPrimaryHover',
24
- labelTextColor: 'accentTextPrimary',
25
- labelTextColorHover: 'accentTextPrimary',
26
- loaderFill: 'accentPrimary',
27
- loaderItemFill: 'accentItemPrimary',
28
- },
29
- accentSecondary: {
30
- fill: 'accentSecondary',
31
- fillHover: 'accentPrimaryHover',
32
- labelTextColor: 'accentTextPrimary',
33
- labelTextColorHover: 'accentTextPrimary',
34
- loaderFill: 'accentPrimary',
35
- loaderItemFill: 'accentItemPrimary',
36
- },
37
- primary: {
38
- fill: 'primaryPrimary',
39
- fillHover: 'primaryPrimaryHover',
40
- labelTextColor: 'primaryTextPrimary',
41
- },
42
- secondary: {
43
- fill: 'secondaryPrimary',
44
- fillHover: 'secondaryPrimaryHover',
45
- labelTextColor: 'secondaryTextPrimary',
46
- },
47
- surfacePrimary: {
48
- fill: 'surfacePrimary',
49
- fillHover: 'surfacePrimaryHover',
50
- labelTextColor: 'surfaceTextPrimary',
51
- },
52
- surfaceSecondary: {
53
- fill: 'surfaceSecondary',
54
- fillHover: 'surfaceSecondaryHover',
55
- labelTextColor: 'surfaceTextPrimary',
56
- loaderFill: 'surfaceSecondary',
57
- loaderItemFill: 'surfaceItemPrimary',
58
- },
59
- surfaceTertiary: {
60
- fill: 'surfaceTertiary',
61
- fillHover: 'surfaceTertiaryHover',
62
- labelTextColor: 'surfaceTextPrimary',
63
- },
64
- surfaceDisabled: {
65
- fill: 'surfaceDisabled',
66
- fillHover: 'surfaceDisabled',
67
- labelTextColor: 'surfaceTextPrimary',
68
- },
69
- };
70
-
71
- var buttonConfig = {
72
- appearance: buttonAppearance,
73
- setAppearance: function (newComponent) {
74
- buttonConfig.appearance = newComponent;
75
- },
76
- };
77
- var Button = React.forwardRef(function Button(props, ref) {
78
- var children = props.children; props.width; var isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _b = props.htmlType, htmlType = _b === void 0 ? 'button' : _b, icon = props.icon, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterFillSize = props.iconAfterFillSize, iconAfterShape = props.iconAfterShape, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeFillSize = props.iconBeforeFillSize, iconBeforeShape = props.iconBeforeShape, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconFill = props.iconFill, iconFillSize = props.iconFillSize, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, label = props.label, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextSizeMobile = props.labelTextSizeMobile,
79
- // @ts-expect-error
80
- labelTextTruncate = props.labelTextTruncate, labelTextWeight = props.labelTextWeight,
81
- // @ts-expect-error
82
- labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap, link = props.link, loaderFill = props.loaderFill, loaderItemFill = props.loaderItemFill, _c = props.loaderSet, loaderSet = _c === void 0 ? 'simple' : _c, _d = props.loading, loading = _d === void 0 ? false : _d, rel = props.rel, set = props.set; props.size; var target = props.target, onClick = props.onClick, onMouseDown = props.onMouseDown;
83
- var widthClass = useDeviceTargetClass(props, {
84
- prefix: 'button_width_',
85
- propsKey: 'width',
86
- });
87
- var sizeClass = useDeviceTargetClass(props, {
88
- prefix: 'button_size_',
89
- propsKey: 'size',
90
- });
91
- var fillClass = useDeviceTargetClass(props, {
92
- prefix: 'fill_',
93
- propsKey: 'fill',
94
- });
95
- var fillHoverClass = useDeviceTargetClass(props, {
96
- prefix: 'fill_hover_',
97
- propsKey: 'fillHover',
98
- });
99
- var borderWidthClass = useDeviceTargetClass(props, {
100
- prefix: 'border-width_',
101
- propsKey: 'borderWidth',
102
- });
103
- var borderColorClass = useDeviceTargetClass(props, {
104
- prefix: 'border-color_',
105
- propsKey: 'borderColor',
106
- });
107
- var shapeClass = useDeviceTargetClass(props, {
108
- prefix: 'button_shape_',
109
- propsKey: 'shape',
110
- });
111
- var borderTypeClass = useDeviceTargetClass(props, {
112
- prefix: 'border_type_',
113
- propsKey: 'borderType',
114
- });
115
- var elevationClass = useDeviceTargetClass(props, {
116
- prefix: 'elevation_',
117
- propsKey: 'elevation',
118
- });
119
- // @ts-expect-error
120
- var _f = useStyles(props), labelStyles = _f.label, buttonStyles = _f.styles;
121
- var appearanceConfig = appearance && buttonConfig.appearance && buttonConfig.appearance[appearance];
122
- return (jsx(LinkWrapper, { className: clsx(className, 'button', label && 'button_type_label', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass ||
123
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderWidth) &&
124
- "border-width_".concat(appearanceConfig.borderWidth)
125
- .replace(/([A-Z])/g, '-$1')
126
- .toLowerCase()), borderColorClass ||
127
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
128
- "border-color_".concat(appearanceConfig.borderColor)
129
- .replace(/([A-Z])/g, '-$1')
130
- .toLowerCase()), borderTypeClass ||
131
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderType) &&
132
- "border-type_".concat(appearanceConfig.borderType).replace(/([A-Z])/g, '-$1').toLowerCase()), fillClass ||
133
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
134
- "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
135
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
136
- "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, sizeClass, widthClass, elevationClass, onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', !label &&
137
- (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc || icon || iconSrc) &&
138
- 'button_type_icon', label &&
139
- (after ||
140
- before ||
141
- icon ||
142
- iconAfter ||
143
- iconAfterSrc ||
144
- iconBefore ||
145
- iconBeforeSrc ||
146
- iconSrc) &&
147
- 'button_type_with-icon', loading && 'button_state_loading'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsx(Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsx(Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "button__label", width: labelTextWidth, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
148
- });
149
-
150
- export { Button as B, buttonAppearance as a, buttonConfig as b };
@@ -1,154 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var clsx = require('clsx');
6
- var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
7
- var useStyles = require('./cjs/hooks/useStyles.js');
8
- var Icon = require('./Icon-C8ACV9r7.js');
9
- var Link = require('./Link-CqWzwh8V.js');
10
- var Loader = require('./Loader-DReoCdZ2.js');
11
- var Text = require('./Text-R6XNq6Ca.js');
12
-
13
- var buttonAppearance = {
14
- dev: {
15
- fill: 'surfaceSecondary',
16
- fillHover: 'surfaceSecondaryHover',
17
- label: 'Button',
18
- labelTextColor: 'surfaceTextPrimary',
19
- labelTextSize: 'l',
20
- shape: 'rounded',
21
- size: 'xxl',
22
- },
23
- accent: {
24
- fill: 'accentPrimary',
25
- fillHover: 'accentPrimaryHover',
26
- labelTextColor: 'accentTextPrimary',
27
- labelTextColorHover: 'accentTextPrimary',
28
- loaderFill: 'accentPrimary',
29
- loaderItemFill: 'accentItemPrimary',
30
- },
31
- accentSecondary: {
32
- fill: 'accentSecondary',
33
- fillHover: 'accentPrimaryHover',
34
- labelTextColor: 'accentTextPrimary',
35
- labelTextColorHover: 'accentTextPrimary',
36
- loaderFill: 'accentPrimary',
37
- loaderItemFill: 'accentItemPrimary',
38
- },
39
- primary: {
40
- fill: 'primaryPrimary',
41
- fillHover: 'primaryPrimaryHover',
42
- labelTextColor: 'primaryTextPrimary',
43
- },
44
- secondary: {
45
- fill: 'secondaryPrimary',
46
- fillHover: 'secondaryPrimaryHover',
47
- labelTextColor: 'secondaryTextPrimary',
48
- },
49
- surfacePrimary: {
50
- fill: 'surfacePrimary',
51
- fillHover: 'surfacePrimaryHover',
52
- labelTextColor: 'surfaceTextPrimary',
53
- },
54
- surfaceSecondary: {
55
- fill: 'surfaceSecondary',
56
- fillHover: 'surfaceSecondaryHover',
57
- labelTextColor: 'surfaceTextPrimary',
58
- loaderFill: 'surfaceSecondary',
59
- loaderItemFill: 'surfaceItemPrimary',
60
- },
61
- surfaceTertiary: {
62
- fill: 'surfaceTertiary',
63
- fillHover: 'surfaceTertiaryHover',
64
- labelTextColor: 'surfaceTextPrimary',
65
- },
66
- surfaceDisabled: {
67
- fill: 'surfaceDisabled',
68
- fillHover: 'surfaceDisabled',
69
- labelTextColor: 'surfaceTextPrimary',
70
- },
71
- };
72
-
73
- var buttonConfig = {
74
- appearance: buttonAppearance,
75
- setAppearance: function (newComponent) {
76
- buttonConfig.appearance = newComponent;
77
- },
78
- };
79
- var Button = React.forwardRef(function Button(props, ref) {
80
- var children = props.children; props.width; var isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _b = props.htmlType, htmlType = _b === void 0 ? 'button' : _b, icon = props.icon, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterFillSize = props.iconAfterFillSize, iconAfterShape = props.iconAfterShape, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeFillSize = props.iconBeforeFillSize, iconBeforeShape = props.iconBeforeShape, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconFill = props.iconFill, iconFillSize = props.iconFillSize, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, label = props.label, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextSizeMobile = props.labelTextSizeMobile,
81
- // @ts-expect-error
82
- labelTextTruncate = props.labelTextTruncate, labelTextWeight = props.labelTextWeight,
83
- // @ts-expect-error
84
- labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap, link = props.link, loaderFill = props.loaderFill, loaderItemFill = props.loaderItemFill, _c = props.loaderSet, loaderSet = _c === void 0 ? 'simple' : _c, _d = props.loading, loading = _d === void 0 ? false : _d, rel = props.rel, set = props.set; props.size; var target = props.target, onClick = props.onClick, onMouseDown = props.onMouseDown;
85
- var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
86
- prefix: 'button_width_',
87
- propsKey: 'width',
88
- });
89
- var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
90
- prefix: 'button_size_',
91
- propsKey: 'size',
92
- });
93
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
94
- prefix: 'fill_',
95
- propsKey: 'fill',
96
- });
97
- var fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
98
- prefix: 'fill_hover_',
99
- propsKey: 'fillHover',
100
- });
101
- var borderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
102
- prefix: 'border-width_',
103
- propsKey: 'borderWidth',
104
- });
105
- var borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
106
- prefix: 'border-color_',
107
- propsKey: 'borderColor',
108
- });
109
- var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
110
- prefix: 'button_shape_',
111
- propsKey: 'shape',
112
- });
113
- var borderTypeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
114
- prefix: 'border_type_',
115
- propsKey: 'borderType',
116
- });
117
- var elevationClass = useDeviceTargetClass.useDeviceTargetClass(props, {
118
- prefix: 'elevation_',
119
- propsKey: 'elevation',
120
- });
121
- // @ts-expect-error
122
- var _f = useStyles.useStyles(props), labelStyles = _f.label, buttonStyles = _f.styles;
123
- var appearanceConfig = appearance && buttonConfig.appearance && buttonConfig.appearance[appearance];
124
- return (jsxRuntime.jsx(Link.LinkWrapper, { className: clsx(className, 'button', label && 'button_type_label', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass ||
125
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderWidth) &&
126
- "border-width_".concat(appearanceConfig.borderWidth)
127
- .replace(/([A-Z])/g, '-$1')
128
- .toLowerCase()), borderColorClass ||
129
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
130
- "border-color_".concat(appearanceConfig.borderColor)
131
- .replace(/([A-Z])/g, '-$1')
132
- .toLowerCase()), borderTypeClass ||
133
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderType) &&
134
- "border-type_".concat(appearanceConfig.borderType).replace(/([A-Z])/g, '-$1').toLowerCase()), fillClass ||
135
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
136
- "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
137
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
138
- "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, sizeClass, widthClass, elevationClass, onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', !label &&
139
- (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc || icon || iconSrc) &&
140
- 'button_type_icon', label &&
141
- (after ||
142
- before ||
143
- icon ||
144
- iconAfter ||
145
- iconAfterSrc ||
146
- iconBefore ||
147
- iconBeforeSrc ||
148
- iconSrc) &&
149
- 'button_type_with-icon', loading && 'button_state_loading'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsx(Loader.Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsx(Text.Text, { className: "button__label", width: labelTextWidth, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
150
- });
151
-
152
- exports.Button = Button;
153
- exports.buttonAppearance = buttonAppearance;
154
- exports.buttonConfig = buttonConfig;
@@ -1,74 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var clsx = require('clsx');
5
- var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
6
- var useStyles = require('./cjs/hooks/useStyles.js');
7
-
8
- var dividerAppearance = {
9
- dev: {},
10
- };
11
-
12
- var dividerConfig = {
13
- appearance: dividerAppearance,
14
- setAppearance: function (newComponent) {
15
- dividerConfig.appearance = newComponent;
16
- },
17
- };
18
- function Divider(props) {
19
- var appearance = props.appearance, className = props.className;
20
- var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
21
- prefix: 'divider_direction_',
22
- propsKey: 'direction',
23
- });
24
- var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
25
- prefix: 'fill_',
26
- propsKey: 'fill',
27
- });
28
- var fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
29
- prefix: 'fill_hover_',
30
- propsKey: 'fillHover',
31
- });
32
- var fillActiveClass = useDeviceTargetClass.useDeviceTargetClass(props, {
33
- prefix: 'fill_active_',
34
- propsKey: 'fillActive',
35
- });
36
- var fillActiveHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
37
- prefix: 'fill_active_hover_',
38
- propsKey: 'fillActiveHover',
39
- });
40
- var fillDisabledClass = useDeviceTargetClass.useDeviceTargetClass(props, {
41
- prefix: 'fill_disabled_',
42
- propsKey: 'fillDisabled',
43
- });
44
- var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
45
- prefix: 'divider_size_',
46
- propsKey: 'size',
47
- });
48
- var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
49
- prefix: 'width_',
50
- propsKey: 'width',
51
- });
52
- // @ts-expect-error
53
- var hrStyles = useStyles.useStyles(props).styles;
54
- var appearanceConfig = appearance && dividerConfig.appearance && dividerConfig.appearance[appearance];
55
- return (jsxRuntime.jsx("hr", { className: clsx(className, 'divider', widthClass ||
56
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.width) &&
57
- "width_".concat(appearanceConfig.width).replace(/([A-Z])/g, '-$1').toLowerCase()), directionClass ||
58
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.direction) &&
59
- "divider_direction_".concat(appearanceConfig.direction)
60
- .replace(/([A-Z])/g, '-$1')
61
- .toLowerCase()), sizeClass ||
62
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.size) &&
63
- "divider_size_".concat(appearanceConfig.size).replace(/([A-Z])/g, '-$1').toLowerCase()), fillClass ||
64
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
65
- "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
66
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
67
- "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), fillActiveClass, fillActiveHoverClass, fillDisabledClass), style: hrStyles }));
68
- }
69
- Divider.defaultProps = {
70
- size: 'xs',
71
- };
72
-
73
- exports.Divider = Divider;
74
- exports.dividerConfig = dividerConfig;
@@ -1,71 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import clsx from 'clsx';
3
- import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
4
- import { useStyles } from './hooks/useStyles.js';
5
-
6
- var dividerAppearance = {
7
- dev: {},
8
- };
9
-
10
- var dividerConfig = {
11
- appearance: dividerAppearance,
12
- setAppearance: function (newComponent) {
13
- dividerConfig.appearance = newComponent;
14
- },
15
- };
16
- function Divider(props) {
17
- var appearance = props.appearance, className = props.className;
18
- var directionClass = useDeviceTargetClass(props, {
19
- prefix: 'divider_direction_',
20
- propsKey: 'direction',
21
- });
22
- var fillClass = useDeviceTargetClass(props, {
23
- prefix: 'fill_',
24
- propsKey: 'fill',
25
- });
26
- var fillHoverClass = useDeviceTargetClass(props, {
27
- prefix: 'fill_hover_',
28
- propsKey: 'fillHover',
29
- });
30
- var fillActiveClass = useDeviceTargetClass(props, {
31
- prefix: 'fill_active_',
32
- propsKey: 'fillActive',
33
- });
34
- var fillActiveHoverClass = useDeviceTargetClass(props, {
35
- prefix: 'fill_active_hover_',
36
- propsKey: 'fillActiveHover',
37
- });
38
- var fillDisabledClass = useDeviceTargetClass(props, {
39
- prefix: 'fill_disabled_',
40
- propsKey: 'fillDisabled',
41
- });
42
- var sizeClass = useDeviceTargetClass(props, {
43
- prefix: 'divider_size_',
44
- propsKey: 'size',
45
- });
46
- var widthClass = useDeviceTargetClass(props, {
47
- prefix: 'width_',
48
- propsKey: 'width',
49
- });
50
- // @ts-expect-error
51
- var hrStyles = useStyles(props).styles;
52
- var appearanceConfig = appearance && dividerConfig.appearance && dividerConfig.appearance[appearance];
53
- return (jsx("hr", { className: clsx(className, 'divider', widthClass ||
54
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.width) &&
55
- "width_".concat(appearanceConfig.width).replace(/([A-Z])/g, '-$1').toLowerCase()), directionClass ||
56
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.direction) &&
57
- "divider_direction_".concat(appearanceConfig.direction)
58
- .replace(/([A-Z])/g, '-$1')
59
- .toLowerCase()), sizeClass ||
60
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.size) &&
61
- "divider_size_".concat(appearanceConfig.size).replace(/([A-Z])/g, '-$1').toLowerCase()), fillClass ||
62
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
63
- "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
64
- ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
65
- "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), fillActiveClass, fillActiveHoverClass, fillDisabledClass), style: hrStyles }));
66
- }
67
- Divider.defaultProps = {
68
- size: 'xs',
69
- };
70
-
71
- export { Divider as D, dividerConfig as d };