@rescui/menu 0.2.2 → 0.5.0

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 (8) hide show
  1. package/lib/index.css +114 -200
  2. package/lib/index.module.pcss.js +23 -22
  3. package/lib/menu.js +5 -1
  4. package/lib/parts/menu-context.d.ts +1 -0
  5. package/lib/parts/menu-context.js +1 -0
  6. package/lib/parts/menu-item.d.ts +1 -0
  7. package/lib/parts/menu-item.js +6 -3
  8. package/package.json +3 -3
package/lib/index.css CHANGED
@@ -1,52 +1,50 @@
1
- ._menuItem_in4tum_9{
1
+ ._menuItem_mt4uu8_9{
2
2
  display:-webkit-box;
3
3
  display:-ms-flexbox;
4
4
  display:flex;
5
5
  outline:none;
6
6
  cursor:pointer;
7
7
  }
8
- ._content_in4tum_15{
8
+ ._content_mt4uu8_15{
9
9
  -webkit-box-flex:1;
10
10
  -ms-flex-positive:1;
11
11
  flex-grow:1;
12
12
  font-size:inherit;
13
13
  }
14
- ._placementRight_in4tum_20{
14
+ ._placementRight_mt4uu8_20{
15
15
  -webkit-box-pack:justify;
16
16
  -ms-flex-pack:justify;
17
17
  justify-content:space-between;
18
18
  }
19
- ._sizeS_in4tum_25{
19
+ ._sizeS_mt4uu8_25{
20
20
  padding: 6px 8px;
21
21
  }
22
- ._sizeM_in4tum_29{
22
+ ._sizeM_mt4uu8_29{
23
23
  padding: 8px 16px;
24
24
  }
25
- ._sizeL_in4tum_33{
25
+ ._sizeL_mt4uu8_33{
26
26
  padding: 12px 16px;
27
27
  }
28
- ._modeClear_in4tum_37._sizeS_in4tum_25,
29
- ._modeClear_in4tum_37._sizeM_in4tum_29,
30
- ._modeClear_in4tum_37._sizeL_in4tum_33{
28
+ ._modeClear_mt4uu8_37._sizeS_mt4uu8_25,
29
+ ._modeClear_mt4uu8_37._sizeM_mt4uu8_29,
30
+ ._modeClear_mt4uu8_37._sizeL_mt4uu8_33{
31
31
  padding-left:0;
32
32
  padding-right:0;
33
33
  }
34
- ._themeLight_in4tum_45:focus[data-focus-method='key']{
34
+ ._themeLight_mt4uu8_45:focus[data-focus-method='key']{
35
35
  -webkit-box-shadow:#8979ff 0 0 0 4px;
36
36
  -webkit-box-shadow:var(--rs-color-primary-dim-light-theme, #8979ff) 0 0 0 4px;
37
37
  box-shadow:#8979ff 0 0 0 4px;
38
38
  box-shadow:var(--rs-color-primary-dim-light-theme, #8979ff) 0 0 0 4px;
39
39
  }
40
- ._themeDark_in4tum_51:focus[data-focus-method='key']{
40
+ ._themeDark_mt4uu8_51:focus[data-focus-method='key']{
41
41
  -webkit-box-shadow:#6f61d2 0 0 0 4px;
42
42
  -webkit-box-shadow:var(--rs-color-primary-dim-dark-theme, #6f61d2) 0 0 0 4px;
43
43
  box-shadow:#6f61d2 0 0 0 4px;
44
44
  box-shadow:var(--rs-color-primary-dim-dark-theme, #6f61d2) 0 0 0 4px;
45
45
  }
46
- ._sizeS_in4tum_25._themeLight_in4tum_45{
46
+ ._sizeS_mt4uu8_25{
47
47
  letter-spacing:0.0045em;
48
- color:rgba(25,25,28,0.7);
49
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
50
48
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
51
49
  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));
52
50
  font-size:13px;
@@ -54,13 +52,11 @@
54
52
  line-height:20px;
55
53
  line-height:var(--rs-text-3-line-height, 20px);
56
54
  }
57
- ._rs-reset-letter-spacing_in4tum_1 ._sizeS_in4tum_25._themeLight_in4tum_45{
55
+ ._rs-reset-letter-spacing_mt4uu8_1 ._sizeS_mt4uu8_25{
58
56
  letter-spacing:normal;
59
57
  }
60
- ._sizeM_in4tum_29._themeLight_in4tum_45{
58
+ ._sizeM_mt4uu8_29{
61
59
  letter-spacing:0.0015em;
62
- color:rgba(25,25,28,0.7);
63
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
64
60
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
65
61
  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));
66
62
  font-size:16px;
@@ -69,12 +65,10 @@
69
65
  line-height:24px;
70
66
  line-height:var(--rs-text-2-line-height, 24px);
71
67
  }
72
- ._rs-reset-letter-spacing_in4tum_1 ._sizeM_in4tum_29._themeLight_in4tum_45{
68
+ ._rs-reset-letter-spacing_mt4uu8_1 ._sizeM_mt4uu8_29{
73
69
  letter-spacing:normal;
74
70
  }
75
- ._sizeL_in4tum_33._themeLight_in4tum_45{
76
- color:rgba(25,25,28,0.7);
77
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
71
+ ._sizeL_mt4uu8_33{
78
72
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
79
73
  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));
80
74
  font-size:19px;
@@ -83,157 +77,136 @@
83
77
  line-height:28px;
84
78
  line-height:var(--rs-text-1-line-height, 28px);
85
79
  }
86
- ._sizeS_in4tum_25._themeDark_in4tum_51{
87
- letter-spacing:0.0045em;
80
+ ._themeLight_mt4uu8_45{
88
81
  color:rgba(25,25,28,0.7);
89
82
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
90
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
91
- 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));
92
- font-size:13px;
93
- font-size:var(--rs-text-3-font-size, 13px);
94
- line-height:20px;
95
- line-height:var(--rs-text-3-line-height, 20px);
96
83
  }
97
- ._rs-reset-letter-spacing_in4tum_1 ._sizeS_in4tum_25._themeDark_in4tum_51{
98
- letter-spacing:normal;
99
- }
100
- ._sizeS_in4tum_25._themeDark_in4tum_51 {
84
+ ._themeDark_mt4uu8_51{
101
85
  color:rgba(255,255,255,0.7);
102
86
  color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
103
87
  }
104
- ._sizeM_in4tum_29._themeDark_in4tum_51{
105
- letter-spacing:0.0015em;
106
- color:rgba(25,25,28,0.7);
107
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
108
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
109
- 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));
110
- font-size:16px;
111
- font-size:var(--rs-text-2-font-size, 16px);
112
- font-weight:400;
113
- line-height:24px;
114
- line-height:var(--rs-text-2-line-height, 24px);
115
- }
116
- ._rs-reset-letter-spacing_in4tum_1 ._sizeM_in4tum_29._themeDark_in4tum_51{
117
- letter-spacing:normal;
118
- }
119
- ._sizeM_in4tum_29._themeDark_in4tum_51 {
120
- color:rgba(255,255,255,0.7);
121
- color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
122
- }
123
- ._sizeL_in4tum_33._themeDark_in4tum_51{
124
- color:rgba(25,25,28,0.7);
125
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
126
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
127
- 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));
128
- font-size:19px;
129
- font-size:var(--rs-text-1-font-size, 19px);
130
- font-weight:normal;
131
- line-height:28px;
132
- line-height:var(--rs-text-1-line-height, 28px);
133
- color:rgba(255,255,255,0.7);
134
- color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
135
- }
136
- ._modeClassic_in4tum_87._themeLight_in4tum_45:active{
88
+ ._modeClassic_mt4uu8_79._themeLight_mt4uu8_45:active{
137
89
  color:#19191C;
90
+ color:var(--rs-typography-color-hard, #19191C);
138
91
  background-color:rgba(107, 87, 255,0.2);
139
92
  background-color:var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2));
140
93
  }
141
- ._modeClassic_in4tum_87._themeDark_in4tum_51:active{
94
+ ._modeClassic_mt4uu8_79._themeDark_mt4uu8_51:active{
142
95
  color:#FFFFFF;
96
+ color:var(--rs-typography-color-hard, #FFFFFF);
143
97
  background-color:rgba(132, 115, 255,0.3);
144
98
  background-color:var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3));
145
99
  }
146
- ._modeClassic_in4tum_87._themeLight_in4tum_45._selected_in4tum_99{
100
+ ._modeClassic_mt4uu8_79._themeLight_mt4uu8_45._selected_mt4uu8_91{
147
101
  color:#FFFFFF;
102
+ color:var(--rs-typography-color-hard, #FFFFFF);
148
103
  background-color:#19191C;
149
104
  }
150
- ._modeClassic_in4tum_87._themeDark_in4tum_51._selected_in4tum_99{
105
+ ._modeClassic_mt4uu8_79._themeDark_mt4uu8_51._selected_mt4uu8_91{
151
106
  color:#19191C;
107
+ color:var(--rs-typography-color-hard, #19191C);
152
108
  background-color:#FFFFFF;
153
109
  }
154
- ._modeRock_in4tum_109._themeLight_in4tum_45._selected_in4tum_99{
110
+ ._modeRock_mt4uu8_101._themeLight_mt4uu8_45._selected_mt4uu8_91{
155
111
  color:#FFFFFF;
112
+ color:var(--rs-typography-color-hard, #FFFFFF);
156
113
  background-color:#19191C;
157
114
  }
158
- ._modeRock_in4tum_109._themeDark_in4tum_51._selected_in4tum_99{
115
+ ._modeRock_mt4uu8_101._themeDark_mt4uu8_51._selected_mt4uu8_91{
159
116
  color:#19191C;
117
+ color:var(--rs-typography-color-hard, #19191C);
160
118
  background-color:#FFFFFF;
161
119
  }
162
- ._modeClear_in4tum_37._themeLight_in4tum_45._selected_in4tum_99{
120
+ ._modeClear_mt4uu8_37._themeLight_mt4uu8_45._selected_mt4uu8_91{
163
121
  color:#6B57FF;
164
122
  color:var(--rs-color-primary-light-theme, #6B57FF);
165
123
  }
166
- ._modeClear_in4tum_37._themeDark_in4tum_51._selected_in4tum_99{
124
+ ._modeClear_mt4uu8_37._themeDark_mt4uu8_51._selected_mt4uu8_91{
167
125
  color:#8473FF;
168
126
  color:var(--rs-color-primary-dark-theme, #8473FF);
169
127
  }
170
- ._modeClassic_in4tum_87._themeLight_in4tum_45._highlighted_in4tum_129,
171
- ._modeClassic_in4tum_87._themeLight_in4tum_45:hover{
128
+ ._disableCursor_mt4uu8_121{
129
+ pointer-events:none;
130
+ }
131
+ ._modeClassic_mt4uu8_79._themeLight_mt4uu8_45._highlighted_mt4uu8_125,
132
+ ._modeClassic_mt4uu8_79._themeLight_mt4uu8_45:not(._disableCursor_mt4uu8_121):hover{
172
133
  color:#19191C;
134
+ color:var(--rs-typography-color-hard, #19191C);
173
135
  background-color:rgba(25,25,28,0.1);
174
136
  }
175
- ._modeRock_in4tum_109._themeLight_in4tum_45._highlighted_in4tum_129,
176
- ._modeRock_in4tum_109._themeLight_in4tum_45:hover{
137
+ ._modeRock_mt4uu8_101._themeLight_mt4uu8_45._highlighted_mt4uu8_125,
138
+ ._modeRock_mt4uu8_101._themeLight_mt4uu8_45:not(._disableCursor_mt4uu8_121):hover{
177
139
  color:#FFFFFF;
140
+ color:var(--rs-typography-color-hard, #FFFFFF);
178
141
  background-color:#6B57FF;
179
142
  background-color:var(--rs-color-primary-light-theme, #6B57FF);
180
143
  }
181
- ._modeClassic_in4tum_87._themeDark_in4tum_51._highlighted_in4tum_129,
182
- ._modeClassic_in4tum_87._themeDark_in4tum_51:hover{
144
+ ._modeClassic_mt4uu8_79._themeDark_mt4uu8_51._highlighted_mt4uu8_125,
145
+ ._modeClassic_mt4uu8_79._themeDark_mt4uu8_51:not(._disableCursor_mt4uu8_121):hover{
183
146
  color:#FFFFFF;
147
+ color:var(--rs-typography-color-hard, #FFFFFF);
184
148
  background-color:rgba(255,255,255,0.1);
185
149
  }
186
- ._modeRock_in4tum_109._themeDark_in4tum_51._highlighted_in4tum_129,
187
- ._modeRock_in4tum_109._themeDark_in4tum_51:hover{
150
+ ._modeRock_mt4uu8_101._themeDark_mt4uu8_51._highlighted_mt4uu8_125,
151
+ ._modeRock_mt4uu8_101._themeDark_mt4uu8_51:not(._disableCursor_mt4uu8_121):hover{
188
152
  color:#FFFFFF;
153
+ color:var(--rs-typography-color-hard, #FFFFFF);
189
154
  background-color:#8473FF;
190
155
  background-color:var(--rs-color-primary-dark-theme, #8473FF);
191
156
  }
192
- ._modeClear_in4tum_37._themeLight_in4tum_45._highlighted_in4tum_129,
193
- ._modeClear_in4tum_37._themeLight_in4tum_45:hover{
157
+ ._modeClear_mt4uu8_37._themeLight_mt4uu8_45._highlighted_mt4uu8_125,
158
+ ._modeClear_mt4uu8_37._themeLight_mt4uu8_45:not(._disableCursor_mt4uu8_121):hover{
194
159
  color:#19191C;
160
+ color:var(--rs-typography-color-hard, #19191C);
195
161
  }
196
- ._modeClear_in4tum_37._themeDark_in4tum_51._highlighted_in4tum_129,
197
- ._modeClear_in4tum_37._themeDark_in4tum_51:hover{
162
+ ._modeClear_mt4uu8_37._themeDark_mt4uu8_51._highlighted_mt4uu8_125,
163
+ ._modeClear_mt4uu8_37._themeDark_mt4uu8_51:not(._disableCursor_mt4uu8_121):hover{
198
164
  color:#FFFFFF;
165
+ color:var(--rs-typography-color-hard, #FFFFFF);
199
166
  }
200
- ._modeClassic_in4tum_87._themeLight_in4tum_45._highlighted_in4tum_129._selected_in4tum_99,
201
- ._modeClassic_in4tum_87._themeLight_in4tum_45._selected_in4tum_99:hover{
167
+ ._modeClassic_mt4uu8_79._themeLight_mt4uu8_45._highlighted_mt4uu8_125._selected_mt4uu8_91,
168
+ ._modeClassic_mt4uu8_79._themeLight_mt4uu8_45._selected_mt4uu8_91:not(._disableCursor_mt4uu8_121):hover{
202
169
  background-color:#303033;
203
170
  color:#FFFFFF;
171
+ color:var(--rs-typography-color-hard, #FFFFFF);
204
172
  }
205
- ._modeRock_in4tum_109._themeLight_in4tum_45._highlighted_in4tum_129._selected_in4tum_99,
206
- ._modeRock_in4tum_109._themeLight_in4tum_45._selected_in4tum_99:hover{
173
+ ._modeRock_mt4uu8_101._themeLight_mt4uu8_45._highlighted_mt4uu8_125._selected_mt4uu8_91,
174
+ ._modeRock_mt4uu8_101._themeLight_mt4uu8_45._selected_mt4uu8_91:not(._disableCursor_mt4uu8_121):hover{
207
175
  background-color:#303033;
208
176
  color:#FFFFFF;
177
+ color:var(--rs-typography-color-hard, #FFFFFF);
209
178
  }
210
- ._modeClassic_in4tum_87._themeDark_in4tum_51._highlighted_in4tum_129._selected_in4tum_99,
211
- ._modeClassic_in4tum_87._themeDark_in4tum_51._selected_in4tum_99:hover{
179
+ ._modeClassic_mt4uu8_79._themeDark_mt4uu8_51._highlighted_mt4uu8_125._selected_mt4uu8_91,
180
+ ._modeClassic_mt4uu8_79._themeDark_mt4uu8_51._selected_mt4uu8_91:not(._disableCursor_mt4uu8_121):hover{
212
181
  background-color:#E8E8E8;
213
182
  color:#19191C;
183
+ color:var(--rs-typography-color-hard, #19191C);
214
184
  }
215
- ._modeRock_in4tum_109._themeDark_in4tum_51._highlighted_in4tum_129._selected_in4tum_99,
216
- ._modeRock_in4tum_109._themeDark_in4tum_51._selected_in4tum_99:hover{
185
+ ._modeRock_mt4uu8_101._themeDark_mt4uu8_51._highlighted_mt4uu8_125._selected_mt4uu8_91,
186
+ ._modeRock_mt4uu8_101._themeDark_mt4uu8_51._selected_mt4uu8_91:not(._disableCursor_mt4uu8_121):hover{
217
187
  background-color:#E8E8E8;
218
188
  color:#19191C;
189
+ color:var(--rs-typography-color-hard, #19191C);
219
190
  }
220
- ._modeClear_in4tum_37._themeLight_in4tum_45._highlighted_in4tum_129._selected_in4tum_99,
221
- ._modeClear_in4tum_37._themeLight_in4tum_45._selected_in4tum_99:hover{
191
+ ._modeClear_mt4uu8_37._themeLight_mt4uu8_45._highlighted_mt4uu8_125._selected_mt4uu8_91,
192
+ ._modeClear_mt4uu8_37._themeLight_mt4uu8_45._selected_mt4uu8_91:not(._disableCursor_mt4uu8_121):hover{
222
193
  background-color:rgba(25,25,28,0.1);
223
194
  }
224
- ._modeClear_in4tum_37._themeDark_in4tum_51._highlighted_in4tum_129._selected_in4tum_99,
225
- ._modeClear_in4tum_37._themeDark_in4tum_51._selected_in4tum_99:hover{
195
+ ._modeClear_mt4uu8_37._themeDark_mt4uu8_51._highlighted_mt4uu8_125._selected_mt4uu8_91,
196
+ ._modeClear_mt4uu8_37._themeDark_mt4uu8_51._selected_mt4uu8_91:not(._disableCursor_mt4uu8_121):hover{
226
197
  background-color:rgba(255,255,255,0.1);
227
198
  }
228
- ._menuItem_in4tum_9._themeLight_in4tum_45._disabled_in4tum_201{
199
+ ._menuItem_mt4uu8_9._themeLight_mt4uu8_45._disabled_mt4uu8_197{
229
200
  pointer-events:none;
230
- color:rgba(25,25,28,0.4);
201
+ color:rgba(25,25,28,0.5);
202
+ color:var(--rs-typography-color-pale, rgba(25,25,28,0.5));
231
203
  }
232
- ._menuItem_in4tum_9._themeDark_in4tum_51._disabled_in4tum_201{
204
+ ._menuItem_mt4uu8_9._themeDark_mt4uu8_51._disabled_mt4uu8_197{
233
205
  pointer-events:none;
234
- color:rgba(255,255,255,0.3);
206
+ color:rgba(255,255,255,0.5);
207
+ color:var(--rs-typography-color-pale, rgba(255,255,255,0.5));
235
208
  }
236
- ._icon_in4tum_212{
209
+ ._icon_mt4uu8_208{
237
210
  -webkit-box-flex:0;
238
211
  -ms-flex:0 0;
239
212
  flex:0 0;
@@ -241,25 +214,25 @@
241
214
  flex-basis:auto;
242
215
 
243
216
  }
244
- ._sizeS_in4tum_25._placementLeft_in4tum_216 ._icon_in4tum_212{
217
+ ._sizeS_mt4uu8_25._placementLeft_mt4uu8_212 ._icon_mt4uu8_208{
245
218
  margin-right:8px;
246
219
  }
247
- ._sizeS_in4tum_25._placementRight_in4tum_20 ._icon_in4tum_212{
220
+ ._sizeS_mt4uu8_25._placementRight_mt4uu8_20 ._icon_mt4uu8_208{
248
221
  margin-left:8px;
249
222
  }
250
- ._sizeM_in4tum_29._placementLeft_in4tum_216 ._icon_in4tum_212{
223
+ ._sizeM_mt4uu8_29._placementLeft_mt4uu8_212 ._icon_mt4uu8_208{
251
224
  margin-right:8px;
252
225
  }
253
- ._sizeM_in4tum_29._placementRight_in4tum_20 ._icon_in4tum_212{
226
+ ._sizeM_mt4uu8_29._placementRight_mt4uu8_20 ._icon_mt4uu8_208{
254
227
  margin-left:8px;
255
228
  }
256
- ._sizeL_in4tum_33._placementLeft_in4tum_216 ._icon_in4tum_212{
229
+ ._sizeL_mt4uu8_33._placementLeft_mt4uu8_212 ._icon_mt4uu8_208{
257
230
  margin-right:16px;
258
231
  }
259
- ._sizeL_in4tum_33._placementRight_in4tum_20 ._icon_in4tum_212{
232
+ ._sizeL_mt4uu8_33._placementRight_mt4uu8_20 ._icon_mt4uu8_208{
260
233
  margin-left:16px;
261
234
  }
262
- ._divider_in4tum_242{
235
+ ._divider_mt4uu8_238{
263
236
  width:100%;
264
237
  border:none;
265
238
  height:1px;
@@ -267,114 +240,55 @@
267
240
  -ms-flex-negative:0;
268
241
  flex-shrink:0;
269
242
  }
270
- ._divider_in4tum_242._themeLight_in4tum_45{
243
+ ._divider_mt4uu8_238._themeLight_mt4uu8_45{
271
244
  background-color:rgba(25,25,28,0.2);
272
245
  }
273
- ._divider_in4tum_242._themeDark_in4tum_51{
246
+ ._divider_mt4uu8_238._themeDark_mt4uu8_51{
274
247
  background-color:rgba(255,255,255,0.2);
275
248
  }
276
- ._groupHeader_in4tum_258{
249
+ ._groupHeader_mt4uu8_254{
277
250
  border:none;
278
- text-transform:uppercase;
279
- }
280
- ._groupHeaderSizeS_in4tum_264{
281
- padding: 6px 8px;
282
- padding-top:8px;
283
- padding-bottom:4px;
284
- }
285
- ._groupHeaderSizeM_in4tum_271{
286
- padding: 8px 16px;
287
- padding-top:10px;
288
- padding-bottom:6px;
289
- }
290
- ._groupHeaderSizeL_in4tum_277._themeLight_in4tum_45{
291
- color:rgba(25,25,28,0.7);
292
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
293
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
294
- 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));
295
- font-size:19px;
296
- font-size:var(--rs-text-1-font-size, 19px);
297
- font-weight:normal;
298
- line-height:28px;
299
- line-height:var(--rs-text-1-line-height, 28px);
300
251
  }
301
- ._groupHeaderSizeL_in4tum_277._themeDark_in4tum_51{
302
- color:rgba(25,25,28,0.7);
303
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
252
+ ._groupHeaderSizeL_mt4uu8_258{
253
+ padding: 12px 16px;
254
+ letter-spacing:normal;
304
255
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
305
256
  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));
306
- font-size:19px;
307
- font-size:var(--rs-text-1-font-size, 19px);
308
- font-weight:normal;
257
+ font-size:20px;
258
+ font-size:var(--rs-h3-font-size, 20px);
259
+ font-weight:530;
260
+ font-weight:var(--rs-font-weight-semi-bold, 530);
309
261
  line-height:28px;
310
- line-height:var(--rs-text-1-line-height, 28px);
311
- color:rgba(255,255,255,0.7);
312
- color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
313
- }
314
- ._groupHeaderSizeM_in4tum_271._themeLight_in4tum_45{
315
- letter-spacing:0.0015em;
316
- color:rgba(25,25,28,0.7);
317
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
318
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
319
- 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));
320
- font-size:16px;
321
- font-size:var(--rs-text-2-font-size, 16px);
322
- font-weight:400;
323
- line-height:24px;
324
- line-height:var(--rs-text-2-line-height, 24px);
262
+ line-height:var(--rs-h3-line-height, 28px);
325
263
  }
326
- ._rs-reset-letter-spacing_in4tum_1 ._groupHeaderSizeM_in4tum_271._themeLight_in4tum_45{
327
- letter-spacing:normal;
328
- }
329
- ._groupHeaderSizeM_in4tum_271._themeDark_in4tum_51{
330
- letter-spacing:0.0015em;
331
- color:rgba(25,25,28,0.7);
332
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
264
+ ._groupHeaderSizeM_mt4uu8_263{
265
+ padding: 8px 16px;
333
266
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
334
267
  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));
335
- font-size:16px;
336
- font-size:var(--rs-text-2-font-size, 16px);
337
- font-weight:400;
268
+ font-size:17px;
269
+ font-size:var(--rs-h4-font-size, 17px);
270
+ font-weight:530;
271
+ font-weight:var(--rs-font-weight-semi-bold, 530);
338
272
  line-height:24px;
339
- line-height:var(--rs-text-2-line-height, 24px);
273
+ line-height:var(--rs-h4-line-height, 24px);
340
274
  }
341
- ._rs-reset-letter-spacing_in4tum_1 ._groupHeaderSizeM_in4tum_271._themeDark_in4tum_51{
342
- letter-spacing:normal;
343
- }
344
- ._groupHeaderSizeM_in4tum_271._themeDark_in4tum_51 {
345
- color:rgba(255,255,255,0.7);
346
- color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
347
- }
348
- ._groupHeaderSizeS_in4tum_264._themeLight_in4tum_45{
349
- letter-spacing:0.0045em;
350
- color:rgba(25,25,28,0.7);
351
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
275
+ ._groupHeaderSizeS_mt4uu8_268{
276
+ padding: 6px 8px;
352
277
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
353
278
  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));
354
- font-size:13px;
355
- font-size:var(--rs-text-3-font-size, 13px);
279
+ font-size:14px;
280
+ font-size:var(--rs-h5-font-size, 14px);
281
+ font-weight:530;
282
+ font-weight:var(--rs-font-weight-semi-bold, 530);
356
283
  line-height:20px;
357
- line-height:var(--rs-text-3-line-height, 20px);
284
+ line-height:var(--rs-h5-line-height, 20px);
358
285
  }
359
- ._rs-reset-letter-spacing_in4tum_1 ._groupHeaderSizeS_in4tum_264._themeLight_in4tum_45{
360
- letter-spacing:normal;
361
- }
362
- ._groupHeaderSizeS_in4tum_264._themeDark_in4tum_51{
363
- letter-spacing:0.0045em;
364
- color:rgba(25,25,28,0.7);
365
- color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
366
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
367
- 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));
368
- font-size:13px;
369
- font-size:var(--rs-text-3-font-size, 13px);
370
- line-height:20px;
371
- line-height:var(--rs-text-3-line-height, 20px);
286
+ ._themeLight_mt4uu8_45{
287
+ color:#19191C;
288
+ color:var(--rs-typography-color-hard, #19191C);
372
289
  }
373
- ._rs-reset-letter-spacing_in4tum_1 ._groupHeaderSizeS_in4tum_264._themeDark_in4tum_51{
374
- letter-spacing:normal;
375
- }
376
- ._groupHeaderSizeS_in4tum_264._themeDark_in4tum_51 {
377
- color:rgba(255,255,255,0.7);
378
- color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
290
+ ._themeDark_mt4uu8_51{
291
+ color:#FFFFFF;
292
+ color:var(--rs-typography-color-hard, #FFFFFF);
379
293
  }
380
294
 
package/lib/index.module.pcss.js CHANGED
@@ -1,25 +1,26 @@
1
1
  var styles = {
2
- "menuItem": "_menuItem_in4tum_9",
3
- "content": "_content_in4tum_15",
4
- "placementRight": "_placementRight_in4tum_20",
5
- "sizeS": "_sizeS_in4tum_25",
6
- "sizeM": "_sizeM_in4tum_29",
7
- "sizeL": "_sizeL_in4tum_33",
8
- "modeClear": "_modeClear_in4tum_37",
9
- "themeLight": "_themeLight_in4tum_45",
10
- "themeDark": "_themeDark_in4tum_51",
11
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_in4tum_1",
12
- "modeClassic": "_modeClassic_in4tum_87",
13
- "selected": "_selected_in4tum_99",
14
- "modeRock": "_modeRock_in4tum_109",
15
- "highlighted": "_highlighted_in4tum_129",
16
- "disabled": "_disabled_in4tum_201",
17
- "icon": "_icon_in4tum_212",
18
- "placementLeft": "_placementLeft_in4tum_216",
19
- "divider": "_divider_in4tum_242",
20
- "groupHeader": "_groupHeader_in4tum_258",
21
- "groupHeaderSizeS": "_groupHeaderSizeS_in4tum_264",
22
- "groupHeaderSizeM": "_groupHeaderSizeM_in4tum_271",
23
- "groupHeaderSizeL": "_groupHeaderSizeL_in4tum_277"
2
+ "menuItem": "_menuItem_mt4uu8_9",
3
+ "content": "_content_mt4uu8_15",
4
+ "placementRight": "_placementRight_mt4uu8_20",
5
+ "sizeS": "_sizeS_mt4uu8_25",
6
+ "sizeM": "_sizeM_mt4uu8_29",
7
+ "sizeL": "_sizeL_mt4uu8_33",
8
+ "modeClear": "_modeClear_mt4uu8_37",
9
+ "themeLight": "_themeLight_mt4uu8_45",
10
+ "themeDark": "_themeDark_mt4uu8_51",
11
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_mt4uu8_1",
12
+ "modeClassic": "_modeClassic_mt4uu8_79",
13
+ "selected": "_selected_mt4uu8_91",
14
+ "modeRock": "_modeRock_mt4uu8_101",
15
+ "disableCursor": "_disableCursor_mt4uu8_121",
16
+ "highlighted": "_highlighted_mt4uu8_125",
17
+ "disabled": "_disabled_mt4uu8_197",
18
+ "icon": "_icon_mt4uu8_208",
19
+ "placementLeft": "_placementLeft_mt4uu8_212",
20
+ "divider": "_divider_mt4uu8_238",
21
+ "groupHeader": "_groupHeader_mt4uu8_254",
22
+ "groupHeaderSizeL": "_groupHeaderSizeL_mt4uu8_258",
23
+ "groupHeaderSizeM": "_groupHeaderSizeM_mt4uu8_263",
24
+ "groupHeaderSizeS": "_groupHeaderSizeS_mt4uu8_268"
24
25
  };
25
26
  export default styles;
package/lib/menu.js CHANGED
@@ -6,7 +6,7 @@ import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-sta
6
6
  import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
7
7
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
8
8
  import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
9
- var _excluded = ["tag", "itemTag", "iconPlacement", "disabled", "size", "mode", "theme"];
9
+ var _excluded = ["tag", "itemTag", "iconPlacement", "disabled", "size", "mode", "disableCursor", "theme"];
10
10
 
11
11
  function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
12
12
 
@@ -27,6 +27,8 @@ var Menu = function Menu(_ref) {
27
27
  _ref$size = _ref.size,
28
28
  size = _ref$size === void 0 ? 'm' : _ref$size,
29
29
  mode = _ref.mode,
30
+ _ref$disableCursor = _ref.disableCursor,
31
+ disableCursor = _ref$disableCursor === void 0 ? false : _ref$disableCursor,
30
32
  theme = _ref.theme,
31
33
  restProps = _objectWithoutProperties(_ref, _excluded);
32
34
 
@@ -36,6 +38,7 @@ var Menu = function Menu(_ref) {
36
38
  iconPlacement: iconPlacement,
37
39
  disabled: disabled,
38
40
  size: size,
41
+ disableCursor: disableCursor,
39
42
  mode: mode,
40
43
  theme: theme
41
44
  }, /*#__PURE__*/React.createElement(Tag, _objectSpread({}, restProps)));
@@ -45,6 +48,7 @@ Menu.propTypes = {
45
48
  size: PropTypes.oneOf(['l', 'm', 's']),
46
49
  mode: PropTypes.oneOf(['clear', 'classic', 'rock']),
47
50
  theme: PropTypes.oneOf(['light', 'dark']),
51
+ disableCursor: PropTypes.bool,
48
52
  disabled: PropTypes.bool,
49
53
  iconPlacement: PropTypes.oneOf(['left', 'right']),
50
54
  itemTag: PropTypes.elementType,
package/lib/parts/menu-context.d.ts CHANGED
@@ -6,6 +6,7 @@ export declare type MenuItemMode = 'clear' | 'classic' | 'rock';
6
6
  export interface MenuContextValue {
7
7
  iconPlacement?: MenuItemIconPlacement;
8
8
  disabled?: boolean;
9
+ disableCursor?: boolean;
9
10
  size?: MenuItemSize;
10
11
  mode?: MenuItemMode;
11
12
  theme?: Theme;
package/lib/parts/menu-context.js CHANGED
@@ -25,6 +25,7 @@ MenuProvider.propTypes = {
25
25
  size: PropTypes.oneOf(['l', 'm', 's']),
26
26
  mode: PropTypes.oneOf(['clear', 'classic', 'rock']),
27
27
  theme: PropTypes.oneOf(['light', 'dark']),
28
+ disableCursor: PropTypes.bool,
28
29
  disabled: PropTypes.bool,
29
30
  iconPlacement: PropTypes.oneOf(['left', 'right']),
30
31
  itemTag: PropTypes.elementType
package/lib/parts/menu-item.d.ts CHANGED
@@ -9,6 +9,7 @@ interface MenuItemProps extends HTMLAttributes<Element> {
9
9
  mode?: MenuItemMode;
10
10
  theme?: Theme;
11
11
  disabled?: boolean;
12
+ disableCursor?: boolean;
12
13
  selected?: boolean;
13
14
  highlighted?: boolean;
14
15
  iconPlacement?: MenuItemIconPlacement;
package/lib/parts/menu-item.js CHANGED
@@ -6,7 +6,7 @@ import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-sta
6
6
  import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
7
7
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
8
8
  import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
9
- var _excluded = ["className", "tag", "children", "icon", "size", "mode", "theme", "disabled", "selected", "highlighted", "iconPlacement"];
9
+ var _excluded = ["className", "tag", "children", "icon", "size", "mode", "theme", "disabled", "disableCursor", "selected", "highlighted", "iconPlacement"];
10
10
 
11
11
  function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
12
12
 
@@ -38,7 +38,7 @@ var THEME_STYLES = {
38
38
  }; // eslint-disable-next-line complexity
39
39
 
40
40
  var MenuItemInner = function MenuItemInner(_ref, ref) {
41
- var _menuContext$theme, _menuContext$itemTag, _menuContext$iconPlac, _menuContext$mode, _menuContext$size;
41
+ var _menuContext$theme, _menuContext$itemTag, _menuContext$iconPlac, _menuContext$mode, _menuContext$size, _menuContext$disableC;
42
42
 
43
43
  var className = _ref.className,
44
44
  _ref$tag = _ref.tag,
@@ -51,6 +51,7 @@ var MenuItemInner = function MenuItemInner(_ref, ref) {
51
51
  mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
52
52
  theme = _ref.theme,
53
53
  disabled = _ref.disabled,
54
+ disableCursor = _ref.disableCursor,
54
55
  selected = _ref.selected,
55
56
  highlighted = _ref.highlighted,
56
57
  _ref$iconPlacement = _ref.iconPlacement,
@@ -63,12 +64,13 @@ var MenuItemInner = function MenuItemInner(_ref, ref) {
63
64
  var actualIconPlacement = (_menuContext$iconPlac = menuContext.iconPlacement) !== null && _menuContext$iconPlac !== void 0 ? _menuContext$iconPlac : iconPlacement;
64
65
  var actualMode = (_menuContext$mode = menuContext.mode) !== null && _menuContext$mode !== void 0 ? _menuContext$mode : mode;
65
66
  var actualSize = (_menuContext$size = menuContext.size) !== null && _menuContext$size !== void 0 ? _menuContext$size : size;
67
+ var actualDisableCursor = (_menuContext$disableC = menuContext.disableCursor) !== null && _menuContext$disableC !== void 0 ? _menuContext$disableC : disableCursor;
66
68
  var iconElement = icon ? /*#__PURE__*/cloneElement(icon, {
67
69
  className: cn(icon.props.className, styles.icon)
68
70
  }) : null;
69
71
  return /*#__PURE__*/React.createElement(Tag, _objectSpread({
70
72
  ref: ref,
71
- className: cn(styles.menuItem, ICON_PLACEMENT_STYLES[actualIconPlacement], MODE_STYLES[actualMode], SIZE_STYLES[actualSize], THEME_STYLES[actualTheme], (menuContext.disabled || disabled) && styles.disabled, selected && styles.selected, highlighted && styles.highlighted, className),
73
+ className: cn(styles.menuItem, ICON_PLACEMENT_STYLES[actualIconPlacement], MODE_STYLES[actualMode], SIZE_STYLES[actualSize], THEME_STYLES[actualTheme], (menuContext.disabled || disabled) && styles.disabled, selected && styles.selected, highlighted && styles.highlighted, actualDisableCursor && styles.disableCursor, className),
72
74
  "data-test": 'menu-item',
73
75
  tabIndex: 0
74
76
  }, restProps), actualIconPlacement === 'left' && iconElement, /*#__PURE__*/React.createElement("span", {
@@ -83,6 +85,7 @@ MenuItem.propTypes = {
83
85
  theme: PropTypes.oneOf(['light', 'dark']),
84
86
  onClick: PropTypes.func,
85
87
  disabled: PropTypes.bool,
88
+ disableCursor: PropTypes.bool,
86
89
  selected: PropTypes.bool,
87
90
 
88
91
  /** @ignore */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/menu",
3
- "version": "0.2.2",
3
+ "version": "0.5.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -28,12 +28,12 @@
28
28
  "@rescui/colors": "^0.1.0",
29
29
  "@rescui/postcss-preset-library": "^0.0.4",
30
30
  "@rescui/scripts": "^0.1.4",
31
- "@rescui/typography": "^0.5.1",
31
+ "@rescui/typography": "^0.7.0",
32
32
  "@rescui/visual-regression": "^0.0.1",
33
33
  "postcss": "^8.3.0"
34
34
  },
35
35
  "scripts": {
36
36
  "build": "rescui-scripts build"
37
37
  },
38
- "gitHead": "24a3fbe87179468f1dc804374864b21042fa2dbe"
38
+ "gitHead": "b9d865165f162732befa0868ea1325d064313d9e"
39
39
  }