@hh.ru/magritte-ui-chips-trigger 4.3.31 → 4.3.32

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 (3) hide show
  1. package/ChipsTrigger.js +1 -1
  2. package/index.css +39 -40
  3. package/package.json +2 -2
package/ChipsTrigger.js CHANGED
@@ -12,7 +12,7 @@ import { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
12
12
  import { useFocus } from '@hh.ru/magritte-ui-input/useFocus';
13
13
  import { useScrollbar, Scrollbar } from '@hh.ru/magritte-ui-scrollbar';
14
14
 
15
- var styles = {"root":"magritte-root___-zVdz_4-3-31","focused":"magritte-focused___0Uzyu_4-3-31","invalid":"magritte-invalid___tVzQV_4-3-31","disabled":"magritte-disabled___UeqcV_4-3-31","label":"magritte-label___j7Trt_4-3-31","field-input":"magritte-field-input___04Cag_4-3-31","fieldInput":"magritte-field-input___04Cag_4-3-31","scrollable-area":"magritte-scrollable-area___-xMF2_4-3-31","scrollableArea":"magritte-scrollable-area___-xMF2_4-3-31","focus-visible":"magritte-focus-visible___ifvAP_4-3-31","focusVisible":"magritte-focus-visible___ifvAP_4-3-31","large":"magritte-large___JIrIy_4-3-31","field":"magritte-field___rlEmn_4-3-31","icon":"magritte-icon___fDMiz_4-3-31","scrollable-area-wrapper":"magritte-scrollable-area-wrapper___hZNQd_4-3-31","scrollableAreaWrapper":"magritte-scrollable-area-wrapper___hZNQd_4-3-31","medium":"magritte-medium___Xk-XB_4-3-31","chips-and-input":"magritte-chips-and-input___qg-Ba_4-3-31","chipsAndInput":"magritte-chips-and-input___qg-Ba_4-3-31","label-wrapper":"magritte-label-wrapper___De7Bm_4-3-31","labelWrapper":"magritte-label-wrapper___De7Bm_4-3-31","icon_expanded":"magritte-icon_expanded___RaOT-_4-3-31","iconExpanded":"magritte-icon_expanded___RaOT-_4-3-31","custom-chip-wrapper":"magritte-custom-chip-wrapper___a9kJ6_4-3-31","customChipWrapper":"magritte-custom-chip-wrapper___a9kJ6_4-3-31"};
15
+ var styles = {"root":"magritte-root___-zVdz_4-3-32","focused":"magritte-focused___0Uzyu_4-3-32","invalid":"magritte-invalid___tVzQV_4-3-32","disabled":"magritte-disabled___UeqcV_4-3-32","label":"magritte-label___j7Trt_4-3-32","field-input":"magritte-field-input___04Cag_4-3-32","fieldInput":"magritte-field-input___04Cag_4-3-32","scrollable-area":"magritte-scrollable-area___-xMF2_4-3-32","scrollableArea":"magritte-scrollable-area___-xMF2_4-3-32","focus-visible":"magritte-focus-visible___ifvAP_4-3-32","focusVisible":"magritte-focus-visible___ifvAP_4-3-32","large":"magritte-large___JIrIy_4-3-32","field":"magritte-field___rlEmn_4-3-32","icon":"magritte-icon___fDMiz_4-3-32","scrollable-area-wrapper":"magritte-scrollable-area-wrapper___hZNQd_4-3-32","scrollableAreaWrapper":"magritte-scrollable-area-wrapper___hZNQd_4-3-32","medium":"magritte-medium___Xk-XB_4-3-32","chips-and-input":"magritte-chips-and-input___qg-Ba_4-3-32","chipsAndInput":"magritte-chips-and-input___qg-Ba_4-3-32","label-wrapper":"magritte-label-wrapper___De7Bm_4-3-32","labelWrapper":"magritte-label-wrapper___De7Bm_4-3-32","icon_expanded":"magritte-icon_expanded___RaOT-_4-3-32","iconExpanded":"magritte-icon_expanded___RaOT-_4-3-32","custom-chip-wrapper":"magritte-custom-chip-wrapper___a9kJ6_4-3-32","customChipWrapper":"magritte-custom-chip-wrapper___a9kJ6_4-3-32"};
16
16
 
17
17
  const focusOnLastChip = (event, chipsContainer, input) => {
18
18
  if (!chipsContainer || !input) {
package/index.css CHANGED
@@ -68,7 +68,7 @@
68
68
  --magritte-color-component-input-icon-state-chevron-hovered-v24-7-3:#8293a2;
69
69
  --magritte-color-component-input-icon-state-chevron-disabled-v24-7-3:#96aabb;
70
70
  }
71
- .magritte-root___-zVdz_4-3-31{
71
+ .magritte-root___-zVdz_4-3-32{
72
72
  display:inline-flex;
73
73
  position:relative;
74
74
  width:100%;
@@ -84,134 +84,133 @@
84
84
  --magritte-ui-scrollbar-border-radius:12px;
85
85
  }
86
86
  @media (min-width: 1020px){
87
- body.magritte-old-layout .magritte-root___-zVdz_4-3-31:not(.magritte-focused___0Uzyu_4-3-31):not(.magritte-invalid___tVzQV_4-3-31):not(.magritte-disabled___UeqcV_4-3-31):hover{
87
+ body.magritte-old-layout .magritte-root___-zVdz_4-3-32:not(.magritte-focused___0Uzyu_4-3-32):not(.magritte-invalid___tVzQV_4-3-32):not(.magritte-disabled___UeqcV_4-3-32):hover{
88
88
  background-color:var(--magritte-color-component-input-background-state-field-hovered-v24-7-3);
89
89
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v24-7-3);
90
90
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v24-7-3);
91
91
  }
92
- body.magritte-old-layout .magritte-root___-zVdz_4-3-31:not(.magritte-focused___0Uzyu_4-3-31):not(.magritte-invalid___tVzQV_4-3-31):not(.magritte-disabled___UeqcV_4-3-31):hover .magritte-label___j7Trt_4-3-31{
92
+ body.magritte-old-layout .magritte-root___-zVdz_4-3-32:not(.magritte-focused___0Uzyu_4-3-32):not(.magritte-invalid___tVzQV_4-3-32):not(.magritte-disabled___UeqcV_4-3-32):hover .magritte-label___j7Trt_4-3-32{
93
93
  color:var(--magritte-color-component-input-text-state-placeholder-hovered-v24-7-3);
94
94
  }
95
- body.magritte-old-layout .magritte-root___-zVdz_4-3-31:not(.magritte-focused___0Uzyu_4-3-31):not(.magritte-invalid___tVzQV_4-3-31):not(.magritte-disabled___UeqcV_4-3-31):hover .magritte-field-input___04Cag_4-3-31{
95
+ body.magritte-old-layout .magritte-root___-zVdz_4-3-32:not(.magritte-focused___0Uzyu_4-3-32):not(.magritte-invalid___tVzQV_4-3-32):not(.magritte-disabled___UeqcV_4-3-32):hover .magritte-field-input___04Cag_4-3-32{
96
96
  color:var(--magritte-color-component-input-text-state-content-hovered-v24-7-3);
97
97
  }
98
98
  }
99
99
  @media (min-width: 1024px){
100
- body:not(.magritte-old-layout) .magritte-root___-zVdz_4-3-31:not(.magritte-focused___0Uzyu_4-3-31):not(.magritte-invalid___tVzQV_4-3-31):not(.magritte-disabled___UeqcV_4-3-31):hover{
100
+ body:not(.magritte-old-layout) .magritte-root___-zVdz_4-3-32:not(.magritte-focused___0Uzyu_4-3-32):not(.magritte-invalid___tVzQV_4-3-32):not(.magritte-disabled___UeqcV_4-3-32):hover{
101
101
  background-color:var(--magritte-color-component-input-background-state-field-hovered-v24-7-3);
102
102
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v24-7-3);
103
103
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v24-7-3);
104
104
  }
105
- body:not(.magritte-old-layout) .magritte-root___-zVdz_4-3-31:not(.magritte-focused___0Uzyu_4-3-31):not(.magritte-invalid___tVzQV_4-3-31):not(.magritte-disabled___UeqcV_4-3-31):hover .magritte-label___j7Trt_4-3-31{
105
+ body:not(.magritte-old-layout) .magritte-root___-zVdz_4-3-32:not(.magritte-focused___0Uzyu_4-3-32):not(.magritte-invalid___tVzQV_4-3-32):not(.magritte-disabled___UeqcV_4-3-32):hover .magritte-label___j7Trt_4-3-32{
106
106
  color:var(--magritte-color-component-input-text-state-placeholder-hovered-v24-7-3);
107
107
  }
108
- body:not(.magritte-old-layout) .magritte-root___-zVdz_4-3-31:not(.magritte-focused___0Uzyu_4-3-31):not(.magritte-invalid___tVzQV_4-3-31):not(.magritte-disabled___UeqcV_4-3-31):hover .magritte-field-input___04Cag_4-3-31{
108
+ body:not(.magritte-old-layout) .magritte-root___-zVdz_4-3-32:not(.magritte-focused___0Uzyu_4-3-32):not(.magritte-invalid___tVzQV_4-3-32):not(.magritte-disabled___UeqcV_4-3-32):hover .magritte-field-input___04Cag_4-3-32{
109
109
  color:var(--magritte-color-component-input-text-state-content-hovered-v24-7-3);
110
110
  }
111
111
  }
112
- .magritte-root___-zVdz_4-3-31:not(.magritte-disabled___UeqcV_4-3-31){
112
+ .magritte-root___-zVdz_4-3-32:not(.magritte-disabled___UeqcV_4-3-32){
113
113
  cursor:text;
114
114
  }
115
- .magritte-root___-zVdz_4-3-31.magritte-focused___0Uzyu_4-3-31{
115
+ .magritte-root___-zVdz_4-3-32.magritte-focused___0Uzyu_4-3-32{
116
116
  background-color:var(--magritte-color-component-input-background-state-field-focused-v24-7-3);
117
117
  box-shadow:inset 0 0 0 2px var(--magritte-color-component-input-stroke-state-field-focused-v24-7-3);
118
118
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v24-7-3);
119
119
  }
120
- .magritte-root___-zVdz_4-3-31.magritte-focused___0Uzyu_4-3-31 .magritte-label___j7Trt_4-3-31{
120
+ .magritte-root___-zVdz_4-3-32.magritte-focused___0Uzyu_4-3-32 .magritte-label___j7Trt_4-3-32{
121
121
  color:var(--magritte-color-component-input-text-state-placeholder-focused-v24-7-3);
122
122
  }
123
- .magritte-root___-zVdz_4-3-31.magritte-focused___0Uzyu_4-3-31 .magritte-field-input___04Cag_4-3-31{
123
+ .magritte-root___-zVdz_4-3-32.magritte-focused___0Uzyu_4-3-32 .magritte-field-input___04Cag_4-3-32{
124
124
  color:var(--magritte-color-component-input-text-state-content-focused-v24-7-3);
125
125
  }
126
- .magritte-root___-zVdz_4-3-31.magritte-invalid___tVzQV_4-3-31{
126
+ .magritte-root___-zVdz_4-3-32.magritte-invalid___tVzQV_4-3-32{
127
127
  background-color:var(--magritte-color-component-input-background-state-field-invalid-v24-7-3);
128
128
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-invalid-v24-7-3);
129
129
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-invalid-v24-7-3);
130
130
  }
131
- .magritte-root___-zVdz_4-3-31.magritte-invalid___tVzQV_4-3-31 .magritte-label___j7Trt_4-3-31{
131
+ .magritte-root___-zVdz_4-3-32.magritte-invalid___tVzQV_4-3-32 .magritte-label___j7Trt_4-3-32{
132
132
  color:var(--magritte-color-component-input-text-state-placeholder-invalid-v24-7-3);
133
133
  }
134
- .magritte-root___-zVdz_4-3-31.magritte-invalid___tVzQV_4-3-31 .magritte-field-input___04Cag_4-3-31{
134
+ .magritte-root___-zVdz_4-3-32.magritte-invalid___tVzQV_4-3-32 .magritte-field-input___04Cag_4-3-32{
135
135
  color:var(--magritte-color-component-input-text-state-content-invalid-v24-7-3);
136
136
  }
137
- .magritte-root___-zVdz_4-3-31.magritte-disabled___UeqcV_4-3-31{
137
+ .magritte-root___-zVdz_4-3-32.magritte-disabled___UeqcV_4-3-32{
138
138
  background-color:var(--magritte-color-component-input-background-state-field-disabled-v24-7-3);
139
139
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-disabled-v24-7-3);
140
140
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-disabled-v24-7-3);
141
141
  --magritte-ui-chip-text-color-override:var(--magritte-color-component-input-chips-text-state-neutral-disable-v24-7-3);
142
142
  --magritte-ui-chip-background-color-override:var(--magritte-color-component-input-chips-background-state-neutral-disable-v24-7-3);
143
143
  }
144
- .magritte-root___-zVdz_4-3-31.magritte-disabled___UeqcV_4-3-31 .magritte-label___j7Trt_4-3-31{
144
+ .magritte-root___-zVdz_4-3-32.magritte-disabled___UeqcV_4-3-32 .magritte-label___j7Trt_4-3-32{
145
145
  color:var(--magritte-color-component-input-text-state-placeholder-disabled-v24-7-3);
146
146
  }
147
- .magritte-root___-zVdz_4-3-31.magritte-disabled___UeqcV_4-3-31 .magritte-field-input___04Cag_4-3-31{
147
+ .magritte-root___-zVdz_4-3-32.magritte-disabled___UeqcV_4-3-32 .magritte-field-input___04Cag_4-3-32{
148
148
  color:var(--magritte-color-component-input-text-state-content-disabled-v24-7-3);
149
149
  }
150
- .magritte-root___-zVdz_4-3-31.magritte-disabled___UeqcV_4-3-31 .magritte-scrollable-area___-xMF2_4-3-31{
150
+ .magritte-root___-zVdz_4-3-32.magritte-disabled___UeqcV_4-3-32 .magritte-scrollable-area___-xMF2_4-3-32{
151
151
  overflow:hidden;
152
152
  }
153
- .magritte-root___-zVdz_4-3-31.magritte-focus-visible___ifvAP_4-3-31{
153
+ .magritte-root___-zVdz_4-3-32.magritte-focus-visible___ifvAP_4-3-32{
154
154
  outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v24-7-3) solid 4px;
155
155
  }
156
- .magritte-root___-zVdz_4-3-31.magritte-focus-visible___ifvAP_4-3-31.magritte-invalid___tVzQV_4-3-31{
156
+ .magritte-root___-zVdz_4-3-32.magritte-focus-visible___ifvAP_4-3-32.magritte-invalid___tVzQV_4-3-32{
157
157
  outline-color:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v24-7-3);
158
158
  }
159
- .magritte-large___JIrIy_4-3-31{
159
+ .magritte-large___JIrIy_4-3-32{
160
160
  padding-left:12px;
161
161
  padding-top:12px;
162
162
  padding-bottom:12px;
163
163
  padding-right:2px;
164
164
  }
165
- .magritte-large___JIrIy_4-3-31 .magritte-field___rlEmn_4-3-31{
165
+ .magritte-large___JIrIy_4-3-32 .magritte-field___rlEmn_4-3-32{
166
166
  margin-left:4px;
167
167
  }
168
- .magritte-large___JIrIy_4-3-31 .magritte-icon___fDMiz_4-3-31{
168
+ .magritte-large___JIrIy_4-3-32 .magritte-icon___fDMiz_4-3-32{
169
169
  top:12px;
170
170
  right:16px;
171
171
  }
172
- .magritte-large___JIrIy_4-3-31 .magritte-scrollable-area-wrapper___hZNQd_4-3-31{
172
+ .magritte-large___JIrIy_4-3-32 .magritte-scrollable-area-wrapper___hZNQd_4-3-32{
173
173
  padding-right:calc(24px + 10px + 12px);
174
174
  }
175
- .magritte-medium___Xk-XB_4-3-31{
175
+ .magritte-medium___Xk-XB_4-3-32{
176
176
  padding-left:8px;
177
177
  padding-top:8px;
178
178
  padding-bottom:8px;
179
179
  padding-right:2px;
180
180
  }
181
- .magritte-medium___Xk-XB_4-3-31 .magritte-field___rlEmn_4-3-31{
181
+ .magritte-medium___Xk-XB_4-3-32 .magritte-field___rlEmn_4-3-32{
182
182
  margin-left:8px;
183
183
  }
184
- .magritte-medium___Xk-XB_4-3-31 .magritte-icon___fDMiz_4-3-31{
184
+ .magritte-medium___Xk-XB_4-3-32 .magritte-icon___fDMiz_4-3-32{
185
185
  top:8px;
186
186
  right:12px;
187
187
  }
188
- .magritte-medium___Xk-XB_4-3-31 .magritte-scrollable-area-wrapper___hZNQd_4-3-31{
188
+ .magritte-medium___Xk-XB_4-3-32 .magritte-scrollable-area-wrapper___hZNQd_4-3-32{
189
189
  padding-right:calc(24px + 6px + 12px);
190
190
  }
191
- .magritte-scrollable-area-wrapper___hZNQd_4-3-31{
191
+ .magritte-scrollable-area-wrapper___hZNQd_4-3-32{
192
192
  width:100%;
193
193
  position:relative;
194
194
  overflow:hidden;
195
195
  }
196
- .magritte-scrollable-area___-xMF2_4-3-31{
196
+ .magritte-scrollable-area___-xMF2_4-3-32{
197
197
  height:100%;
198
198
  display:flex;
199
199
  align-items:flex-start;
200
200
  overflow-y:auto;
201
- overscroll-behavior:contain;
202
201
  scrollbar-width:none;
203
202
  }
204
- .magritte-scrollable-area___-xMF2_4-3-31::-webkit-scrollbar{
203
+ .magritte-scrollable-area___-xMF2_4-3-32::-webkit-scrollbar{
205
204
  display:none;
206
205
  }
207
- .magritte-chips-and-input___qg-Ba_4-3-31{
206
+ .magritte-chips-and-input___qg-Ba_4-3-32{
208
207
  display:flex;
209
208
  gap:6px;
210
209
  flex-wrap:wrap;
211
210
  align-items:center;
212
211
  width:100%;
213
212
  }
214
- .magritte-field___rlEmn_4-3-31{
213
+ .magritte-field___rlEmn_4-3-32{
215
214
  display:flex;
216
215
  align-items:center;
217
216
  position:relative;
@@ -227,7 +226,7 @@
227
226
  text-transform:none;
228
227
  text-decoration:none;
229
228
  }
230
- .magritte-field-input___04Cag_4-3-31{
229
+ .magritte-field-input___04Cag_4-3-32{
231
230
  border:0;
232
231
  padding:0;
233
232
  background:none;
@@ -236,19 +235,19 @@
236
235
  z-index:1;
237
236
  color:var(--magritte-color-component-input-text-content-v24-7-3);
238
237
  }
239
- .magritte-label-wrapper___De7Bm_4-3-31{
238
+ .magritte-label-wrapper___De7Bm_4-3-32{
240
239
  display:flex;
241
240
  align-items:center;
242
241
  position:absolute;
243
242
  height:100%;
244
243
  inset:0;
245
244
  }
246
- .magritte-label___j7Trt_4-3-31{
245
+ .magritte-label___j7Trt_4-3-32{
247
246
  color:var(--magritte-color-component-input-text-placeholder-v24-7-3);
248
247
  overflow:hidden;
249
248
  text-overflow:ellipsis;
250
249
  }
251
- .magritte-icon___fDMiz_4-3-31{
250
+ .magritte-icon___fDMiz_4-3-32{
252
251
  display:inline-flex;
253
252
  margin-left:auto;
254
253
  padding:4px 0;
@@ -257,11 +256,11 @@
257
256
  transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v24-7-3);
258
257
  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v24-7-3);
259
258
  }
260
- .magritte-icon_expanded___RaOT-_4-3-31{
259
+ .magritte-icon_expanded___RaOT-_4-3-32{
261
260
  transform:rotate(-180deg);
262
261
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v24-7-3);
263
262
  }
264
- .magritte-custom-chip-wrapper___a9kJ6_4-3-31{
263
+ .magritte-custom-chip-wrapper___a9kJ6_4-3-32{
265
264
  display:inline-flex;
266
265
  min-width:0;
267
266
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-chips-trigger",
3
- "version": "4.3.31",
3
+ "version": "4.3.32",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -38,5 +38,5 @@
38
38
  "@hh.ru/magritte-ui-mock-component": "1.1.7",
39
39
  "@hh.ru/magritte-ui-scrollbar": "1.0.29"
40
40
  },
41
- "gitHead": "70ac6d4c2faa2fe631fae008bb817f6cb21f6520"
41
+ "gitHead": "e3b164dddb3a1f9322da3180f130b54c1b17a72a"
42
42
  }