@alfalab/core-components-tabs 8.3.3 → 8.4.1

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 (92) hide show
  1. package/collapsible/index.js +1 -1
  2. package/components/primary-tablist/Component.collapsible.js +1 -1
  3. package/components/primary-tablist/Component.desktop.js +1 -1
  4. package/components/primary-tablist/Component.mobile.js +2 -2
  5. package/components/primary-tablist/Component.responsive.js +1 -1
  6. package/components/primary-tablist/index.css +34 -34
  7. package/components/primary-tablist/mobile.css +43 -39
  8. package/components/scroll-controls/Component.js +1 -1
  9. package/components/scroll-controls/index.css +18 -18
  10. package/components/scrollable-container/Component.js +1 -1
  11. package/components/scrollable-container/index.css +6 -6
  12. package/components/secondary-tablist/Component.desktop.js +1 -1
  13. package/components/secondary-tablist/Component.mobile.js +2 -2
  14. package/components/secondary-tablist/Component.responsive.js +1 -1
  15. package/components/secondary-tablist/index.css +11 -11
  16. package/components/secondary-tablist/mobile.css +19 -15
  17. package/components/tab/Component.js +1 -1
  18. package/components/tab/index.css +3 -3
  19. package/components/tabs/Component.collapsible.js +1 -1
  20. package/components/tabs/Component.desktop.js +2 -2
  21. package/components/tabs/Component.mobile.js +2 -2
  22. package/components/tabs/Component.responsive.js +2 -2
  23. package/cssm/components/primary-tablist/index.module.css +4 -4
  24. package/cssm/components/scroll-controls/index.module.css +4 -4
  25. package/desktop/index.js +2 -2
  26. package/esm/collapsible/index.js +1 -1
  27. package/esm/components/primary-tablist/Component.collapsible.js +1 -1
  28. package/esm/components/primary-tablist/Component.desktop.js +1 -1
  29. package/esm/components/primary-tablist/Component.mobile.js +2 -2
  30. package/esm/components/primary-tablist/Component.responsive.js +1 -1
  31. package/esm/components/primary-tablist/index.css +34 -34
  32. package/esm/components/primary-tablist/mobile.css +43 -39
  33. package/esm/components/scroll-controls/Component.js +1 -1
  34. package/esm/components/scroll-controls/index.css +18 -18
  35. package/esm/components/scrollable-container/Component.js +1 -1
  36. package/esm/components/scrollable-container/index.css +6 -6
  37. package/esm/components/secondary-tablist/Component.desktop.js +1 -1
  38. package/esm/components/secondary-tablist/Component.mobile.js +2 -2
  39. package/esm/components/secondary-tablist/Component.responsive.js +1 -1
  40. package/esm/components/secondary-tablist/index.css +11 -11
  41. package/esm/components/secondary-tablist/mobile.css +19 -15
  42. package/esm/components/tab/Component.js +1 -1
  43. package/esm/components/tab/index.css +3 -3
  44. package/esm/components/tabs/Component.collapsible.js +1 -1
  45. package/esm/components/tabs/Component.desktop.js +2 -2
  46. package/esm/components/tabs/Component.mobile.js +2 -2
  47. package/esm/components/tabs/Component.responsive.js +2 -2
  48. package/esm/desktop/index.js +2 -2
  49. package/esm/index.js +2 -2
  50. package/esm/index.module-7b8a0cb9.js +4 -0
  51. package/esm/index.module-dbd0d61f.js +4 -0
  52. package/esm/mobile/index.js +2 -2
  53. package/index.js +2 -2
  54. package/index.module-4d9a1064.js +6 -0
  55. package/index.module-7229be12.js +6 -0
  56. package/mobile/index.js +2 -2
  57. package/modern/collapsible/index.js +1 -1
  58. package/modern/components/primary-tablist/Component.collapsible.js +1 -1
  59. package/modern/components/primary-tablist/Component.desktop.js +1 -1
  60. package/modern/components/primary-tablist/Component.mobile.js +2 -2
  61. package/modern/components/primary-tablist/Component.responsive.js +1 -1
  62. package/modern/components/primary-tablist/index.css +34 -34
  63. package/modern/components/primary-tablist/mobile.css +43 -39
  64. package/modern/components/scroll-controls/Component.js +1 -1
  65. package/modern/components/scroll-controls/index.css +18 -18
  66. package/modern/components/scrollable-container/Component.js +1 -1
  67. package/modern/components/scrollable-container/index.css +6 -6
  68. package/modern/components/secondary-tablist/Component.desktop.js +1 -1
  69. package/modern/components/secondary-tablist/Component.mobile.js +2 -2
  70. package/modern/components/secondary-tablist/Component.responsive.js +1 -1
  71. package/modern/components/secondary-tablist/index.css +11 -11
  72. package/modern/components/secondary-tablist/mobile.css +19 -15
  73. package/modern/components/tab/Component.js +1 -1
  74. package/modern/components/tab/index.css +3 -3
  75. package/modern/components/tabs/Component.collapsible.js +1 -1
  76. package/modern/components/tabs/Component.desktop.js +2 -2
  77. package/modern/components/tabs/Component.mobile.js +2 -2
  78. package/modern/components/tabs/Component.responsive.js +2 -2
  79. package/modern/desktop/index.js +2 -2
  80. package/modern/index.js +2 -2
  81. package/modern/index.module-377caacf.js +4 -0
  82. package/modern/index.module-e6e7da51.js +4 -0
  83. package/modern/mobile/index.js +2 -2
  84. package/package.json +5 -5
  85. package/src/components/scroll-controls/index.module.css +1 -1
  86. package/src/vars.css +2 -2
  87. package/esm/index.module-4151daf2.js +0 -4
  88. package/esm/index.module-525943f3.js +0 -4
  89. package/index.module-0382cb1b.js +0 -6
  90. package/index.module-6325dd03.js +0 -6
  91. package/modern/index.module-86f8baa2.js +0 -4
  92. package/modern/index.module-efbe6ab6.js +0 -4
