@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
@@ -1,52 +1,70 @@
1
- import { CSSProperties, ElementType, ReactNode } from 'react';
2
- import { AppearanceKeysDefault, FillProps, SvgFillProps, TextAlignProps, TextColorActiveProps, TextColorHoverProps, TextColorProps, TextGradientProps, TextStyleProps, TextWeightProps, TextWrapProps, TitleSizeProps } from '@itcase/types';
1
+ import { CSSProperties, ReactNode } from 'react';
2
+ import { AppearanceKeysDefault, AppearanceShapeKey, AppearanceStyleKey, AppearanceTitleSizeKey, CompositeAppearanceTitleKey, DirectionHVProps, FillHoverProps, FillProps, SvgFillHoverProps, SvgFillProps, TextAlignProps, TextColorActiveHoverProps, TextColorActiveProps, TextColorHoverProps, TextColorProps, TextSizeProps, TextTagProps, TextWeightProps, TextWrapProps, TitleSizeProps } from '@itcase/types';
3
3
  import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
4
- interface TitleThemeColor {
5
- [key: number | string | symbol]: any;
4
+ import { IconProps } from '../Icon/Icon.interface';
5
+ type TitleAppearanceProps = {
6
+ direction?: string;
6
7
  fill?: FillProps;
8
+ fillHover?: FillHoverProps;
9
+ iconAfter?: IconProps['SvgImage'];
10
+ iconAfterFill?: IconProps['fill'];
11
+ iconAfterFillIcon?: IconProps['iconFill'];
12
+ iconAfterFillSize?: IconProps['fillSize'];
13
+ iconAfterShape?: IconProps['shape'];
14
+ iconAfterSize?: IconProps['iconSize'];
15
+ iconAfterSrc?: IconProps['imageSrc'];
16
+ iconBadgeAppearance?: IconProps['badgeAppearance'];
17
+ iconBadgeShape?: IconProps['badgeShape'];
18
+ iconBadgeSize?: IconProps['badgeSize'];
19
+ iconBadgeTextColor?: TextColorProps;
20
+ iconBadgeTextSize?: TextSizeProps;
21
+ iconBadgeValue?: IconProps['badgeValue'];
22
+ iconBefore?: IconProps['SvgImage'];
23
+ iconBeforeFill?: IconProps['fill'];
24
+ iconBeforeFillIcon?: IconProps['iconFill'];
25
+ iconBeforeFillSize?: IconProps['fillSize'];
26
+ iconBeforeShape?: IconProps['shape'];
27
+ iconBeforeSize?: IconProps['iconSize'];
28
+ iconBeforeSrc?: IconProps['imageSrc'];
7
29
  size?: TitleSizeProps;
8
- sizeDesktop?: TitleSizeProps;
9
- sizeMobile?: TitleSizeProps;
10
- sizeTablet?: TitleSizeProps;
11
30
  svgFill?: SvgFillProps;
12
- svgFillHover?: SvgFillProps;
31
+ svgFillHover?: SvgFillHoverProps;
32
+ textAlign?: TextAlignProps;
13
33
  textColor?: TextColorProps;
14
34
  textColorActive?: TextColorActiveProps;
35
+ textColorActiveHover?: TextColorActiveHoverProps;
36
+ textColorDisabled?: string;
15
37
  textColorHover?: TextColorHoverProps;
16
- textGradient?: TextGradientProps;
17
- textStyle?: TextStyleProps;
38
+ textStyle?: string;
39
+ textTruncate?: boolean;
18
40
  textWeight?: TextWeightProps;
19
41
  textWrap?: TextWrapProps;
20
- weight?: TextWeightProps;
21
- }
22
- type AppearanceKeys = AppearanceKeysDefault & {};
23
- export type TitleAppearanceType = {
24
- [key in AppearanceKeys]: TitleThemeColor;
42
+ wrapperDirection?: DirectionHVProps;
25
43
  };
26
- export interface TitleConfig {
27
- [key: number | string | symbol]: any;
28
- appearance: TitleAppearanceType | undefined;
29
- setAppearance: (newComponent: TitleAppearanceType) => void;
30
- }
31
- export interface TitleProps extends TitleThemeColor, StyleAttributes {
32
- [key: number | string | symbol]: any;
33
- after?: any;
34
- afterWrapper?: any;
35
- appearance?: AppearanceKeys;
36
- before?: any;
37
- beforeWrapper?: any;
38
- children: ReactNode;
44
+ type TitleProps = StyleAttributes & TitleAppearanceProps & {
45
+ after?: string;
46
+ afterWrapper?: string;
47
+ appearance?: CompositeAppearanceTitleKey;
48
+ before?: string;
49
+ beforeWrapper?: string;
50
+ children?: ReactNode;
39
51
  className?: string;
52
+ dataTestId?: string;
40
53
  dataTour?: string;
41
- direction?: string;
42
- directionWrapper?: string;
43
- mode?: string;
54
+ isActive?: boolean;
55
+ isDisabled?: boolean;
56
+ isSkeleton?: boolean;
57
+ onClick: () => void;
44
58
  style?: CSSProperties;
45
- tag?: ElementType;
59
+ tag: TextTagProps;
46
60
  text?: string;
47
- textAlign?: TextAlignProps;
48
- textTruncate?: boolean;
49
- type?: string;
50
- onClick?: () => void;
51
- }
52
- export {};
61
+ };
62
+ type TitleAppearanceKey = AppearanceKeysDefault | AppearanceShapeKey | AppearanceStyleKey | AppearanceTitleSizeKey;
63
+ type TitleAppearance = {
64
+ [key in TitleAppearanceKey]?: TitleAppearanceProps;
65
+ };
66
+ type TitleConfig = {
67
+ appearance: TitleAppearance;
68
+ setAppearance: (appearanceConfig: TitleAppearance) => void;
69
+ };
70
+ export type { TitleAppearance, TitleConfig, TitleProps };
@@ -1,20 +1,3 @@
1
- declare const titleAppearanceAccent: {
2
- accent: {
3
- fill: string;
4
- fillHover: string;
5
- };
6
- accentPrimary: {
7
- fill: string;
8
- fillHover: string;
9
- borderColor: string;
10
- };
11
- accentSecondary: {
12
- fill: string;
13
- fillHover: string;
14
- labelTextColor: string;
15
- labelTextColorHover: string;
16
- borderColor: string;
17
- loaderItemFill: string;
18
- };
19
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceAccent: TitleAppearance;
20
3
  export { titleAppearanceAccent };
@@ -1,7 +1,3 @@
1
- declare const titleAppearanceDanger: {
2
- danger: {
3
- fill: string;
4
- fillHover: string;
5
- };
6
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceDanger: TitleAppearance;
7
3
  export { titleAppearanceDanger };
@@ -1,20 +1,3 @@
1
- declare const titleAppearanceDisabled: {
2
- disabledPrimary: {
3
- fill: string;
4
- borderColor: string;
5
- borderHover: string;
6
- textColor: string;
7
- iconBeforeFill: string;
8
- iconClearFill: string;
9
- placeholderTextColor: string;
10
- };
11
- disabledSecondary: {
12
- fill: string;
13
- borderColor: string;
14
- borderHover: string;
15
- iconBeforeFill: string;
16
- iconClearFill: string;
17
- placeholderTextColor: string;
18
- };
19
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceDisabled: TitleAppearance;
20
3
  export { titleAppearanceDisabled };
@@ -1,11 +1,3 @@
1
- declare const titleAppearanceError: {
2
- error: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- labelTextColorHover: string;
7
- loaderFill: string;
8
- loaderItemFill: string;
9
- };
10
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceError: TitleAppearance;
11
3
  export { titleAppearanceError };
@@ -1,21 +1,3 @@
1
- declare const titleAppearanceInfo: {
2
- info: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- labelTextColorHover: string;
7
- borderColor: string;
8
- loaderFill: string;
9
- loaderItemFill: string;
10
- };
11
- infoSecondary: {
12
- fill: string;
13
- fillHover: string;
14
- labelTextColor: string;
15
- labelTextColorHover: string;
16
- borderColor: string;
17
- loaderFill: string;
18
- loaderItemFill: string;
19
- };
20
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceInfo: TitleAppearance;
21
3
  export { titleAppearanceInfo };
@@ -1,8 +1,3 @@
1
- declare const titleAppearancePrimary: {
2
- primary: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- };
7
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearancePrimary: TitleAppearance;
8
3
  export { titleAppearancePrimary };
@@ -1,20 +1,3 @@
1
- declare const titleAppearanceRequire: {
2
- requirePrimary: {
3
- fill: string;
4
- borderColor: string;
5
- borderHover: string;
6
- textColor: string;
7
- iconBeforeFill: string;
8
- iconClearFill: string;
9
- placeholderTextColor: string;
10
- };
11
- requireSecondary: {
12
- fill: string;
13
- borderColor: string;
14
- borderHover: string;
15
- iconBeforeFill: string;
16
- iconClearFill: string;
17
- placeholderTextColor: string;
18
- };
19
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceRequire: TitleAppearance;
20
3
  export { titleAppearanceRequire };
@@ -1,8 +1,3 @@
1
- declare const titleAppearanceSecondary: {
2
- secondary: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- };
7
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceSecondary: TitleAppearance;
8
3
  export { titleAppearanceSecondary };
@@ -1,45 +1,3 @@
1
- declare const titleAppearanceSize: {
2
- h1: {
3
- size: string;
4
- iconAfterFillSize: string;
5
- iconAfterSize: string;
6
- iconBeforeFillSize: string;
7
- iconBeforeSize: string;
8
- };
9
- h2: {
10
- size: string;
11
- iconAfterFillSize: string;
12
- iconAfterSize: string;
13
- iconBeforeFillSize: string;
14
- iconBeforeSize: string;
15
- };
16
- h3: {
17
- size: string;
18
- iconAfterFillSize: string;
19
- iconAfterSize: string;
20
- iconBeforeFillSize: string;
21
- iconBeforeSize: string;
22
- };
23
- h4: {
24
- size: string;
25
- iconAfterFillSize: string;
26
- iconAfterSize: string;
27
- iconBeforeFillSize: string;
28
- iconBeforeSize: string;
29
- };
30
- h5: {
31
- size: string;
32
- iconAfterFillSize: string;
33
- iconAfterSize: string;
34
- iconBeforeFillSize: string;
35
- iconBeforeSize: string;
36
- };
37
- h6: {
38
- size: string;
39
- iconAfterFillSize: string;
40
- iconAfterSize: string;
41
- iconBeforeFillSize: string;
42
- iconBeforeSize: string;
43
- };
44
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceSize: TitleAppearance;
45
3
  export { titleAppearanceSize };
@@ -1,16 +1,3 @@
1
- declare const titleAppearanceStyle: {
2
- full: {
3
- borderColor: string;
4
- };
5
- ghost: {
6
- fill: string;
7
- borderColor: string;
8
- };
9
- outlined: {
10
- fill: string;
11
- };
12
- solid: {
13
- borderColor: string;
14
- };
15
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceStyle: TitleAppearance;
16
3
  export { titleAppearanceStyle };
@@ -1,11 +1,3 @@
1
- declare const titleAppearanceSuccess: {
2
- success: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- labelTextColorHover: string;
7
- loaderFill: string;
8
- loaderItemFill: string;
9
- };
10
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceSuccess: TitleAppearance;
11
3
  export { titleAppearanceSuccess };
@@ -1,25 +1,3 @@
1
- declare const titleAppearanceSurface: {
2
- surfacePrimary: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- };
7
- surfaceSecondary: {
8
- fill: string;
9
- fillHover: string;
10
- labelTextColor: string;
11
- loaderFill: string;
12
- loaderItemFill: string;
13
- };
14
- surfaceTertiary: {
15
- fill: string;
16
- fillHover: string;
17
- labelTextColor: string;
18
- };
19
- surfaceQuaternary: {
20
- fill: string;
21
- fillHover: string;
22
- labelTextColor: string;
23
- };
24
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceSurface: TitleAppearance;
25
3
  export { titleAppearanceSurface };
@@ -1,11 +1,3 @@
1
- declare const titleAppearanceWarning: {
2
- warning: {
3
- fill: string;
4
- fillHover: string;
5
- labelTextColor: string;
6
- labelTextColorHover: string;
7
- loaderFill: string;
8
- loaderItemFill: string;
9
- };
10
- };
1
+ import { TitleAppearance } from '../Title.interface';
2
+ declare const titleAppearanceWarning: TitleAppearance;
11
3
  export { titleAppearanceWarning };
@@ -1,9 +1,28 @@
1
- import React, { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes, type ComponentType } from 'react';
2
- type UrlWithAssetPrefixProps = {
3
- imageSrc?: string;
4
- placeholderUrl?: string;
5
- src?: string;
6
- svgSrc?: string;
7
- };
8
- declare const urlWithAssetPrefix: <P extends UrlWithAssetPrefixProps, R = unknown>(WrappedComponent: ComponentType<P> | ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<R>>) => React.ForwardRefExoticComponent<React.PropsWithoutRef<P> & React.RefAttributes<R>>;
1
+ import React from 'react';
2
+ import type { ComponentType, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
3
+ import { RequireAtLeastOneProp, RequireAtLeastOnePropError } from 'src/types';
4
+ type UrlPropKeys = (typeof urlPropsList)[number];
5
+ type OnePropCheckError = [
6
+ 'urlWithAssetPrefix: компонент должен содержать хотя бы один из пропсов',
7
+ UrlPropKeys
8
+ ];
9
+ declare const urlPropsList: readonly ["src", "imageSrc", "svgSrc", "placeholderUrl"];
10
+ /**
11
+ * HOC, который добавляет assetPrefix к URL-пропсам.
12
+ *
13
+ * @template P - Тип пропсов оборачиваемого компонента.
14
+ * @template T - Тип ref (если используется forwardRef).
15
+ * @template Check - Проверка на наличие хотя бы одного URL-пропа.
16
+ *
17
+ * @param WrappedComponent - Компонент, который оборачиваем.
18
+ * @param _error - Проверка: если ни одного URL-пропа нет, будет ошибка компиляции.
19
+ *
20
+ * @example
21
+ * const A = (props: { src?: string }) => <div />;
22
+ * urlWithAssetPrefix(A); // ✅ OK
23
+ *
24
+ * const B = (props: { id: string }) => <div />;
25
+ * urlWithAssetPrefix(B); // ❌ TS ошибка (нет url-пропов)
26
+ */
27
+ declare const urlWithAssetPrefix: <P extends Record<string, any>, T = unknown, OnePropCheck extends RequireAtLeastOneProp<P, UrlPropKeys> = RequireAtLeastOneProp<P, UrlPropKeys>>(WrappedComponent: ComponentType<P> | ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<T>>, ..._error: RequireAtLeastOnePropError<OnePropCheck, OnePropCheckError>) => React.ForwardRefExoticComponent<React.PropsWithoutRef<P> & React.RefAttributes<T>>;
9
28
  export { urlWithAssetPrefix };
@@ -0,0 +1,3 @@
1
+ import { StyleAttributeOrValidator } from 'src/hooks/useStyles/styleAttributes.interface';
2
+ declare const getStyleAttributeKey: (targetStyleAttribute: StyleAttributeOrValidator) => "fixed" | "hug" | "fill" | import("src/hooks/useStyles/styleAttributes.interface").StyleAttributes | import("csstype").Property.Width<0 | (string & {})> | undefined;
3
+ export { getStyleAttributeKey };
@@ -0,0 +1,2 @@
1
+ import { useActiveClasses } from './useActiveClasses';
2
+ export { useActiveClasses };
@@ -0,0 +1,3 @@
1
+ import type { UseActiveClasses, UseActiveClassesReturn } from './useActiveClasses.interface';
2
+ declare const useActiveClasses: (params: UseActiveClasses) => UseActiveClassesReturn;
3
+ export { useActiveClasses };
@@ -0,0 +1,5 @@
1
+ import type { RulesConfig } from './useActiveClasses.interface';
2
+ declare const CLASS_RULES: Record<string, RulesConfig[]>;
3
+ declare const formatState: (key: string) => string;
4
+ declare const toKebabCase: (str: string) => string;
5
+ export { CLASS_RULES, formatState, toKebabCase };
@@ -0,0 +1,26 @@
1
+ declare const suffix: readonly ["Button", "Checkbox", "Radio", "Checkmark", "Avatar", "AvatarStack", "Badge", "Breadcrumbs", "Cell", "Chips", "Choice", "Code", "CookiesWarning", "Dadata", "DatePeriod", "Divider", "Dot", "Drawer", "Dropdown", "DropdownItem", "Flex", "Grid", "Group", "HeroTitle", "HTMLContent", "Icon", "Image", "Input", "InputPassword", "Label", "Link", "List", "Loader", "Logo", "MenuItem", "Modal", "ModalSheetBottom", "Notification", "Overlay", "Pagination", "RangeSlider", "Response", "ScrollBar", "ScrollOnDrag", "ScrollToView", "Search", "Segmented", "Select", "SvgContent", "Swiper", "Switch", "Tab", "Text", "Textarea", "Tile", "Title", "Tooltip", "Video", "Warning"];
2
+ type SuffixComponents = (typeof suffix)[number];
3
+ type SpecialSuffix<T extends string> = T extends 'HTMLContent' ? 'htmlContent' : Uncapitalize<T>;
4
+ type SuffixKeys = SpecialSuffix<SuffixComponents>;
5
+ interface PropsGenerator {
6
+ [key: string]: string;
7
+ }
8
+ interface UseActiveClassesReturn {
9
+ rootClasses: string;
10
+ suffixClasses: Record<SuffixKeys, string>;
11
+ }
12
+ interface UseActiveClasses {
13
+ propsGenerator: PropsGenerator;
14
+ suffixes?: SuffixComponents[];
15
+ isActive?: boolean;
16
+ isDisabled?: boolean;
17
+ }
18
+ interface RulesConfig {
19
+ key: string;
20
+ stateFn?: (params: {
21
+ isActive?: boolean;
22
+ isDisabled?: boolean;
23
+ }) => boolean;
24
+ }
25
+ export { suffix };
26
+ export type { SuffixComponents, SuffixKeys, UseActiveClassesReturn, UseActiveClasses, RulesConfig, };
@@ -1,7 +1,7 @@
1
1
  import { KebabCase, WithClassKeys } from 'src/types';
2
2
  import type { AppearanceConfig, ComponentProps, GeneratorGetClassParams as GP } from './useDevicePropsGenerator.interface';
3
3
  declare function useDevicePropsGenerator<Props extends ComponentProps>(componentProps: Props, appearanceConfig?: AppearanceConfig): Props & {
4
- getProp(propKey: string): string;
4
+ getProp(propKey: string): number | string | undefined;
5
5
  getClassName<K extends keyof Props, P extends GP | undefined = undefined>(propKey: K, params?: P): ReturnGetClassName<Props, K, P>;
6
6
  } & WithClassKeys<Props>;
7
7
  type ReturnGetClassName<Props, K extends keyof Props, Params = undefined> = Params extends undefined ? NonNullable<Props[K]> extends string ? KebabCase<NonNullable<Props[K]>> : string : Props[K];
@@ -135,4 +135,7 @@ export interface TypeStyleLabelAttributes extends LabelInterface<StyleAttributes
135
135
  }
136
136
  export interface TypeStyleImageAttributes extends ImageInterface<StyleAttributes> {
137
137
  }
138
+ export type StyleAttributeOrValidator = StyleAttributes | [StyleAttributes['width'], {
139
+ validate?: (value: string) => boolean;
140
+ }];
138
141
  export {};
@@ -7,3 +7,37 @@ export type WithClassKeys<T> = T & {
7
7
  [K in keyof T & string as `${K}Class`]: NonNullable<T[K]> extends string ? KebabCase<T[K]> | undefined : string | undefined;
8
8
  };
9
9
  export type KebabCase<S> = S extends string ? S extends `${infer F}${infer R}` ? R extends Uncapitalize<R> ? `${Lowercase<F>}${KebabCase<R>}` : `${Lowercase<F>}-${KebabCase<Uncapitalize<R>>}` : Lowercase<S> : never;
10
+ /**
11
+ * Проверяет, что у типа `P` есть хотя бы один ключ из списка `Keys`.
12
+ *
13
+ * @template P - Объект, который проверяем (обычно тип пропсов компонента).
14
+ * @template Keys - Набор ключей, хотя бы один из которых должен присутствовать.
15
+ *
16
+ * @example
17
+ * type Props = { id: string; placeholderUrl?: string };
18
+ *
19
+ * type Check1 = RequireAtLeastOneProp<Props, 'src' | 'placeholderUrl'>;
20
+ * // ✅ "placeholderUrl" (совпадение есть)
21
+ *
22
+ * type Check2 = RequireAtLeastOneProp<Props, 'src' | 'imageSrc'>;
23
+ * // ❌ never (совпадений нет)
24
+ */
25
+ export type RequireAtLeastOneProp<P, Keys> = Extract<keyof P, Keys>;
26
+ /**
27
+ * Выводит типовую ошибку, если в `Check` нет ни одного ключа (равен `never`).
28
+ *
29
+ * @template Check - Результат проверки из `RequireAtLeastOneProp`.
30
+ * @template Error - Текст ошибки, который будет показан в TS.
31
+ *
32
+ * @example
33
+ * type Props = { id: string };
34
+ *
35
+ * type Check = RequireAtLeastOneProp<Props, 'src' | 'imageSrc'>;
36
+ *
37
+ * type ErrorCheck = RequireAtLeastOnePropError<
38
+ * Check,
39
+ * ['Компонент должен содержать хотя бы один из пропсов', 'src' | 'imageSrc']
40
+ * >;
41
+ * // ❌ TS ошибка: ["Компонент должен содержать хотя бы один из пропсов", "src" | "imageSrc"]
42
+ */
43
+ export type RequireAtLeastOnePropError<Check, Error> = [Check] extends [never] ? Error : [];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.8.108",
3
+ "version": "1.8.110",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",
@@ -103,7 +103,7 @@
103
103
  "@emotion/is-prop-valid": "^1.3.1",
104
104
  "@itcase/common": "^1.2.29",
105
105
  "@itcase/icons": "^1.2.19",
106
- "@itcase/storybook-config": "^1.1.110",
106
+ "@itcase/storybook-config": "^1.1.112",
107
107
  "@itcase/tokens-am": "^1.1.19",
108
108
  "@itcase/tokens-baikal": "^1.1.17",
109
109
  "@itcase/tokens-palette": "^1.1.11",
@@ -139,9 +139,9 @@
139
139
  "@babel/preset-react": "^7.27.1",
140
140
  "@commitlint/cli": "^19.8.1",
141
141
  "@commitlint/config-conventional": "^19.8.1",
142
- "@itcase/config": "^1.0.55",
142
+ "@itcase/config": "^1.0.56",
143
143
  "@itcase/lint": "^1.1.37",
144
- "@itcase/types": "^1.0.33",
144
+ "@itcase/types": "^1.0.42",
145
145
  "@rollup/plugin-alias": "^5.1.1",
146
146
  "@rollup/plugin-babel": "^6.0.4",
147
147
  "@rollup/plugin-commonjs": "^28.0.6",
@@ -166,18 +166,18 @@
166
166
  "babel-plugin-react-docgen": "^4.2.1",
167
167
  "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
168
168
  "conventional-changelog-conventionalcommits": "^9.1.0",
169
- "eslint": "9.33.0",
169
+ "eslint": "9.34.0",
170
170
  "husky": "^9.1.7",
171
171
  "lint-staged": "^16.1.5",
172
172
  "prettier": "^3.6.2",
173
173
  "react-docgen-typescript": "^2.4.0",
174
- "rollup": "^4.47.0",
174
+ "rollup": "^4.48.1",
175
175
  "rollup-plugin-copy": "^3.5.0",
176
176
  "rollup-plugin-dts": "^6.2.3",
177
177
  "rollup-plugin-peer-deps-external": "^2.2.4",
178
178
  "rollup-preserve-directives": "^1.1.3",
179
179
  "semantic-release": "^24.2.7",
180
- "storybook": "^9.1.2",
180
+ "storybook": "^9.1.3",
181
181
  "stylelint": "^16.23.1",
182
182
  "typescript": "^5.9.2"
183
183
  }