@vaadin/slider 25.3.0-alpha8 → 25.3.0-alpha9

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.
Files changed (4) hide show
  1. package/custom-elements.json +60 -8
  2. package/package.json +11 -11
  3. package/web-types.json +45 -9
  4. package/web-types.lit.json +19 -5
package/custom-elements.json CHANGED
@@ -41,6 +41,20 @@
41
41
  "description": "`<vaadin-range-slider>` is a web component that represents a range slider\nfor selecting a subset of the given range.\n\n```html\n<vaadin-range-slider min=\"0\" max=\"100\" step=\"1\"></vaadin-range-slider>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb (applies to both thumbs)\n`thumb-start` | The start (lower value) thumb\n`thumb-end` | The end (upper value) thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`start-active` | Set when the start thumb is activated with mouse or touch\n`end-active` | Set when the end thumb is activated with mouse or touch\n`start-focused` | Set when the start thumb has focus\n`end-focused` | Set when the end thumb has focus\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `<vaadin-slider-bubble>` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
42
42
  "name": "RangeSlider",
43
43
  "members": [
44
+ {
45
+ "kind": "field",
46
+ "name": "accessibleDescriptionRef",
47
+ "privacy": "public",
48
+ "type": {
49
+ "text": "string"
50
+ },
51
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
52
+ "attribute": "accessible-description-ref",
53
+ "inheritedFrom": {
54
+ "name": "FieldMixin",
55
+ "package": "@vaadin/field-base/src/field-mixin.js"
56
+ }
57
+ },
44
58
  {
45
59
  "kind": "field",
46
60
  "name": "accessibleName",
@@ -48,7 +62,7 @@
48
62
  "type": {
49
63
  "text": "string"
50
64
  },
51
- "description": "String used to label the component to screen reader users.",
65
+ "description": "String used to label the component for screen reader users.",
52
66
  "attribute": "accessible-name",
53
67
  "inheritedFrom": {
54
68
  "name": "FieldMixin",
@@ -72,7 +86,7 @@
72
86
  "type": {
73
87
  "text": "string"
74
88
  },
75
- "description": "Id of the element used as label of the component to screen reader users.",
89
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
76
90
  "attribute": "accessible-name-ref",
77
91
  "inheritedFrom": {
78
92
  "name": "FieldMixin",
@@ -360,12 +374,24 @@
360
374
  }
361
375
  ],
362
376
  "attributes": [
377
+ {
378
+ "name": "accessible-description-ref",
379
+ "type": {
380
+ "text": "string"
381
+ },
382
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
383
+ "fieldName": "accessibleDescriptionRef",
384
+ "inheritedFrom": {
385
+ "name": "FieldMixin",
386
+ "package": "@vaadin/field-base/src/field-mixin.js"
387
+ }
388
+ },
363
389
  {
364
390
  "name": "accessible-name",
365
391
  "type": {
366
392
  "text": "string"
367
393
  },
368
- "description": "String used to label the component to screen reader users.",
394
+ "description": "String used to label the component for screen reader users.",
369
395
  "fieldName": "accessibleName",
370
396
  "inheritedFrom": {
371
397
  "name": "FieldMixin",
@@ -385,7 +411,7 @@
385
411
  "type": {
386
412
  "text": "string"
387
413
  },
388
- "description": "Id of the element used as label of the component to screen reader users.",
414
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
389
415
  "fieldName": "accessibleNameRef",
390
416
  "inheritedFrom": {
391
417
  "name": "FieldMixin",
@@ -818,6 +844,20 @@
818
844
  "description": "`<vaadin-slider>` is a web component that represents a range slider\nfor selecting numerical values within a defined range.\n\n```html\n<vaadin-slider min=\"0\" max=\"100\" step=\"1\"></vaadin-slider>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`active` | Set when the slider is activated with mouse or touch\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `<vaadin-slider-bubble>` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
819
845
  "name": "Slider",
820
846
  "members": [
847
+ {
848
+ "kind": "field",
849
+ "name": "accessibleDescriptionRef",
850
+ "privacy": "public",
851
+ "type": {
852
+ "text": "string"
853
+ },
854
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
855
+ "attribute": "accessible-description-ref",
856
+ "inheritedFrom": {
857
+ "name": "FieldMixin",
858
+ "package": "@vaadin/field-base/src/field-mixin.js"
859
+ }
860
+ },
821
861
  {
822
862
  "kind": "field",
823
863
  "name": "accessibleName",
@@ -825,7 +865,7 @@
825
865
  "type": {
826
866
  "text": "string"
827
867
  },
828
- "description": "String used to label the component to screen reader users.",
868
+ "description": "String used to label the component for screen reader users.",
829
869
  "attribute": "accessible-name",
830
870
  "inheritedFrom": {
831
871
  "name": "FieldMixin",
@@ -839,7 +879,7 @@
839
879
  "type": {
840
880
  "text": "string"
841
881
  },
842
- "description": "Id of the element used as label of the component to screen reader users.",
882
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
843
883
  "attribute": "accessible-name-ref",
844
884
  "inheritedFrom": {
845
885
  "name": "FieldMixin",
@@ -1117,12 +1157,24 @@
1117
1157
  }
1118
1158
  ],
1119
1159
  "attributes": [
1160
+ {
1161
+ "name": "accessible-description-ref",
1162
+ "type": {
1163
+ "text": "string"
1164
+ },
1165
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
1166
+ "fieldName": "accessibleDescriptionRef",
1167
+ "inheritedFrom": {
1168
+ "name": "FieldMixin",
1169
+ "package": "@vaadin/field-base/src/field-mixin.js"
1170
+ }
1171
+ },
1120
1172
  {
1121
1173
  "name": "accessible-name",
1122
1174
  "type": {
1123
1175
  "text": "string"
1124
1176
  },
1125
- "description": "String used to label the component to screen reader users.",
1177
+ "description": "String used to label the component for screen reader users.",
1126
1178
  "fieldName": "accessibleName",
1127
1179
  "inheritedFrom": {
1128
1180
  "name": "FieldMixin",
@@ -1134,7 +1186,7 @@
1134
1186
  "type": {
1135
1187
  "text": "string"
1136
1188
  },
1137
- "description": "Id of the element used as label of the component to screen reader users.",
1189
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
1138
1190
  "fieldName": "accessibleNameRef",
1139
1191
  "inheritedFrom": {
1140
1192
  "name": "FieldMixin",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/slider",
3
- "version": "25.3.0-alpha8",
3
+ "version": "25.3.0-alpha9",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -35,24 +35,24 @@
35
35
  ],
36
36
  "dependencies": {
37
37
  "@open-wc/dedupe-mixin": "^1.3.0",
38
- "@vaadin/a11y-base": "25.3.0-alpha8",
39
- "@vaadin/component-base": "25.3.0-alpha8",
40
- "@vaadin/field-base": "25.3.0-alpha8",
41
- "@vaadin/overlay": "25.3.0-alpha8",
42
- "@vaadin/vaadin-themable-mixin": "25.3.0-alpha8",
38
+ "@vaadin/a11y-base": "25.3.0-alpha9",
39
+ "@vaadin/component-base": "25.3.0-alpha9",
40
+ "@vaadin/field-base": "25.3.0-alpha9",
41
+ "@vaadin/overlay": "25.3.0-alpha9",
42
+ "@vaadin/vaadin-themable-mixin": "25.3.0-alpha9",
43
43
  "lit": "^3.0.0"
44
44
  },
45
45
  "devDependencies": {
46
- "@vaadin/aura": "25.3.0-alpha8",
47
- "@vaadin/chai-plugins": "25.3.0-alpha8",
48
- "@vaadin/test-runner-commands": "25.3.0-alpha8",
46
+ "@vaadin/aura": "25.3.0-alpha9",
47
+ "@vaadin/chai-plugins": "25.3.0-alpha9",
48
+ "@vaadin/test-runner-commands": "25.3.0-alpha9",
49
49
  "@vaadin/testing-helpers": "^2.0.0",
50
- "@vaadin/vaadin-lumo-styles": "25.3.0-alpha8"
50
+ "@vaadin/vaadin-lumo-styles": "25.3.0-alpha9"
51
51
  },
52
52
  "customElements": "custom-elements.json",
53
53
  "web-types": [
54
54
  "web-types.json",
55
55
  "web-types.lit.json"
56
56
  ],
57
- "gitHead": "ccbb4aaffb63c745c6da0426b532d4d05e47af29"
57
+ "gitHead": "cb915ebde095ec5b94a87af93dd4530f51984c52"
58
58
  }
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/slider",
4
- "version": "25.3.0-alpha8",
4
+ "version": "25.3.0-alpha9",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -10,9 +10,18 @@
10
10
  "name": "vaadin-range-slider",
11
11
  "description": "`<vaadin-range-slider>` is a web component that represents a range slider\nfor selecting a subset of the given range.\n\n```html\n<vaadin-range-slider min=\"0\" max=\"100\" step=\"1\"></vaadin-range-slider>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb (applies to both thumbs)\n`thumb-start` | The start (lower value) thumb\n`thumb-end` | The end (upper value) thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`start-active` | Set when the start thumb is activated with mouse or touch\n`end-active` | Set when the end thumb is activated with mouse or touch\n`start-focused` | Set when the start thumb has focus\n`end-focused` | Set when the end thumb has focus\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `<vaadin-slider-bubble>` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
12
12
  "attributes": [
13
+ {
14
+ "name": "accessible-description-ref",
15
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
16
+ "value": {
17
+ "type": [
18
+ "string"
19
+ ]
20
+ }
21
+ },
13
22
  {
14
23
  "name": "accessible-name",
15
- "description": "String used to label the component to screen reader users.",
24
+ "description": "String used to label the component for screen reader users.",
16
25
  "value": {
17
26
  "type": [
18
27
  "string"
@@ -30,7 +39,7 @@
30
39
  },
31
40
  {
32
41
  "name": "accessible-name-ref",
33
- "description": "Id of the element used as label of the component to screen reader users.",
42
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
34
43
  "value": {
35
44
  "type": [
36
45
  "string"
@@ -175,9 +184,18 @@
175
184
  ],
176
185
  "js": {
177
186
  "properties": [
187
+ {
188
+ "name": "accessibleDescriptionRef",
189
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
190
+ "value": {
191
+ "type": [
192
+ "string"
193
+ ]
194
+ }
195
+ },
178
196
  {
179
197
  "name": "accessibleName",
180
- "description": "String used to label the component to screen reader users.",
198
+ "description": "String used to label the component for screen reader users.",
181
199
  "value": {
182
200
  "type": [
183
201
  "string"
@@ -195,7 +213,7 @@
195
213
  },
196
214
  {
197
215
  "name": "accessibleNameRef",
198
- "description": "Id of the element used as label of the component to screen reader users.",
216
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
199
217
  "value": {
200
218
  "type": [
201
219
  "string"
@@ -366,9 +384,18 @@
366
384
  "name": "vaadin-slider",
367
385
  "description": "`<vaadin-slider>` is a web component that represents a range slider\nfor selecting numerical values within a defined range.\n\n```html\n<vaadin-slider min=\"0\" max=\"100\" step=\"1\"></vaadin-slider>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`active` | Set when the slider is activated with mouse or touch\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `<vaadin-slider-bubble>` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
368
386
  "attributes": [
387
+ {
388
+ "name": "accessible-description-ref",
389
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
390
+ "value": {
391
+ "type": [
392
+ "string"
393
+ ]
394
+ }
395
+ },
369
396
  {
370
397
  "name": "accessible-name",
371
- "description": "String used to label the component to screen reader users.",
398
+ "description": "String used to label the component for screen reader users.",
372
399
  "value": {
373
400
  "type": [
374
401
  "string"
@@ -377,7 +404,7 @@
377
404
  },
378
405
  {
379
406
  "name": "accessible-name-ref",
380
- "description": "Id of the element used as label of the component to screen reader users.",
407
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
381
408
  "value": {
382
409
  "type": [
383
410
  "string"
@@ -522,9 +549,18 @@
522
549
  ],
523
550
  "js": {
524
551
  "properties": [
552
+ {
553
+ "name": "accessibleDescriptionRef",
554
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
555
+ "value": {
556
+ "type": [
557
+ "string"
558
+ ]
559
+ }
560
+ },
525
561
  {
526
562
  "name": "accessibleName",
527
- "description": "String used to label the component to screen reader users.",
563
+ "description": "String used to label the component for screen reader users.",
528
564
  "value": {
529
565
  "type": [
530
566
  "string"
@@ -533,7 +569,7 @@
533
569
  },
534
570
  {
535
571
  "name": "accessibleNameRef",
536
- "description": "Id of the element used as label of the component to screen reader users.",
572
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
537
573
  "value": {
538
574
  "type": [
539
575
  "string"
package/web-types.lit.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/slider",
4
- "version": "25.3.0-alpha8",
4
+ "version": "25.3.0-alpha9",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -19,9 +19,16 @@
19
19
  "description": "`<vaadin-range-slider>` is a web component that represents a range slider\nfor selecting a subset of the given range.\n\n```html\n<vaadin-range-slider min=\"0\" max=\"100\" step=\"1\"></vaadin-range-slider>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb (applies to both thumbs)\n`thumb-start` | The start (lower value) thumb\n`thumb-end` | The end (upper value) thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`start-active` | Set when the start thumb is activated with mouse or touch\n`end-active` | Set when the end thumb is activated with mouse or touch\n`start-focused` | Set when the start thumb has focus\n`end-focused` | Set when the end thumb has focus\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `<vaadin-slider-bubble>` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
20
20
  "extension": true,
21
21
  "attributes": [
22
+ {
23
+ "name": ".accessibleDescriptionRef",
24
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
25
+ "value": {
26
+ "kind": "expression"
27
+ }
28
+ },
22
29
  {
23
30
  "name": ".accessibleName",
24
- "description": "String used to label the component to screen reader users.",
31
+ "description": "String used to label the component for screen reader users.",
25
32
  "value": {
26
33
  "kind": "expression"
27
34
  }
@@ -35,7 +42,7 @@
35
42
  },
36
43
  {
37
44
  "name": ".accessibleNameRef",
38
- "description": "Id of the element used as label of the component to screen reader users.",
45
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
39
46
  "value": {
40
47
  "kind": "expression"
41
48
  }
@@ -187,16 +194,23 @@
187
194
  "description": "`<vaadin-slider>` is a web component that represents a range slider\nfor selecting numerical values within a defined range.\n\n```html\n<vaadin-slider min=\"0\" max=\"100\" step=\"1\"></vaadin-slider>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`active` | Set when the slider is activated with mouse or touch\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `<vaadin-slider-bubble>` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
188
195
  "extension": true,
189
196
  "attributes": [
197
+ {
198
+ "name": ".accessibleDescriptionRef",
199
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
200
+ "value": {
201
+ "kind": "expression"
202
+ }
203
+ },
190
204
  {
191
205
  "name": ".accessibleName",
192
- "description": "String used to label the component to screen reader users.",
206
+ "description": "String used to label the component for screen reader users.",
193
207
  "value": {
194
208
  "kind": "expression"
195
209
  }
196
210
  },
197
211
  {
198
212
  "name": ".accessibleNameRef",
199
- "description": "Id of the element used as label of the component to screen reader users.",
213
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
200
214
  "value": {
201
215
  "kind": "expression"
202
216
  }