@@ -1,8 +1,8 @@
1
- /* hash: zea9b */
1
+ /* hash: 1bfrx */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
- --color-light-border-primary: #d5d6dc;
5
- --color-light-specialbg-tertiary-transparent: rgba(30, 43, 68, 0.08); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
+ --color-light-neutral-translucent-300: rgba(15, 25, 55, 0.1);
5
+ --color-light-neutral-translucent-500: rgba(9, 12, 37, 0.28); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
6
6
  } :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 */
7
7
  } :root {
8
8
  } :root {
@@ -19,7 +19,7 @@
19
19
  } :root {
20
20
  } :root {
21
21
  } :root {
22
- --primary-tablist-bottom-border-color: var(--color-light-border-primary);
22
+ --primary-tablist-bottom-border-color: var(--color-light-neutral-translucent-500);
23
23
 
24
24
  /* mobile */
25
25
 
@@ -44,11 +44,11 @@
44
44
  /* size l */
45
45
 
46
46
  /* size xl */
47
- } .tabs__component_ghgtf {
47
+ } .tabs__component_bjpan {
48
48
  position: relative;
49
49
  display: flex;
50
50
  flex-shrink: 0
51
- } .tabs__component_ghgtf:before {
51
+ } .tabs__component_bjpan:before {
52
52
  content: '';
53
53
  display: block;
54
54
  position: absolute;
@@ -57,12 +57,12 @@
57
57
  width: 1px;
58
58
  background-color: transparent;
59
59
  transition: background-color 0.3s ease;
60
- } .tabs__borderVisible_ghgtf:before {
61
- background-color: var(--color-light-specialbg-tertiary-transparent);
62
- } .tabs__primary_ghgtf {
60
+ } .tabs__borderVisible_bjpan:before {
61
+ background-color: var(--color-light-neutral-translucent-300);
62
+ } .tabs__primary_bjpan {
63
63
  align-items: flex-start;
64
64
  justify-content: flex-end
65
- } .tabs__primary_ghgtf:after {
65
+ } .tabs__primary_bjpan:after {
66
66
  content: '';
67
67
  display: block;
68
68
  position: absolute;
@@ -70,25 +70,25 @@
70
70
  height: 1px;
71
71
  width: 100%;
72
72
  background-color: var(--primary-tablist-bottom-border-color);
73
- } .tabs__primary_ghgtf:before {
73
+ } .tabs__primary_bjpan:before {
74
74
  bottom: 2px;
75
- } .tabs__primary_ghgtf {
75
+ } .tabs__primary_bjpan {
76
76
 
77
- .tabs__button_ghgtf:first-child {
77
+ .tabs__button_bjpan:first-child {
78
78
  padding-left: var(--gap-xs);
79
79
  margin-right: var(--gap-xs);
80
80
  }
81
- } .tabs__primary_ghgtf.tabs__xl_ghgtf .tabs__button_ghgtf:first-child {
81
+ } .tabs__primary_bjpan.tabs__xl_bjpan .tabs__button_bjpan:first-child {
82
82
  margin-right: var(--gap-2xs);
83
- } .tabs__secondary_ghgtf {
83
+ } .tabs__secondary_bjpan {
84
84
  align-items: center;
85
85
  justify-content: center
86
- } .tabs__secondary_ghgtf:before {
86
+ } .tabs__secondary_bjpan:before {
87
87
  bottom: 0;
88
- } .tabs__secondary_ghgtf.tabs__xs_ghgtf {
88
+ } .tabs__secondary_bjpan.tabs__xs_bjpan {
89
89
  width: 76px;
90
90
 
91
- .tabs__button_ghgtf:first-child {
91
+ .tabs__button_bjpan:first-child {
92
92
  margin-right: var(--gap-2xs);
93
93
  }
94
94
  }
@@ -8,7 +8,7 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
8
8
  import '@alfalab/icons-glyph/ChevronRightMIcon';
9
9
  import '../scroll-controls/utils.js';
10
10
 
11
- const styles = {"scrollableContainerWrapper":"tabs__scrollableContainerWrapper_nl14b","container":"tabs__container_nl14b","fullWidthScroll":"tabs__fullWidthScroll_nl14b"};
11
+ const styles = {"scrollableContainerWrapper":"tabs__scrollableContainerWrapper_3to0z","container":"tabs__container_3to0z","fullWidthScroll":"tabs__fullWidthScroll_3to0z"};
12
12
  require('./index.css')
13
13
 
14
14
  /**
@@ -1,4 +1,4 @@
1
- /* hash: 1rq6l */
1
+ /* hash: oxv2t */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -42,9 +42,9 @@
42
42
  /* size l */
43
43
 
44
44
  /* size xl */
45
- } .tabs__scrollableContainerWrapper_nl14b {
45
+ } .tabs__scrollableContainerWrapper_3to0z {
46
46
  display: flex;
47
- } .tabs__container_nl14b {
47
+ } .tabs__container_3to0z {
48
48
  position: relative;
49
49
  overflow-x: auto;
50
50
  overflow-y: hidden;
@@ -55,11 +55,11 @@
55
55
  /* focus-outline fix */
56
56
  margin: var(--gap-2xs-neg) 0 var(--gap-2xs-neg) var(--gap-2xs-neg);
57
57
  padding: var(--gap-2xs) 0 var(--gap-2xs) var(--gap-2xs)
58
- } .tabs__container_nl14b::-webkit-scrollbar {
58
+ } .tabs__container_3to0z::-webkit-scrollbar {
59
59
  display: none;
60
- } .tabs__container_nl14b > * {
60
+ } .tabs__container_3to0z > * {
61
61
  flex-shrink: 0;
62
- } .tabs__fullWidthScroll_nl14b {
62
+ } .tabs__fullWidthScroll_3to0z {
63
63
  padding-left: 0;
64
64
  margin: var(--gap-2xs-neg) var(--gap-m-neg);
65
65
  }
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { TagDesktop } from '@alfalab/core-components-tag/modern/desktop';
3
3
  import { SecondaryTabList } from './Component.js';
4
- import { c as commonStyles } from '../../index.module-86f8baa2.js';
4
+ import { c as commonStyles } from '../../index.module-e6e7da51.js';
5
5
  import 'classnames';
6
6
  import '../../hooks/use-tabs.js';
7
7
  import '@alfalab/core-components-shared/modern';
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import cn from 'classnames';
3
3
  import { TagMobile } from '@alfalab/core-components-tag/modern/mobile';
4
4
  import { SecondaryTabList } from './Component.js';
5
- import { c as commonStyles } from '../../index.module-86f8baa2.js';
5
+ import { c as commonStyles } from '../../index.module-e6e7da51.js';
6
6
  import '../../hooks/use-tabs.js';
7
7
  import '@alfalab/core-components-shared/modern';
8
8
  import '../scrollable-container/Component.js';
@@ -14,7 +14,7 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
14
14
  import '@alfalab/icons-glyph/ChevronRightMIcon';
15
15
  import '../scroll-controls/utils.js';
16
16
 
17
- const mobileStyles = {"title":"tabs__title_6pqi5 tabs__title_1i6us","mobile":"tabs__mobile_6pqi5"};
17
+ const mobileStyles = {"title":"tabs__title_gx8tm tabs__title_1kn1n","mobile":"tabs__mobile_gx8tm"};
18
18
  require('./mobile.css')
19
19
 
20
20
  const styles = {
@@ -15,7 +15,7 @@ import '@alfalab/core-components-icon-button/modern';
15
15
  import '@alfalab/icons-glyph/ChevronLeftMIcon';
16
16
  import '@alfalab/icons-glyph/ChevronRightMIcon';
17
17
  import '../scroll-controls/utils.js';
18
- import '../../index.module-86f8baa2.js';
18
+ import '../../index.module-e6e7da51.js';
19
19
  import '@alfalab/core-components-tag/modern/mobile';
20
20
 
21
21
  const SecondaryTabListResponsive = ({ defaultMatchMediaValue, fullWidthScroll, breakpoint = 1024, ...restProps }) => {
@@ -1,4 +1,4 @@
1
- /* hash: aqgms */
1
+ /* hash: zk8d0 */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -50,29 +50,29 @@
50
50
 
51
51
  /* size xl */
52
52
  --secondary-tablist-xl-gaps: var(--gap-m);
53
- } .tabs__component_1i6us {
53
+ } .tabs__component_1kn1n {
54
54
  position: relative;
55
55
  display: inline-flex;
56
- } .tabs__fullWidthScroll_1i6us {
56
+ } .tabs__fullWidthScroll_1kn1n {
57
57
  margin: 0 var(--gap-m);
58
- } .tabs__container_1i6us {
58
+ } .tabs__container_1kn1n {
59
59
  overflow: hidden;
60
60
 
61
61
  /* focus-outline fix */
62
62
  margin: var(--gap-2xs-neg) 0 var(--gap-2xs-neg) var(--gap-2xs-neg);
63
63
  padding: var(--gap-2xs) 0 var(--gap-2xs) var(--gap-2xs);
64
- } .tabs__title_1i6us {
64
+ } .tabs__title_1kn1n {
65
65
  white-space: nowrap;
66
- } /* sizes */ .tabs__xxs_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
66
+ } /* sizes */ .tabs__xxs_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
67
67
  margin-left: var(--secondary-tablist-xxs-gaps);
68
- } .tabs__xs_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
68
+ } .tabs__xs_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
69
69
  margin-left: var(--secondary-tablist-xs-gaps);
