@itcase/ui 1.8.12 → 1.8.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -124,7 +124,7 @@ function Tab(props) {
124
124
  var tab = useStyles.useStyles(props).styles;
125
125
  return (jsxRuntime.jsx("div", { className: clsx('tab', isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', isHover && 'tab_state_hover', !isDisabled
126
126
  ? fillClass && "fill_".concat(fillClass)
127
- : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, className, sizeClass && "tab_size_".concat(sizeClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "tab_shape_".concat(shapeClass), typeClass && "tab_type_".concat(typeClass), widthClass && "width_".concat(widthClass), reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsx(Link.Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: "tab__wrapper", children: [label && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: isDisabled ? labelColorDisabled : labelColor, textColorActive: isActive && labelColorActive, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), badgeValue && (jsxRuntime.jsx(Badge.Badge, { appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }), jsxRuntime.jsx(Divider.Divider, { width: "fill", direction: dividerDirection, size: dividerSize, zIndex: '1', fill: isDisabled ? dividerFillDisabled : dividerFill, fillActive: isActive && dividerFillActive, fillActiveHover: dividerFillActiveHover, fillHover: isHover && dividerFillHover })] })), after] }) }) }));
127
+ : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, className, sizeClass && "tab_size_".concat(sizeClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "tab_shape_".concat(shapeClass), typeClass && "tab_type_".concat(typeClass), widthClass && "width_".concat(widthClass), reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsx(Link.Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: "tab__wrapper", children: [label && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: isDisabled ? labelColorDisabled : labelColor, textColorActive: isActive && labelColorActive, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), badgeValue && (jsxRuntime.jsx(Badge.Badge, { appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }), jsxRuntime.jsx(Divider.Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: isDisabled ? dividerFillDisabled : dividerFill, fillActive: isActive && dividerFillActive, fillActiveHover: dividerFillActiveHover, fillHover: isHover && dividerFillHover, zIndex: "1" })] })), after] }) }) }));
128
128
  }
129
129
 
130
130
  function TabGroup(props) {
@@ -32,6 +32,22 @@ var textareaAppearanceDefault = {
32
32
  iconClearFill: 'surfaceItemPrimary',
33
33
  placeholderTextColor: 'surfaceTextSecondary',
34
34
  },
35
+ defaultTertiaryy: {
36
+ fill: 'surfacePrimary',
37
+ borderColor: 'surfaceBorderTertiary',
38
+ borderHover: 'surfaceBorderQuaternary',
39
+ iconBeforeFill: 'surfaceItemQuaternary',
40
+ iconClearFill: 'surfaceItemPrimary',
41
+ placeholderTextColor: 'surfaceTextSecondary',
42
+ },
43
+ defaultQuaternary: {
44
+ fill: 'surfacePrimary',
45
+ borderColor: 'surfaceBorderTertiary',
46
+ borderHover: 'surfaceBorderQuaternary',
47
+ iconBeforeFill: 'surfaceItemQuaternary',
48
+ iconClearFill: 'surfaceItemPrimary',
49
+ placeholderTextColor: 'surfaceTextSecondary',
50
+ },
35
51
  };
36
52
 
37
53
  var textareaAppearanceDisabled = {
@@ -122,7 +122,7 @@ function Tab(props) {
122
122
  var tab = useStyles(props).styles;
123
123
  return (jsx("div", { className: clsx('tab', isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', isHover && 'tab_state_hover', !isDisabled
124
124
  ? fillClass && "fill_".concat(fillClass)
125
- : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, className, sizeClass && "tab_size_".concat(sizeClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "tab_shape_".concat(shapeClass), typeClass && "tab_type_".concat(typeClass), widthClass && "width_".concat(widthClass), reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [jsxs("div", { className: "tab__wrapper", children: [label && (jsx(Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: isDisabled ? labelColorDisabled : labelColor, textColorActive: isActive && labelColorActive, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), badgeValue && (jsx(Badge, { appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }), jsx(Divider, { width: "fill", direction: dividerDirection, size: dividerSize, zIndex: '1', fill: isDisabled ? dividerFillDisabled : dividerFill, fillActive: isActive && dividerFillActive, fillActiveHover: dividerFillActiveHover, fillHover: isHover && dividerFillHover })] })), after] }) }) }));
125
+ : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, className, sizeClass && "tab_size_".concat(sizeClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "tab_shape_".concat(shapeClass), typeClass && "tab_type_".concat(typeClass), widthClass && "width_".concat(widthClass), reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [jsxs("div", { className: "tab__wrapper", children: [label && (jsx(Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: isDisabled ? labelColorDisabled : labelColor, textColorActive: isActive && labelColorActive, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), badgeValue && (jsx(Badge, { appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }), jsx(Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: isDisabled ? dividerFillDisabled : dividerFill, fillActive: isActive && dividerFillActive, fillActiveHover: dividerFillActiveHover, fillHover: isHover && dividerFillHover, zIndex: "1" })] })), after] }) }) }));
126
126
  }
