@itcase/ui 1.8.108 → 1.8.110

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 (226) hide show
  1. package/dist/{Avatar_cjs_bOSuIjlv.js → Avatar_cjs_joB9qjwk.js} +36 -60
  2. package/dist/{Avatar_es_CEiiRkAd.js → Avatar_es_C3HGSiHU.js} +36 -60
  3. package/dist/{Button_cjs_eGfgY2Dz.js → Button_cjs_mau_55Fl.js} +6 -6
  4. package/dist/{Button_es_CEXL2diU.js → Button_es_D_IlkeBp.js} +6 -6
  5. package/dist/{ChipsGroup_cjs_DKLEgUi2.js → ChipsGroup_cjs_D454M1-p.js} +2 -2
  6. package/dist/{ChipsGroup_es_vMh6YMRm.js → ChipsGroup_es_BKG5mK5N.js} +2 -2
  7. package/dist/{DatePicker_cjs_T63y9kcH.js → DatePicker_cjs_C9rI2uTl.js} +5 -5
  8. package/dist/{DatePicker_es_B87jj8h6.js → DatePicker_es_Bi6lgbTb.js} +5 -5
  9. package/dist/{DropdownItem_cjs_BGp4XAme.js → DropdownItem_cjs_D2hHKA5E.js} +2 -2
  10. package/dist/{DropdownItem_es_BwdenrJx.js → DropdownItem_es_D9JBMV70.js} +2 -2
  11. package/dist/{Icon_cjs_LSfBwmrG.js → Icon_cjs_ZerVip3X.js} +32 -47
  12. package/dist/{Icon_es_BYO1LdXJ.js → Icon_es_C76te22j.js} +32 -47
  13. package/dist/{Input_cjs_CFy0tfAO.js → Input_cjs_TC7DOpvh.js} +13 -13
  14. package/dist/{Input_es_l3ry6luZ.js → Input_es_RtN2gtZq.js} +13 -13
  15. package/dist/{Label_cjs_Df_mrKBf.js → Label_cjs_CaTh_laL.js} +2 -2
  16. package/dist/{Label_es_Dl5zb0RD.js → Label_es_CoIII7Ty.js} +2 -2
  17. package/dist/{Loader_cjs_Db9diKuF.js → Loader_cjs_c6yF7akz.js} +1 -1
  18. package/dist/{Loader_es_AhHU-s7_.js → Loader_es_C8ETXkiZ.js} +1 -1
  19. package/dist/{Text_cjs_CeJHeRfI.js → Text_cjs_DpRclhwc.js} +2 -5
  20. package/dist/{Text_es_BXh9Y3hR.js → Text_es_CtCwsa3V.js} +2 -5
  21. package/dist/cjs/components/Accordion.js +4 -3
  22. package/dist/cjs/components/Avatar.js +5 -4
  23. package/dist/cjs/components/AvatarStack.js +5 -4
  24. package/dist/cjs/components/Badge.js +4 -3
  25. package/dist/cjs/components/Breadcrumbs.js +4 -3
  26. package/dist/cjs/components/Button.js +6 -5
  27. package/dist/cjs/components/Cell.js +5 -4
  28. package/dist/cjs/components/Checkbox.js +3 -2
  29. package/dist/cjs/components/Checkmark.js +2 -1
  30. package/dist/cjs/components/Chips.js +5 -4
  31. package/dist/cjs/components/Choice.js +9 -8
  32. package/dist/cjs/components/Code.js +2 -0
  33. package/dist/cjs/components/CookiesWarning.js +6 -5
  34. package/dist/cjs/components/Dadata.js +3 -1
  35. package/dist/cjs/components/DatePeriod.js +9 -8
  36. package/dist/cjs/components/DatePicker.js +9 -8
  37. package/dist/cjs/components/Divider.js +2 -1
  38. package/dist/cjs/components/Dot.js +2 -1
  39. package/dist/cjs/components/Drawer.js +3 -2
  40. package/dist/cjs/components/Dropdown.js +5 -4
  41. package/dist/cjs/components/Flex.js +2 -1
  42. package/dist/cjs/components/Grid.js +2 -1
  43. package/dist/cjs/components/Group.js +2 -1
  44. package/dist/cjs/components/HTMLContent.js +2 -1
  45. package/dist/cjs/components/HeroTitle.js +4 -3
  46. package/dist/cjs/components/Icon.js +4 -3
  47. package/dist/cjs/components/Image.js +2 -1
  48. package/dist/cjs/components/Input.js +3 -1
  49. package/dist/cjs/components/InputPassword.js +4 -3
  50. package/dist/cjs/components/Label.js +5 -4
  51. package/dist/cjs/components/Link.js +2 -1
  52. package/dist/cjs/components/List.js +2 -1
  53. package/dist/cjs/components/Loader.js +4 -3
  54. package/dist/cjs/components/Logo.js +2 -1
  55. package/dist/cjs/components/MenuItem.js +4 -3
  56. package/dist/cjs/components/Modal.js +5 -4
  57. package/dist/cjs/components/ModalSheetBottom.js +4 -3
  58. package/dist/cjs/components/Notification.js +4 -3
  59. package/dist/cjs/components/Overlay.js +2 -1
  60. package/dist/cjs/components/Pagination.js +5 -4
  61. package/dist/cjs/components/Radio.js +6 -2
  62. package/dist/cjs/components/RangeSlider.js +2 -1
  63. package/dist/cjs/components/Response.js +6 -5
  64. package/dist/cjs/components/SVGContent.js +2 -1
  65. package/dist/cjs/components/ScrollOnDrag.js +2 -1
  66. package/dist/cjs/components/ScrollToView.js +2 -1
  67. package/dist/cjs/components/Search.js +4 -3
  68. package/dist/cjs/components/Segmented.js +3 -2
  69. package/dist/cjs/components/Select.js +4 -3
  70. package/dist/cjs/components/Swiper.js +4 -3
  71. package/dist/cjs/components/Switch.js +3 -2
  72. package/dist/cjs/components/Tab.js +14 -16
  73. package/dist/cjs/components/Text.js +3 -2
  74. package/dist/cjs/components/Textarea.js +2 -0
  75. package/dist/cjs/components/Tile.js +4 -3
  76. package/dist/cjs/components/Title.js +4 -3
  77. package/dist/cjs/components/Tooltip.js +4 -3
  78. package/dist/cjs/components/Video.js +1 -0
  79. package/dist/cjs/components/Warning.js +4 -3
  80. package/dist/cjs/hoc/urlWithAssetPrefix.js +17 -0
  81. package/dist/cjs/hooks/useActiveClasses/useActiveClasses.helpers.js +120 -0
  82. package/dist/cjs/hooks/useActiveClasses/useActiveClasses.interface.js +65 -0
  83. package/dist/cjs/hooks/useActiveClasses/useActiveClasses.js +64 -0
  84. package/dist/cjs/hooks/useActiveClasses.js +9 -0
  85. package/dist/cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js +11 -1
  86. package/dist/cjs/hooks/useDevicePropsGenerator.js +2 -0
  87. package/dist/cjs/hooks/useStyles/useStyles.js +4 -3
  88. package/dist/cjs/hooks/useStyles.js +1 -0
  89. package/dist/cjs/hooks.js +9 -0
  90. package/dist/components/Accordion.js +4 -3
  91. package/dist/components/Avatar.js +5 -4
  92. package/dist/components/AvatarStack.js +5 -4
  93. package/dist/components/Badge.js +4 -3
  94. package/dist/components/Breadcrumbs.js +4 -3
  95. package/dist/components/Button.js +6 -5
  96. package/dist/components/Cell.js +5 -4
  97. package/dist/components/Checkbox.js +3 -2
  98. package/dist/components/Checkmark.js +2 -1
  99. package/dist/components/Chips.js +5 -4
  100. package/dist/components/Choice.js +9 -8
  101. package/dist/components/Code.js +2 -0
  102. package/dist/components/CookiesWarning.js +6 -5
  103. package/dist/components/Dadata.js +3 -1
  104. package/dist/components/DatePeriod.js +9 -8
  105. package/dist/components/DatePicker.js +9 -8
  106. package/dist/components/Divider.js +2 -1
  107. package/dist/components/Dot.js +2 -1
  108. package/dist/components/Drawer.js +3 -2
  109. package/dist/components/Dropdown.js +5 -4
  110. package/dist/components/Flex.js +2 -1
  111. package/dist/components/Grid.js +2 -1
  112. package/dist/components/Group.js +2 -1
  113. package/dist/components/HTMLContent.js +2 -1
  114. package/dist/components/HeroTitle.js +4 -3
  115. package/dist/components/Icon.js +4 -3
  116. package/dist/components/Image.js +2 -1
  117. package/dist/components/Input.js +3 -1
  118. package/dist/components/InputPassword.js +4 -3
  119. package/dist/components/Label.js +5 -4
  120. package/dist/components/Link.js +2 -1
  121. package/dist/components/List.js +2 -1
  122. package/dist/components/Loader.js +4 -3
  123. package/dist/components/Logo.js +2 -1
  124. package/dist/components/MenuItem.js +4 -3
  125. package/dist/components/Modal.js +5 -4
  126. package/dist/components/ModalSheetBottom.js +4 -3
  127. package/dist/components/Notification.js +4 -3
  128. package/dist/components/Overlay.js +2 -1
  129. package/dist/components/Pagination.js +5 -4
  130. package/dist/components/Radio.js +6 -2
  131. package/dist/components/RangeSlider.js +2 -1
  132. package/dist/components/Response.js +6 -5
  133. package/dist/components/SVGContent.js +2 -1
  134. package/dist/components/ScrollOnDrag.js +2 -1
  135. package/dist/components/ScrollToView.js +2 -1
  136. package/dist/components/Search.js +4 -3
  137. package/dist/components/Segmented.js +3 -2
  138. package/dist/components/Select.js +4 -3
  139. package/dist/components/Swiper.js +4 -3
  140. package/dist/components/Switch.js +3 -2
  141. package/dist/components/Tab.js +14 -16
  142. package/dist/components/Text.js +3 -2
  143. package/dist/components/Textarea.js +2 -0
  144. package/dist/components/Tile.js +4 -3
  145. package/dist/components/Title.js +4 -3
  146. package/dist/components/Tooltip.js +4 -3
  147. package/dist/components/Video.js +1 -0
  148. package/dist/components/Warning.js +4 -3
  149. package/dist/css/components/Choice/Choice.css +22 -22
  150. package/dist/css/components/Choice/css/__item/choice__item_size.css +3 -3
  151. package/dist/css/components/Icon/Icon.css +12 -19
  152. package/dist/css/components/Input/Input.css +12 -13
  153. package/dist/css/components/Select/Select.css +8 -5
  154. package/dist/css/styles/bundle.css +2 -1
  155. package/dist/css/styles/text-weight/text-weight.css +2 -1
  156. package/dist/hoc/urlWithAssetPrefix.js +17 -0
  157. package/dist/hooks/useActiveClasses/useActiveClasses.helpers.js +116 -0
  158. package/dist/hooks/useActiveClasses/useActiveClasses.interface.js +63 -0
  159. package/dist/hooks/useActiveClasses/useActiveClasses.js +62 -0
  160. package/dist/hooks/useActiveClasses.js +3 -0
  161. package/dist/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js +11 -1
  162. package/dist/hooks/useDevicePropsGenerator.js +2 -0
  163. package/dist/hooks/useStyles/useStyles.js +4 -3
  164. package/dist/hooks/useStyles.js +1 -0
  165. package/dist/hooks.js +7 -0
  166. package/dist/stories/useActiveClasses.mdx +134 -0
  167. package/dist/types/components/Avatar/Avatar.appearance.d.ts +1878 -2
  168. package/dist/types/components/Avatar/Avatar.interface.d.ts +48 -37
  169. package/dist/types/components/Avatar/appearance/avatarDefault.d.ts +2 -19
  170. package/dist/types/components/Avatar/appearance/avatarShape.d.ts +2 -24
  171. package/dist/types/components/Avatar/appearance/avatarSize.d.ts +2 -83
  172. package/dist/types/components/Avatar/appearance/avatarStyle.d.ts +2 -15
  173. package/dist/types/components/Badge/Badge.appearance.d.ts +986 -228
  174. package/dist/types/components/Badge/Badge.interface.d.ts +6 -6
  175. package/dist/types/components/Badge/appearance/badgeAccent.d.ts +2 -37
  176. package/dist/types/components/Badge/appearance/badgeDanger.d.ts +2 -16
  177. package/dist/types/components/Badge/appearance/badgeDisabled.d.ts +2 -14
  178. package/dist/types/components/Badge/appearance/badgeError.d.ts +2 -16
  179. package/dist/types/components/Badge/appearance/badgeInfo.d.ts +2 -15
  180. package/dist/types/components/Badge/appearance/badgePrimary.d.ts +2 -16
  181. package/dist/types/components/Badge/appearance/badgeSecondary.d.ts +2 -16
  182. package/dist/types/components/Badge/appearance/badgeShape.d.ts +2 -24
  183. package/dist/types/components/Badge/appearance/badgeSize.d.ts +2 -31
  184. package/dist/types/components/Badge/appearance/badgeStyle.d.ts +2 -13
  185. package/dist/types/components/Badge/appearance/badgeSuccess.d.ts +2 -16
  186. package/dist/types/components/Badge/appearance/badgeSurface.d.ts +2 -24
  187. package/dist/types/components/Badge/appearance/badgeWarning.d.ts +2 -16
  188. package/dist/types/components/Icon/Icon.d.ts +30 -6
  189. package/dist/types/components/Icon/Icon.interface.d.ts +2 -0
  190. package/dist/types/components/Image/Image.d.ts +1 -2
  191. package/dist/types/components/Input/appearance/inputDefault.d.ts +2 -2
  192. package/dist/types/components/Input/appearance/inputShape.d.ts +4 -4
  193. package/dist/types/components/Logo/Logo.d.ts +2 -2
  194. package/dist/types/components/Radio/Radio.appearance.d.ts +3 -0
  195. package/dist/types/components/Radio/appearance/radioDefault.d.ts +3 -0
  196. package/dist/types/components/Response/Response.d.ts +2 -2
  197. package/dist/types/components/SVGContent/SVGContent.d.ts +1 -2
  198. package/dist/types/components/Tab/appearance/tabSurface.d.ts +1 -0
  199. package/dist/types/components/Text/Text.appearance.d.ts +698 -2
  200. package/dist/types/components/Text/Text.interface.d.ts +32 -47
  201. package/dist/types/components/Text/appearance/textSize.d.ts +2 -23
  202. package/dist/types/components/Title/Title.appearance.d.ts +2225 -2
  203. package/dist/types/components/Title/Title.interface.d.ts +56 -38
  204. package/dist/types/components/Title/appearance/titleAccent.d.ts +2 -19
  205. package/dist/types/components/Title/appearance/titleDanger.d.ts +2 -6
  206. package/dist/types/components/Title/appearance/titleDisabled.d.ts +2 -19
  207. package/dist/types/components/Title/appearance/titleError.d.ts +2 -10
  208. package/dist/types/components/Title/appearance/titleInfo.d.ts +2 -20
  209. package/dist/types/components/Title/appearance/titlePrimary.d.ts +2 -7
  210. package/dist/types/components/Title/appearance/titleRequire.d.ts +2 -19
  211. package/dist/types/components/Title/appearance/titleSecondary.d.ts +2 -7
  212. package/dist/types/components/Title/appearance/titleSize.d.ts +2 -44
  213. package/dist/types/components/Title/appearance/titleStyle.d.ts +2 -15
  214. package/dist/types/components/Title/appearance/titleSuccess.d.ts +2 -10
  215. package/dist/types/components/Title/appearance/titleSurface.d.ts +2 -24
  216. package/dist/types/components/Title/appearance/titleWarning.d.ts +2 -10
  217. package/dist/types/hoc/urlWithAssetPrefix.d.ts +27 -8
  218. package/dist/types/hooks/index.helpers.d.ts +3 -0
  219. package/dist/types/hooks/useActiveClasses/index.d.ts +2 -0
  220. package/dist/types/hooks/useActiveClasses/useActiveClasses.d.ts +3 -0
  221. package/dist/types/hooks/useActiveClasses/useActiveClasses.helpers.d.ts +5 -0
  222. package/dist/types/hooks/useActiveClasses/useActiveClasses.interface.d.ts +26 -0
  223. package/dist/types/hooks/useDevicePropsGenerator/useDevicePropsGenerator.d.ts +1 -1
  224. package/dist/types/hooks/useStyles/styleAttributes.interface.d.ts +3 -0
  225. package/dist/types/types/utils.d.ts +34 -0
  226. package/package.json +7 -7