70
- } .tabs__s_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
70
+ } .tabs__s_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
71
71
  margin-left: var(--secondary-tablist-s-gaps);
72
- } .tabs__m_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
72
+ } .tabs__m_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
73
73
  margin-left: var(--secondary-tablist-m-gaps);
74
- } .tabs__l_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
74
+ } .tabs__l_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
75
75
  margin-left: var(--secondary-tablist-l-gaps);
76
- } .tabs__xl_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
76
+ } .tabs__xl_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
77
77
  margin-left: var(--secondary-tablist-xl-gaps);
78
78
  }
@@ -1,4 +1,4 @@
1
- /* hash: mpx36 */
1
+ /* hash: 1p9no */
2
2
  :root {
3
3
  }/* deprecated */: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 */
4
4
  }: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 */
@@ -51,30 +51,30 @@
51
51
 
52
52
  /* size xl */
53
53
  --secondary-tablist-xl-gaps: var(--gap-m);
54
- }.tabs__component_1i6us {
54
+ }.tabs__component_1kn1n {
55
55
  position: relative;
56
56
  display: inline-flex;
57
- }.tabs__fullWidthScroll_1i6us {
57
+ }.tabs__fullWidthScroll_1kn1n {
58
58
  margin: 0 var(--gap-m);
59
- }.tabs__container_1i6us {
59
+ }.tabs__container_1kn1n {
60
60
  overflow: hidden;
61
61
 
62
62
  /* focus-outline fix */
63
63
  margin: var(--gap-2xs-neg) 0 var(--gap-2xs-neg) var(--gap-2xs-neg);
64
64
  padding: var(--gap-2xs) 0 var(--gap-2xs) var(--gap-2xs);
65
- }.tabs__title_1i6us {
65
+ }.tabs__title_1kn1n {
66
66
  white-space: nowrap;
67
- }/* sizes */.tabs__xxs_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
67
+ }/* sizes */.tabs__xxs_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
68
68
  margin-left: var(--secondary-tablist-xxs-gaps);
