@entur/dropdown 2.3.0 → 3.0.2

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.
package/dist/styles.css CHANGED
@@ -2,17 +2,69 @@
2
2
  --eds-dropdown: 1;
3
3
  }/* DO NOT CHANGE!*/
4
4
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
5
- .eds-dropdown + .eds-form-control__append {
6
- margin-left: -2em;
7
- pointer-events: none;
5
+ .eds-dropdown-list {
6
+ border-radius: 0.25rem;
7
+ box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
8
+ display: none;
9
+ list-style: none;
10
+ margin: 0;
11
+ max-height: 50vh;
12
+ padding: 0;
13
+ position: relative;
14
+ overflow-y: auto;
15
+ width: 100%;
16
+ z-index: 20;
17
+ }
18
+ .eds-contrast .eds-dropdown-list {
19
+ box-shadow: 0 0.0625rem 0.1875rem #393d79;
20
+ }
21
+ .eds-dropdown-list--open {
22
+ display: inline-block;
23
+ }
24
+ .eds-dropdown-list:focus {
25
+ outline: none;
26
+ }
27
+ @media all and (min-width: 50rem) {
28
+ .eds-dropdown-list {
29
+ max-height: 30vh;
30
+ }
8
31
  }
9
32
 
10
- .eds-dropdown option {
33
+ .eds-dropdown-list__item {
34
+ align-items: center;
35
+ background-color: #f8f8f8;
36
+ border-bottom: 0.125rem solid #e9e9e9;
37
+ border-left: 0.125rem solid #e9e9e9;
38
+ border-right: 0.125rem solid #e9e9e9;
11
39
  color: #181c56;
12
- background-color: #ffffff;
40
+ display: flex;
41
+ justify-content: space-between;
42
+ font-family: inherit;
43
+ font-size: 1rem;
44
+ line-height: 1.25rem;
45
+ padding: 0.75rem 1rem;
46
+ width: 100%;
13
47
  }
14
- .eds-contrast .eds-dropdown option {
48
+ .eds-dropdown-list__item:first-child {
49
+ border-top: 0.125rem solid #e9e9e9;
50
+ }
51
+ .eds-dropdown-list__item:last-child {
52
+ border-bottom: none;
53
+ }
54
+ .eds-contrast .eds-dropdown-list__item {
15
55
  color: #181c56;
56
+ border-color: #54568c;
57
+ background-color: #ffffff;
58
+ }
59
+ .eds-dropdown-list__item--highlighted {
60
+ background-color: #d1d4e3;
61
+ }
62
+ .eds-contrast .eds-dropdown-list__item--highlighted {
63
+ background-color: #d1d4e3;
64
+ }
65
+
66
+ .eds-dropdown-list__item-icon {
67
+ margin-left: 0.75rem;
16
68
  }/* DO NOT CHANGE!*/
17
69
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
18
70
  .eds-multi-select {
@@ -96,7 +148,14 @@
96
148
  }
97
149
  .eds-multiselect-checkbox--checked .eds-checkbox-icon__path {
98
150
  stroke: #ffffff;
99
- animation: stroke ease-in-out 0.2s 0.1s forwards;
151
+ -webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
152
+ animation: stroke ease-in-out 0.2s 0.1s forwards;
153
+ }
154
+
155
+ @-webkit-keyframes stroke {
156
+ 100% {
157
+ stroke-dashoffset: 0;
158
+ }
100
159
  }
101
160
 
102
161
  @keyframes stroke {
@@ -105,69 +164,17 @@
105
164
  }
106
165
  }/* DO NOT CHANGE!*/
107
166
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
108
- .eds-dropdown-list {
109
- border-radius: 0.25rem;
110
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
111
- display: none;
112
- list-style: none;
113
- margin: 0;
114
- max-height: 50vh;
115
- padding: 0;
116
- position: relative;
117
- overflow-y: auto;
118
- width: 100%;
119
- z-index: 20;
120
- }
121
- .eds-contrast .eds-dropdown-list {
122
- box-shadow: 0 0.0625rem 0.1875rem #393d79;
123
- }
124
- .eds-dropdown-list--open {
125
- display: inline-block;
126
- }
127
- .eds-dropdown-list:focus {
128
- outline: none;
129
- }
130
- @media all and (min-width: 50rem) {
131
- .eds-dropdown-list {
132
- max-height: 30vh;
133
- }
167
+ .eds-dropdown + .eds-form-control__append {
168
+ margin-left: -2em;
169
+ pointer-events: none;
134
170
  }
135
171
 
136
- .eds-dropdown-list__item {
137
- align-items: center;
138
- background-color: #f8f8f8;
139
- border-bottom: 0.125rem solid #e9e9e9;
140
- border-left: 0.125rem solid #e9e9e9;
141
- border-right: 0.125rem solid #e9e9e9;
142
- color: #181c56;
143
- display: flex;
144
- justify-content: space-between;
145
- font-family: inherit;
146
- font-size: 1rem;
147
- line-height: 1.25rem;
148
- padding: 0.75rem 1rem;
149
- width: 100%;
150
- }
151
- .eds-dropdown-list__item:first-child {
152
- border-top: 0.125rem solid #e9e9e9;
153
- }
154
- .eds-dropdown-list__item:last-child {
155
- border-bottom: none;
156
- }
157
- .eds-contrast .eds-dropdown-list__item {
172
+ .eds-dropdown option {
158
173
  color: #181c56;
159
- border-color: #54568c;
160
174
  background-color: #ffffff;
161
175
  }
162
- .eds-dropdown-list__item--highlighted {
163
- background-color: #d1d4e3;
164
- }
165
- .eds-contrast .eds-dropdown-list__item--highlighted {
166
- background-color: #d1d4e3;
167
- }
168
-
169
- .eds-dropdown-list__item-icon {
170
- margin-left: 0.75rem;
176
+ .eds-contrast .eds-dropdown option {
177
+ color: #181c56;
171
178
  }/* DO NOT CHANGE!*/
172
179
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
173
180
  .eds-inline-spinner {
@@ -188,6 +195,23 @@
188
195
  overflow-x: hidden;
189
196
  text-overflow: ellipsis;
190
197
  white-space: nowrap;
198
+ }
199
+ .eds-dropdown__searchable-selected-item__wrapper {
200
+ max-width: 65%;
201
+ }
202
+
203
+ .eds-form-control.eds-dropdown__input::-moz-placeholder {
204
+ -moz-transition: none;
205
+ transition: none;
206
+ }
207
+
208
+ .eds-form-control.eds-dropdown__input:-ms-input-placeholder {
209
+ -ms-transition: none;
210
+ transition: none;
211
+ }
212
+
213
+ .eds-form-control.eds-dropdown__input::placeholder {
214
+ transition: none;
191
215
  }/* DO NOT CHANGE!*/
192
216
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
193
217
  .eds-dropdown-wrapper {
@@ -201,6 +225,14 @@
201
225
  align-items: center;
202
226
  }
203
227
 
228
+ .eds-dropdown__input::-moz-placeholder {
229
+ color: #656782;
230
+ }
231
+
232
+ .eds-dropdown__input:-ms-input-placeholder {
233
+ color: #656782;
234
+ }
235
+
204
236
  .eds-dropdown__input::placeholder {
205
237
  color: #656782;
206
238
  }
@@ -244,7 +276,9 @@
244
276
  }/* DO NOT CHANGE!*/
245
277
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
246
278
  .eds-dropdown__toggle-button {
247
- appearance: none;
279
+ -webkit-appearance: none;
280
+ -moz-appearance: none;
281
+ appearance: none;
248
282
  background: none;
249
283
  border: none;
250
284
  border-radius: 0;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/dropdown",
3
- "version": "2.3.0",
3
+ "version": "3.0.2",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/dropdown.esm.js",
@@ -28,15 +28,15 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@entur/a11y": "^0.2.42",
31
- "@entur/chip": "^0.5.0",
32
- "@entur/form": "^5.3.0",
33
- "@entur/icons": "^3.5.0",
31
+ "@entur/chip": "^0.5.3",
32
+ "@entur/form": "^5.3.2",
33
+ "@entur/icons": "^4.1.0",
34
34
  "@entur/loader": "^0.4.5",
35
35
  "@entur/tokens": "^3.3.1",
36
- "@entur/tooltip": "^2.5.3",
36
+ "@entur/tooltip": "^2.5.5",
37
37
  "@entur/utils": "^0.4.3",
38
38
  "classnames": "^2.3.1",
39
39
  "downshift": "^6.1.7"
40
40
  },
41
- "gitHead": "c672c8396ce0c3d436746e4299680137488d579d"
41
+ "gitHead": "c10b4f0f9ecda0126bc916b80ca694cf8d58e399"
42
42
  }