@entur/chip 0.6.5 → 0.6.7
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/CHANGELOG.md +4 -0
- package/dist/styles.css +131 -131
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.6.6](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.6.5...@entur/chip@0.6.6) (2022-08-31)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @entur/chip
|
|
9
|
+
|
|
6
10
|
## [0.6.5](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.6.4...@entur/chip@0.6.5) (2022-08-24)
|
|
7
11
|
|
|
8
12
|
**Note:** Version bump only for package @entur/chip
|
package/dist/styles.css
CHANGED
|
@@ -2,44 +2,43 @@
|
|
|
2
2
|
--eds-chip: 1;
|
|
3
3
|
}/* DO NOT CHANGE!*/
|
|
4
4
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
|
-
.eds-
|
|
6
|
-
cursor: default;
|
|
7
|
-
padding-right: 0.25rem;
|
|
8
|
-
width: -webkit-fit-content;
|
|
9
|
-
width: -moz-fit-content;
|
|
10
|
-
width: fit-content;
|
|
11
|
-
}
|
|
12
|
-
.eds-tag-chip__close-button {
|
|
13
|
-
-webkit-appearance: none;
|
|
14
|
-
-moz-appearance: none;
|
|
15
|
-
appearance: none;
|
|
16
|
-
background: none;
|
|
17
|
-
border: none;
|
|
18
|
-
border-radius: 50%;
|
|
19
|
-
color: #181c56;
|
|
5
|
+
.eds-action-chip {
|
|
20
6
|
cursor: pointer;
|
|
21
|
-
display: flex;
|
|
22
|
-
font-size: 0.875rem;
|
|
23
|
-
padding: 0.25rem;
|
|
24
|
-
margin-left: 0.25rem;
|
|
25
|
-
transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
26
|
-
}
|
|
27
|
-
.eds-contrast .eds-tag-chip__close-button {
|
|
28
|
-
color: #ffffff;
|
|
29
|
-
}
|
|
30
|
-
.eds-tag-chip__close-button:hover {
|
|
31
|
-
background: #babbcf;
|
|
32
|
-
}
|
|
33
|
-
.eds-contrast .eds-tag-chip__close-button:hover {
|
|
34
|
-
background: #54568c;
|
|
35
7
|
}
|
|
36
|
-
.eds-
|
|
37
|
-
outline-offset: 0.125rem;
|
|
8
|
+
.eds-action-chip:focus {
|
|
38
9
|
outline: none;
|
|
39
10
|
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
11
|
+
outline-offset: 0.125rem;
|
|
40
12
|
}
|
|
41
|
-
.eds-contrast .eds-
|
|
13
|
+
.eds-contrast .eds-action-chip:focus {
|
|
42
14
|
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
15
|
+
}
|
|
16
|
+
.eds-action-chip:hover {
|
|
17
|
+
border-color: #181c56;
|
|
18
|
+
}
|
|
19
|
+
.eds-contrast .eds-action-chip:hover {
|
|
20
|
+
background-color: #54568c;
|
|
21
|
+
border-color: #54568c;
|
|
22
|
+
}
|
|
23
|
+
.eds-action-chip:active {
|
|
24
|
+
background: #d1d4e3;
|
|
25
|
+
}
|
|
26
|
+
.eds-contrast .eds-action-chip:active {
|
|
27
|
+
background-color: #292b6a;
|
|
28
|
+
border-color: #292b6a;
|
|
29
|
+
}
|
|
30
|
+
.eds-action-chip--disabled {
|
|
31
|
+
opacity: 0.5;
|
|
32
|
+
pointer-events: none;
|
|
33
|
+
}
|
|
34
|
+
.eds-action-chip--disabled__wrapper {
|
|
35
|
+
cursor: not-allowed;
|
|
36
|
+
width: -webkit-fit-content;
|
|
37
|
+
width: -moz-fit-content;
|
|
38
|
+
width: fit-content;
|
|
39
|
+
}
|
|
40
|
+
.eds-contrast .eds-action-chip__loading-dots .eds-loading-dots__dot {
|
|
41
|
+
background-color: #ffffff;
|
|
43
42
|
}/* DO NOT CHANGE!*/
|
|
44
43
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
45
44
|
.eds-chip {
|
|
@@ -71,98 +70,44 @@
|
|
|
71
70
|
margin-left: 0.5rem;
|
|
72
71
|
}/* DO NOT CHANGE!*/
|
|
73
72
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
74
|
-
.eds-
|
|
75
|
-
cursor:
|
|
76
|
-
-
|
|
77
|
-
-moz-user-select: none;
|
|
78
|
-
-ms-user-select: none;
|
|
79
|
-
user-select: none;
|
|
80
|
-
padding-left: 0.25rem;
|
|
73
|
+
.eds-tag-chip {
|
|
74
|
+
cursor: default;
|
|
75
|
+
padding-right: 0.25rem;
|
|
81
76
|
width: -webkit-fit-content;
|
|
82
77
|
width: -moz-fit-content;
|
|
83
78
|
width: fit-content;
|
|
84
79
|
}
|
|
85
|
-
.eds-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
80
|
+
.eds-tag-chip__close-button {
|
|
81
|
+
-webkit-appearance: none;
|
|
82
|
+
-moz-appearance: none;
|
|
83
|
+
appearance: none;
|
|
84
|
+
background: none;
|
|
85
|
+
border: none;
|
|
86
|
+
border-radius: 50%;
|
|
87
|
+
color: #181c56;
|
|
88
|
+
cursor: pointer;
|
|
89
|
+
display: flex;
|
|
90
|
+
font-size: 0.875rem;
|
|
91
|
+
padding: 0.25rem;
|
|
92
|
+
margin-left: 0.25rem;
|
|
93
|
+
transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
90
94
|
}
|
|
91
|
-
.eds-
|
|
92
|
-
|
|
95
|
+
.eds-contrast .eds-tag-chip__close-button {
|
|
96
|
+
color: #ffffff;
|
|
93
97
|
}
|
|
94
|
-
.eds-
|
|
95
|
-
|
|
96
|
-
-webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
97
|
-
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
98
|
+
.eds-tag-chip__close-button:hover {
|
|
99
|
+
background: #babbcf;
|
|
98
100
|
}
|
|
99
|
-
.eds-contrast .eds-
|
|
100
|
-
|
|
101
|
+
.eds-contrast .eds-tag-chip__close-button:hover {
|
|
102
|
+
background: #54568c;
|
|
101
103
|
}
|
|
102
|
-
.eds-
|
|
103
|
-
outline: none;
|
|
104
|
-
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
104
|
+
.eds-tag-chip__close-button:focus {
|
|
105
105
|
outline-offset: 0.125rem;
|
|
106
|
-
}
|
|
107
|
-
.eds-filter-chip:focus-within {
|
|
108
106
|
outline: none;
|
|
109
107
|
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
110
|
-
outline-offset: 0.125rem;
|
|
111
|
-
}
|
|
112
|
-
.eds-contrast .eds-filter-chip[focus-within] {
|
|
113
|
-
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
114
108
|
}
|
|
115
|
-
.eds-contrast .eds-
|
|
109
|
+
.eds-contrast .eds-tag-chip__close-button:focus {
|
|
116
110
|
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
117
|
-
}
|
|
118
|
-
.eds-filter-chip:hover {
|
|
119
|
-
border-color: #181c56;
|
|
120
|
-
}
|
|
121
|
-
.eds-contrast .eds-filter-chip:hover {
|
|
122
|
-
background-color: #54568c;
|
|
123
|
-
border-color: #54568c;
|
|
124
|
-
}
|
|
125
|
-
.eds-filter-chip__icon {
|
|
126
|
-
display: inline-flex;
|
|
127
|
-
justify-content: center;
|
|
128
|
-
align-items: center;
|
|
129
|
-
position: relative;
|
|
130
|
-
margin-right: 0.5rem;
|
|
131
|
-
height: 1.5rem;
|
|
132
|
-
width: 1.5rem;
|
|
133
|
-
border: 0.125rem solid transparent;
|
|
134
|
-
border-radius: 50%;
|
|
135
|
-
background-color: #ffffff;
|
|
136
|
-
color: #ffffff;
|
|
137
|
-
}
|
|
138
|
-
.eds-contrast .eds-filter-chip__icon {
|
|
139
|
-
background-color: #181c56;
|
|
140
|
-
}
|
|
141
|
-
.eds-filter-chip__icon .eds-filter-chip-icon {
|
|
142
|
-
height: 1rem;
|
|
143
|
-
width: 1rem;
|
|
144
|
-
visibility: hidden;
|
|
145
|
-
}
|
|
146
|
-
.eds-contrast .eds-filter-chip__icon .eds-filter-chip-icon {
|
|
147
|
-
color: #ffffff;
|
|
148
|
-
}
|
|
149
|
-
.eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
150
|
-
transform-origin: 50% 50%;
|
|
151
|
-
stroke-dasharray: 48;
|
|
152
|
-
stroke-dashoffset: 48;
|
|
153
|
-
stroke-width: 0.375rem;
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
@-webkit-keyframes stroke {
|
|
157
|
-
100% {
|
|
158
|
-
stroke-dashoffset: 0;
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
@keyframes stroke {
|
|
163
|
-
100% {
|
|
164
|
-
stroke-dashoffset: 0;
|
|
165
|
-
}
|
|
166
111
|
}/* DO NOT CHANGE!*/
|
|
167
112
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
168
113
|
.eds-choice-chip {
|
|
@@ -236,41 +181,96 @@
|
|
|
236
181
|
color: #babbcf;
|
|
237
182
|
}/* DO NOT CHANGE!*/
|
|
238
183
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
239
|
-
.eds-
|
|
184
|
+
.eds-filter-chip {
|
|
240
185
|
cursor: pointer;
|
|
186
|
+
-webkit-user-select: none;
|
|
187
|
+
-moz-user-select: none;
|
|
188
|
+
-ms-user-select: none;
|
|
189
|
+
user-select: none;
|
|
190
|
+
padding-left: 0.25rem;
|
|
191
|
+
width: -webkit-fit-content;
|
|
192
|
+
width: -moz-fit-content;
|
|
193
|
+
width: fit-content;
|
|
241
194
|
}
|
|
242
|
-
.eds-
|
|
195
|
+
.eds-filter-chip__input {
|
|
196
|
+
position: absolute;
|
|
197
|
+
opacity: 0;
|
|
198
|
+
height: 0;
|
|
199
|
+
width: 0;
|
|
200
|
+
}
|
|
201
|
+
.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon {
|
|
202
|
+
visibility: visible;
|
|
203
|
+
}
|
|
204
|
+
.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
205
|
+
stroke: #181c56;
|
|
206
|
+
-webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
207
|
+
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
208
|
+
}
|
|
209
|
+
.eds-contrast .eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
210
|
+
stroke: #5ac39a;
|
|
211
|
+
}
|
|
212
|
+
.eds-filter-chip[focus-within] {
|
|
243
213
|
outline: none;
|
|
244
214
|
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
245
215
|
outline-offset: 0.125rem;
|
|
246
216
|
}
|
|
247
|
-
.eds-
|
|
217
|
+
.eds-filter-chip:focus-within {
|
|
218
|
+
outline: none;
|
|
219
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
220
|
+
outline-offset: 0.125rem;
|
|
221
|
+
}
|
|
222
|
+
.eds-contrast .eds-filter-chip[focus-within] {
|
|
248
223
|
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
249
224
|
}
|
|
250
|
-
.eds-
|
|
225
|
+
.eds-contrast .eds-filter-chip:focus-within {
|
|
226
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
227
|
+
}
|
|
228
|
+
.eds-filter-chip:hover {
|
|
251
229
|
border-color: #181c56;
|
|
252
230
|
}
|
|
253
|
-
.eds-contrast .eds-
|
|
231
|
+
.eds-contrast .eds-filter-chip:hover {
|
|
254
232
|
background-color: #54568c;
|
|
255
233
|
border-color: #54568c;
|
|
256
234
|
}
|
|
257
|
-
.eds-
|
|
258
|
-
|
|
235
|
+
.eds-filter-chip__icon {
|
|
236
|
+
display: inline-flex;
|
|
237
|
+
justify-content: center;
|
|
238
|
+
align-items: center;
|
|
239
|
+
position: relative;
|
|
240
|
+
margin-right: 0.5rem;
|
|
241
|
+
height: 1.5rem;
|
|
242
|
+
width: 1.5rem;
|
|
243
|
+
border: 0.125rem solid transparent;
|
|
244
|
+
border-radius: 50%;
|
|
245
|
+
background-color: #ffffff;
|
|
246
|
+
color: #ffffff;
|
|
259
247
|
}
|
|
260
|
-
.eds-contrast .eds-
|
|
261
|
-
background-color: #
|
|
262
|
-
border-color: #292b6a;
|
|
248
|
+
.eds-contrast .eds-filter-chip__icon {
|
|
249
|
+
background-color: #181c56;
|
|
263
250
|
}
|
|
264
|
-
.eds-
|
|
265
|
-
|
|
266
|
-
|
|
251
|
+
.eds-filter-chip__icon .eds-filter-chip-icon {
|
|
252
|
+
height: 1rem;
|
|
253
|
+
width: 1rem;
|
|
254
|
+
visibility: hidden;
|
|
267
255
|
}
|
|
268
|
-
.eds-
|
|
269
|
-
|
|
270
|
-
width: -webkit-fit-content;
|
|
271
|
-
width: -moz-fit-content;
|
|
272
|
-
width: fit-content;
|
|
256
|
+
.eds-contrast .eds-filter-chip__icon .eds-filter-chip-icon {
|
|
257
|
+
color: #ffffff;
|
|
273
258
|
}
|
|
274
|
-
.eds-
|
|
275
|
-
|
|
259
|
+
.eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
260
|
+
transform-origin: 50% 50%;
|
|
261
|
+
stroke-dasharray: 48;
|
|
262
|
+
stroke-dashoffset: 48;
|
|
263
|
+
stroke-width: 0.375rem;
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
@-webkit-keyframes stroke {
|
|
267
|
+
100% {
|
|
268
|
+
stroke-dashoffset: 0;
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
@keyframes stroke {
|
|
273
|
+
100% {
|
|
274
|
+
stroke-dashoffset: 0;
|
|
275
|
+
}
|
|
276
276
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/chip",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.7",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/chip.esm.js",
|
|
@@ -27,10 +27,10 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/form": "^5.4.
|
|
30
|
+
"@entur/form": "^5.4.4",
|
|
31
31
|
"@entur/tokens": "^3.4.1",
|
|
32
|
-
"@entur/utils": "^0.4.
|
|
32
|
+
"@entur/utils": "^0.4.5",
|
|
33
33
|
"classnames": "^2.3.1"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "c1318d134c4097efd550872cabf41b1e67940eae"
|
|
36
36
|
}
|