69
- }.tabs__xs_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
69
+ }.tabs__xs_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
70
70
  margin-left: var(--secondary-tablist-xs-gaps);
71
- }.tabs__s_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
71
+ }.tabs__s_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
72
72
  margin-left: var(--secondary-tablist-s-gaps);
73
- }.tabs__m_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
73
+ }.tabs__m_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
74
74
  margin-left: var(--secondary-tablist-m-gaps);
75
- }.tabs__l_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
75
+ }.tabs__l_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
76
76
  margin-left: var(--secondary-tablist-l-gaps);
77
- }.tabs__xl_1i6us .tabs__title_1i6us + .tabs__title_1i6us {
77
+ }.tabs__xl_1kn1n .tabs__title_1kn1n + .tabs__title_1kn1n {
78
78
  margin-left: var(--secondary-tablist-xl-gaps);
79
79
  } :root {
80
80
  --color-dark-indigo: #0b1f35;
@@ -1101,6 +1101,7 @@
1101
1101
  --color-dark-graphic-tertiary-inverted-alpha-30: rgba(184, 185, 192, 0.3);
1102
1102
  --color-dark-graphic-tertiary-inverted-shade-15: rgb(156, 157, 163);
1103
1103
  --color-dark-graphic-tertiary-inverted-shade-20: rgb(147, 148, 154);
1104
+ --color-dark-neutral-700-alpha-15: rgba(137, 137, 145, 0.15);
1104
1105
  --color-dark-specialbg-component-tint-7: rgba(255, 255, 255, 0.163);
1105
1106
  --color-dark-specialbg-component-tint-10: rgba(255, 255, 255, 0.19);
1106
1107
  --color-dark-specialbg-component-tint-15: rgba(255, 255, 255, 0.235);
@@ -1120,6 +1121,7 @@
1120
1121
  --color-dark-specialbg-tertiary-transparent-tint-15: rgba(227, 227, 242, 0.252);
1121
1122
  --color-dark-specialbg-tertiary-transparent-inverted-shade-15: rgba(26, 37, 58, 0.218);
1122
1123
  --color-dark-specialbg-tertiary-transparent-inverted-shade-20: rgba(24, 34, 54, 0.264);
1124
+ --color-dark-status-info-alpha-15: rgba(49, 147, 252, 0.15);
1123
1125
  --color-dark-text-link-shade-30: rgb(52, 110, 176);
1124
1126
  --color-dark-text-link-shade-50: rgb(37, 79, 126);
1125
1127
  --color-dark-text-link-tint-20: rgb(110, 177, 253);
@@ -1261,6 +1263,7 @@
1261
1263
  --color-light-graphic-tertiary-inverted-alpha-30: rgba(73, 73, 79, 0.3);
1262
1264
  --color-light-graphic-tertiary-inverted-tint-15: rgb(100, 100, 105);
1263
1265
  --color-light-graphic-tertiary-inverted-tint-20: rgb(109, 109, 114);
1266
+ --color-light-neutral-700-alpha-15: rgba(137, 137, 145, 0.15);
1264
1267
  --color-light-specialbg-component-shade-7: rgba(10, 29, 49, 0.1351);
1265
1268
  --color-light-specialbg-component-shade-10: rgba(10, 28, 48, 0.163);
1266
1269
  --color-light-specialbg-component-shade-15: rgba(9, 26, 45, 0.2095);
@@ -1280,6 +1283,7 @@
1280
1283
  --color-light-specialbg-tertiary-transparent-shade-15: rgba(26, 37, 58, 0.218);
1281
1284
  --color-light-specialbg-tertiary-transparent-inverted-tint-15: rgba(227, 227, 242, 0.252);
1282
1285
  --color-light-specialbg-tertiary-transparent-inverted-tint-20: rgba(229, 229, 243, 0.296);
1286
+ --color-light-status-info-alpha-15: rgba(34, 136, 250, 0.15);
1283
1287
  --color-light-text-link-tint-30: rgb(106, 160, 244);
1284
1288
  --color-light-text-link-tint-50: rgb(149, 187, 247);
1285
1289
  --color-light-text-link-shade-20: rgb(34, 95, 191);
@@ -1573,8 +1577,8 @@
1573
1577
  --primary-tablist-hover-color: var(--color-light-text-primary);
1574
1578
  --primary-tablist-selected-color: var(--color-light-text-primary);
1575
1579
  --primary-tablist-disabled-color: var(--color-light-text-tertiary);
1576
- --primary-tablist-bottom-border-color: var(--color-light-border-primary);
1577
- --primary-tablist-line-color: var(--color-light-border-accent);
1580
+ --primary-tablist-bottom-border-color: var(--color-light-neutral-translucent-500);
1581
+ --primary-tablist-line-color: var(--color-light-accent-primary);
1578
1582
  --primary-tablist-font-feature-settings: normal;
1579
1583
 
1580
1584
  /* mobile */
@@ -1633,7 +1637,7 @@
1633
1637
 
1634
1638
  /* size xl */
1635
1639
  --secondary-tablist-xl-gaps: var(--gap-m);
1636
- } .tabs__title_6pqi5 {
1637
- } .tabs__mobile_6pqi5 .tabs__title_6pqi5 + .tabs__title_6pqi5 {
1640
+ } .tabs__title_gx8tm {
1641
+ } .tabs__mobile_gx8tm .tabs__title_gx8tm + .tabs__title_gx8tm {
1638
1642
  margin-left: var(--secondary-tablist-mobile-gaps);
1639
1643
  }
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import cn from 'classnames';
3
3
 