127
127
 
128
128
  function TabGroup(props) {
@@ -30,6 +30,22 @@ var textareaAppearanceDefault = {
30
30
  iconClearFill: 'surfaceItemPrimary',
31
31
  placeholderTextColor: 'surfaceTextSecondary',
32
32
  },
33
+ defaultTertiaryy: {
34
+ fill: 'surfacePrimary',
35
+ borderColor: 'surfaceBorderTertiary',
36
+ borderHover: 'surfaceBorderQuaternary',
37
+ iconBeforeFill: 'surfaceItemQuaternary',
38
+ iconClearFill: 'surfaceItemPrimary',
39
+ placeholderTextColor: 'surfaceTextSecondary',
40
+ },
41
+ defaultQuaternary: {
42
+ fill: 'surfacePrimary',
43
+ borderColor: 'surfaceBorderTertiary',
44
+ borderHover: 'surfaceBorderQuaternary',
45
+ iconBeforeFill: 'surfaceItemQuaternary',
46
+ iconClearFill: 'surfaceItemPrimary',
47
+ placeholderTextColor: 'surfaceTextSecondary',
48
+ },
33
49
  };
34
50
 
35
51
  var textareaAppearanceDisabled = {
@@ -2,7 +2,10 @@
2
2
  &_type {
3
3
  @each $val in auto, default, none, pointer {
4
4
  &_$(val) {
5
- cursor: $(val);
5
+ cursor: $(val);
6
+ &:hover {
7
+ cursor: $(val);
8
+ }
6
9
  }
7
10
  }
8
11
  }
@@ -29,4 +29,20 @@
29
29
  /* } */
30
30
  }
31
31
  }
32
+ @each $palette in red, neon-pink, electric-pink, hibiscus, pink, pink-citrus,
33
+ pomagranate, dragon-fruit, camellia, red-rose, plum, orange, clementine,
34
+ apricot, papaya, kumquat, light-orange, peach, flamingo, rose-gold,
35
+ pink-sand, vintage-rose, grapefruit, cream, mellow-yellow, canary-yellow,
36
+ pollen, flash-light, lemon-cream, flash, dark-green, green, spearmint, mint,
37
+ beryl, sea-foam, turquoise, blue, light-blue, cerulian, surf-blue,
38
+ pacific-green, blue-cobalt, dark-teal, blue-horizon, denim-blue, linen-blue,
39
+ deep-navy, midnight-blue, purple, ultra-violet, lilac, ocean-blue,
40
+ delft-blue, indigo, lavender-gray, lavender, mist-blue, storm-gray, cactus,
41
+ pine-green, cyprus-green, northern-blue, azure, alaskan-blue, khaki,
42
+ dark-olive, soft-white, antique-white, yellow-gold, gold, camel, walnut,
43
+ stone, pebble, cocoa, coastal-gray, white, black {
44
+ &_$(palette) {
45
+ background: var(--color-palette-$(palette));
46
+ }
47
+ }
32
48
  }
@@ -13,5 +13,21 @@
13
13
  }
14
14
  }
15
15
  }
