@entur/chip 0.6.3 → 0.6.4
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 +6 -0
- package/dist/styles.css +104 -105
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,12 @@
|
|
|
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.4](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.6.3...@entur/chip@0.6.4) (2022-08-12)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- **choice chip:** remove opacitiy when chip is disabled ([7412724](https://bitbucket.org/enturas/design-system/commits/741272400dda7ff77aa58b5032dd91f91d3a0393))
|
|
11
|
+
|
|
6
12
|
## [0.6.3](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.6.2...@entur/chip@0.6.3) (2022-08-09)
|
|
7
13
|
|
|
8
14
|
**Note:** Version bump only for package @entur/chip
|
package/dist/styles.css
CHANGED
|
@@ -70,44 +70,98 @@
|
|
|
70
70
|
margin-left: 0.5rem;
|
|
71
71
|
}/* DO NOT CHANGE!*/
|
|
72
72
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
73
|
-
.eds-
|
|
74
|
-
cursor:
|
|
75
|
-
|
|
73
|
+
.eds-filter-chip {
|
|
74
|
+
cursor: pointer;
|
|
75
|
+
-webkit-user-select: none;
|
|
76
|
+
-moz-user-select: none;
|
|
77
|
+
-ms-user-select: none;
|
|
78
|
+
user-select: none;
|
|
79
|
+
padding-left: 0.25rem;
|
|
76
80
|
width: -webkit-fit-content;
|
|
77
81
|
width: -moz-fit-content;
|
|
78
82
|
width: fit-content;
|
|
79
83
|
}
|
|
80
|
-
.eds-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
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;
|
|
84
|
+
.eds-filter-chip__input {
|
|
85
|
+
position: absolute;
|
|
86
|
+
opacity: 0;
|
|
87
|
+
height: 0;
|
|
88
|
+
width: 0;
|
|
94
89
|
}
|
|
95
|
-
.eds-
|
|
96
|
-
|
|
90
|
+
.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon {
|
|
91
|
+
visibility: visible;
|
|
97
92
|
}
|
|
98
|
-
.eds-
|
|
99
|
-
|
|
93
|
+
.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
94
|
+
stroke: #181c56;
|
|
95
|
+
-webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
96
|
+
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
100
97
|
}
|
|
101
|
-
.eds-contrast .eds-
|
|
102
|
-
|
|
98
|
+
.eds-contrast .eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
99
|
+
stroke: #5ac39a;
|
|
103
100
|
}
|
|
104
|
-
.eds-
|
|
101
|
+
.eds-filter-chip[focus-within] {
|
|
102
|
+
outline: none;
|
|
103
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
105
104
|
outline-offset: 0.125rem;
|
|
105
|
+
}
|
|
106
|
+
.eds-filter-chip:focus-within {
|
|
106
107
|
outline: none;
|
|
107
108
|
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
109
|
+
outline-offset: 0.125rem;
|
|
108
110
|
}
|
|
109
|
-
.eds-contrast .eds-
|
|
111
|
+
.eds-contrast .eds-filter-chip[focus-within] {
|
|
110
112
|
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
113
|
+
}
|
|
114
|
+
.eds-contrast .eds-filter-chip:focus-within {
|
|
115
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
116
|
+
}
|
|
117
|
+
.eds-filter-chip:hover {
|
|
118
|
+
border-color: #181c56;
|
|
119
|
+
}
|
|
120
|
+
.eds-contrast .eds-filter-chip:hover {
|
|
121
|
+
background-color: #54568c;
|
|
122
|
+
border-color: #54568c;
|
|
123
|
+
}
|
|
124
|
+
.eds-filter-chip__icon {
|
|
125
|
+
display: inline-flex;
|
|
126
|
+
justify-content: center;
|
|
127
|
+
align-items: center;
|
|
128
|
+
position: relative;
|
|
129
|
+
margin-right: 0.5rem;
|
|
130
|
+
height: 1.5rem;
|
|
131
|
+
width: 1.5rem;
|
|
132
|
+
border: 0.125rem solid transparent;
|
|
133
|
+
border-radius: 50%;
|
|
134
|
+
background-color: #ffffff;
|
|
135
|
+
color: #ffffff;
|
|
136
|
+
}
|
|
137
|
+
.eds-contrast .eds-filter-chip__icon {
|
|
138
|
+
background-color: #181c56;
|
|
139
|
+
}
|
|
140
|
+
.eds-filter-chip__icon .eds-filter-chip-icon {
|
|
141
|
+
height: 1rem;
|
|
142
|
+
width: 1rem;
|
|
143
|
+
visibility: hidden;
|
|
144
|
+
}
|
|
145
|
+
.eds-contrast .eds-filter-chip__icon .eds-filter-chip-icon {
|
|
146
|
+
color: #ffffff;
|
|
147
|
+
}
|
|
148
|
+
.eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
149
|
+
transform-origin: 50% 50%;
|
|
150
|
+
stroke-dasharray: 48;
|
|
151
|
+
stroke-dashoffset: 48;
|
|
152
|
+
stroke-width: 0.375rem;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
@-webkit-keyframes stroke {
|
|
156
|
+
100% {
|
|
157
|
+
stroke-dashoffset: 0;
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
@keyframes stroke {
|
|
162
|
+
100% {
|
|
163
|
+
stroke-dashoffset: 0;
|
|
164
|
+
}
|
|
111
165
|
}/* DO NOT CHANGE!*/
|
|
112
166
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
113
167
|
.eds-choice-chip {
|
|
@@ -172,7 +226,6 @@
|
|
|
172
226
|
background: #33376d;
|
|
173
227
|
}
|
|
174
228
|
.eds-choice-chip .eds-chip--disabled {
|
|
175
|
-
opacity: 0.5;
|
|
176
229
|
border-style: dashed;
|
|
177
230
|
cursor: not-allowed;
|
|
178
231
|
}
|
|
@@ -182,96 +235,42 @@
|
|
|
182
235
|
color: #babbcf;
|
|
183
236
|
}/* DO NOT CHANGE!*/
|
|
184
237
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
185
|
-
.eds-
|
|
186
|
-
cursor:
|
|
187
|
-
-
|
|
188
|
-
-moz-user-select: none;
|
|
189
|
-
-ms-user-select: none;
|
|
190
|
-
user-select: none;
|
|
191
|
-
padding-left: 0.25rem;
|
|
238
|
+
.eds-tag-chip {
|
|
239
|
+
cursor: default;
|
|
240
|
+
padding-right: 0.25rem;
|
|
192
241
|
width: -webkit-fit-content;
|
|
193
242
|
width: -moz-fit-content;
|
|
194
243
|
width: fit-content;
|
|
195
244
|
}
|
|
196
|
-
.eds-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
245
|
+
.eds-tag-chip__close-button {
|
|
246
|
+
-webkit-appearance: none;
|
|
247
|
+
-moz-appearance: none;
|
|
248
|
+
appearance: none;
|
|
249
|
+
background: none;
|
|
250
|
+
border: none;
|
|
251
|
+
border-radius: 50%;
|
|
252
|
+
color: #181c56;
|
|
253
|
+
cursor: pointer;
|
|
254
|
+
display: flex;
|
|
255
|
+
font-size: 0.875rem;
|
|
256
|
+
padding: 0.25rem;
|
|
257
|
+
margin-left: 0.25rem;
|
|
258
|
+
transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
201
259
|
}
|
|
202
|
-
.eds-
|
|
203
|
-
|
|
260
|
+
.eds-contrast .eds-tag-chip__close-button {
|
|
261
|
+
color: #ffffff;
|
|
204
262
|
}
|
|
205
|
-
.eds-
|
|
206
|
-
|
|
207
|
-
-webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
208
|
-
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
263
|
+
.eds-tag-chip__close-button:hover {
|
|
264
|
+
background: #babbcf;
|
|
209
265
|
}
|
|
210
|
-
.eds-contrast .eds-
|
|
211
|
-
|
|
266
|
+
.eds-contrast .eds-tag-chip__close-button:hover {
|
|
267
|
+
background: #54568c;
|
|
212
268
|
}
|
|
213
|
-
.eds-
|
|
214
|
-
outline: none;
|
|
215
|
-
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
269
|
+
.eds-tag-chip__close-button:focus {
|
|
216
270
|
outline-offset: 0.125rem;
|
|
217
|
-
}
|
|
218
|
-
.eds-filter-chip:focus-within {
|
|
219
271
|
outline: none;
|
|
220
272
|
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
221
|
-
outline-offset: 0.125rem;
|
|
222
|
-
}
|
|
223
|
-
.eds-contrast .eds-filter-chip[focus-within] {
|
|
224
|
-
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
225
273
|
}
|
|
226
|
-
.eds-contrast .eds-
|
|
274
|
+
.eds-contrast .eds-tag-chip__close-button:focus {
|
|
227
275
|
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
228
|
-
}
|
|
229
|
-
.eds-filter-chip:hover {
|
|
230
|
-
border-color: #181c56;
|
|
231
|
-
}
|
|
232
|
-
.eds-contrast .eds-filter-chip:hover {
|
|
233
|
-
background-color: #54568c;
|
|
234
|
-
border-color: #54568c;
|
|
235
|
-
}
|
|
236
|
-
.eds-filter-chip__icon {
|
|
237
|
-
display: inline-flex;
|
|
238
|
-
justify-content: center;
|
|
239
|
-
align-items: center;
|
|
240
|
-
position: relative;
|
|
241
|
-
margin-right: 0.5rem;
|
|
242
|
-
height: 1.5rem;
|
|
243
|
-
width: 1.5rem;
|
|
244
|
-
border: 0.125rem solid transparent;
|
|
245
|
-
border-radius: 50%;
|
|
246
|
-
background-color: #ffffff;
|
|
247
|
-
color: #ffffff;
|
|
248
|
-
}
|
|
249
|
-
.eds-contrast .eds-filter-chip__icon {
|
|
250
|
-
background-color: #181c56;
|
|
251
|
-
}
|
|
252
|
-
.eds-filter-chip__icon .eds-filter-chip-icon {
|
|
253
|
-
height: 1rem;
|
|
254
|
-
width: 1rem;
|
|
255
|
-
visibility: hidden;
|
|
256
|
-
}
|
|
257
|
-
.eds-contrast .eds-filter-chip__icon .eds-filter-chip-icon {
|
|
258
|
-
color: #ffffff;
|
|
259
|
-
}
|
|
260
|
-
.eds-filter-chip__icon .eds-filter-chip-icon__path {
|
|
261
|
-
transform-origin: 50% 50%;
|
|
262
|
-
stroke-dasharray: 48;
|
|
263
|
-
stroke-dashoffset: 48;
|
|
264
|
-
stroke-width: 0.375rem;
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
@-webkit-keyframes stroke {
|
|
268
|
-
100% {
|
|
269
|
-
stroke-dashoffset: 0;
|
|
270
|
-
}
|
|
271
|
-
}
|
|
272
|
-
|
|
273
|
-
@keyframes stroke {
|
|
274
|
-
100% {
|
|
275
|
-
stroke-dashoffset: 0;
|
|
276
|
-
}
|
|
277
276
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/chip",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.4",
|
|
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.1",
|
|
31
31
|
"@entur/tokens": "^3.4.0",
|
|
32
32
|
"@entur/utils": "^0.4.3",
|
|
33
33
|
"classnames": "^2.3.1"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "a3da0071a393c0ec1c6194ffe50f51ee13edd5e6"
|
|
36
36
|
}
|