4
- const styles = {"component":"tabs__component_4ye6r","hidden":"tabs__hidden_4ye6r"};
4
+ const styles = {"component":"tabs__component_1i6au","hidden":"tabs__hidden_1i6au"};
5
5
  require('./index.css')
6
6
 
7
7
  const Tab = ({ children, hidden, className, disabled, dataTestId }) => children ? (React.createElement("div", { className: cn(styles.component, {
@@ -1,8 +1,8 @@
1
- /* hash: 1qxer */
2
- .tabs__component_4ye6r {
1
+ /* hash: 1c5ei */
2
+ .tabs__component_1i6au {
3
3
  outline: none;
4
4
  }
5
5
 
6
- .tabs__hidden_4ye6r {
6
+ .tabs__hidden_1i6au {
7
7
  display: none;
8
8
  }
@@ -14,7 +14,7 @@ import '../../hooks/use-tabs.js';
14
14
  import '@alfalab/core-components-shared/modern';
15
15
  import '../../synthetic-events.js';
16
16
  import '../title/Component.js';
17
- import '../../index.module-efbe6ab6.js';
17
+ import '../../index.module-377caacf.js';
18
18
 
19
19
  const TabsCollapsible = ({ ...restProps }) => (React.createElement(Tabs, { TabList: CollapsiblePrimaryTabList, ...restProps }));
20
20
 
@@ -17,10 +17,10 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
17
17
  import '@alfalab/icons-glyph/ChevronRightMIcon';
18
18
  import '../scroll-controls/utils.js';
19
19
  import '../title/Component.js';
20
- import '../../index.module-efbe6ab6.js';
20
+ import '../../index.module-377caacf.js';
21
21
  import '@alfalab/core-components-tag/modern/desktop';
22
22
  import '../secondary-tablist/Component.js';
23
- import '../../index.module-86f8baa2.js';
23
+ import '../../index.module-e6e7da51.js';
24
24
 
25
25
  const views = {
26
26
  primary: PrimaryTabListDesktop,
@@ -17,10 +17,10 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
17
17
  import '@alfalab/icons-glyph/ChevronRightMIcon';
18
18
  import '../scroll-controls/utils.js';
19
19
  import '../title/Component.js';
20
- import '../../index.module-efbe6ab6.js';
20
+ import '../../index.module-377caacf.js';
21
21
  import '@alfalab/core-components-tag/modern/mobile';
22
22
  import '../secondary-tablist/Component.js';
23
- import '../../index.module-86f8baa2.js';
23
+ import '../../index.module-e6e7da51.js';
24
24
 
25
25
  const views = {
26
26
  primary: PrimaryTabListMobile,
@@ -19,12 +19,12 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
19
19
  import '@alfalab/icons-glyph/ChevronRightMIcon';
20
20
  import '../scroll-controls/utils.js';
21
21
  import '../title/Component.js';
22
- import '../../index.module-efbe6ab6.js';
22
+ import '../../index.module-377caacf.js';
23
23
  import '../primary-tablist/Component.mobile.js';
24
24
  import '../secondary-tablist/Component.desktop.js';
25
25
  import '@alfalab/core-components-tag/modern/desktop';
26
26
  import '../secondary-tablist/Component.js';
27
- import '../../index.module-86f8baa2.js';
27
+ import '../../index.module-e6e7da51.js';
28
28
  import '../secondary-tablist/Component.mobile.js';
29
29
  import '@alfalab/core-components-tag/modern/mobile';
30
30
 
@@ -18,8 +18,8 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
18
18
  import '@alfalab/icons-glyph/ChevronRightMIcon';
19
19
  import '../components/scroll-controls/utils.js';
20
20
  import '../components/title/Component.js';
21
- import '../index.module-efbe6ab6.js';
21
+ import '../index.module-377caacf.js';
22
22
  import '@alfalab/core-components-tag/modern/desktop';
23
23
  import '../components/secondary-tablist/Component.js';
24
- import '../index.module-86f8baa2.js';
24
+ import '../index.module-e6e7da51.js';
25
25
  import '../components/tabs/Component.js';
package/modern/index.js CHANGED
@@ -20,12 +20,12 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
20
20
  import '@alfalab/icons-glyph/ChevronRightMIcon';
21
21
  import './components/scroll-controls/utils.js';
22
22
  import './components/title/Component.js';
23
- import './index.module-efbe6ab6.js';
23
+ import './index.module-377caacf.js';
24
24
  import './components/primary-tablist/Component.mobile.js';
25
25
  import './components/secondary-tablist/Component.desktop.js';
26
26
  import '@alfalab/core-components-tag/modern/desktop';
27
27
  import './components/secondary-tablist/Component.js';
28
- import './index.module-86f8baa2.js';
28
+ import './index.module-e6e7da51.js';
29
29
  import './components/secondary-tablist/Component.mobile.js';
30
30
  import '@alfalab/core-components-tag/modern/mobile';
31
31
  import './components/tabs/Component.js';
@@ -0,0 +1,4 @@
1
+ const styles = {"component":"tabs__component_nkcwu","fullWidthScroll":"tabs__fullWidthScroll_nkcwu","container":"tabs__container_nkcwu","title":"tabs__title_nkcwu","disabled":"tabs__disabled_nkcwu","focused":"tabs__focused_nkcwu","collapsed":"tabs__collapsed_nkcwu","selected":"tabs__selected_nkcwu","line":"tabs__line_nkcwu","option":"tabs__option_nkcwu","s":"tabs__s_nkcwu","xs":"tabs__xs_nkcwu","xxs":"tabs__xxs_nkcwu","pickerWrapper":"tabs__pickerWrapper_nkcwu","m":"tabs__m_nkcwu","l":"tabs__l_nkcwu","xl":"tabs__xl_nkcwu","rightAddons":"tabs__rightAddons_nkcwu"};
2
+ require('./components/primary-tablist/index.css')
3
+
4
+ export { styles as s };
@@ -0,0 +1,4 @@
1
+ const commonStyles = {"component":"tabs__component_1kn1n","fullWidthScroll":"tabs__fullWidthScroll_1kn1n","container":"tabs__container_1kn1n","title":"tabs__title_1kn1n","xxs":"tabs__xxs_1kn1n","xs":"tabs__xs_1kn1n","s":"tabs__s_1kn1n","m":"tabs__m_1kn1n","l":"tabs__l_1kn1n","xl":"tabs__xl_1kn1n"};
2
+ require('./components/secondary-tablist/index.css')
3
+
4
+ export { commonStyles as c };
@@ -18,8 +18,8 @@ import '@alfalab/icons-glyph/ChevronLeftMIcon';
18
18
  import '@alfalab/icons-glyph/ChevronRightMIcon';
19
19
  import '../components/scroll-controls/utils.js';
20
20
  import '../components/title/Component.js';
21
- import '../index.module-efbe6ab6.js';
21
+ import '../index.module-377caacf.js';
22
22
  import '@alfalab/core-components-tag/modern/mobile';
23
23
  import '../components/secondary-tablist/Component.js';
24
- import '../index.module-86f8baa2.js';
24
+ import '../index.module-e6e7da51.js';
25
25
  import '../components/tabs/Component.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-tabs",
3
- "version": "8.3.3",
3
+ "version": "8.4.1",
4
4
  "description": "Tabs components",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -15,13 +15,13 @@
15
15
  },
16
16
  "dependencies": {
17
17
  "@alfalab/core-components-keyboard-focusable": "^4.1.0",
18
- "@alfalab/core-components-tag": "^7.0.2",
19
- "@alfalab/core-components-picker-button": "^11.3.3",
20
- "@alfalab/core-components-badge": "^5.3.0",
18
+ "@alfalab/core-components-tag": "^8.0.0",
19
+ "@alfalab/core-components-picker-button": "^11.4.1",
20
+ "@alfalab/core-components-badge": "^5.4.0",
21
21
  "@alfalab/core-components-mq": "^4.2.0",
22
22
  "@alfalab/hooks": "^1.13.0",
23
23
  "@alfalab/core-components-shared": "^0.8.0",
24
- "@alfalab/core-components-icon-button": "^6.4.2",
24
+ "@alfalab/core-components-icon-button": "^6.4.3",
25
25
  "@alfalab/icons-glyph": "^2.108.0",
26
26
  "classnames": "^2.3.1",
27
27
  "compute-scroll-into-view": "^3.1.0",
@@ -19,7 +19,7 @@
19
19
  }
20
20
 
21
21
  .borderVisible:before {
22
- background-color: var(--color-light-specialbg-tertiary-transparent);
22
+ background-color: var(--color-light-neutral-translucent-300);
23
23
  }
24
24
 
25
25
  .primary {
package/src/vars.css CHANGED
@@ -5,8 +5,8 @@
5
5
  --primary-tablist-hover-color: var(--color-light-text-primary);
6
6
  --primary-tablist-selected-color: var(--color-light-text-primary);
7
7
  --primary-tablist-disabled-color: var(--color-light-text-tertiary);
8
- --primary-tablist-bottom-border-color: var(--color-light-border-primary);
9
- --primary-tablist-line-color: var(--color-light-border-accent);
8
+ --primary-tablist-bottom-border-color: var(--color-light-neutral-translucent-500);
9
+ --primary-tablist-line-color: var(--color-light-accent-primary);
10
10
  --primary-tablist-font-feature-settings: normal;
11
11
 
12
12
  /* mobile */
@@ -1,4 +0,0 @@
1
- var commonStyles = {"component":"tabs__component_1i6us","fullWidthScroll":"tabs__fullWidthScroll_1i6us","container":"tabs__container_1i6us","title":"tabs__title_1i6us","xxs":"tabs__xxs_1i6us","xs":"tabs__xs_1i6us","s":"tabs__s_1i6us","m":"tabs__m_1i6us","l":"tabs__l_1i6us","xl":"tabs__xl_1i6us"};
2
- require('./components/secondary-tablist/index.css')
3
-
4
- export { commonStyles as c };
@@ -1,4 +0,0 @@
1
- var styles = {"component":"tabs__component_1u6tn","fullWidthScroll":"tabs__fullWidthScroll_1u6tn","container":"tabs__container_1u6tn","title":"tabs__title_1u6tn","disabled":"tabs__disabled_1u6tn","focused":"tabs__focused_1u6tn","collapsed":"tabs__collapsed_1u6tn","selected":"tabs__selected_1u6tn","line":"tabs__line_1u6tn","option":"tabs__option_1u6tn","s":"tabs__s_1u6tn","xs":"tabs__xs_1u6tn","xxs":"tabs__xxs_1u6tn","pickerWrapper":"tabs__pickerWrapper_1u6tn","m":"tabs__m_1u6tn","l":"tabs__l_1u6tn","xl":"tabs__xl_1u6tn","rightAddons":"tabs__rightAddons_1u6tn"};
2
- require('./components/primary-tablist/index.css')
3
-
4
- export { styles as s };
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var styles = {"component":"tabs__component_1u6tn","fullWidthScroll":"tabs__fullWidthScroll_1u6tn","container":"tabs__container_1u6tn","title":"tabs__title_1u6tn","disabled":"tabs__disabled_1u6tn","focused":"tabs__focused_1u6tn","collapsed":"tabs__collapsed_1u6tn","selected":"tabs__selected_1u6tn","line":"tabs__line_1u6tn","option":"tabs__option_1u6tn","s":"tabs__s_1u6tn","xs":"tabs__xs_1u6tn","xxs":"tabs__xxs_1u6tn","pickerWrapper":"tabs__pickerWrapper_1u6tn","m":"tabs__m_1u6tn","l":"tabs__l_1u6tn","xl":"tabs__xl_1u6tn","rightAddons":"tabs__rightAddons_1u6tn"};
4
- require('./components/primary-tablist/index.css')
5
-
6
- exports.styles = styles;
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var commonStyles = {"component":"tabs__component_1i6us","fullWidthScroll":"tabs__fullWidthScroll_1i6us","container":"tabs__container_1i6us","title":"tabs__title_1i6us","xxs":"tabs__xxs_1i6us","xs":"tabs__xs_1i6us","s":"tabs__s_1i6us","m":"tabs__m_1i6us","l":"tabs__l_1i6us","xl":"tabs__xl_1i6us"};
4
- require('./components/secondary-tablist/index.css')
5
-
6
- exports.commonStyles = commonStyles;
@@ -1,4 +0,0 @@
1
- const commonStyles = {"component":"tabs__component_1i6us","fullWidthScroll":"tabs__fullWidthScroll_1i6us","container":"tabs__container_1i6us","title":"tabs__title_1i6us","xxs":"tabs__xxs_1i6us","xs":"tabs__xs_1i6us","s":"tabs__s_1i6us","m":"tabs__m_1i6us","l":"tabs__l_1i6us","xl":"tabs__xl_1i6us"};
2
- require('./components/secondary-tablist/index.css')
3
-
4
- export { commonStyles as c };
@@ -1,4 +0,0 @@
1
- const styles = {"component":"tabs__component_1u6tn","fullWidthScroll":"tabs__fullWidthScroll_1u6tn","container":"tabs__container_1u6tn","title":"tabs__title_1u6tn","disabled":"tabs__disabled_1u6tn","focused":"tabs__focused_1u6tn","collapsed":"tabs__collapsed_1u6tn","selected":"tabs__selected_1u6tn","line":"tabs__line_1u6tn","option":"tabs__option_1u6tn","s":"tabs__s_1u6tn","xs":"tabs__xs_1u6tn","xxs":"tabs__xxs_1u6tn","pickerWrapper":"tabs__pickerWrapper_1u6tn","m":"tabs__m_1u6tn","l":"tabs__l_1u6tn","xl":"tabs__xl_1u6tn","rightAddons":"tabs__rightAddons_1u6tn"};
2
- require('./components/primary-tablist/index.css')
3
-
4
- export { styles as s };