16
+ @each $palette in red, neon-pink, electric-pink, hibiscus, pink,
17
+ pink-citrus, pomagranate, dragon-fruit, camellia, red-rose, plum, orange,
18
+ clementine, apricot, papaya, kumquat, light-orange, peach, flamingo,
19
+ rose-gold, pink-sand, vintage-rose, grapefruit, cream, mellow-yellow,
20
+ canary-yellow, pollen, flash-light, lemon-cream, flash, dark-green, green,
21
+ spearmint, mint, beryl, sea-foam, turquoise, blue, light-blue, cerulian,
22
+ surf-blue, pacific-green, blue-cobalt, dark-teal, blue-horizon,
23
+ denim-blue, linen-blue, deep-navy, midnight-blue, purple, ultra-violet,
24
+ lilac, ocean-blue, delft-blue, indigo, lavender-gray, lavender, mist-blue,
25
+ storm-gray, cactus, pine-green, cyprus-green, northern-blue, azure,
26
+ alaskan-blue, khaki, dark-olive, soft-white, antique-white, yellow-gold,
27
+ gold, camel, walnut, stone, pebble, cocoa, coastal-gray, white, black {
28
+ &_$(palette) {
29
+ color: var(--color-palette-$(palette));
30
+ }
31
+ }
16
32
  }
17
33
  }
@@ -14,5 +14,21 @@ declare const textareaAppearanceDefault: {
14
14
  iconClearFill: string;
15
15
  placeholderTextColor: string;
16
16
  };
17
+ defaultTertiaryy: {
18
+ fill: string;
19
+ borderColor: string;
20
+ borderHover: string;
21
+ iconBeforeFill: string;
22
+ iconClearFill: string;
23
+ placeholderTextColor: string;
24
+ };
25
+ defaultQuaternary: {
26
+ fill: string;
27
+ borderColor: string;
28
+ borderHover: string;
29
+ iconBeforeFill: string;
30
+ iconClearFill: string;
31
+ placeholderTextColor: string;
32
+ };
17
33
  };
18
34
  export { textareaAppearanceDefault };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.8.12",
3
+ "version": "1.8.13",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",
@@ -100,17 +100,18 @@
100
100
  "@itcase/config": "^1.0.47",
101
101
  "@itcase/icons": "^1.1.1",
102
102
  "@itcase/storybook-config": "^1.1.10",
103
- "@itcase/tokens-am": "^1.1.7",
104
- "@itcase/tokens-baikal": "^1.1.7",
103
+ "@itcase/tokens-am": "^1.1.8",
104
+ "@itcase/tokens-baikal": "^1.1.8",
105
105
  "@itcase/types": "^1.0.3",
106
+ "@itcase/tokens-palette": "^1.1.8",
106
107
  "clsx": "^2.1.1",
107
108
  "date-fns": "^4.1.0",
108
109
  "eslint-import-resolver-alias": "^1.1.2",
109
110
  "eslint-plugin-import": "^2.31.0",
110
- "framer-motion": "^12.14.0",
111
+ "framer-motion": "^12.15.0",
111
112
  "js-cookie": "^3.0.5",
112
113
  "lodash": "^4.17.21",
113
- "motion": "^12.14.0",
114
+ "motion": "^12.15.0",
114
115
  "rc-slider": "^11.1.8",
115
116
  "react": "^18.3.1",
116
117
  "react-dadata": "^2.27.4",
@@ -130,7 +131,7 @@
130
131
  "uuid": "^11.1.0"
131
132
  },
132
133
  "devDependencies": {
133
- "@babel/core": "^7.27.1",
134
+ "@babel/core": "^7.27.3",
134
135
  "@babel/preset-env": "^7.27.2",
135
136
  "@babel/preset-react": "^7.27.1",
136
137
  "@commitlint/cli": "^19.8.1",
@@ -162,7 +163,7 @@
162
163
  "conventional-changelog-conventionalcommits": "^9.0.0",
163
164
  "eslint": "9.27.0",
164
165
  "husky": "^9.1.7",
165
- "lint-staged": "^16.0.0",
166
+ "lint-staged": "^16.1.0",
166
167
  "npm": "^11.4.1",
167
168
  "postcss": "^8.5.3",
168
169
  "prettier": "^3.5.3",