@@ -10,7 +10,7 @@ var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearance
10
10
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
11
11
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
12
12
  var Link = require('./Link_cjs_BqT6eVl6.js');
13
- var Text = require('./Text_cjs_CeJHeRfI.js');
13
+ var Text = require('./Text_cjs_DpRclhwc.js');
14
14
 
15
15
  var badgeAppearanceAccent = {
16
16
  accent: {
@@ -178,31 +178,37 @@ var badgeAppearanceSize = {
178
178
  sizeXXL: {
179
179
  size: 'xxl',
180
180
  textSize: 'xl',
181
- iconSize: 24,
181
+ iconSize: '24',
182
182
  },
183
183
  sizeXL: {
184
184
  size: 'xl',
185
185
  textSize: 'l',
186
+ iconSize: '24',
186
187
  },
187
188
  sizeL: {
188
189
  size: 'l',
189
190
  textSize: 'l',
191
+ iconSize: '24',
190
192
  },
191
193
  sizeM: {
192
194
  size: 'm',
193
195
  textSize: 'm',
196
+ iconSize: '24',
194
197
  },
195
198
  sizeS: {
196
199
  size: 's',
197
200
  textSize: 's',
201
+ iconSize: '24',
198
202
  },
199
203
  sizeXS: {
200
204
  size: 'xs',
201
205
  textSize: 'xs',
206
+ iconSize: '24',
202
207
  },
203
208
  sizeXXS: {
204
209
  size: 'xxs',
205
210
  textSize: 'xs',
211
+ iconSize: '24',
206
212
  },
207
213
  };
208
214
 
@@ -312,20 +318,15 @@ function Badge(props) {
312
318
  var titleAppearanceAccent = {
313
319
  accent: {
314
320
  fill: 'accentPrimary',
315
- fillHover: 'accentPrimaryHover',
321
+ fillHover: 'accentHoverPrimary',
316
322
  },
317
323
  accentPrimary: {
318
324
  fill: 'accentPrimary',
319
- fillHover: 'accentPrimaryHover',
320
- borderColor: 'accentBorderPrimary',
325
+ fillHover: 'accentHoverPrimary',
321
326
  },
322
327
  accentSecondary: {
323
328
  fill: 'accentPrimary',
324
- fillHover: 'accentPrimaryHover',
325
- labelTextColor: 'accentTextSecondary',
326
- labelTextColorHover: 'accentTextSecondary',
327
- borderColor: 'accentBorderPrimary',
328
- loaderItemFill: 'accentItemPrimary',
329
+ fillHover: 'accentHoverPrimary',
329
330
  },
330
331
  };
331
332
 
@@ -362,8 +363,6 @@ var titleAppearanceError = {
362
363
  fillHover: 'errorPrimaryHover',
363
364
  labelTextColor: 'errorTextPrimary',
364
365
  labelTextColorHover: 'errorTextPrimary',
365
- loaderFill: 'errorPrimary',
366
- loaderItemFill: 'errorItemPrimary',
367
366
  },
368
367
  };
369
368
 
@@ -371,20 +370,10 @@ var titleAppearanceInfo = {
371
370
  info: {
372
371
  fill: 'accentPrimary',
373
372
  fillHover: 'accentPrimaryHover',
374
- labelTextColor: 'accentTextPrimary',
375
- labelTextColorHover: 'accentTextPrimary',
376
- borderColor: 'accentBorderPrimary',
377
- loaderFill: 'accentPrimary',
378
- loaderItemFill: 'accentItemPrimary',
379
373
  },
380
374
  infoSecondary: {
381
375
  fill: 'accentPrimary',
382
376
  fillHover: 'accentPrimaryHover',
383
- labelTextColor: 'accentTextSecondary',
384
- labelTextColorHover: 'accentTextSecondary',
385
- borderColor: 'accentBorderPrimary',
386
- loaderFill: 'accentPrimary',
387
- loaderItemFill: 'accentItemPrimary',
388
377
  },
389
378
  };
390
379
 
@@ -392,7 +381,6 @@ var titleAppearancePrimary = {
392
381
  primary: {
393
382
  fill: 'primaryPrimary',
394
383
  fillHover: 'primaryPrimaryHover',
395
- labelTextColor: 'primaryTextPrimary',
396
384
  },
397
385
  };
398
386
 
@@ -470,18 +458,13 @@ var titleAppearanceSize = {
470
458
  };
471
459
 
472
460
  var titleAppearanceStyle = {
473
- full: {
474
- borderColor: '0',
475
- },
476
- ghost: {
477
- fill: 'none',
478
- borderColor: '0',
479
- },
461
+ solid: {},
480
462
  outlined: {
481
463
  fill: 'none',
482
464
  },
483
- solid: {
484
- borderColor: '0',
465
+ full: {},
466
+ ghost: {
467
+ fill: 'none',
485
468
  },
486
469
  };
487
470
 
@@ -489,10 +472,6 @@ var titleAppearanceSuccess = {
489
472
  success: {
490
473
  fill: 'successPrimary',
491
474
  fillHover: 'successPrimaryHover',
492
- labelTextColor: 'successTextSecondary',
493
- labelTextColorHover: 'successTextSecondary',
494
- loaderFill: 'successPrimary',
495
- loaderItemFill: 'successItemPrimary',
496
475
  },
497
476
  };
498
477
 
@@ -500,24 +479,18 @@ var titleAppearanceSurface = {
500
479
  surfacePrimary: {
501
480
  fill: 'surfacePrimary',
502
481
  fillHover: 'surfacePrimaryHover',
503
- labelTextColor: 'surfaceTextPrimary',
504
482
  },
505
483
  surfaceSecondary: {
506
484
  fill: 'surfaceSecondary',
507
485
  fillHover: 'surfaceSecondaryHover',
508
- labelTextColor: 'surfaceTextPrimary',
509
- loaderFill: 'surfaceSecondary',
510
- loaderItemFill: 'surfaceItemPrimary',
511
486
  },
512
487
  surfaceTertiary: {
513
488
  fill: 'surfaceTertiary',
514
489
  fillHover: 'surfaceTertiaryHover',
515
- labelTextColor: 'surfaceTextPrimary',
516
490
  },
517
491
  surfaceQuaternary: {
518
492
  fill: 'surfaceQuaternary',
519
493
  fillHover: 'surfaceQuaternaryHover',
520
- labelTextColor: 'surfaceTextPrimary',
521
494
  },
522
495
  };
523
496
 
@@ -527,8 +500,6 @@ var titleAppearanceWarning = {
527
500
  fillHover: 'warningPrimaryHover',
528
501
  labelTextColor: 'warningTextSecondary',
529
502
  labelTextColorHover: 'warningTextSecondary',
530
- loaderFill: 'warningPrimary',
531
- loaderItemFill: 'warningItemPrimary',
532
503
  },
533
504
  };
534
505
 
@@ -541,10 +512,10 @@ var titleConfig = {
541
512
  },
542
513
  };
543
514
  function Title(props) {
544
- var dataTour = props.dataTour, className = props.className, appearance = props.appearance, text = props.text, afterWrapper = props.afterWrapper, beforeWrapper = props.beforeWrapper, _a = props.tag, tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
515
+ var dataTestId = props.dataTestId, dataTour = props.dataTour, className = props.className, appearance = props.appearance, isDisabled = props.isDisabled, text = props.text, afterWrapper = props.afterWrapper, beforeWrapper = props.beforeWrapper, _a = props.tag, tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, isActive = props.isActive, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
545
516
  var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, titleConfig);
546
517
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
547
- var dataTestId = propsGenerator.dataTestId, directionClass = propsGenerator.directionClass, size = propsGenerator.size, fillClass = propsGenerator.fillClass, textAlignClass = propsGenerator.textAlignClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorClass = propsGenerator.textColorClass, textColorGradientClass = propsGenerator.textColorGradientClass, textColorHoverClass = propsGenerator.textColorHoverClass, textStyleClass = propsGenerator.textStyleClass, textTruncateClass = propsGenerator.textTruncateClass, textWeightClass = propsGenerator.textWeightClass, textWrap = propsGenerator.textWrap, heightClass = propsGenerator.heightClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, wrapperDirectionClass = propsGenerator.wrapperDirectionClass;
518
+ var directionClass = propsGenerator.directionClass, size = propsGenerator.size, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textAlignClass = propsGenerator.textAlignClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorActiveHoverClass = propsGenerator.textColorActiveHoverClass, textColorClass = propsGenerator.textColorClass, textColorHoverClass = propsGenerator.textColorHoverClass, textStyleClass = propsGenerator.textStyleClass, textTruncateClass = propsGenerator.textTruncateClass, textWeightClass = propsGenerator.textWeightClass, textWrap = propsGenerator.textWrap, heightClass = propsGenerator.heightClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass, widthClass = propsGenerator.widthClass, wrapperDirectionClass = propsGenerator.wrapperDirectionClass;
548
519
  // @ts-expect-error
549
520
  var _b = useStyles.useStyles(props), titleStyles = _b.styles, titleWrapperStyles = _b.wrapper;
550
521
  // Element type (h1, h2, ..., h6)
@@ -554,7 +525,21 @@ function Title(props) {
554
525
  }
555
526
  return size ? size : 'span';
556
527
  }, [tag, size]);
