@alfalab/core-components-tab-bar 2.1.6 → 2.1.7

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.
package/Component.js CHANGED
@@ -13,7 +13,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
13
13
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
14
14
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
15
15
 
16
- var styles = {"component":"tab-bar__component_dyrh9","modal-bg-primary":"tab-bar__modal-bg-primary_dyrh9","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_dyrh9","border":"tab-bar__border_dyrh9"};
16
+ var styles = {"component":"tab-bar__component_cabyl","modal-bg-primary":"tab-bar__modal-bg-primary_cabyl","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_cabyl","border":"tab-bar__border_cabyl"};
17
17
  require('./index.css')
18
18
 
19
19
  var TabBarComponent = React.forwardRef(function (_a, ref) {
@@ -14,7 +14,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
14
14
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
15
15
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
16
16
 
17
- var styles = {"component":"tab-bar__component_suhf7","primary":"tab-bar__primary_suhf7","secondary":"tab-bar__secondary_suhf7","icon":"tab-bar__icon_suhf7","label":"tab-bar__label_suhf7","labelSelected":"tab-bar__labelSelected_suhf7","indicator":"tab-bar__indicator_suhf7"};
17
+ var styles = {"component":"tab-bar__component_1timm","primary":"tab-bar__primary_1timm","secondary":"tab-bar__secondary_1timm","icon":"tab-bar__icon_1timm","label":"tab-bar__label_1timm","labelSelected":"tab-bar__labelSelected_1timm","indicator":"tab-bar__indicator_1timm"};
18
18
  require('./index.css')
19
19
 
20
20
  var TabComponent = React.forwardRef(function (_a, ref) {
@@ -29,7 +29,7 @@ var TabComponent = React.forwardRef(function (_a, ref) {
29
29
  _b[styles[accentColor]] = selected,
30
30
  _b)), onClick: handleClick }),
31
31
  React__default.default.createElement("div", { className: cn__default.default(styles.icon, commonIconClassName, iconClassName) }, React.isValidElement(icon) ? React.cloneElement(icon, { selected: selected }) : icon),
32
- React__default.default.createElement(coreComponentsTypography.Typography.Text, { weight: 'medium', view: 'secondary-small', className: cn__default.default(styles.label, commonLabelClassName, labelClassName, (_c = {},
32
+ React__default.default.createElement(coreComponentsTypography.Text, { weight: 'medium', view: 'secondary-small', className: cn__default.default(styles.label, commonLabelClassName, labelClassName, (_c = {},
33
33
  _c[styles.labelSelected] = selected,
34
34
  _c)) }, React.isValidElement(label) ? React.cloneElement(label, { selected: selected }) : label),
35
35
  showIndicator && (React__default.default.createElement("div", { className: styles.indicator },
@@ -1,4 +1,4 @@
1
- /* hash: 1rvhw */
1
+ /* hash: m03is */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-accent-primary: #ef3124;
@@ -27,7 +27,7 @@
27
27
  --gap-8: var(--gap-xs);
28
28
  } :root {
29
29
  } :root {
30
- } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_suhf7 {
30
+ } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_1timm {
31
31
  -webkit-tap-highlight-color: transparent;
32
32
  box-sizing: border-box;
33
33
  background-color: transparent;
@@ -51,17 +51,17 @@
51
51
  align-items: center;
52
52
  padding: var(--gap-8) var(--gap-0);
53
53
  color: var(--color-light-neutral-translucent-700);
54
- } .tab-bar__primary_suhf7 {
54
+ } .tab-bar__primary_1timm {
55
55
  color: var(--color-light-accent-primary);
56
- } .tab-bar__secondary_suhf7 {
56
+ } .tab-bar__secondary_1timm {
57
57
  color: var(--color-light-accent-secondary);
58
- } .tab-bar__icon_suhf7 {
58
+ } .tab-bar__icon_1timm {
59
59
  display: flex;
60
60
  align-items: center;
61
61
  justify-content: center;
62
62
  flex-grow: 1;
63
63
  width: 100%;
64
- } .tab-bar__label_suhf7 {
64
+ } .tab-bar__label_1timm {
65
65
  -webkit-line-clamp: 1;
66
66
  display: -webkit-box;
67
67
  -webkit-box-orient: vertical;
@@ -70,9 +70,9 @@
70
70
  flex-shrink: 0;
71
71
 
72
72
  color: var(--color-light-text-secondary);
73
- } .tab-bar__labelSelected_suhf7 {
73
+ } .tab-bar__labelSelected_1timm {
74
74
  color: inherit;
75
- } .tab-bar__indicator_suhf7 {
75
+ } .tab-bar__indicator_1timm {
76
76
  position: absolute;
77
77
  top: 3px;
78
78
  left: calc(50% + var(--gap-4));
@@ -28,7 +28,7 @@ var TabComponent = React.forwardRef(function (_a, ref) {
28
28
  _b[styles__default.default[accentColor]] = selected,
29
29
  _b)), onClick: handleClick }),
30
30
  React__default.default.createElement("div", { className: cn__default.default(styles__default.default.icon, commonIconClassName, iconClassName) }, React.isValidElement(icon) ? React.cloneElement(icon, { selected: selected }) : icon),
31
- React__default.default.createElement(coreComponentsTypography.Typography.Text, { weight: 'medium', view: 'secondary-small', className: cn__default.default(styles__default.default.label, commonLabelClassName, labelClassName, (_c = {},
31
+ React__default.default.createElement(coreComponentsTypography.Text, { weight: 'medium', view: 'secondary-small', className: cn__default.default(styles__default.default.label, commonLabelClassName, labelClassName, (_c = {},
32
32
  _c[styles__default.default.labelSelected] = selected,
33
33
  _c)) }, React.isValidElement(label) ? React.cloneElement(label, { selected: selected }) : label),
34
34
  showIndicator && (React__default.default.createElement("div", { className: styles__default.default.indicator },
package/esm/Component.js CHANGED
@@ -4,7 +4,7 @@ import cn from 'classnames';
4
4
  import { getDataTestId } from '@alfalab/core-components-shared/esm';
5
5
  import { Tab } from './components/tab/Component.js';
6
6
 
7
- var styles = {"component":"tab-bar__component_dyrh9","modal-bg-primary":"tab-bar__modal-bg-primary_dyrh9","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_dyrh9","border":"tab-bar__border_dyrh9"};
7
+ var styles = {"component":"tab-bar__component_cabyl","modal-bg-primary":"tab-bar__modal-bg-primary_cabyl","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_cabyl","border":"tab-bar__border_cabyl"};
8
8
  require('./index.css')
9
9
 
10
10
  var TabBarComponent = forwardRef(function (_a, ref) {
@@ -2,10 +2,10 @@ import { __rest, __assign } from 'tslib';
2
2
  import React, { forwardRef, isValidElement, cloneElement } from 'react';
3
3
  import cn from 'classnames';
4
4
  import { Indicator } from '@alfalab/core-components-indicator/esm';
5
- import { Typography } from '@alfalab/core-components-typography/esm';
5
+ import { Text } from '@alfalab/core-components-typography/esm';
6
6
  import { INDICATOR_BORDER_COLOR, INDICATOR_BG_COLOR } from '../../consts.js';
7
7
 
8
- var styles = {"component":"tab-bar__component_suhf7","primary":"tab-bar__primary_suhf7","secondary":"tab-bar__secondary_suhf7","icon":"tab-bar__icon_suhf7","label":"tab-bar__label_suhf7","labelSelected":"tab-bar__labelSelected_suhf7","indicator":"tab-bar__indicator_suhf7"};
8
+ var styles = {"component":"tab-bar__component_1timm","primary":"tab-bar__primary_1timm","secondary":"tab-bar__secondary_1timm","icon":"tab-bar__icon_1timm","label":"tab-bar__label_1timm","labelSelected":"tab-bar__labelSelected_1timm","indicator":"tab-bar__indicator_1timm"};
9
9
  require('./index.css')
10
10
 
11
11
  var TabComponent = forwardRef(function (_a, ref) {
@@ -20,7 +20,7 @@ var TabComponent = forwardRef(function (_a, ref) {
20
20
  _b[styles[accentColor]] = selected,
21
21
  _b)), onClick: handleClick }),
22
22
  React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon) ? cloneElement(icon, { selected: selected }) : icon),
23
- React.createElement(Typography.Text, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, (_c = {},
23
+ React.createElement(Text, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, (_c = {},
24
24
  _c[styles.labelSelected] = selected,
25
25
  _c)) }, isValidElement(label) ? cloneElement(label, { selected: selected }) : label),
26
26
  showIndicator && (React.createElement("div", { className: styles.indicator },
@@ -1,4 +1,4 @@
1
- /* hash: 1rvhw */
1
+ /* hash: m03is */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-accent-primary: #ef3124;
@@ -27,7 +27,7 @@
27
27
  --gap-8: var(--gap-xs);
28
28
  } :root {
29
29
  } :root {
30
- } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_suhf7 {
30
+ } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_1timm {
31
31
  -webkit-tap-highlight-color: transparent;
32
32
  box-sizing: border-box;
33
33
  background-color: transparent;
@@ -51,17 +51,17 @@
51
51
  align-items: center;
52
52
  padding: var(--gap-8) var(--gap-0);
53
53
  color: var(--color-light-neutral-translucent-700);
54
- } .tab-bar__primary_suhf7 {
54
+ } .tab-bar__primary_1timm {
55
55
  color: var(--color-light-accent-primary);
56
- } .tab-bar__secondary_suhf7 {
56
+ } .tab-bar__secondary_1timm {
57
57
  color: var(--color-light-accent-secondary);
58
- } .tab-bar__icon_suhf7 {
58
+ } .tab-bar__icon_1timm {
59
59
  display: flex;
60
60
  align-items: center;
61
61
  justify-content: center;
62
62
  flex-grow: 1;
63
63
  width: 100%;
64
- } .tab-bar__label_suhf7 {
64
+ } .tab-bar__label_1timm {
65
65
  -webkit-line-clamp: 1;
66
66
  display: -webkit-box;
67
67
  -webkit-box-orient: vertical;
@@ -70,9 +70,9 @@
70
70
  flex-shrink: 0;
71
71
 
72
72
  color: var(--color-light-text-secondary);
73
- } .tab-bar__labelSelected_suhf7 {
73
+ } .tab-bar__labelSelected_1timm {
74
74
  color: inherit;
75
- } .tab-bar__indicator_suhf7 {
75
+ } .tab-bar__indicator_1timm {
76
76
  position: absolute;
77
77
  top: 3px;
78
78
  left: calc(50% + var(--gap-4));
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1ftk0 */
1
+ /* hash: t73ec */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-base-bg-alt-primary: #f2f3f5;
@@ -21,7 +21,7 @@
21
21
  /* новые значения, используйте их */
22
22
  } :root {
23
23
  } :root {
24
- } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_dyrh9 {
24
+ } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_cabyl {
25
25
  display: flex;
26
26
  justify-content: center;
27
27
  height: 64px;
@@ -29,10 +29,10 @@
29
29
  box-sizing: border-box;
30
30
  overflow: hidden;
31
31
  transition: box-shadow 0.2s ease
32
- } .tab-bar__component_dyrh9.tab-bar__modal-bg-primary_dyrh9 {
32
+ } .tab-bar__component_cabyl.tab-bar__modal-bg-primary_cabyl {
33
33
  background-color: var(--color-light-base-bg-primary);
34
- } .tab-bar__component_dyrh9.tab-bar__modal-bg-alt-primary_dyrh9 {
34
+ } .tab-bar__component_cabyl.tab-bar__modal-bg-alt-primary_cabyl {
35
35
  background-color: var(--color-light-base-bg-alt-primary);
36
- } .tab-bar__border_dyrh9 {
36
+ } .tab-bar__border_cabyl {
37
37
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
38
38
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1ftk0 */
1
+ /* hash: t73ec */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-base-bg-alt-primary: #f2f3f5;
@@ -21,7 +21,7 @@
21
21
  /* новые значения, используйте их */
22
22
  } :root {
23
23
  } :root {
24
- } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_dyrh9 {
24
+ } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_cabyl {
25
25
  display: flex;
26
26
  justify-content: center;
27
27
  height: 64px;
@@ -29,10 +29,10 @@
29
29
  box-sizing: border-box;
30
30
  overflow: hidden;
31
31
  transition: box-shadow 0.2s ease
32
- } .tab-bar__component_dyrh9.tab-bar__modal-bg-primary_dyrh9 {
32
+ } .tab-bar__component_cabyl.tab-bar__modal-bg-primary_cabyl {
33
33
  background-color: var(--color-light-base-bg-primary);
34
- } .tab-bar__component_dyrh9.tab-bar__modal-bg-alt-primary_dyrh9 {
34
+ } .tab-bar__component_cabyl.tab-bar__modal-bg-alt-primary_cabyl {
35
35
  background-color: var(--color-light-base-bg-alt-primary);
36
- } .tab-bar__border_dyrh9 {
36
+ } .tab-bar__border_cabyl {
37
37
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
38
38
  }
@@ -3,7 +3,7 @@ import cn from 'classnames';
3
3
  import { getDataTestId } from '@alfalab/core-components-shared/modern';
4
4
  import { Tab } from './components/tab/Component.js';
5
5
 
6
- const styles = {"component":"tab-bar__component_dyrh9","modal-bg-primary":"tab-bar__modal-bg-primary_dyrh9","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_dyrh9","border":"tab-bar__border_dyrh9"};
6
+ const styles = {"component":"tab-bar__component_cabyl","modal-bg-primary":"tab-bar__modal-bg-primary_cabyl","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_cabyl","border":"tab-bar__border_cabyl"};
7
7
  require('./index.css')
8
8
 
9
9
  const TabBarComponent = forwardRef(({ children, className, selectedId, border, dataTestId, tabClassNames, onChange, accentColor = 'primary', bgColor = 'modal-bg-primary', ...restProps }, ref) => {
@@ -1,10 +1,10 @@
1
1
  import React, { forwardRef, isValidElement, cloneElement } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Indicator } from '@alfalab/core-components-indicator/modern';
4
- import { Typography } from '@alfalab/core-components-typography/modern';
4
+ import { Text } from '@alfalab/core-components-typography/modern';
5
5
  import { INDICATOR_BORDER_COLOR, INDICATOR_BG_COLOR } from '../../consts.js';
6
6
 
7
- const styles = {"component":"tab-bar__component_suhf7","primary":"tab-bar__primary_suhf7","secondary":"tab-bar__secondary_suhf7","icon":"tab-bar__icon_suhf7","label":"tab-bar__label_suhf7","labelSelected":"tab-bar__labelSelected_suhf7","indicator":"tab-bar__indicator_suhf7"};
7
+ const styles = {"component":"tab-bar__component_1timm","primary":"tab-bar__primary_1timm","secondary":"tab-bar__secondary_1timm","icon":"tab-bar__icon_1timm","label":"tab-bar__label_1timm","labelSelected":"tab-bar__labelSelected_1timm","indicator":"tab-bar__indicator_1timm"};
8
8
  require('./index.css')
9
9
 
10
10
  const TabComponent = forwardRef(({ showIndicator, indicatorProps, label, icon, id, selected, onChange, onClick, tabClassNames = {}, dataTestId, className, labelClassName, selectedClassName, iconClassName, href, Component = href ? 'a' : 'button', accentColor = 'primary', bgColor = 'modal-bg-primary', ...restProps }, ref) => {
@@ -17,7 +17,7 @@ const TabComponent = forwardRef(({ showIndicator, indicatorProps, label, icon, i
17
17
  [styles[accentColor]]: selected,
18
18
  }), onClick: handleClick },
19
19
  React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon) ? cloneElement(icon, { selected }) : icon),
20
- React.createElement(Typography.Text, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, {
20
+ React.createElement(Text, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, {
21
21
  [styles.labelSelected]: selected,
22
22
  }) }, isValidElement(label) ? cloneElement(label, { selected }) : label),
23
23
  showIndicator && (React.createElement("div", { className: styles.indicator },
@@ -1,4 +1,4 @@
1
- /* hash: 1rvhw */
1
+ /* hash: m03is */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-accent-primary: #ef3124;
@@ -27,7 +27,7 @@
27
27
  --gap-8: var(--gap-xs);
28
28
  } :root {
29
29
  } :root {
30
- } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_suhf7 {
30
+ } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_1timm {
31
31
  -webkit-tap-highlight-color: transparent;
32
32
  box-sizing: border-box;
33
33
  background-color: transparent;
@@ -51,17 +51,17 @@
51
51
  align-items: center;
52
52
  padding: var(--gap-8) var(--gap-0);
53
53
  color: var(--color-light-neutral-translucent-700);
54
- } .tab-bar__primary_suhf7 {
54
+ } .tab-bar__primary_1timm {
55
55
  color: var(--color-light-accent-primary);
56
- } .tab-bar__secondary_suhf7 {
56
+ } .tab-bar__secondary_1timm {
57
57
  color: var(--color-light-accent-secondary);
58
- } .tab-bar__icon_suhf7 {
58
+ } .tab-bar__icon_1timm {
59
59
  display: flex;
60
60
  align-items: center;
61
61
  justify-content: center;
62
62
  flex-grow: 1;
63
63
  width: 100%;
64
- } .tab-bar__label_suhf7 {
64
+ } .tab-bar__label_1timm {
65
65
  -webkit-line-clamp: 1;
66
66
  display: -webkit-box;
67
67
  -webkit-box-orient: vertical;
@@ -70,9 +70,9 @@
70
70
  flex-shrink: 0;
71
71
 
72
72
  color: var(--color-light-text-secondary);
73
- } .tab-bar__labelSelected_suhf7 {
73
+ } .tab-bar__labelSelected_1timm {
74
74
  color: inherit;
75
- } .tab-bar__indicator_suhf7 {
75
+ } .tab-bar__indicator_1timm {
76
76
  position: absolute;
77
77
  top: 3px;
78
78
  left: calc(50% + var(--gap-4));
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1ftk0 */
1
+ /* hash: t73ec */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-base-bg-alt-primary: #f2f3f5;
@@ -21,7 +21,7 @@
21
21
  /* новые значения, используйте их */
22
22
  } :root {
23
23
  } :root {
24
- } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_dyrh9 {
24
+ } /* сбрасывает синюю подсветку при нажатии */ .tab-bar__component_cabyl {
25
25
  display: flex;
26
26
  justify-content: center;
27
27
  height: 64px;
@@ -29,10 +29,10 @@
29
29
  box-sizing: border-box;
30
30
  overflow: hidden;
31
31
  transition: box-shadow 0.2s ease
32
- } .tab-bar__component_dyrh9.tab-bar__modal-bg-primary_dyrh9 {
32
+ } .tab-bar__component_cabyl.tab-bar__modal-bg-primary_cabyl {
33
33
  background-color: var(--color-light-base-bg-primary);
34
- } .tab-bar__component_dyrh9.tab-bar__modal-bg-alt-primary_dyrh9 {
34
+ } .tab-bar__component_cabyl.tab-bar__modal-bg-alt-primary_cabyl {
35
35
  background-color: var(--color-light-base-bg-alt-primary);
36
- } .tab-bar__border_dyrh9 {
36
+ } .tab-bar__border_cabyl {
37
37
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
38
38
  }
@@ -1,7 +1,7 @@
1
1
  import React, { forwardRef, isValidElement, cloneElement } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Indicator } from '@alfalab/core-components-indicator/moderncssm';
4
- import { Typography } from '@alfalab/core-components-typography/moderncssm';
4
+ import { Text } from '@alfalab/core-components-typography/moderncssm';
5
5
  import { INDICATOR_BORDER_COLOR, INDICATOR_BG_COLOR } from '../../consts.js';
6
6
  import styles from './index.module.css';
7
7
 
@@ -15,7 +15,7 @@ const TabComponent = forwardRef(({ showIndicator, indicatorProps, label, icon, i
15
15
  [styles[accentColor]]: selected,
16
16
  }), onClick: handleClick },
17
17
  React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon) ? cloneElement(icon, { selected }) : icon),
18
- React.createElement(Typography.Text, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, {
18
+ React.createElement(Text, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, {
19
19
  [styles.labelSelected]: selected,
20
20
  }) }, isValidElement(label) ? cloneElement(label, { selected }) : label),
21
21
  showIndicator && (React.createElement("div", { className: styles.indicator },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-tab-bar",
3
- "version": "2.1.6",
3
+ "version": "2.1.7",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -10,15 +10,16 @@
10
10
  "access": "public",
11
11
  "directory": "dist"
12
12
  },
13
+ "sideEffects": false,
13
14
  "peerDependencies": {
14
15
  "react": ">=16.8.0",
15
16
  "react-dom": ">=16.8.0"
16
17
  },
17
18
  "dependencies": {
18
- "@alfalab/core-components-typography": "^4.11.0",
19
- "@alfalab/core-components-indicator": "^2.2.1",
19
+ "@alfalab/core-components-typography": "^4.11.1",
20
+ "@alfalab/core-components-indicator": "^2.2.2",
20
21
  "@alfalab/core-components-shared": "^0.14.0",
21
- "classnames": "^2.3.1",
22
+ "classnames": "^2.5.1",
22
23
  "tslib": "^2.4.0"
23
24
  },
24
25
  "themesVersion": "13.6.0",
@@ -2,7 +2,7 @@ import React, { cloneElement, forwardRef, isValidElement, MouseEvent } from 'rea
2
2
  import cn from 'classnames';
3
3
 
4
4
  import { Indicator } from '@alfalab/core-components-indicator';
5
- import { Typography } from '@alfalab/core-components-typography';
5
+ import { Text } from '@alfalab/core-components-typography';
6
6
 
7
7
  import { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';
8
8
  import { PrivateTabProps, TabProps } from '../../types';
@@ -71,7 +71,7 @@ const TabComponent = forwardRef(
71
71
  {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}
72
72
  </div>
73
73
 
74
- <Typography.Text
74
+ <Text
75
75
  weight='medium'
76
76
  view='secondary-small'
77
77
  className={cn(styles.label, commonLabelClassName, labelClassName, {
@@ -79,7 +79,7 @@ const TabComponent = forwardRef(
79
79
  })}
80
80
  >
81
81
  {isValidElement(label) ? cloneElement(label, { selected }) : label}
82
- </Typography.Text>
82
+ </Text>
83
83
 
84
84
  {showIndicator && (
85
85
  <div className={styles.indicator}>