@vaadin/checkbox 24.4.6 → 24.5.0-alpha10
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/README.md
CHANGED
|
@@ -53,7 +53,7 @@ import '@vaadin/checkbox/src/vaadin-checkbox.js';
|
|
|
53
53
|
|
|
54
54
|
## Contributing
|
|
55
55
|
|
|
56
|
-
Read the [contributing guide](https://vaadin.com/docs/latest/contributing
|
|
56
|
+
Read the [contributing guide](https://vaadin.com/docs/latest/contributing) to learn about our development process, how to propose bugfixes and improvements, and how to test your changes to Vaadin components.
|
|
57
57
|
|
|
58
58
|
## License
|
|
59
59
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/checkbox",
|
|
3
|
-
"version": "24.
|
|
3
|
+
"version": "24.5.0-alpha10",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -37,22 +37,22 @@
|
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
39
39
|
"@polymer/polymer": "^3.0.0",
|
|
40
|
-
"@vaadin/a11y-base": "
|
|
41
|
-
"@vaadin/component-base": "
|
|
42
|
-
"@vaadin/field-base": "
|
|
43
|
-
"@vaadin/vaadin-lumo-styles": "
|
|
44
|
-
"@vaadin/vaadin-material-styles": "
|
|
45
|
-
"@vaadin/vaadin-themable-mixin": "
|
|
40
|
+
"@vaadin/a11y-base": "24.5.0-alpha10",
|
|
41
|
+
"@vaadin/component-base": "24.5.0-alpha10",
|
|
42
|
+
"@vaadin/field-base": "24.5.0-alpha10",
|
|
43
|
+
"@vaadin/vaadin-lumo-styles": "24.5.0-alpha10",
|
|
44
|
+
"@vaadin/vaadin-material-styles": "24.5.0-alpha10",
|
|
45
|
+
"@vaadin/vaadin-themable-mixin": "24.5.0-alpha10",
|
|
46
46
|
"lit": "^3.0.0"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@
|
|
50
|
-
"@vaadin/testing-helpers": "^0.
|
|
51
|
-
"sinon": "^
|
|
49
|
+
"@vaadin/chai-plugins": "24.5.0-alpha10",
|
|
50
|
+
"@vaadin/testing-helpers": "^1.0.0",
|
|
51
|
+
"sinon": "^18.0.0"
|
|
52
52
|
},
|
|
53
53
|
"web-types": [
|
|
54
54
|
"web-types.json",
|
|
55
55
|
"web-types.lit.json"
|
|
56
56
|
],
|
|
57
|
-
"gitHead": "
|
|
57
|
+
"gitHead": "6f9c37308031af872a98017bfab4de89aeacda51"
|
|
58
58
|
}
|
|
@@ -27,6 +27,7 @@ registerStyles(
|
|
|
27
27
|
--_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
|
|
28
28
|
--_selection-color: var(--vaadin-selection-color, var(--lumo-primary-color));
|
|
29
29
|
--_invalid-background: var(--vaadin-input-field-invalid-background, var(--lumo-error-color-10pct));
|
|
30
|
+
--_disabled-checkmark-color: var(--vaadin-checkbox-disabled-checkmark-color, var(--lumo-contrast-30pct));
|
|
30
31
|
}
|
|
31
32
|
|
|
32
33
|
[part='label'] {
|
|
@@ -57,7 +58,9 @@ registerStyles(
|
|
|
57
58
|
position: relative;
|
|
58
59
|
border-radius: var(--vaadin-checkbox-border-radius, var(--lumo-border-radius-s));
|
|
59
60
|
background: var(--vaadin-checkbox-background, var(--lumo-contrast-20pct));
|
|
60
|
-
transition:
|
|
61
|
+
transition:
|
|
62
|
+
transform 0.2s cubic-bezier(0.12, 0.32, 0.54, 2),
|
|
63
|
+
background-color 0.15s;
|
|
61
64
|
cursor: var(--lumo-clickable-cursor);
|
|
62
65
|
/* Default field border color */
|
|
63
66
|
--_input-border-color: var(--vaadin-input-field-border-color, var(--lumo-contrast-50pct));
|
|
@@ -128,12 +131,16 @@ registerStyles(
|
|
|
128
131
|
|
|
129
132
|
/* Focus ring */
|
|
130
133
|
:host([focus-ring]) [part='checkbox'] {
|
|
131
|
-
box-shadow:
|
|
134
|
+
box-shadow:
|
|
135
|
+
0 0 0 1px var(--lumo-base-color),
|
|
136
|
+
0 0 0 calc(var(--_focus-ring-width) + 1px) var(--_focus-ring-color),
|
|
132
137
|
inset 0 0 0 var(--_input-border-width, 0) var(--_input-border-color);
|
|
133
138
|
}
|
|
134
139
|
|
|
135
140
|
:host([focus-ring][readonly]:not([checked]):not([indeterminate])) [part='checkbox'] {
|
|
136
|
-
box-shadow:
|
|
141
|
+
box-shadow:
|
|
142
|
+
0 0 0 1px var(--lumo-base-color),
|
|
143
|
+
0 0 0 calc(var(--_focus-ring-width) + 1px) var(--_focus-ring-color);
|
|
137
144
|
}
|
|
138
145
|
|
|
139
146
|
/* Disabled */
|
|
@@ -147,11 +154,11 @@ registerStyles(
|
|
|
147
154
|
}
|
|
148
155
|
|
|
149
156
|
:host([disabled]) [part='checkbox'] {
|
|
150
|
-
background-color: var(--lumo-contrast-10pct);
|
|
157
|
+
background-color: var(--vaadin-checkbox-disabled-background, var(--lumo-contrast-10pct));
|
|
151
158
|
}
|
|
152
159
|
|
|
153
160
|
:host([disabled]) [part='checkbox']::after {
|
|
154
|
-
color: var(--
|
|
161
|
+
color: var(--_disabled-checkmark-color);
|
|
155
162
|
}
|
|
156
163
|
|
|
157
164
|
:host([disabled]) [part='label'],
|
|
@@ -161,7 +168,7 @@ registerStyles(
|
|
|
161
168
|
}
|
|
162
169
|
|
|
163
170
|
:host([indeterminate][disabled]) [part='checkbox']::after {
|
|
164
|
-
background-color: var(--
|
|
171
|
+
background-color: var(--_disabled-checkmark-color);
|
|
165
172
|
}
|
|
166
173
|
|
|
167
174
|
:host([readonly][checked]) [part='checkbox'],
|
|
@@ -180,7 +187,9 @@ registerStyles(
|
|
|
180
187
|
background-color: inherit;
|
|
181
188
|
transform: scale(1.4);
|
|
182
189
|
opacity: 0;
|
|
183
|
-
transition:
|
|
190
|
+
transition:
|
|
191
|
+
transform 0.1s,
|
|
192
|
+
opacity 0.8s;
|
|
184
193
|
}
|
|
185
194
|
|
|
186
195
|
/* Hover */
|
|
@@ -45,7 +45,9 @@ registerStyles(
|
|
|
45
45
|
background-color: var(--material-disabled-text-color);
|
|
46
46
|
transform: scale(0);
|
|
47
47
|
opacity: 0;
|
|
48
|
-
transition:
|
|
48
|
+
transition:
|
|
49
|
+
transform 0s 0.8s,
|
|
50
|
+
opacity 0.8s;
|
|
49
51
|
will-change: transform, opacity;
|
|
50
52
|
}
|
|
51
53
|
|
package/web-types.json
CHANGED