@vaadin/field-base 25.0.0-alpha19 → 25.0.0-alpha20

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/field-base",
3
- "version": "25.0.0-alpha19",
3
+ "version": "25.0.0-alpha20",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -31,15 +31,15 @@
31
31
  ],
32
32
  "dependencies": {
33
33
  "@open-wc/dedupe-mixin": "^1.3.0",
34
- "@vaadin/a11y-base": "25.0.0-alpha19",
35
- "@vaadin/component-base": "25.0.0-alpha19",
34
+ "@vaadin/a11y-base": "25.0.0-alpha20",
35
+ "@vaadin/component-base": "25.0.0-alpha20",
36
36
  "lit": "^3.0.0"
37
37
  },
38
38
  "devDependencies": {
39
- "@vaadin/chai-plugins": "25.0.0-alpha19",
40
- "@vaadin/test-runner-commands": "25.0.0-alpha19",
39
+ "@vaadin/chai-plugins": "25.0.0-alpha20",
40
+ "@vaadin/test-runner-commands": "25.0.0-alpha20",
41
41
  "@vaadin/testing-helpers": "^2.0.0",
42
42
  "sinon": "^21.0.0"
43
43
  },
44
- "gitHead": "1f9af1ce5f0bae8daff044176c8a8df697763881"
44
+ "gitHead": "c948aae591a30b432f3784000d4677674cae56e0"
45
45
  }
@@ -8,7 +8,7 @@ import { css } from 'lit';
8
8
 
9
9
  export const button = css`
10
10
  [part$='button'] {
11
- color: var(--vaadin-input-field-button-color, var(--vaadin-color-subtle));
11
+ color: var(--vaadin-input-field-button-color, var(--vaadin-text-color-secondary));
12
12
  cursor: var(--vaadin-clickable-cursor);
13
13
  touch-action: manipulation;
14
14
  -webkit-tap-highlight-color: transparent;
@@ -25,16 +25,16 @@ export const button = css`
25
25
  width: var(--vaadin-icon-size, 1lh);
26
26
  }
27
27
 
