@alfalab/core-components-tabs 7.3.3 → 7.3.4

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 (132) hide show
  1. package/Component-3e68f8db.d.ts +2 -2
  2. package/{Component-85892853.d.ts → Component-cac440c1.d.ts} +1 -1
  3. package/components/primary-tablist/Component.desktop.js +2 -2
  4. package/components/primary-tablist/Component.js +1 -1
  5. package/components/primary-tablist/Component.mobile.js +3 -3
  6. package/components/primary-tablist/Component.responsive.js +2 -2
  7. package/components/primary-tablist/index.css +38 -68
  8. package/components/primary-tablist/mobile.css +150 -163
  9. package/components/scrollable-container/Component.js +1 -1
  10. package/components/scrollable-container/index.css +14 -13
  11. package/components/secondary-tablist/Component.desktop.js +2 -2
  12. package/components/secondary-tablist/Component.js +1 -1
  13. package/components/secondary-tablist/Component.mobile.js +3 -3
  14. package/components/secondary-tablist/Component.responsive.js +2 -2
  15. package/components/secondary-tablist/index.css +20 -26
  16. package/components/secondary-tablist/mobile.css +130 -142
  17. package/components/tab/Component.js +1 -1
  18. package/components/tab/index.css +3 -3
  19. package/components/tabs/Component.desktop.js +3 -3
  20. package/components/tabs/Component.mobile.js +3 -3
  21. package/components/tabs/Component.responsive.js +3 -3
  22. package/components/title/Component.js +1 -1
  23. package/components/title/index.js +1 -1
  24. package/cssm/Component-3e68f8db.d.ts +2 -2
  25. package/cssm/{Component-85892853.d.ts → Component-cac440c1.d.ts} +1 -1
  26. package/cssm/components/primary-tablist/index.module.css +37 -67
  27. package/cssm/components/primary-tablist/mobile.module.css +12 -12
  28. package/cssm/components/scrollable-container/index.module.css +13 -12
  29. package/cssm/components/secondary-tablist/index.module.css +19 -25
  30. package/cssm/components/secondary-tablist/mobile.module.css +11 -8
  31. package/cssm/index-3e68f8db.d.ts +4 -4
  32. package/cssm/index-48646db0.d.ts +1 -1
  33. package/cssm/index-7ca84eff.d.ts +6 -0
  34. package/cssm/index-ebda875c.d.ts +1 -1
  35. package/{esm/typings-85892853.d.ts → cssm/typings-cac440c1.d.ts} +1 -5
  36. package/{modern/utils-85892853.d.ts → cssm/utils-cac440c1.d.ts} +1 -1
  37. package/cssm/vars.css +9 -2
  38. package/desktop.js +3 -3
  39. package/esm/Component-3e68f8db.d.ts +2 -2
  40. package/esm/{Component-85892853.d.ts → Component-cac440c1.d.ts} +1 -1
  41. package/esm/components/primary-tablist/Component.desktop.js +2 -2
  42. package/esm/components/primary-tablist/Component.js +1 -1
  43. package/esm/components/primary-tablist/Component.mobile.js +3 -3
  44. package/esm/components/primary-tablist/Component.responsive.js +2 -2
  45. package/esm/components/primary-tablist/index.css +38 -68
  46. package/esm/components/primary-tablist/mobile.css +150 -163
  47. package/esm/components/scrollable-container/Component.js +1 -1
  48. package/esm/components/scrollable-container/index.css +14 -13
  49. package/esm/components/secondary-tablist/Component.desktop.js +2 -2
  50. package/esm/components/secondary-tablist/Component.js +1 -1
  51. package/esm/components/secondary-tablist/Component.mobile.js +3 -3
  52. package/esm/components/secondary-tablist/Component.responsive.js +2 -2
  53. package/esm/components/secondary-tablist/index.css +20 -26
  54. package/esm/components/secondary-tablist/mobile.css +130 -142
  55. package/esm/components/tab/Component.js +1 -1
  56. package/esm/components/tab/index.css +3 -3
  57. package/esm/components/tabs/Component.desktop.js +3 -3
  58. package/esm/components/tabs/Component.mobile.js +3 -3
  59. package/esm/components/tabs/Component.responsive.js +3 -3
  60. package/esm/components/title/Component.js +1 -1
  61. package/esm/components/title/index.js +1 -1
  62. package/esm/desktop.js +3 -3
  63. package/esm/hooks/use-collapsible-elements.js +1 -1
  64. package/esm/hooks/use-tablist-titles.js +1 -1
  65. package/esm/index-3e68f8db.d.ts +4 -4
  66. package/esm/index-48646db0.d.ts +1 -1
  67. package/esm/index-7ca84eff.d.ts +6 -0
  68. package/esm/index-ebda875c.d.ts +1 -1
  69. package/esm/index.js +3 -3
  70. package/esm/index.module-ba97f96d.js +4 -0
  71. package/esm/index.module-da19acab.js +4 -0
  72. package/esm/mobile.js +3 -3
  73. package/esm/responsive.js +3 -3
  74. package/esm/synthetic-events.js +1 -1
  75. package/esm/{tslib.es6-62e0e458.d.ts → tslib.es6-ef625021.d.ts} +0 -0
  76. package/esm/{tslib.es6-62e0e458.js → tslib.es6-ef625021.js} +0 -0
  77. package/{modern/typings-85892853.d.ts → esm/typings-cac440c1.d.ts} +1 -5
  78. package/{utils-85892853.d.ts → esm/utils-cac440c1.d.ts} +1 -1
  79. package/hooks/use-collapsible-elements.js +1 -1
  80. package/hooks/use-tablist-titles.js +1 -1
  81. package/index-3e68f8db.d.ts +4 -4
  82. package/index-48646db0.d.ts +1 -1
  83. package/index-7ca84eff.d.ts +6 -0
  84. package/index-ebda875c.d.ts +1 -1
  85. package/index.js +3 -3
  86. package/index.module-3b1c7c9a.js +6 -0
  87. package/index.module-88a600f7.js +6 -0
  88. package/mobile.js +3 -3
  89. package/modern/Component-3e68f8db.d.ts +2 -2
  90. package/modern/{Component-85892853.d.ts → Component-cac440c1.d.ts} +1 -1
  91. package/modern/components/primary-tablist/Component.desktop.js +1 -1
  92. package/modern/components/primary-tablist/Component.mobile.js +2 -2
  93. package/modern/components/primary-tablist/Component.responsive.js +1 -1
  94. package/modern/components/primary-tablist/index.css +38 -68
  95. package/modern/components/primary-tablist/mobile.css +150 -163
  96. package/modern/components/scrollable-container/Component.js +1 -1
  97. package/modern/components/scrollable-container/index.css +14 -13
  98. package/modern/components/secondary-tablist/Component.desktop.js +1 -1
  99. package/modern/components/secondary-tablist/Component.mobile.js +2 -2
  100. package/modern/components/secondary-tablist/Component.responsive.js +1 -1
  101. package/modern/components/secondary-tablist/index.css +20 -26
  102. package/modern/components/secondary-tablist/mobile.css +130 -142
  103. package/modern/components/tab/Component.js +1 -1
  104. package/modern/components/tab/index.css +3 -3
  105. package/modern/components/tabs/Component.desktop.js +2 -2
  106. package/modern/components/tabs/Component.mobile.js +2 -2
  107. package/modern/components/tabs/Component.responsive.js +2 -2
  108. package/modern/desktop.js +2 -2
  109. package/modern/index-3e68f8db.d.ts +4 -4
  110. package/modern/index-48646db0.d.ts +1 -1
  111. package/modern/index-7ca84eff.d.ts +6 -0
  112. package/modern/index-ebda875c.d.ts +1 -1
  113. package/modern/index.js +2 -2
  114. package/modern/index.module-08b2503f.js +4 -0
  115. package/modern/index.module-a4ad700d.js +4 -0
  116. package/modern/mobile.js +2 -2
  117. package/modern/responsive.js +2 -2
  118. package/{cssm/typings-85892853.d.ts → modern/typings-cac440c1.d.ts} +1 -5
  119. package/{esm/utils-85892853.d.ts → modern/utils-cac440c1.d.ts} +1 -1
  120. package/package.json +2 -2
  121. package/responsive.js +3 -3
  122. package/synthetic-events.js +1 -1
  123. package/{tslib.es6-edd9cdac.d.ts → tslib.es6-860bcbc6.d.ts} +0 -0
  124. package/{tslib.es6-edd9cdac.js → tslib.es6-860bcbc6.js} +0 -0
  125. package/{typings-85892853.d.ts → typings-cac440c1.d.ts} +1 -5
  126. package/{cssm/utils-85892853.d.ts → utils-cac440c1.d.ts} +1 -1
  127. package/esm/index.module-10d535eb.js +0 -4
  128. package/esm/index.module-9c2f5300.js +0 -4
  129. package/index.module-7dc52a7b.js +0 -6
  130. package/index.module-a5052a1c.js +0 -6
  131. package/modern/index.module-4d08392f.js +0 -4
  132. package/modern/index.module-cd099570.js +0 -4
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { FC, SVGProps } from 'react';
3
- import { OptionShape } from "./typings-85892853";
4
- import { OptionProps as BaseOptionProps } from "./typings-85892853";
3
+ import { OptionShape } from "./typings-cac440c1";
4
+ import { OptionProps as BaseOptionProps } from "./typings-cac440c1";
5
5
  type OptionProps = Omit<BaseOptionProps, 'option'> & {
6
6
  option: OptionShape & {
7
7
  icon?: FC<SVGProps<SVGSVGElement>>;
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import { FC } from 'react';
3
- import { OptionProps } from "./typings-85892853";
3
+ import { OptionProps } from "./typings-cac440c1";
4
4
  declare const BaseOption: FC<OptionProps>;
5
5
  export { BaseOption };
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
- var tslib_es6 = require('../../tslib.es6-edd9cdac.js');
3
+ var tslib_es6 = require('../../tslib.es6-860bcbc6.js');
4
4
  var React = require('react');
5
5
  var components_primaryTablist_Component = require('./Component.js');
6
- var index_module = require('../../index.module-7dc52a7b.js');
6
+ var index_module = require('../../index.module-88a600f7.js');
7
7
  require('classnames');
8
8
  require('@alfalab/core-components-badge');
9
9
  require('@alfalab/core-components-keyboard-focusable');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var tslib_es6 = require('../../tslib.es6-edd9cdac.js');
3
+ var tslib_es6 = require('../../tslib.es6-860bcbc6.js');
4
4
  var React = require('react');
5
5
  var cn = require('classnames');
6
6
  var coreComponentsBadge = require('@alfalab/core-components-badge');
@@ -1,10 +1,10 @@
1
1
  'use strict';
2
2
 
3
- var tslib_es6 = require('../../tslib.es6-edd9cdac.js');
3
+ var tslib_es6 = require('../../tslib.es6-860bcbc6.js');
4
4
  var React = require('react');
5
5
  var cn = require('classnames');
6
6
  var components_primaryTablist_Component = require('./Component.js');
7
- var index_module = require('../../index.module-7dc52a7b.js');
7
+ var index_module = require('../../index.module-88a600f7.js');
8
8
  require('@alfalab/core-components-badge');
9
9
  require('@alfalab/core-components-keyboard-focusable');
10
10
  require('@alfalab/core-components-picker-button/desktop');
@@ -23,7 +23,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
23
23
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
24
24
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
25
25
 
26
- var mobileStyles = {"title":"tabs__title_f1h14 tabs__title_1w0vv","mobile":"tabs__mobile_f1h14"};
26
+ var mobileStyles = {"title":"tabs__title_1awe6 tabs__title_mcuzy","mobile":"tabs__mobile_1awe6"};
27
27
  require('./mobile.css')
28
28
 
29
29
  var styles = tslib_es6.__assign(tslib_es6.__assign({}, index_module.commonStyles), mobileStyles);
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var tslib_es6 = require('../../tslib.es6-edd9cdac.js');
3
+ var tslib_es6 = require('../../tslib.es6-860bcbc6.js');
4
4
  var React = require('react');
5
5
  var hooks = require('@alfalab/hooks');
6
6
  var components_primaryTablist_Component_desktop = require('./Component.desktop.js');
@@ -18,7 +18,7 @@ require('../../synthetic-events.js');
18
18
  require('../scrollable-container/Component.js');
19
19
  require('compute-scroll-into-view');
20
20
  require('../title/Component.js');
21
- require('../../index.module-7dc52a7b.js');
21
+ require('../../index.module-88a600f7.js');
22
22
 
23
23
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
24
24
 
@@ -1,21 +1,23 @@
1
- /* hash: 1audr */
1
+ /* hash: 1mbt0 */
2
2
  :root {
3
+ } /* deprecated */ :root {
3
4
  --color-light-border-accent: #ef3124;
4
5
  --color-light-border-link: #007aff;
5
6
  --color-light-border-primary: #dbdee1;
6
7
  --color-light-text-primary: #0b1f35;
7
8
  --color-light-text-secondary: rgba(11, 31, 53, 0.7);
8
9
  --color-light-text-tertiary: rgba(11, 31, 53, 0.3);
9
- }
10
- :root {
10
+ } :root {
11
+ } :root {
12
+ } :root {
11
13
 
12
14
  /* Hard */
13
15
 
14
16
  /* Up */
15
17
 
16
18
  /* Hard up */
17
- }
18
- :root {
19
+ } :root {
20
+ } :root {
19
21
  --gap-2xs: 4px;
20
22
  --gap-xs: 8px;
21
23
  --gap-s: 12px;
@@ -23,16 +25,13 @@
23
25
  --gap-l: 20px;
24
26
  --gap-2xl: 32px;
25
27
  --gap-2xs-neg: -4px;
26
- }
27
- :root {
28
+ } :root {
28
29
  --font-family-system: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
29
30
  sans-serif;
30
- }
31
- :root {
31
+ } :root {
32
32
  --focus-color: var(--color-light-border-link);
33
33
  --disabled-cursor: not-allowed;
34
- }
35
- :root {
34
+ } :root {
36
35
  --primary-tablist-color: var(--color-light-text-secondary);
37
36
  --primary-tablist-hover-color: var(--color-light-text-primary);
38
37
  --primary-tablist-selected-color: var(--color-light-text-primary);
@@ -84,13 +83,11 @@
84
83
  /* size l */
85
84
 
86
85
  /* size xl */
87
- }
88
- .tabs__component_1w0vv {
86
+ } .tabs__component_mcuzy {
89
87
  position: relative;
90
88
  display: inline-flex;
91
89
  min-width: 100%
92
- }
93
- .tabs__component_1w0vv:before {
90
+ } .tabs__component_mcuzy:before {
94
91
  content: '';
95
92
  display: block;
96
93
  position: absolute;
@@ -98,20 +95,17 @@
98
95
  height: 1px;
99
96
  width: 100%;
100
97
  background-color: var(--primary-tablist-bottom-border-color);
101
- }
102
- .tabs__fullWidthScroll_1w0vv {
98
+ } .tabs__fullWidthScroll_mcuzy {
103
99
  min-width: calc(100% - 2 * var(--gap-m));
104
100
  margin: 0 var(--gap-m);
105
- }
106
- .tabs__container_1w0vv {
101
+ } .tabs__container_mcuzy {
107
102
  position: relative;
108
103
  overflow: hidden;
109
104
 
110
105
  /* focus-outline fix */
111
106
  margin: var(--gap-2xs-neg) 0 var(--gap-2xs-neg) var(--gap-2xs-neg);
112
107
  padding: var(--gap-2xs) 0 var(--gap-2xs) var(--gap-2xs);
113
- }
114
- .tabs__title_1w0vv {
108
+ } .tabs__title_mcuzy {
115
109
  display: flex;
116
110
  align-items: center;
117
111
  height: 100%;
@@ -128,100 +122,76 @@
128
122
  user-select: none;
129
123
  cursor: pointer;
130
124
  outline: none
131
- }
132
- .tabs__title_1w0vv:not(.tabs__disabled_1w0vv):hover {
125
+ } .tabs__title_mcuzy:not(.tabs__disabled_mcuzy):hover {
133
126
  color: var(--primary-tablist-hover-color);
134
- }
135
- .tabs__focused_1w0vv {
127
+ } .tabs__focused_mcuzy {
136
128
  outline: 2px solid var(--focus-color);
137
129
  outline-offset: 2px;
138
- }
139
- .tabs__collapsed_1w0vv {
130
+ } .tabs__collapsed_mcuzy {
140
131
  order: 99;
141
132
  visibility: collapse;
142
- }
143
- .tabs__selected_1w0vv {
133
+ } .tabs__selected_mcuzy {
144
134
  cursor: default;
145
135
  color: var(--primary-tablist-selected-color);
146
- }
147
- .tabs__disabled_1w0vv {
136
+ } .tabs__disabled_mcuzy {
148
137
  cursor: var(--disabled-cursor);
149
138
  color: var(--primary-tablist-disabled-color);
150
- }
151
- .tabs__line_1w0vv {
139
+ } .tabs__line_mcuzy {
152
140
  position: absolute;
153
141
  height: 3px;
154
142
  bottom: 0;
155
143
  left: 0;
156
144
  background-color: var(--primary-tablist-line-color);
157
145
  transition: transform 0.2s ease, width 0.2s ease;
158
- }
159
- /* sizes */
160
- .tabs__s_1w0vv .tabs__title_1w0vv, .tabs__xs_1w0vv .tabs__title_1w0vv, .tabs__xxs_1w0vv .tabs__title_1w0vv {
146
+ } /* sizes */ .tabs__s_mcuzy .tabs__title_mcuzy, .tabs__xs_mcuzy .tabs__title_mcuzy, .tabs__xxs_mcuzy .tabs__title_mcuzy {
161
147
  padding: var(--primary-tablist-s-padding);
162
148
  font-size: var(--primary-tablist-s-font-size);
163
149
  font-weight: var(--primary-tablist-s-font-weight);
164
150
  font-family: var(--primary-tablist-s-font-family);
165
151
  line-height: 24px;
166
- }
167
- .tabs__s_1w0vv .tabs__title_1w0vv + .tabs__title_1w0vv, .tabs__xs_1w0vv .tabs__title_1w0vv + .tabs__title_1w0vv, .tabs__xxs_1w0vv .tabs__title_1w0vv + .tabs__title_1w0vv {
152
+ } .tabs__s_mcuzy .tabs__title_mcuzy + .tabs__title_mcuzy, .tabs__xs_mcuzy .tabs__title_mcuzy + .tabs__title_mcuzy, .tabs__xxs_mcuzy .tabs__title_mcuzy + .tabs__title_mcuzy {
168
153
  margin-left: var(--primary-tablist-s-gaps);
169
- }
170
- .tabs__s_1w0vv .tabs__pickerWrapper_1w0vv, .tabs__xs_1w0vv .tabs__pickerWrapper_1w0vv, .tabs__xxs_1w0vv .tabs__pickerWrapper_1w0vv {
154
+ } .tabs__s_mcuzy .tabs__pickerWrapper_mcuzy, .tabs__xs_mcuzy .tabs__pickerWrapper_mcuzy, .tabs__xxs_mcuzy .tabs__pickerWrapper_mcuzy {
171
155
  margin-left: var(--primary-tablist-s-gaps);
172
- }
173
- .tabs__s_1w0vv .tabs__option_1w0vv, .tabs__xs_1w0vv .tabs__option_1w0vv, .tabs__xxs_1w0vv .tabs__option_1w0vv {
156
+ } .tabs__s_mcuzy .tabs__option_mcuzy, .tabs__xs_mcuzy .tabs__option_mcuzy, .tabs__xxs_mcuzy .tabs__option_mcuzy {
174
157
  padding: 0;
175
- }
176
- .tabs__m_1w0vv .tabs__title_1w0vv {
158
+ } .tabs__m_mcuzy .tabs__title_mcuzy {
177
159
  padding: var(--primary-tablist-m-padding);
178
160
  font-size: var(--primary-tablist-m-font-size);
179
161
  font-weight: var(--primary-tablist-m-font-weight);
180
162
  font-family: var(--primary-tablist-m-font-family);
181
163
  line-height: 24px;
182
- }
183
- .tabs__m_1w0vv .tabs__title_1w0vv + .tabs__title_1w0vv {
164
+ } .tabs__m_mcuzy .tabs__title_mcuzy + .tabs__title_mcuzy {
184
165
  margin-left: var(--primary-tablist-m-gaps);
185
- }
186
- .tabs__m_1w0vv .tabs__pickerWrapper_1w0vv {
166
+ } .tabs__m_mcuzy .tabs__pickerWrapper_mcuzy {
187
167
  margin-left: var(--primary-tablist-m-gaps);
188
- }
189
- .tabs__m_1w0vv .tabs__option_1w0vv {
168
+ } .tabs__m_mcuzy .tabs__option_mcuzy {
190
169
  padding: 0;
191
- }
192
- .tabs__l_1w0vv .tabs__title_1w0vv {
170
+ } .tabs__l_mcuzy .tabs__title_mcuzy {
193
171
  padding: var(--primary-tablist-l-padding);
194
172
  font-size: var(--primary-tablist-l-font-size);
195
173
  font-weight: var(--primary-tablist-l-font-weight);
196
174
  font-family: var(--primary-tablist-l-font-family);
197
175
  line-height: 24px;
198
- }
199
- .tabs__l_1w0vv .tabs__title_1w0vv + .tabs__title_1w0vv {
176
+ } .tabs__l_mcuzy .tabs__title_mcuzy + .tabs__title_mcuzy {
200
177
  margin-left: var(--primary-tablist-l-gaps);
201
- }
202
- .tabs__l_1w0vv .tabs__pickerWrapper_1w0vv {
178
+ } .tabs__l_mcuzy .tabs__pickerWrapper_mcuzy {
203
179
  margin-left: var(--primary-tablist-l-gaps);
204
- }
205
- .tabs__l_1w0vv .tabs__option_1w0vv {
180
+ } .tabs__l_mcuzy .tabs__option_mcuzy {
206
181
  padding: 0;
207
- }
208
- .tabs__xl_1w0vv .tabs__title_1w0vv {
182
+ } .tabs__xl_mcuzy .tabs__title_mcuzy {
209
183
  padding: var(--primary-tablist-xl-padding);
210
184
  font-size: var(--primary-tablist-xl-font-size);
211
185
  font-weight: var(--primary-tablist-xl-font-weight);
212
186
  font-family: var(--primary-tablist-xl-font-family);
213
187
  line-height: 32px;
214
- }
215
- .tabs__xl_1w0vv .tabs__title_1w0vv + .tabs__title_1w0vv {
188
+ } .tabs__xl_mcuzy .tabs__title_mcuzy + .tabs__title_mcuzy {
216
189
  margin-left: var(--primary-tablist-xl-gaps);
217
- }
218
- .tabs__xl_1w0vv .tabs__pickerWrapper_1w0vv {
190
+ } .tabs__xl_mcuzy .tabs__pickerWrapper_mcuzy {
219
191
  margin-left: var(--primary-tablist-xl-gaps);
220
- }
221
- .tabs__xl_1w0vv .tabs__option_1w0vv {
192
+ } .tabs__xl_mcuzy .tabs__option_mcuzy {
222
193
  padding: 0;
223
- }
224
- .tabs__rightAddons_1w0vv {
194
+ } .tabs__rightAddons_mcuzy {
225
195
  display: flex;
226
196
  justify-content: center;
227
197
  align-items: center;