@rescui/switcher 0.1.1 → 0.1.5

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 (4) hide show
  1. package/lib/index.css +79 -72
  2. package/lib/index.module.pcss.js +14 -13
  3. package/lib/switcher.js +34 -19
  4. package/package.json +5 -5
package/lib/index.css CHANGED
@@ -1,4 +1,4 @@
1
- ._switcher_1jraics_4{
1
+ ._switcher_165bbt6_4{
2
2
 
3
3
  position:relative;
4
4
 
@@ -16,21 +16,21 @@
16
16
 
17
17
  background:transparent;
18
18
  }
19
- ._themeLight_1jraics_17{
19
+ ._themeLight_165bbt6_17{
20
20
  -webkit-box-shadow:inset rgba(25,25,28,0.4) 0 0 0 1px;
21
21
  box-shadow:inset rgba(25,25,28,0.4) 0 0 0 1px;
22
22
  }
23
- ._themeDark_1jraics_21{
23
+ ._themeDark_165bbt6_21{
24
24
  -webkit-box-shadow:inset rgba(255,255,255,0.5) 0 0 0 1px;
25
25
  box-shadow:inset rgba(255,255,255,0.5) 0 0 0 1px;
26
26
  }
27
- ._sizeL_1jraics_25{
27
+ ._sizeL_165bbt6_25{
28
28
  border-radius:36px;
29
29
  }
30
- ._sizeXS_1jraics_29{
30
+ ._sizeXS_165bbt6_29{
31
31
  border-radius:4px;
32
32
  }
33
- ._option_1jraics_33{
33
+ ._option_165bbt6_33{
34
34
  position:relative;
35
35
  -webkit-appearance:none;
36
36
  -moz-appearance:none;
@@ -50,116 +50,125 @@
50
50
 
51
51
  background:transparent;
52
52
  }
53
- ._sizeL_1jraics_25 ._option_1jraics_33{
53
+ ._sizeL_165bbt6_25 ._option_165bbt6_33{
54
54
  padding:12px 32px;
55
- letter-spacing:normal;
56
55
  color:rgba(25,25,28,0.7);
57
56
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
58
- font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
59
- font-family:var(--rs-font-family-inter, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif);
60
- font-size:20px;
61
- font-size:var(--rs-text-1-font-size, 20px);
62
- font-weight:400;
63
- line-height:32px;
64
- line-height:var(--rs-text-1-line-height, 32px);
57
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
58
+ font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
59
+ font-size:19px;
60
+ font-size:var(--rs-text-1-font-size, 19px);
61
+ font-weight:normal;
62
+ line-height:28px;
63
+ line-height:var(--rs-text-1-line-height, 28px);
65
64
  border-radius:36px;
66
65
  }
67
- ._sizeM_1jraics_56 ._option_1jraics_33{
66
+ ._sizeM_165bbt6_56 ._option_165bbt6_33{
68
67
  padding:8px 24px;
69
- letter-spacing:normal;
68
+ letter-spacing:0.0015em;
70
69
  color:rgba(25,25,28,0.7);
71
70
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
72
- font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
73
- font-family:var(--rs-font-family-inter, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif);
71
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
72
+ font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
74
73
  font-size:16px;
75
74
  font-size:var(--rs-text-2-font-size, 16px);
76
75
  font-weight:400;
77
76
  line-height:24px;
78
77
  line-height:var(--rs-text-2-line-height, 24px);
79
78
  }
80
- ._sizeS_1jraics_61 ._option_1jraics_33{
81
- padding:6px 16px;
79
+ ._rs-reset-letter-spacing_165bbt6_1 ._sizeM_165bbt6_56 ._option_165bbt6_33{
82
80
  letter-spacing:normal;
81
+ }
82
+ ._sizeS_165bbt6_61 ._option_165bbt6_33{
83
+ padding:6px 16px;
84
+ letter-spacing:0.0015em;
83
85
  color:rgba(25,25,28,0.7);
84
86
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
85
- font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
86
- font-family:var(--rs-font-family-inter, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif);
87
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
88
+ font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
87
89
  font-size:16px;
88
90
  font-size:var(--rs-text-2-font-size, 16px);
89
91
  font-weight:400;
90
92
  line-height:24px;
91
93
  line-height:var(--rs-text-2-line-height, 24px);
92
94
  }
93
- ._sizeXS_1jraics_29 ._option_1jraics_33{
94
- padding:2px 12px;
95
+ ._rs-reset-letter-spacing_165bbt6_1 ._sizeS_165bbt6_61 ._option_165bbt6_33{
95
96
  letter-spacing:normal;
97
+ }
98
+ ._sizeXS_165bbt6_29 ._option_165bbt6_33{
99
+ padding:2px 12px;
100
+ letter-spacing:0.0045em;
96
101
  color:rgba(25,25,28,0.7);
97
102
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
98
- font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
99
- font-family:var(--rs-font-family-inter, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif);
103
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
104
+ font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
100
105
  font-size:13px;
101
106
  font-size:var(--rs-text-3-font-size, 13px);
102
- font-weight:400;
103
107
  line-height:20px;
104
108
  line-height:var(--rs-text-3-line-height, 20px);
105
- border-radius:4px;
106
109
  }
107
- ._disabled_1jraics_72 ._option_1jraics_33{
110
+ ._rs-reset-letter-spacing_165bbt6_1 ._sizeXS_165bbt6_29 ._option_165bbt6_33{
111
+ letter-spacing:normal;
112
+ }
113
+ ._sizeXS_165bbt6_29 ._option_165bbt6_33 {
114
+ border-radius:4px;
115
+ }
116
+ ._disabled_165bbt6_72 ._option_165bbt6_33{
108
117
  cursor:not-allowed;
109
118
  pointer-events:none;
110
119
  }
111
- ._themeLight_1jraics_17 ._option_1jraics_33{
120
+ ._themeLight_165bbt6_17 ._option_165bbt6_33{
112
121
  color:#19191C;
113
122
  }
114
- ._themeLight_1jraics_17 ._option_1jraics_33:focus[data-focus-method='key']{
115
- -webkit-box-shadow:rgba(22,125,255,0.8) 0 0 0 4px;
116
- -webkit-box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(22,125,255,0.8)) 0 0 0 4px;
117
- box-shadow:rgba(22,125,255,0.8) 0 0 0 4px;
118
- box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(22,125,255,0.8)) 0 0 0 4px;
123
+ ._themeLight_165bbt6_17 ._option_165bbt6_33:focus[data-focus-method='key']{
124
+ -webkit-box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
125
+ -webkit-box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
126
+ box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
127
+ box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
119
128
  }
120
- ._themeLight_1jraics_17 ._option_1jraics_33._selected_1jraics_85:hover, ._themeLight_1jraics_17 ._option_1jraics_33._selected_1jraics_85:active{
129
+ ._themeLight_165bbt6_17 ._option_165bbt6_33._selected_165bbt6_85:hover, ._themeLight_165bbt6_17 ._option_165bbt6_33._selected_165bbt6_85:active{
121
130
  background:transparent;
122
131
  cursor:default;
123
132
  }
124
- ._themeLight_1jraics_17._modeClassic_1jraics_93 ._option_1jraics_33:hover{
125
- background:rgba(22,125,255,0.2);
126
- background:var(--rs-color-primary-t-fog-light-theme, rgba(22,125,255,0.2));
133
+ ._themeLight_165bbt6_17._modeClassic_165bbt6_93 ._option_165bbt6_33:hover{
134
+ background:rgba(107, 87, 255,0.2);
135
+ background:var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2));
127
136
  }
128
- ._themeLight_1jraics_17._modeRock_1jraics_99 ._option_1jraics_33:hover{
137
+ ._themeLight_165bbt6_17._modeRock_165bbt6_99 ._option_165bbt6_33:hover{
129
138
  background:rgba(25,25,28,0.1);
130
139
  }
131
- ._disabled_1jraics_72._themeLight_1jraics_17 ._option_1jraics_33,
132
- ._disabled_1jraics_72._themeLight_1jraics_17 ._option_1jraics_33._selected_1jraics_85{
140
+ ._disabled_165bbt6_72._themeLight_165bbt6_17 ._option_165bbt6_33,
141
+ ._disabled_165bbt6_72._themeLight_165bbt6_17 ._option_165bbt6_33._selected_165bbt6_85{
133
142
  color:rgba(25,25,28,0.4);
134
143
  }
135
- ._themeDark_1jraics_21 ._option_1jraics_33{
144
+ ._themeDark_165bbt6_21 ._option_165bbt6_33{
136
145
  color:#FFFFFF;
137
146
  }
138
- ._themeDark_1jraics_21 ._option_1jraics_33:hover{
147
+ ._themeDark_165bbt6_21 ._option_165bbt6_33:hover{
139
148
  background:rgba(255,255,255,0.1);
140
149
  }
141
- ._themeDark_1jraics_21 ._option_1jraics_33:focus[data-focus-method='key']{
142
- -webkit-box-shadow:rgba(76,166,255,0.8) 0 0 0 4px;
143
- -webkit-box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(76,166,255,0.8)) 0 0 0 4px;
144
- box-shadow:rgba(76,166,255,0.8) 0 0 0 4px;
145
- box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(76,166,255,0.8)) 0 0 0 4px;
150
+ ._themeDark_165bbt6_21 ._option_165bbt6_33:focus[data-focus-method='key']{
151
+ -webkit-box-shadow:rgba(132, 115, 255,0.8) 0 0 0 4px;
152
+ -webkit-box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) 0 0 0 4px;
153
+ box-shadow:rgba(132, 115, 255,0.8) 0 0 0 4px;
154
+ box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) 0 0 0 4px;
146
155
  }
147
- ._themeDark_1jraics_21 ._option_1jraics_33._selected_1jraics_85:hover, ._themeDark_1jraics_21 ._option_1jraics_33._selected_1jraics_85:active{
156
+ ._themeDark_165bbt6_21 ._option_165bbt6_33._selected_165bbt6_85:hover, ._themeDark_165bbt6_21 ._option_165bbt6_33._selected_165bbt6_85:active{
148
157
  background:transparent;
149
158
  cursor:default;
150
159
  }
151
- ._themeDark_1jraics_21._modeClassic_1jraics_93 ._option_1jraics_33:hover{
152
- background:rgba(76,166,255,0.3);
153
- background:var(--rs-color-primary-t-fog-dark-theme, rgba(76,166,255,0.3));
160
+ ._themeDark_165bbt6_21._modeClassic_165bbt6_93 ._option_165bbt6_33:hover{
161
+ background:rgba(132, 115, 255,0.3);
162
+ background:var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3));
154
163
  }
155
- ._themeDark_1jraics_21._modeRock_1jraics_99 ._option_1jraics_33:hover{
164
+ ._themeDark_165bbt6_21._modeRock_165bbt6_99 ._option_165bbt6_33:hover{
156
165
  background:rgba(255,255,255,0.1);
157
166
  }
158
- ._disabled_1jraics_72._themeDark_1jraics_21 ._option_1jraics_33,
159
- ._disabled_1jraics_72._themeDark_1jraics_21 ._option_1jraics_33._selected_1jraics_85{
167
+ ._disabled_165bbt6_72._themeDark_165bbt6_21 ._option_165bbt6_33,
168
+ ._disabled_165bbt6_72._themeDark_165bbt6_21 ._option_165bbt6_33._selected_165bbt6_85{
160
169
  color:rgba(255,255,255,0.2);
161
170
  }
162
- ._mark_1jraics_146{
171
+ ._mark_165bbt6_146{
163
172
  position:absolute;
164
173
  top:0;
165
174
  bottom:0;
@@ -167,34 +176,32 @@
167
176
  -webkit-box-sizing:border-box;
168
177
  box-sizing:border-box;
169
178
  border-radius:24px;
170
-
171
179
  -webkit-transition:all 0.3s;
172
-
173
180
  transition:all 0.3s;
174
181
  }
175
- ._themeLight_1jraics_17._modeClassic_1jraics_93 ._mark_1jraics_146{
176
- border:solid 2px #167DFF;
177
- border:solid 2px var(--rs-color-primary-light-theme, #167DFF);
182
+ ._themeLight_165bbt6_17._modeClassic_165bbt6_93 ._mark_165bbt6_146{
183
+ border:solid 2px #6B57FF;
184
+ border:solid 2px var(--rs-color-primary-light-theme, #6B57FF);
178
185
  }
179
- ._themeDark_1jraics_21._modeClassic_1jraics_93 ._mark_1jraics_146{
180
- border:solid 2px #4CA6ff;
181
- border:solid 2px var(--rs-color-primary-dark-theme, #4CA6ff);
186
+ ._themeDark_165bbt6_21._modeClassic_165bbt6_93 ._mark_165bbt6_146{
187
+ border:solid 2px #8473FF;
188
+ border:solid 2px var(--rs-color-primary-dark-theme, #8473FF);
182
189
  }
183
- ._themeLight_1jraics_17._modeRock_1jraics_99 ._mark_1jraics_146{
190
+ ._themeLight_165bbt6_17._modeRock_165bbt6_99 ._mark_165bbt6_146{
184
191
  border:solid 2px #19191C;
185
192
  }
186
- ._themeDark_1jraics_21._modeRock_1jraics_99 ._mark_1jraics_146{
193
+ ._themeDark_165bbt6_21._modeRock_165bbt6_99 ._mark_165bbt6_146{
187
194
  border:solid 2px #FFFFFF;
188
195
  }
189
- ._sizeL_1jraics_25 ._mark_1jraics_146{
196
+ ._sizeL_165bbt6_25 ._mark_165bbt6_146{
190
197
  border-radius:36px;
191
198
  }
192
- ._sizeXS_1jraics_29 ._mark_1jraics_146{
199
+ ._sizeXS_165bbt6_29 ._mark_165bbt6_146{
193
200
  border-radius:4px;
194
201
  }
195
- ._themeLight_1jraics_17._disabled_1jraics_72 ._mark_1jraics_146{
202
+ ._themeLight_165bbt6_17._disabled_165bbt6_72 ._mark_165bbt6_146{
196
203
  border:solid 2px rgba(25,25,28,0.4);
197
204
  }
198
- ._themeDark_1jraics_21._disabled_1jraics_72 ._mark_1jraics_146{
205
+ ._themeDark_165bbt6_21._disabled_165bbt6_72 ._mark_165bbt6_146{
199
206
  border:solid 2px rgba(255,255,255,0.2);
200
207
  }
package/lib/index.module.pcss.js CHANGED
@@ -1,16 +1,17 @@
1
1
  var styles = {
2
- "switcher": "_switcher_1jraics_4",
3
- "themeLight": "_themeLight_1jraics_17",
4
- "themeDark": "_themeDark_1jraics_21",
5
- "sizeL": "_sizeL_1jraics_25",
6
- "sizeXS": "_sizeXS_1jraics_29",
7
- "option": "_option_1jraics_33",
8
- "sizeM": "_sizeM_1jraics_56",
9
- "sizeS": "_sizeS_1jraics_61",
10
- "disabled": "_disabled_1jraics_72",
11
- "selected": "_selected_1jraics_85",
12
- "modeClassic": "_modeClassic_1jraics_93",
13
- "modeRock": "_modeRock_1jraics_99",
14
- "mark": "_mark_1jraics_146"
2
+ "switcher": "_switcher_165bbt6_4",
3
+ "themeLight": "_themeLight_165bbt6_17",
4
+ "themeDark": "_themeDark_165bbt6_21",
5
+ "sizeL": "_sizeL_165bbt6_25",
6
+ "sizeXS": "_sizeXS_165bbt6_29",
7
+ "option": "_option_165bbt6_33",
8
+ "sizeM": "_sizeM_165bbt6_56",
9
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_165bbt6_1",
10
+ "sizeS": "_sizeS_165bbt6_61",
11
+ "disabled": "_disabled_165bbt6_72",
12
+ "selected": "_selected_165bbt6_85",
13
+ "modeClassic": "_modeClassic_165bbt6_93",
14
+ "modeRock": "_modeRock_165bbt6_99",
15
+ "mark": "_mark_165bbt6_146"
15
16
  };
16
17
  export default styles;
package/lib/switcher.js CHANGED
@@ -1,7 +1,8 @@
1
+ import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
1
2
  import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
2
3
  import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find-index";
3
4
  import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
4
- import React, { useRef, useMemo, useCallback } from 'react';
5
+ import React, { useState, useRef, useMemo, useCallback } from 'react';
5
6
  import PropTypes from 'prop-types';
6
7
  import { useResizeDetector } from 'react-resize-detector';
7
8
  import cn from 'classnames';
@@ -68,14 +69,18 @@ var Switcher = function Switcher(_ref2) {
68
69
  _ref2$mode = _ref2.mode,
69
70
  mode = _ref2$mode === void 0 ? 'classic' : _ref2$mode,
70
71
  onChange = _ref2.onChange;
72
+
73
+ var _useState = useState(false),
74
+ _useState2 = _slicedToArray(_useState, 2),
75
+ setDummyState = _useState2[1];
76
+
71
77
  var refsArray = useRef([]);
72
78
  var theme = useTheme(themeFromProps);
73
79
 
74
80
  var _useResizeDetector = useResizeDetector({
75
81
  handleHeight: false
76
82
  }),
77
- resizeDetectorRef = _useResizeDetector.ref,
78
- switcherWidth = _useResizeDetector.width;
83
+ resizeDetectorRef = _useResizeDetector.ref;
79
84
 
80
85
  var optionsHash = hashOptions(options);
81
86
  var memoizedOptions = useMemo(function () {
@@ -83,24 +88,34 @@ var Switcher = function Switcher(_ref2) {
83
88
  }, [optionsHash]);
84
89
  var handleOptionRef = useCallback(function (index) {
85
90
  return function (ref) {
86
- refsArray.current[index] = ref;
91
+ if (!ref) {
92
+ return;
93
+ }
94
+
95
+ if (refsArray.current[index] !== ref) {
96
+ refsArray.current[index] = ref; // force rerender
97
+
98
+ setDummyState(function (s) {
99
+ return !s;
100
+ });
101
+ }
87
102
  };
88
103
  }, []);
89
- var offsetAndWidth = useMemo(function () {
90
- if (refsArray.current.length === memoizedOptions.length && refsArray.current.every(Boolean)) {
91
- var activeIndex = findIndexByValue(memoizedOptions, switcherValue);
92
- var activeRef = refsArray.current[activeIndex];
93
- var offset = activeRef.offsetLeft;
94
- var width = activeRef.getBoundingClientRect().width;
95
- return [offset, width];
96
- } else {
97
- return [0, 0];
98
- }
99
- }, [memoizedOptions, switcherValue, switcherWidth]);
104
+ var activeIndex = findIndexByValue(memoizedOptions, switcherValue);
105
+ var activeRef = refsArray.current[activeIndex];
106
+ var markOffset = 0;
107
+ var markWidth = 0;
108
+
109
+ if (activeRef) {
110
+ markOffset = activeRef.offsetLeft;
111
+ markWidth = activeRef.getBoundingClientRect().width;
112
+ }
113
+
100
114
  return /*#__PURE__*/React.createElement("span", {
101
115
  ref: resizeDetectorRef,
102
116
  className: cn(className, styles.switcher, sizeToClass[size], themeToClass[theme], modeToClass[mode], disabled && styles.disabled),
103
- "data-e2e": e2eId
117
+ "data-e2e": e2eId,
118
+ "data-test": "switcher".concat(disabled ? '-disabled' : '')
104
119
  }, _mapInstanceProperty(memoizedOptions).call(memoizedOptions, function (_ref3, index) {
105
120
  var value = _ref3.value,
106
121
  label = _ref3.label;
@@ -116,10 +131,10 @@ var Switcher = function Switcher(_ref2) {
116
131
  selected: switcherValue === value
117
132
  });
118
133
  }), /*#__PURE__*/React.createElement("span", {
119
- className: styles.mark,
134
+ className: cn(styles.mark),
120
135
  style: {
121
- left: offsetAndWidth[0],
122
- width: offsetAndWidth[1]
136
+ left: markOffset,
137
+ width: markWidth
123
138
  }
124
139
  }));
125
140
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/switcher",
3
- "version": "0.1.1",
3
+ "version": "0.1.5",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -26,12 +26,12 @@
26
26
  "react": ">=16.8.0 <18"
27
27
  },
28
28
  "devDependencies": {
29
- "@rescui/colors": "^0.0.4",
30
- "@rescui/scripts": "^0.1.2",
31
- "@rescui/typography": "^0.2.1"
29
+ "@rescui/colors": "^0.1.0",
30
+ "@rescui/scripts": "^0.1.4",
31
+ "@rescui/typography": "^0.5.1"
32
32
  },
33
33
  "scripts": {
34
34
  "build": "rescui-scripts build"
35
35
  },
36
- "gitHead": "66df4ba6f30f960f8d9a77db3ef079f8b0ad40ca"
36
+ "gitHead": "24a3fbe87179468f1dc804374864b21042fa2dbe"
37
37
  }