28
- :host(:is(:not([clear-button-visible][has-value]), [disabled], [readonly])) [part='clear-button'] {
28
+ :host(:is(:not([clear-button-visible][has-value]), [disabled], [readonly])) [part~='clear-button'] {
29
29
  display: none;
30
30
  }
31
31
 
32
- [part='clear-button']::before {
32
+ [part~='clear-button']::before {
33
33
  mask-image: var(--_vaadin-icon-cross);
34
34
  }
35
35
 
36
36
  :host(:is([readonly], [disabled])) [part$='button'] {
37
- color: var(--vaadin-color-disabled);
37
+ color: var(--vaadin-text-color-disabled);
38
38
  cursor: var(--vaadin-disabled-cursor);
39
39
  }
40
40
 
@@ -46,7 +46,7 @@ export const checkable = (part, propName = part) => css`
46
46
  font-size: var(--vaadin-${unsafeCSS(propName)}-label-font-size, var(--vaadin-input-field-label-font-size, inherit));
47
47
  line-height: var(--vaadin-${unsafeCSS(propName)}-label-line-height, var(--vaadin-input-field-label-line-height, inherit));
48
48
  font-weight: var(--vaadin-${unsafeCSS(propName)}-font-weight, var(--vaadin-input-field-label-font-weight, 500));
49
- color: var(--vaadin-${unsafeCSS(propName)}-label-color, var(--vaadin-input-field-label-color, var(--vaadin-color)));
49
+ color: var(--vaadin-${unsafeCSS(propName)}-label-color, var(--vaadin-input-field-label-color, var(--vaadin-text-color)));
50
50
  word-break: break-word;
51
51
  }
52
52
 
@@ -87,14 +87,14 @@ export const checkable = (part, propName = part) => css`
87
87
  --_border-width: var(--vaadin-${unsafeCSS(propName)}-border-width, var(--vaadin-input-field-border-width, 1px));
88
88
  border-width: var(--_border-width);
89
89
  box-sizing: border-box;
90
- color: var(--vaadin-${unsafeCSS(propName)}-color, var(--vaadin-input-field-text-color, var(--vaadin-color)));
90
+ color: var(--vaadin-${unsafeCSS(propName)}-color, var(--vaadin-input-field-text-color, var(--vaadin-text-color)));
91
91
  height: var(--vaadin-${unsafeCSS(propName)}-size, 1lh);
92
92
  width: var(--vaadin-${unsafeCSS(propName)}-size, 1lh);
93
93
  position: relative;
94
94
  }
95
95
 
96
96
  :host(:is([checked], [indeterminate])) {
97
- --vaadin-${unsafeCSS(propName)}-background: var(--vaadin-color);
97
+ --vaadin-${unsafeCSS(propName)}-background: var(--vaadin-text-color);
98
98
  --vaadin-${unsafeCSS(propName)}-border-color: transparent;
99
99
  --vaadin-${unsafeCSS(propName)}-color: oklch(from var(--vaadin-${unsafeCSS(propName)}-background) clamp(0, (0.62 - l) * 1000, 1) 0 0);
100
100
  }
@@ -102,7 +102,7 @@ export const checkable = (part, propName = part) => css`
102
102
  :host([disabled]) {
103
103
  --vaadin-${unsafeCSS(propName)}-background: var(--vaadin-input-field-disabled-background, var(--vaadin-background-container-strong));
104
104
  --vaadin-${unsafeCSS(propName)}-border-color: transparent;
105
- --vaadin-${unsafeCSS(propName)}-color: var(--vaadin-color-disabled);
105
+ --vaadin-${unsafeCSS(propName)}-color: var(--vaadin-text-color-disabled);
106
106
  }
107
107
 
108
108
  /* Focus ring */
@@ -35,7 +35,7 @@ export const field = css`
35
35
  font-size: var(--vaadin-input-field-label-font-size, inherit);
36
36
  line-height: var(--vaadin-input-field-label-line-height, inherit);
37
37
  font-weight: var(--vaadin-input-field-label-font-weight, 500);
38
- color: var(--vaadin-input-field-label-color, var(--vaadin-color));
38
+ color: var(--vaadin-input-field-label-color, var(--vaadin-text-color));
39
39
  order: var(--vaadin-input-field-helper-order);
40
40
  word-break: break-word;
41
41
  position: relative;
@@ -63,7 +63,7 @@ export const field = css`
63
63
  position: absolute;
64
64
  width: 1em;
65
65
  text-align: center;
66
- color: var(--vaadin-input-field-required-indicator-color, var(--vaadin-color-subtle));
66
+ color: var(--vaadin-input-field-required-indicator-color, var(--vaadin-text-color-secondary));
67
67
  }
68
68
 
69
69
  [part='required-indicator']::after {
@@ -90,7 +90,7 @@ export const field = css`
90
90
  font-size: var(--vaadin-input-field-helper-font-size, inherit);
91
91
  line-height: var(--vaadin-input-field-helper-line-height, inherit);
92
92
  font-weight: var(--vaadin-input-field-helper-font-weight, 400);
93
- color: var(--vaadin-input-field-helper-color, var(--vaadin-color-subtle));
93
+ color: var(--vaadin-input-field-helper-color, var(--vaadin-text-color-secondary));
94
94
  order: var(--vaadin-input-field-helper-order);
95
95
  }
96
96
 
@@ -98,7 +98,7 @@ export const field = css`
98
98
  font-size: var(--vaadin-input-field-error-font-size, inherit);
99
99
  line-height: var(--vaadin-input-field-error-line-height, inherit);
100
100
  font-weight: var(--vaadin-input-field-error-font-weight, 400);
101
- color: var(--vaadin-input-field-error-color, var(--vaadin-color));
101
+ color: var(--vaadin-input-field-error-color, var(--vaadin-text-color));
102
102
  display: flex;
103
103
  gap: var(--vaadin-gap-s);
104
104
  }