557
- return (jsxRuntime.jsxs(Tag, { dataTestId: dataTestId, dataTour: dataTour, 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), directionClass && "title_direction_".concat(directionClass), textColorClass && "text 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), iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), 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: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
528
+ return (jsxRuntime.jsxs(Tag, { dataTestId: dataTestId, dataTour: dataTour, className: clsx(className, 'title', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".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), directionClass && "title_direction_".concat(directionClass), isDisabled &&
529
+ textColorDisabledClass &&
530
+ "text-color_".concat(textColorDisabledClass), !isActive &&
531
+ !isDisabled &&
532
+ textColorClass &&
533
+ "text-color_".concat(textColorClass), isActive &&
534
+ !isDisabled &&
535
+ textColorActiveClass &&
536
+ "text-color_active_".concat(textColorActiveClass), !isActive &&
537
+ !isDisabled &&
538
+ textColorHoverClass &&
539
+ "text-color_hover_".concat(textColorHoverClass), isActive &&
540
+ !isDisabled &&
541
+ textColorActiveHoverClass &&
542
+ "text-color_active_hover".concat(textColorActiveHoverClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), textWrap && "word-wrap_".concat(textWrap), iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), 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: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
558
543
  }
559
544
 
560
545
  var tooltipAppearanceDefault = {
@@ -8,7 +8,7 @@ import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceCo
8
8
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
9
9
  import { useStyles } from './hooks/useStyles/useStyles.js';
10
10
  import { a as LinkWrapper } from './Link_es_BnUIX0QT.js';
11
- import { T as Text } from './Text_es_BXh9Y3hR.js';
11
+ import { T as Text } from './Text_es_CtCwsa3V.js';
12
12
 
13
13
  var badgeAppearanceAccent = {
14
14
  accent: {
@@ -176,31 +176,37 @@ var badgeAppearanceSize = {
176
176
  sizeXXL: {
177
177
  size: 'xxl',
178
178
  textSize: 'xl',
179
- iconSize: 24,
179
+ iconSize: '24',
180
180
  },
181
181
  sizeXL: {
182
182
  size: 'xl',
183
183
  textSize: 'l',
184
+ iconSize: '24',
184
185
  },
185
186
  sizeL: {
186
187
  size: 'l',
187
188
  textSize: 'l',
189
+ iconSize: '24',
188
190
  },
189
191
  sizeM: {
190
192
  size: 'm',
191
193
  textSize: 'm',
194
+ iconSize: '24',
192
195
  },
193
196
  sizeS: {
194
197
  size: 's',
195
198
  textSize: 's',
199
+ iconSize: '24',
196
200
  },
197
201
  sizeXS: {
198
202
  size: 'xs',
199
203
  textSize: 'xs',
204
+ iconSize: '24',
200
205
  },
201
206
  sizeXXS: {
202
207
  size: 'xxs',
203
208
  textSize: 'xs',
209
+ iconSize: '24',
204
210
  },
205
211
  };
206
212
 
@@ -310,20 +316,15 @@ function Badge(props) {
310
316
  var titleAppearanceAccent = {
311
317
  accent: {
312
318
  fill: 'accentPrimary',
313
- fillHover: 'accentPrimaryHover',
319
+ fillHover: 'accentHoverPrimary',
314
320
  },
315
321
  accentPrimary: {
316
322
  fill: 'accentPrimary',
317
- fillHover: 'accentPrimaryHover',
318
- borderColor: 'accentBorderPrimary',
323
+ fillHover: 'accentHoverPrimary',
319
324
  },
320
325
  accentSecondary: {
321
326
  fill: 'accentPrimary',
322
- fillHover: 'accentPrimaryHover',
323
- labelTextColor: 'accentTextSecondary',
324
- labelTextColorHover: 'accentTextSecondary',
325
- borderColor: 'accentBorderPrimary',
326
- loaderItemFill: 'accentItemPrimary',
327
+ fillHover: 'accentHoverPrimary',
327
328
  },
328
329
  };
329
330
 
@@ -360,8 +361,6 @@ var titleAppearanceError = {
360
361
  fillHover: 'errorPrimaryHover',
361
362
  labelTextColor: 'errorTextPrimary',
362
363
  labelTextColorHover: 'errorTextPrimary',
363
- loaderFill: 'errorPrimary',
364
- loaderItemFill: 'errorItemPrimary',
365
364
  },
366
365
  };
367
366
 
@@ -369,20 +368,10 @@ var titleAppearanceInfo = {
369
368
  info: {
370
369
  fill: 'accentPrimary',
371
370
  fillHover: 'accentPrimaryHover',
372
- labelTextColor: 'accentTextPrimary',
373
- labelTextColorHover: 'accentTextPrimary',
374
- borderColor: 'accentBorderPrimary',
375
- loaderFill: 'accentPrimary',
376
- loaderItemFill: 'accentItemPrimary',
377
371
  },
378
372
  infoSecondary: {
379
373
  fill: 'accentPrimary',
380
374
  fillHover: 'accentPrimaryHover',
381
- labelTextColor: 'accentTextSecondary',
382
- labelTextColorHover: 'accentTextSecondary',
383
- borderColor: 'accentBorderPrimary',
384
- loaderFill: 'accentPrimary',
385
- loaderItemFill: 'accentItemPrimary',
386
375
  },
387
376
  };
388
377
 
@@ -390,7 +379,6 @@ var titleAppearancePrimary = {
390
379
  primary: {
391
380
  fill: 'primaryPrimary',
392
381
  fillHover: 'primaryPrimaryHover',
393
- labelTextColor: 'primaryTextPrimary',
394
382
  },
395
383
  };
396
384
 
@@ -468,18 +456,13 @@ var titleAppearanceSize = {
468
456
  };
469
457
 
470
458
  var titleAppearanceStyle = {
471
- full: {
472
- borderColor: '0',
473
- },
474
- ghost: {
475
- fill: 'none',
476
- borderColor: '0',
477
- },
459
+ solid: {},
478
460
  outlined: {
479
461
  fill: 'none',
480
462
  },
481
- solid: {
482
- borderColor: '0',
463
+ full: {},
464
+ ghost: {
465
+ fill: 'none',
483
466
  },
484
467
  };
485
468
 
@@ -487,10 +470,6 @@ var titleAppearanceSuccess = {
487
470
  success: {
488
471
  fill: 'successPrimary',
489
472
  fillHover: 'successPrimaryHover',
490
- labelTextColor: 'successTextSecondary',
491
- labelTextColorHover: 'successTextSecondary',
492
- loaderFill: 'successPrimary',
493
- loaderItemFill: 'successItemPrimary',
494
473
  },
495
474
  };
496
475
 
@@ -498,24 +477,18 @@ var titleAppearanceSurface = {
498
477
  surfacePrimary: {
499
478
  fill: 'surfacePrimary',
500
479
  fillHover: 'surfacePrimaryHover',
501
- labelTextColor: 'surfaceTextPrimary',
502
480
  },
503
481
  surfaceSecondary: {
504
482
  fill: 'surfaceSecondary',
505
483
  fillHover: 'surfaceSecondaryHover',
506
- labelTextColor: 'surfaceTextPrimary',
507
- loaderFill: 'surfaceSecondary',
508
- loaderItemFill: 'surfaceItemPrimary',
509
484
  },
510
485
  surfaceTertiary: {
511
486
  fill: 'surfaceTertiary',
512
487
  fillHover: 'surfaceTertiaryHover',
513
- labelTextColor: 'surfaceTextPrimary',
514
488
  },
515
489
  surfaceQuaternary: {
516
490
  fill: 'surfaceQuaternary',
517
491
  fillHover: 'surfaceQuaternaryHover',
518
- labelTextColor: 'surfaceTextPrimary',
519
492
  },
520
493
  };
521
494
 
@@ -525,8 +498,6 @@ var titleAppearanceWarning = {
525
498
  fillHover: 'warningPrimaryHover',
526
499
  labelTextColor: 'warningTextSecondary',
527
500
  labelTextColorHover: 'warningTextSecondary',
528
- loaderFill: 'warningPrimary',
529
- loaderItemFill: 'warningItemPrimary',
530
501
  },
531
502
  };
532
503
 
@@ -539,10 +510,10 @@ var titleConfig = {
539
510
  },
540
511
  };
541
512
  function Title(props) {
542
- var dataTour = props.dataTour, className = props.className, appearance = props.appearance, text = props.text, afterWrapper = props.afterWrapper, beforeWrapper = props.beforeWrapper, _a = props.tag, tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
513
+ var dataTestId = props.dataTestId, dataTour = props.dataTour, className = props.className, appearance = props.appearance, isDisabled = props.isDisabled, text = props.text, afterWrapper = props.afterWrapper, beforeWrapper = props.beforeWrapper, _a = props.tag, tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, isActive = props.isActive, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
543
514
  var appearanceConfig = useAppearanceConfig(appearance, titleConfig);
544
515
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
545
- var dataTestId = propsGenerator.dataTestId, directionClass = propsGenerator.directionClass, size = propsGenerator.size, fillClass = propsGenerator.fillClass, textAlignClass = propsGenerator.textAlignClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorClass = propsGenerator.textColorClass, textColorGradientClass = propsGenerator.textColorGradientClass, textColorHoverClass = propsGenerator.textColorHoverClass, textStyleClass = propsGenerator.textStyleClass, textTruncateClass = propsGenerator.textTruncateClass, textWeightClass = propsGenerator.textWeightClass, textWrap = propsGenerator.textWrap, heightClass = propsGenerator.heightClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, wrapperDirectionClass = propsGenerator.wrapperDirectionClass;
516
+ var directionClass = propsGenerator.directionClass, size = propsGenerator.size, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textAlignClass = propsGenerator.textAlignClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorActiveHoverClass = propsGenerator.textColorActiveHoverClass, textColorClass = propsGenerator.textColorClass, textColorHoverClass = propsGenerator.textColorHoverClass, textStyleClass = propsGenerator.textStyleClass, textTruncateClass = propsGenerator.textTruncateClass, textWeightClass = propsGenerator.textWeightClass, textWrap = propsGenerator.textWrap, heightClass = propsGenerator.heightClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass, widthClass = propsGenerator.widthClass, wrapperDirectionClass = propsGenerator.wrapperDirectionClass;
546
517
  // @ts-expect-error
547
518
  var _b = useStyles(props), titleStyles = _b.styles, titleWrapperStyles = _b.wrapper;
548
519
  // Element type (h1, h2, ..., h6)
@@ -552,7 +523,21 @@ function Title(props) {
552
523
  }
553
524
  return size ? size : 'span';
554
525
  }, [tag, size]);
555
- return (jsxs(Tag, { dataTestId: dataTestId, dataTour: dataTour, 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), directionClass && "title_direction_".concat(directionClass), textColorClass && "text 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), iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), style: titleStyles, onClick: onClick, children: [before, jsxs("span", { className: clsx(textAlignClass && "text-align_".concat(textAlignClass), wrapperDirectionClass && "title_direction_".concat(wrapperDirectionClass), 'title__wrapper', textTruncateClass && "text-truncate_".concat(textTruncateClass)), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
526
+ return (jsxs(Tag, { dataTestId: dataTestId, dataTour: dataTour, className: clsx(className, 'title', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".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), directionClass && "title_direction_".concat(directionClass), isDisabled &&
527
+ textColorDisabledClass &&
528
+ "text-color_".concat(textColorDisabledClass), !isActive &&
529
+ !isDisabled &&
530
+ textColorClass &&
531
+ "text-color_".concat(textColorClass), isActive &&
532
+ !isDisabled &&
533
+ textColorActiveClass &&
534
+ "text-color_active_".concat(textColorActiveClass), !isActive &&
535
+ !isDisabled &&
536
+ textColorHoverClass &&
537
+ "text-color_hover_".concat(textColorHoverClass), isActive &&
538
+ !isDisabled &&
539
+ textColorActiveHoverClass &&
540
+ "text-color_active_hover".concat(textColorActiveHoverClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), textWrap && "word-wrap_".concat(textWrap), iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), style: titleStyles, onClick: onClick, children: [before, jsxs("span", { className: clsx(textAlignClass && "text-align_".concat(textAlignClass), wrapperDirectionClass && "title_direction_".concat(wrapperDirectionClass), 'title__wrapper', textTruncateClass && "text-truncate_".concat(textTruncateClass)), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
556
541
  }
557
542
 
558
543
  var tooltipAppearanceDefault = {
@@ -10,10 +10,10 @@ var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
10
10
  var inputAppearanceDefault = {
11
11
  defaultPrimary: {
12
12
  fill: 'surfaceSecondary',
13
+ textColorDisabled: 'surfaceTextDisabled',
13
14
  borderColor: 'surfaceBorderTertiary',
14
15
  borderColorHover: 'surfaceBorderQuaternary',
15
16
  textColor: 'surfaceTextPrimary',
16
- textColorDisabled: 'surfaceTextDisabled',
17
17
  caret: 'accentItemSecondary',
18
18
  iconBeforeFill: 'surfaceItemQuaternary',
19
19
  iconClearFill: 'surfaceItemPrimary',
@@ -21,10 +21,10 @@ var inputAppearanceDefault = {
21
21
  },
22
22
  defaultSecondary: {
23
23
  fill: 'surfacePrimary',
24
+ textColorDisabled: 'surfaceTextDisabled',
24
25
  borderColor: 'surfaceBorderTertiary',
25
26
  borderColorHover: 'surfaceBorderQuaternary',
26
27
  textColor: 'surfaceTextPrimary',
27
- textColorDisabled: 'surfaceTextDisabled',
28
28
  caret: 'accentItemSecondary',
29
29
  iconBeforeFill: 'surfaceItemQuaternary',
30
30
  iconClearFill: 'surfaceItemPrimary',
@@ -103,21 +103,21 @@ var inputAppearanceShape = {
103
103
  rounded: {
104
104
  shape: 'rounded',
105
105
  },
106
- roundedS: {
107
- shape: 'rounded',
108
- shapeStrength: '0_5m',
109
- },
110
- roundedM: {
106
+ roundedXL: {
111
107
  shape: 'rounded',
112
- shapeStrength: '1m',
108
+ shapeStrength: '2m',
113
109
  },
114
110
  roundedL: {
115
111
  shape: 'rounded',
116
112
  shapeStrength: '1_5m',
117
113
  },
118
- roundedXL: {
114
+ roundedM: {
119
115
  shape: 'rounded',
120
- shapeStrength: '2m',
116
+ shapeStrength: '1m',
117
+ },
118
+ roundedS: {
119
+ shape: 'rounded',
120
+ shapeStrength: '0_5m',
121
121
  },
122
122
  };
123
123
 
@@ -201,11 +201,11 @@ var inputConfig = {
201
201
  },
202
202
  };
203
203
  var Input = React.forwardRef(function Input(props, ref) {
204
- var id = props.id, className = props.className, _a = props.type, type = _a === void 0 ? 'text' : _a, name = props.name, appearance = props.appearance, isDisabled = props.isDisabled, autocomplete = props.autocomplete, dataTestId = props.dataTestId, index = props.index, placeholder = props.placeholder, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
204
+ var id = props.id, dataTestId = props.dataTestId, className = props.className, _a = props.type, type = _a === void 0 ? 'text' : _a, name = props.name, appearance = props.appearance, isDisabled = props.isDisabled, autocomplete = props.autocomplete, index = props.index, placeholder = props.placeholder, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
205
205
  var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, inputConfig);
206
206
  // const stateConfig = state && inputConfig.state && inputConfig.state[state]
207
207
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
208
- var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
208
+ var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderWidthClass = propsGenerator.borderWidthClass, textColorClass = propsGenerator.textColorClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
209
209
  return (jsxRuntime.jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), textColorClass && "text-color_".concat(textColorClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), !isDisabled
210
210
  ? fillClass && "fill_".concat(fillClass)
211
211
  : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
@@ -222,7 +222,7 @@ var Input = React.forwardRef(function Input(props, ref) {
222
222
  : placeholderTextColorDisabledClass &&
223
223
  "placeholder-text-color_disabled_".concat(placeholderTextColorDisabledClass), !isDisabled
224
224
  ? textColorClass && "text-color_".concat(textColorClass)
225
- : textColorDisabledClass && "text-color_".concat(textColorDisabledClass)), type: type, disabled: isDisabled, autocomplete: autocomplete, "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), index: index, placeholder: placeholder, ref: ref, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
225
+ : textColorDisabledClass && "text-color_".concat(textColorDisabledClass)), type: type, ref: ref, disabled: isDisabled, autocomplete: autocomplete, "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), index: index, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
226
226
  });
227
227
 
228
228
  exports.Input = Input;
@@ -8,10 +8,10 @@ import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
8
8
  var inputAppearanceDefault = {
9
9
  defaultPrimary: {
10
10
  fill: 'surfaceSecondary',
11
+ textColorDisabled: 'surfaceTextDisabled',
11
12
  borderColor: 'surfaceBorderTertiary',
12
13
  borderColorHover: 'surfaceBorderQuaternary',
13
14
  textColor: 'surfaceTextPrimary',
14
- textColorDisabled: 'surfaceTextDisabled',
15
15
  caret: 'accentItemSecondary',
16
16
  iconBeforeFill: 'surfaceItemQuaternary',
17
17
  iconClearFill: 'surfaceItemPrimary',
@@ -19,10 +19,10 @@ var inputAppearanceDefault = {
19
19
  },
20
20
  defaultSecondary: {
21
21
  fill: 'surfacePrimary',
22
+ textColorDisabled: 'surfaceTextDisabled',
22
23
  borderColor: 'surfaceBorderTertiary',
23
24
  borderColorHover: 'surfaceBorderQuaternary',
24
25
  textColor: 'surfaceTextPrimary',
25
- textColorDisabled: 'surfaceTextDisabled',
26
26
  caret: 'accentItemSecondary',
27
27
  iconBeforeFill: 'surfaceItemQuaternary',
28
28
  iconClearFill: 'surfaceItemPrimary',
@@ -101,21 +101,21 @@ var inputAppearanceShape = {
101
101
  rounded: {
102
102
  shape: 'rounded',
103
103
  },
104
- roundedS: {
105
- shape: 'rounded',
106
- shapeStrength: '0_5m',
107
- },
108
- roundedM: {
104
+ roundedXL: {
109
105
  shape: 'rounded',
110
- shapeStrength: '1m',
106
+ shapeStrength: '2m',
111
107
  },
112
108
  roundedL: {
113
109
  shape: 'rounded',
114
110
  shapeStrength: '1_5m',
115
111
  },
116
- roundedXL: {
112
+ roundedM: {
117
113
  shape: 'rounded',
118
- shapeStrength: '2m',
114
+ shapeStrength: '1m',
115
+ },
116
+ roundedS: {
117
+ shape: 'rounded',
118
+ shapeStrength: '0_5m',
119
119
  },
120
120
  };
121
121
 
@@ -199,11 +199,11 @@ var inputConfig = {
199
199
  },
200
200
  };
201
201
  var Input = React.forwardRef(function Input(props, ref) {
202
- var id = props.id, className = props.className, _a = props.type, type = _a === void 0 ? 'text' : _a, name = props.name, appearance = props.appearance, isDisabled = props.isDisabled, autocomplete = props.autocomplete, dataTestId = props.dataTestId, index = props.index, placeholder = props.placeholder, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
202
+ var id = props.id, dataTestId = props.dataTestId, className = props.className, _a = props.type, type = _a === void 0 ? 'text' : _a, name = props.name, appearance = props.appearance, isDisabled = props.isDisabled, autocomplete = props.autocomplete, index = props.index, placeholder = props.placeholder, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
203
203
  var appearanceConfig = useAppearanceConfig(appearance, inputConfig);
204
204
  // const stateConfig = state && inputConfig.state && inputConfig.state[state]
205
205
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
206
- var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
206
+ var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderWidthClass = propsGenerator.borderWidthClass, textColorClass = propsGenerator.textColorClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
207
207
  return (jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), textColorClass && "text-color_".concat(textColorClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), !isDisabled
208
208
  ? fillClass && "fill_".concat(fillClass)
209
209
  : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
@@ -220,7 +220,7 @@ var Input = React.forwardRef(function Input(props, ref) {
220
220
  : placeholderTextColorDisabledClass &&
221
221
  "placeholder-text-color_disabled_".concat(placeholderTextColorDisabledClass), !isDisabled
222
222
  ? textColorClass && "text-color_".concat(textColorClass)
223
- : textColorDisabledClass && "text-color_".concat(textColorDisabledClass)), type: type, disabled: isDisabled, autocomplete: autocomplete, "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), index: index, placeholder: placeholder, ref: ref, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
223
+ : textColorDisabledClass && "text-color_".concat(textColorDisabledClass)), type: type, ref: ref, disabled: isDisabled, autocomplete: autocomplete, "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), index: index, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
224
224
  });
225
225
 
226
226
  export { Input as I, inputAppearance as a, inputConfig as i };
@@ -6,8 +6,8 @@ var clsx = require('clsx');
6
6
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
7
7
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
8
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
9
- var Icon = require('./Icon_cjs_LSfBwmrG.js');
10
- var Text = require('./Text_cjs_CeJHeRfI.js');
9
+ var Icon = require('./Icon_cjs_ZerVip3X.js');
10
+ var Text = require('./Text_cjs_DpRclhwc.js');
11
11
  var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
12
12
 
13
13
  var labelAppearanceAccent = {
@@ -4,8 +4,8 @@ import clsx from 'clsx';
4
4
  import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
5
5
  import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
6
6
  import { useStyles } from './hooks/useStyles/useStyles.js';
7
- import { I as Icon, T as Tooltip } from './Icon_es_BYO1LdXJ.js';
8
- import { T as Text } from './Text_es_BXh9Y3hR.js';
7
+ import { I as Icon, T as Tooltip } from './Icon_es_C76te22j.js';
8
+ import { T as Text } from './Text_es_CtCwsa3V.js';
9
9
  import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
10
10
 
11
11
  var labelAppearanceAccent = {
@@ -5,7 +5,7 @@ var clsx = require('clsx');
5
5
  var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
6
6
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
7
7
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
8
- var Text = require('./Text_cjs_CeJHeRfI.js');
8
+ var Text = require('./Text_cjs_DpRclhwc.js');
9
9
  var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
10
10
 
11
11
  var loaderAppearanceAccent = {