@entur/dropdown 5.4.2 → 5.4.3

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 (2) hide show
  1. package/dist/styles.css +123 -123
  2. package/package.json +9 -9
package/dist/styles.css CHANGED
@@ -1,55 +1,93 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
- .eds-dropdown__searchable-selected-item {
4
- display: block;
5
- font-size: 1rem;
6
- line-height: 1rem;
7
- margin-right: -1rem;
8
- padding: calc(1rem + 0.25rem) 0 0.25rem 1rem;
9
- font-family: inherit;
10
- overflow-x: hidden;
11
- text-overflow: ellipsis;
3
+ .eds-multi-select {
4
+ position: relative;
5
+ }
6
+ .eds-multi-select__selected-items {
7
+ display: flex;
8
+ align-items: center;
9
+ flex-wrap: wrap;
10
+ position: relative;
11
+ flex: 1 1 0%;
12
+ padding: 0.25rem;
13
+ }
14
+ .eds-multi-select__selected-items-tag.eds-tag-chip {
15
+ margin-left: 0.25rem;
12
16
  white-space: nowrap;
13
17
  }
14
- .eds-dropdown__searchable-selected-item__wrapper {
15
- max-width: 65%;
18
+ .eds-contrast .eds-multi-select__selected-items-tag.eds-tag-chip svg {
19
+ color: #181c56;
16
20
  }
17
-
18
- .eds-form-control.eds-dropdown__input::-moz-placeholder {
19
- -moz-transition: none;
20
- transition: none;
21
+ .eds-multi-select__selected-items-tag.eds-tag-chip:focus {
22
+ outline-offset: 0.125rem;
21
23
  }
22
-
23
- .eds-form-control.eds-dropdown__input::placeholder {
24
- transition: none;
24
+ .eds-contrast .eds-multi-select__selected-items-tag.eds-tag-chip {
25
+ color: #181c56;
26
+ background: #ebebf1;
27
+ border: 0.0625rem solid #d1d4e3;
25
28
  }
26
- /* DO NOT CHANGE!*/
27
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
28
- .eds-dropdown__toggle-button {
29
- -webkit-appearance: none;
30
- -moz-appearance: none;
31
- appearance: none;
32
- background: none;
33
- border: none;
34
- border-radius: 0;
35
- color: inherit;
36
- font-size: inherit;
37
- font-family: inherit;
38
- margin-right: -0.75rem;
39
- padding: 0.5rem;
29
+ .eds-contrast .eds-multi-select__selected-items-tag.eds-tag-chip .eds-tag-chip__close-button:hover {
30
+ background: #babbcf;
31
+ }
32
+ .eds-multi-select__input {
33
+ flex: 1 1;
34
+ min-height: 44px;
40
35
  display: flex;
36
+ align-items: center;
37
+ }
38
+ .eds-multi-select__placeholder {
39
+ padding-left: 1.5rem;
40
+ line-height: 1.375rem;
41
+ font-size: 1rem;
42
+ }
43
+ .eds-checkbox-icon {
44
+ height: 1rem;
45
+ width: 1rem;
46
+ visibility: hidden;
47
+ }
48
+ .eds-checkbox-icon__path {
49
+ transform-origin: 50% 50%;
50
+ stroke-dasharray: 48;
51
+ stroke-dashoffset: 48;
52
+ stroke-width: 0.375rem;
53
+ }
54
+
55
+ .eds-multiselect {
56
+ position: relative;
57
+ }
58
+ .eds-multiselect__button {
59
+ text-overflow: ellipsis;
60
+ }
61
+
62
+ .eds-multiselect-checkbox {
63
+ display: inline-flex;
41
64
  justify-content: center;
65
+ align-items: center;
66
+ position: relative;
67
+ margin-right: 0.75rem;
68
+ height: 1.25rem;
69
+ width: 1.25rem;
70
+ border: 0.125rem solid #181c56;
71
+ border-radius: 0.0625rem;
72
+ background-color: transparent;
73
+ color: #ffffff;
42
74
  }
43
- .eds-dropdown__toggle-button--open svg {
44
- transform: rotate(180deg);
75
+
76
+ .eds-multiselect-checkbox--checked {
77
+ background-color: #181c56;
45
78
  }
46
- .eds-dropdown__toggle-button:focus {
47
- outline-offset: 0.125rem;
48
- outline: none;
49
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
79
+ .eds-multiselect-checkbox--checked .eds-checkbox-icon {
80
+ visibility: visible;
50
81
  }
51
- .eds-contrast .eds-dropdown__toggle-button:focus {
52
- box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
82
+ .eds-multiselect-checkbox--checked .eds-checkbox-icon__path {
83
+ stroke: #ffffff;
84
+ animation: stroke ease-in-out 0.2s 0.1s forwards;
85
+ }
86
+
87
+ @keyframes stroke {
88
+ 100% {
89
+ stroke-dashoffset: 0;
90
+ }
53
91
  }
54
92
  /* DO NOT CHANGE!*/
55
93
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
@@ -115,6 +153,31 @@
115
153
  .eds-dropdown-list-icon {
116
154
  margin-left: 0.75rem;
117
155
  }
156
+ /* DO NOT CHANGE!*/
157
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
158
+ .eds-dropdown__searchable-selected-item {
159
+ display: block;
160
+ font-size: 1rem;
161
+ line-height: 1rem;
162
+ margin-right: -1rem;
163
+ padding: calc(1rem + 0.25rem) 0 0.25rem 1rem;
164
+ font-family: inherit;
165
+ overflow-x: hidden;
166
+ text-overflow: ellipsis;
167
+ white-space: nowrap;
168
+ }
169
+ .eds-dropdown__searchable-selected-item__wrapper {
170
+ max-width: 65%;
171
+ }
172
+
173
+ .eds-form-control.eds-dropdown__input::-moz-placeholder {
174
+ -moz-transition: none;
175
+ transition: none;
176
+ }
177
+
178
+ .eds-form-control.eds-dropdown__input::placeholder {
179
+ transition: none;
180
+ }
118
181
  .eds-inline-spinner {
119
182
  align-items: center;
120
183
  display: flex;
@@ -182,94 +245,31 @@
182
245
  }
183
246
  /* DO NOT CHANGE!*/
184
247
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
185
- .eds-multi-select {
186
- position: relative;
187
- }
188
- .eds-multi-select__selected-items {
189
- display: flex;
190
- align-items: center;
191
- flex-wrap: wrap;
192
- position: relative;
193
- flex: 1 1 0%;
194
- padding: 0.25rem;
195
- }
196
- .eds-multi-select__selected-items-tag.eds-tag-chip {
197
- margin-left: 0.25rem;
198
- white-space: nowrap;
199
- }
200
- .eds-contrast .eds-multi-select__selected-items-tag.eds-tag-chip svg {
201
- color: #181c56;
202
- }
203
- .eds-multi-select__selected-items-tag.eds-tag-chip:focus {
204
- outline-offset: 0.125rem;
205
- }
206
- .eds-contrast .eds-multi-select__selected-items-tag.eds-tag-chip {
207
- color: #181c56;
208
- background: #ebebf1;
209
- border: 0.0625rem solid #d1d4e3;
210
- }
211
- .eds-contrast .eds-multi-select__selected-items-tag.eds-tag-chip .eds-tag-chip__close-button:hover {
212
- background: #babbcf;
213
- }
214
- .eds-multi-select__input {
215
- flex: 1 1;
216
- min-height: 44px;
248
+ .eds-dropdown__toggle-button {
249
+ -webkit-appearance: none;
250
+ -moz-appearance: none;
251
+ appearance: none;
252
+ background: none;
253
+ border: none;
254
+ border-radius: 0;
255
+ color: inherit;
256
+ font-size: inherit;
257
+ font-family: inherit;
258
+ margin-right: -0.75rem;
259
+ padding: 0.5rem;
217
260
  display: flex;
218
- align-items: center;
219
- }
220
- .eds-multi-select__placeholder {
221
- padding-left: 1.5rem;
222
- line-height: 1.375rem;
223
- font-size: 1rem;
224
- }
225
- .eds-checkbox-icon {
226
- height: 1rem;
227
- width: 1rem;
228
- visibility: hidden;
229
- }
230
- .eds-checkbox-icon__path {
231
- transform-origin: 50% 50%;
232
- stroke-dasharray: 48;
233
- stroke-dashoffset: 48;
234
- stroke-width: 0.375rem;
235
- }
236
-
237
- .eds-multiselect {
238
- position: relative;
239
- }
240
- .eds-multiselect__button {
241
- text-overflow: ellipsis;
242
- }
243
-
244
- .eds-multiselect-checkbox {
245
- display: inline-flex;
246
261
  justify-content: center;
247
- align-items: center;
248
- position: relative;
249
- margin-right: 0.75rem;
250
- height: 1.25rem;
251
- width: 1.25rem;
252
- border: 0.125rem solid #181c56;
253
- border-radius: 0.0625rem;
254
- background-color: transparent;
255
- color: #ffffff;
256
262
  }
257
-
258
- .eds-multiselect-checkbox--checked {
259
- background-color: #181c56;
260
- }
261
- .eds-multiselect-checkbox--checked .eds-checkbox-icon {
262
- visibility: visible;
263
+ .eds-dropdown__toggle-button--open svg {
264
+ transform: rotate(180deg);
263
265
  }
264
- .eds-multiselect-checkbox--checked .eds-checkbox-icon__path {
265
- stroke: #ffffff;
266
- animation: stroke ease-in-out 0.2s 0.1s forwards;
266
+ .eds-dropdown__toggle-button:focus {
267
+ outline-offset: 0.125rem;
268
+ outline: none;
269
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
267
270
  }
268
-
269
- @keyframes stroke {
270
- 100% {
271
- stroke-dashoffset: 0;
272
- }
271
+ .eds-contrast .eds-dropdown__toggle-button:focus {
272
+ box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
273
273
  }
274
274
  /* DO NOT CHANGE!*/
275
275
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/dropdown",
3
- "version": "5.4.2",
3
+ "version": "5.4.3",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/dropdown.esm.js",
@@ -27,17 +27,17 @@
27
27
  "react-dom": ">=16.8.0"
28
28
  },
29
29
  "dependencies": {
30
- "@entur/a11y": "^0.2.82",
31
- "@entur/button": "^3.2.18",
32
- "@entur/chip": "^0.7.3",
33
- "@entur/form": "^7.1.2",
30
+ "@entur/a11y": "^0.2.83",
31
+ "@entur/button": "^3.2.19",
32
+ "@entur/chip": "^0.7.4",
33
+ "@entur/form": "^7.1.3",
34
34
  "@entur/icons": "^6.15.7",
35
- "@entur/loader": "^0.4.62",
35
+ "@entur/loader": "^0.4.63",
36
36
  "@entur/tokens": "^3.13.5",
37
- "@entur/tooltip": "^2.7.2",
38
- "@entur/utils": "^0.11.0",
37
+ "@entur/tooltip": "^2.7.3",
38
+ "@entur/utils": "^0.11.1",
39
39
  "classnames": "^2.3.1",
40
40
  "downshift": "^8.3.3"
41
41
  },
42
- "gitHead": "1008c4e487e114c41234cc4ce7da912519ad26a5"
42
+ "gitHead": "4a9415af2b2c72292bbb4c6aeeb0f79b7dbdb0bd"
43
43
  }