@warp-ds/elements 2.9.0-next.1 → 2.9.0-next.3
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/dist/custom-elements.json +17 -10
- package/dist/docs/affix/affix.md +56 -0
- package/dist/docs/affix/api.md +48 -0
- package/dist/docs/alert/accessibility.md +30 -0
- package/dist/docs/alert/alert.md +208 -0
- package/dist/docs/alert/api.md +39 -0
- package/dist/docs/alert/examples.md +84 -0
- package/dist/docs/alert/usage.md +42 -0
- package/dist/docs/attention/api.md +132 -0
- package/dist/docs/attention/attention.md +138 -0
- package/dist/docs/badge/api.md +28 -0
- package/dist/docs/badge/badge.md +36 -0
- package/dist/docs/box/api.md +52 -0
- package/dist/docs/box/box.md +60 -0
- package/dist/docs/breadcrumbs/api.md +20 -0
- package/dist/docs/breadcrumbs/breadcrumbs.md +28 -0
- package/dist/docs/button/api.md +155 -0
- package/dist/docs/button/button.md +163 -0
- package/dist/docs/card/api.md +44 -0
- package/dist/docs/card/card.md +52 -0
- package/dist/docs/combobox/api.md +132 -0
- package/dist/docs/combobox/combobox.md +140 -0
- package/dist/docs/datepicker/api.md +192 -0
- package/dist/docs/datepicker/datepicker.md +202 -0
- package/dist/docs/expandable/api.md +100 -0
- package/dist/docs/expandable/expandable.md +108 -0
- package/dist/docs/link/api.md +87 -0
- package/dist/docs/link/link.md +95 -0
- package/dist/docs/page-indicator/api.md +28 -0
- package/dist/docs/page-indicator/page-indicator.md +35 -0
- package/dist/docs/pagination/api.md +44 -0
- package/dist/docs/pagination/pagination.md +52 -0
- package/dist/docs/pill/api.md +76 -0
- package/dist/docs/pill/pill.md +84 -0
- package/dist/docs/select/api.md +116 -0
- package/dist/docs/select/select.md +124 -0
- package/dist/docs/slider/api.md +214 -0
- package/dist/docs/slider/slider.md +222 -0
- package/dist/docs/slider-thumb/api.md +116 -0
- package/dist/docs/slider-thumb/slider-thumb.md +124 -0
- package/dist/docs/step/api.md +28 -0
- package/dist/docs/step/step.md +34 -0
- package/dist/docs/step-indicator/api.md +28 -0
- package/dist/docs/step-indicator/step-indicator.md +36 -0
- package/dist/docs/switch/api.md +52 -0
- package/dist/docs/switch/switch.md +58 -0
- package/dist/docs/tab/api.md +76 -0
- package/dist/docs/tab/tab.md +84 -0
- package/dist/docs/tab-panel/api.md +21 -0
- package/dist/docs/tab-panel/tab-panel.md +30 -0
- package/dist/docs/tabs/api.md +36 -0
- package/dist/docs/tabs/tabs.md +44 -0
- package/dist/docs/textarea/api.md +156 -0
- package/dist/docs/textarea/textarea.md +164 -0
- package/dist/docs/textfield/api.md +194 -0
- package/dist/docs/textfield/textfield.md +202 -0
- package/dist/docs/toast-container/api.md +14 -0
- package/dist/docs/toast-container/toast-container.md +20 -0
- package/dist/index.d.ts +0 -2
- package/dist/packages/affix/affix.js +5 -5
- package/dist/packages/affix/affix.js.map +2 -2
- package/dist/packages/alert/alert.d.ts +15 -0
- package/dist/packages/alert/alert.js +6 -6
- package/dist/packages/alert/alert.js.map +2 -2
- package/dist/packages/alert/alert.test.js +1 -1
- package/dist/packages/attention/attention.d.ts +0 -1
- package/dist/packages/attention/attention.js +21 -21
- package/dist/packages/attention/attention.js.map +4 -4
- package/dist/packages/datepicker/DatePicker.test.js +5 -5
- package/dist/packages/datepicker/datepicker.js +1 -1
- package/dist/packages/datepicker/datepicker.js.map +2 -2
- package/dist/packages/expandable/expandable.js +7 -7
- package/dist/packages/expandable/expandable.js.map +2 -2
- package/dist/packages/icon/icon.js +2 -2
- package/dist/packages/icon/icon.js.map +2 -2
- package/dist/packages/icon/icon.test.js +14 -0
- package/dist/packages/modal-header/modal-header.js +6 -6
- package/dist/packages/modal-header/modal-header.js.map +2 -2
- package/dist/packages/pagination/pagination.js +3 -3
- package/dist/packages/pagination/pagination.js.map +2 -2
- package/dist/packages/pill/pill.js +3 -3
- package/dist/packages/pill/pill.js.map +2 -2
- package/dist/packages/select/select.js +4 -4
- package/dist/packages/select/select.js.map +2 -2
- package/dist/packages/step/step.js +4 -4
- package/dist/packages/step/step.js.map +2 -2
- package/dist/packages/toast/toast.js +4 -4
- package/dist/packages/toast/toast.js.map +2 -2
- package/dist/web-types.json +18 -5
- package/package.json +26 -23
- package/dist/packages/utils/index.d.ts +0 -10
- package/dist/packages/utils/index.js +0 -37
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
# Pagination (w-pagination)
|
|
2
|
+
|
|
3
|
+
## Description
|
|
4
|
+
|
|
5
|
+
Pagination allows users to navigate through multiple pages of content by providing navigation controls with page numbers and directional arrows.
|
|
6
|
+
|
|
7
|
+
[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-pagination--docs)
|
|
8
|
+
|
|
9
|
+
## API Documentation
|
|
10
|
+
|
|
11
|
+
### Properties
|
|
12
|
+
|
|
13
|
+
| Name | Type | Default | Summary |
|
|
14
|
+
|-|-|-|-|
|
|
15
|
+
| baseUrl | `string` | `-` | - |
|
|
16
|
+
| pages | `number` | `-` | - |
|
|
17
|
+
| currentPageNumber | `number` | `-` | - |
|
|
18
|
+
| visiblePages | `number` | `-` | - |
|
|
19
|
+
|
|
20
|
+
### Property Details
|
|
21
|
+
|
|
22
|
+
#### baseUrl
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
- Type: `string`
|
|
27
|
+
- Default: `-`
|
|
28
|
+
|
|
29
|
+
#### pages
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
- Type: `number`
|
|
34
|
+
- Default: `-`
|
|
35
|
+
|
|
36
|
+
#### currentPageNumber
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
- Type: `number`
|
|
41
|
+
- Default: `-`
|
|
42
|
+
|
|
43
|
+
#### visiblePages
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
- Type: `number`
|
|
48
|
+
- Default: `-`
|
|
49
|
+
|
|
50
|
+
### Types
|
|
51
|
+
|
|
52
|
+
No types documented.
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
## API Documentation
|
|
2
|
+
|
|
3
|
+
### Properties
|
|
4
|
+
|
|
5
|
+
| Name | Type | Default | Summary |
|
|
6
|
+
|-|-|-|-|
|
|
7
|
+
| canClose | `boolean` | `false` | - |
|
|
8
|
+
| suggestion | `boolean` | `false` | - |
|
|
9
|
+
| openSrLabel | `string` | `-` | - |
|
|
10
|
+
| openAriaLabel | `string` | `-` | - |
|
|
11
|
+
| closeSrLabel | `string` | `-` | - |
|
|
12
|
+
| closeAriaLabel | `string` | `-` | - |
|
|
13
|
+
| openFilterSrText | `unknown` | `-` | - |
|
|
14
|
+
| removeFilterSrText | `unknown` | `-` | - |
|
|
15
|
+
|
|
16
|
+
### Property Details
|
|
17
|
+
|
|
18
|
+
#### canClose
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
- Type: `boolean`
|
|
23
|
+
- Default: `false`
|
|
24
|
+
|
|
25
|
+
#### suggestion
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
- Type: `boolean`
|
|
30
|
+
- Default: `false`
|
|
31
|
+
|
|
32
|
+
#### openSrLabel
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
- Type: `string`
|
|
37
|
+
- Default: `-`
|
|
38
|
+
|
|
39
|
+
#### openAriaLabel
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
- Type: `string`
|
|
44
|
+
- Default: `-`
|
|
45
|
+
|
|
46
|
+
#### closeSrLabel
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
- Type: `string`
|
|
51
|
+
- Default: `-`
|
|
52
|
+
|
|
53
|
+
#### closeAriaLabel
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
- Type: `string`
|
|
58
|
+
- Default: `-`
|
|
59
|
+
|
|
60
|
+
#### openFilterSrText
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
- Type: `unknown`
|
|
65
|
+
- Default: `-`
|
|
66
|
+
|
|
67
|
+
#### removeFilterSrText
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
- Type: `unknown`
|
|
72
|
+
- Default: `-`
|
|
73
|
+
|
|
74
|
+
### Types
|
|
75
|
+
|
|
76
|
+
No types documented.
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
# Pill (w-pill)
|
|
2
|
+
|
|
3
|
+
## Description
|
|
4
|
+
|
|
5
|
+
Pill is a type of button that is often used as a filter, but can also be used as a rounded button for overlays, etc.
|
|
6
|
+
|
|
7
|
+
[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-pill--docs)
|
|
8
|
+
|
|
9
|
+
## API Documentation
|
|
10
|
+
|
|
11
|
+
### Properties
|
|
12
|
+
|
|
13
|
+
| Name | Type | Default | Summary |
|
|
14
|
+
|-|-|-|-|
|
|
15
|
+
| canClose | `boolean` | `false` | - |
|
|
16
|
+
| suggestion | `boolean` | `false` | - |
|
|
17
|
+
| openSrLabel | `string` | `-` | - |
|
|
18
|
+
| openAriaLabel | `string` | `-` | - |
|
|
19
|
+
| closeSrLabel | `string` | `-` | - |
|
|
20
|
+
| closeAriaLabel | `string` | `-` | - |
|
|
21
|
+
| openFilterSrText | `unknown` | `-` | - |
|
|
22
|
+
| removeFilterSrText | `unknown` | `-` | - |
|
|
23
|
+
|
|
24
|
+
### Property Details
|
|
25
|
+
|
|
26
|
+
#### canClose
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
- Type: `boolean`
|
|
31
|
+
- Default: `false`
|
|
32
|
+
|
|
33
|
+
#### suggestion
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
- Type: `boolean`
|
|
38
|
+
- Default: `false`
|
|
39
|
+
|
|
40
|
+
#### openSrLabel
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
- Type: `string`
|
|
45
|
+
- Default: `-`
|
|
46
|
+
|
|
47
|
+
#### openAriaLabel
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
- Type: `string`
|
|
52
|
+
- Default: `-`
|
|
53
|
+
|
|
54
|
+
#### closeSrLabel
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
- Type: `string`
|
|
59
|
+
- Default: `-`
|
|
60
|
+
|
|
61
|
+
#### closeAriaLabel
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
- Type: `string`
|
|
66
|
+
- Default: `-`
|
|
67
|
+
|
|
68
|
+
#### openFilterSrText
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
- Type: `unknown`
|
|
73
|
+
- Default: `-`
|
|
74
|
+
|
|
75
|
+
#### removeFilterSrText
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
- Type: `unknown`
|
|
80
|
+
- Default: `-`
|
|
81
|
+
|
|
82
|
+
### Types
|
|
83
|
+
|
|
84
|
+
No types documented.
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
## API Documentation
|
|
2
|
+
|
|
3
|
+
### Properties
|
|
4
|
+
|
|
5
|
+
| Name | Type | Default | Summary |
|
|
6
|
+
|-|-|-|-|
|
|
7
|
+
| autoFocus | `boolean` | `false` | - |
|
|
8
|
+
| autofocus | `boolean` | `false` | - |
|
|
9
|
+
| helpText | `string` | `-` | - |
|
|
10
|
+
| invalid | `boolean` | `false` | - |
|
|
11
|
+
| always | `boolean` | `false` | - |
|
|
12
|
+
| hint | `string` | `-` | - |
|
|
13
|
+
| label | `string` | `-` | - |
|
|
14
|
+
| optional | `boolean` | `false` | - |
|
|
15
|
+
| disabled | `boolean` | `false` | - |
|
|
16
|
+
| readOnly | `boolean` | `false` | - |
|
|
17
|
+
| readonly | `boolean` | `false` | - |
|
|
18
|
+
| name | `string` | `-` | - |
|
|
19
|
+
| value | `string` | `-` | - |
|
|
20
|
+
|
|
21
|
+
### Property Details
|
|
22
|
+
|
|
23
|
+
#### autoFocus
|
|
24
|
+
|
|
25
|
+
Whether the element should receive focus on render.
|
|
26
|
+
|
|
27
|
+
- Type: `boolean`
|
|
28
|
+
- Default: `false`
|
|
29
|
+
|
|
30
|
+
#### autofocus
|
|
31
|
+
|
|
32
|
+
Whether the element should receive focus on render
|
|
33
|
+
|
|
34
|
+
- Type: `boolean`
|
|
35
|
+
- Default: `false`
|
|
36
|
+
|
|
37
|
+
#### helpText
|
|
38
|
+
|
|
39
|
+
The content displayed as the help text. Paired with `invalid` to show the text as a validation error.
|
|
40
|
+
|
|
41
|
+
- Type: `string`
|
|
42
|
+
- Default: `-`
|
|
43
|
+
|
|
44
|
+
#### invalid
|
|
45
|
+
|
|
46
|
+
Renders the field in an invalid state. Paired with `help-text` to provide feedback about the error.
|
|
47
|
+
|
|
48
|
+
- Type: `boolean`
|
|
49
|
+
- Default: `false`
|
|
50
|
+
|
|
51
|
+
#### always
|
|
52
|
+
|
|
53
|
+
Whether to always show a hint.
|
|
54
|
+
|
|
55
|
+
- Type: `boolean`
|
|
56
|
+
- Default: `false`
|
|
57
|
+
|
|
58
|
+
#### hint
|
|
59
|
+
|
|
60
|
+
The content displayed as the help text.
|
|
61
|
+
|
|
62
|
+
- Type: `string`
|
|
63
|
+
- Default: `-`
|
|
64
|
+
|
|
65
|
+
#### label
|
|
66
|
+
|
|
67
|
+
The content to disply as the label
|
|
68
|
+
|
|
69
|
+
- Type: `string`
|
|
70
|
+
- Default: `-`
|
|
71
|
+
|
|
72
|
+
#### optional
|
|
73
|
+
|
|
74
|
+
Whether to show optional text
|
|
75
|
+
|
|
76
|
+
- Type: `boolean`
|
|
77
|
+
- Default: `false`
|
|
78
|
+
|
|
79
|
+
#### disabled
|
|
80
|
+
|
|
81
|
+
Renders the field in a disabled state.
|
|
82
|
+
|
|
83
|
+
- Type: `boolean`
|
|
84
|
+
- Default: `false`
|
|
85
|
+
|
|
86
|
+
#### readOnly
|
|
87
|
+
|
|
88
|
+
Renders the field in a readonly state.
|
|
89
|
+
|
|
90
|
+
- Type: `boolean`
|
|
91
|
+
- Default: `false`
|
|
92
|
+
|
|
93
|
+
#### readonly
|
|
94
|
+
|
|
95
|
+
Renders the field in a readonly state.
|
|
96
|
+
|
|
97
|
+
- Type: `boolean`
|
|
98
|
+
- Default: `false`
|
|
99
|
+
|
|
100
|
+
#### name
|
|
101
|
+
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
- Type: `string`
|
|
105
|
+
- Default: `-`
|
|
106
|
+
|
|
107
|
+
#### value
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
|
|
111
|
+
- Type: `string`
|
|
112
|
+
- Default: `-`
|
|
113
|
+
|
|
114
|
+
### Types
|
|
115
|
+
|
|
116
|
+
No types documented.
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
# Select (w-select)
|
|
2
|
+
|
|
3
|
+
## Description
|
|
4
|
+
|
|
5
|
+
A dropdown component for selecting a single value.
|
|
6
|
+
|
|
7
|
+
[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-select--docs)
|
|
8
|
+
|
|
9
|
+
## API Documentation
|
|
10
|
+
|
|
11
|
+
### Properties
|
|
12
|
+
|
|
13
|
+
| Name | Type | Default | Summary |
|
|
14
|
+
|-|-|-|-|
|
|
15
|
+
| autoFocus | `boolean` | `false` | - |
|
|
16
|
+
| autofocus | `boolean` | `false` | - |
|
|
17
|
+
| helpText | `string` | `-` | - |
|
|
18
|
+
| invalid | `boolean` | `false` | - |
|
|
19
|
+
| always | `boolean` | `false` | - |
|
|
20
|
+
| hint | `string` | `-` | - |
|
|
21
|
+
| label | `string` | `-` | - |
|
|
22
|
+
| optional | `boolean` | `false` | - |
|
|
23
|
+
| disabled | `boolean` | `false` | - |
|
|
24
|
+
| readOnly | `boolean` | `false` | - |
|
|
25
|
+
| readonly | `boolean` | `false` | - |
|
|
26
|
+
| name | `string` | `-` | - |
|
|
27
|
+
| value | `string` | `-` | - |
|
|
28
|
+
|
|
29
|
+
### Property Details
|
|
30
|
+
|
|
31
|
+
#### autoFocus
|
|
32
|
+
|
|
33
|
+
Whether the element should receive focus on render.
|
|
34
|
+
|
|
35
|
+
- Type: `boolean`
|
|
36
|
+
- Default: `false`
|
|
37
|
+
|
|
38
|
+
#### autofocus
|
|
39
|
+
|
|
40
|
+
Whether the element should receive focus on render
|
|
41
|
+
|
|
42
|
+
- Type: `boolean`
|
|
43
|
+
- Default: `false`
|
|
44
|
+
|
|
45
|
+
#### helpText
|
|
46
|
+
|
|
47
|
+
The content displayed as the help text. Paired with `invalid` to show the text as a validation error.
|
|
48
|
+
|
|
49
|
+
- Type: `string`
|
|
50
|
+
- Default: `-`
|
|
51
|
+
|
|
52
|
+
#### invalid
|
|
53
|
+
|
|
54
|
+
Renders the field in an invalid state. Paired with `help-text` to provide feedback about the error.
|
|
55
|
+
|
|
56
|
+
- Type: `boolean`
|
|
57
|
+
- Default: `false`
|
|
58
|
+
|
|
59
|
+
#### always
|
|
60
|
+
|
|
61
|
+
Whether to always show a hint.
|
|
62
|
+
|
|
63
|
+
- Type: `boolean`
|
|
64
|
+
- Default: `false`
|
|
65
|
+
|
|
66
|
+
#### hint
|
|
67
|
+
|
|
68
|
+
The content displayed as the help text.
|
|
69
|
+
|
|
70
|
+
- Type: `string`
|
|
71
|
+
- Default: `-`
|
|
72
|
+
|
|
73
|
+
#### label
|
|
74
|
+
|
|
75
|
+
The content to disply as the label
|
|
76
|
+
|
|
77
|
+
- Type: `string`
|
|
78
|
+
- Default: `-`
|
|
79
|
+
|
|
80
|
+
#### optional
|
|
81
|
+
|
|
82
|
+
Whether to show optional text
|
|
83
|
+
|
|
84
|
+
- Type: `boolean`
|
|
85
|
+
- Default: `false`
|
|
86
|
+
|
|
87
|
+
#### disabled
|
|
88
|
+
|
|
89
|
+
Renders the field in a disabled state.
|
|
90
|
+
|
|
91
|
+
- Type: `boolean`
|
|
92
|
+
- Default: `false`
|
|
93
|
+
|
|
94
|
+
#### readOnly
|
|
95
|
+
|
|
96
|
+
Renders the field in a readonly state.
|
|
97
|
+
|
|
98
|
+
- Type: `boolean`
|
|
99
|
+
- Default: `false`
|
|
100
|
+
|
|
101
|
+
#### readonly
|
|
102
|
+
|
|
103
|
+
Renders the field in a readonly state.
|
|
104
|
+
|
|
105
|
+
- Type: `boolean`
|
|
106
|
+
- Default: `false`
|
|
107
|
+
|
|
108
|
+
#### name
|
|
109
|
+
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
- Type: `string`
|
|
113
|
+
- Default: `-`
|
|
114
|
+
|
|
115
|
+
#### value
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
|
|
119
|
+
- Type: `string`
|
|
120
|
+
- Default: `-`
|
|
121
|
+
|
|
122
|
+
### Types
|
|
123
|
+
|
|
124
|
+
No types documented.
|
|
@@ -0,0 +1,214 @@
|
|
|
1
|
+
## API Documentation
|
|
2
|
+
|
|
3
|
+
### Properties
|
|
4
|
+
|
|
5
|
+
| Name | Type | Default | Summary |
|
|
6
|
+
|-|-|-|-|
|
|
7
|
+
| shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
|
|
8
|
+
| label | `string` | `-` | - |
|
|
9
|
+
| disabled | `boolean` | `false` | - |
|
|
10
|
+
| openEnded | `boolean` | `false` | - |
|
|
11
|
+
| error | `string` | `-` | - |
|
|
12
|
+
| helpText | `string` | `-` | - |
|
|
13
|
+
| invalid | `boolean` | `false` | - |
|
|
14
|
+
| required | `boolean` | `false` | - |
|
|
15
|
+
| min | `string` | `-` | - |
|
|
16
|
+
| max | `string` | `-` | - |
|
|
17
|
+
| markers | `number` | `-` | - |
|
|
18
|
+
| step | `number` | `-` | - |
|
|
19
|
+
| suffix | `string` | `-` | - |
|
|
20
|
+
| hiddenTextfield | `boolean` | `false` | - |
|
|
21
|
+
| valueFormatter | `(value: string, slot: SliderSlot) => string` | `-` | - |
|
|
22
|
+
| tooltipFormatter | `(value: string, slot: SliderSlot) => string` | `-` | - |
|
|
23
|
+
| labelFormatter | `(slot: SliderSlot) => string` | `-` | - |
|
|
24
|
+
| _invalidMessage | `string` | `''` | - |
|
|
25
|
+
| _hasInternalError | `boolean` | `false` | - |
|
|
26
|
+
| _showError | `boolean` | `false` | - |
|
|
27
|
+
| _tabbableElements | `Array<HTMLElement>` | `[]` | - |
|
|
28
|
+
| edgeMin | `unknown` | `-` | - |
|
|
29
|
+
| edgeMax | `unknown` | `-` | - |
|
|
30
|
+
| componentHasError | `boolean` | `-` | - |
|
|
31
|
+
| errorText | `string` | `-` | - |
|
|
32
|
+
|
|
33
|
+
### Property Details
|
|
34
|
+
|
|
35
|
+
#### shadowRootOptions
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
- Type: `object`
|
|
40
|
+
- Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
|
|
41
|
+
|
|
42
|
+
#### label
|
|
43
|
+
|
|
44
|
+
The slider fieldset label. Required for proper accessibility.
|
|
45
|
+
|
|
46
|
+
If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
|
|
47
|
+
|
|
48
|
+
- Type: `string`
|
|
49
|
+
- Default: `-`
|
|
50
|
+
|
|
51
|
+
#### disabled
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
- Type: `boolean`
|
|
56
|
+
- Default: `false`
|
|
57
|
+
|
|
58
|
+
#### openEnded
|
|
59
|
+
|
|
60
|
+
Whether or not to allow values outside the range such as "Before 1950" and "2025+".
|
|
61
|
+
|
|
62
|
+
- Type: `boolean`
|
|
63
|
+
- Default: `false`
|
|
64
|
+
|
|
65
|
+
#### error
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
- Type: `string`
|
|
70
|
+
- Default: `-`
|
|
71
|
+
|
|
72
|
+
#### helpText
|
|
73
|
+
|
|
74
|
+
|
|
75
|
+
|
|
76
|
+
- Type: `string`
|
|
77
|
+
- Default: `-`
|
|
78
|
+
|
|
79
|
+
#### invalid
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
|
|
83
|
+
- Type: `boolean`
|
|
84
|
+
- Default: `false`
|
|
85
|
+
|
|
86
|
+
#### required
|
|
87
|
+
|
|
88
|
+
Ensures a child slider thumb has a value before allowing the containing form to submit.
|
|
89
|
+
|
|
90
|
+
- Type: `boolean`
|
|
91
|
+
- Default: `false`
|
|
92
|
+
|
|
93
|
+
#### min
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
- Type: `string`
|
|
98
|
+
- Default: `-`
|
|
99
|
+
|
|
100
|
+
#### max
|
|
101
|
+
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
- Type: `string`
|
|
105
|
+
- Default: `-`
|
|
106
|
+
|
|
107
|
+
#### markers
|
|
108
|
+
|
|
109
|
+
Pass a value similar to step to create visual markers at that interval
|
|
110
|
+
|
|
111
|
+
- Type: `number`
|
|
112
|
+
- Default: `-`
|
|
113
|
+
|
|
114
|
+
#### step
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
- Type: `number`
|
|
119
|
+
- Default: `-`
|
|
120
|
+
|
|
121
|
+
#### suffix
|
|
122
|
+
|
|
123
|
+
Suffix used in text input fields and for the min and max values of the slider.
|
|
124
|
+
|
|
125
|
+
- Type: `string`
|
|
126
|
+
- Default: `-`
|
|
127
|
+
|
|
128
|
+
#### hiddenTextfield
|
|
129
|
+
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
- Type: `boolean`
|
|
133
|
+
- Default: `false`
|
|
134
|
+
|
|
135
|
+
#### valueFormatter
|
|
136
|
+
|
|
137
|
+
Formatter for the tooltip and input mask values.
|
|
138
|
+
|
|
139
|
+
- Type: `(value: string, slot: SliderSlot) => string`
|
|
140
|
+
- Default: `-`
|
|
141
|
+
|
|
142
|
+
#### tooltipFormatter
|
|
143
|
+
|
|
144
|
+
Replaces valueFormatter for the tooltip. Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip.
|
|
145
|
+
|
|
146
|
+
- Type: `(value: string, slot: SliderSlot) => string`
|
|
147
|
+
- Default: `-`
|
|
148
|
+
|
|
149
|
+
#### labelFormatter
|
|
150
|
+
|
|
151
|
+
Formatter for the min and max labels below the range.
|
|
152
|
+
|
|
153
|
+
- Type: `(slot: SliderSlot) => string`
|
|
154
|
+
- Default: `-`
|
|
155
|
+
|
|
156
|
+
#### _invalidMessage
|
|
157
|
+
|
|
158
|
+
|
|
159
|
+
|
|
160
|
+
- Type: `string`
|
|
161
|
+
- Default: `''`
|
|
162
|
+
|
|
163
|
+
#### _hasInternalError
|
|
164
|
+
|
|
165
|
+
|
|
166
|
+
|
|
167
|
+
- Type: `boolean`
|
|
168
|
+
- Default: `false`
|
|
169
|
+
|
|
170
|
+
#### _showError
|
|
171
|
+
|
|
172
|
+
|
|
173
|
+
|
|
174
|
+
- Type: `boolean`
|
|
175
|
+
- Default: `false`
|
|
176
|
+
|
|
177
|
+
#### _tabbableElements
|
|
178
|
+
|
|
179
|
+
|
|
180
|
+
|
|
181
|
+
- Type: `Array<HTMLElement>`
|
|
182
|
+
- Default: `[]`
|
|
183
|
+
|
|
184
|
+
#### edgeMin
|
|
185
|
+
|
|
186
|
+
|
|
187
|
+
|
|
188
|
+
- Type: `unknown`
|
|
189
|
+
- Default: `-`
|
|
190
|
+
|
|
191
|
+
#### edgeMax
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
|
|
195
|
+
- Type: `unknown`
|
|
196
|
+
- Default: `-`
|
|
197
|
+
|
|
198
|
+
#### componentHasError
|
|
199
|
+
|
|
200
|
+
|
|
201
|
+
|
|
202
|
+
- Type: `boolean`
|
|
203
|
+
- Default: `-`
|
|
204
|
+
|
|
205
|
+
#### errorText
|
|
206
|
+
|
|
207
|
+
|
|
208
|
+
|
|
209
|
+
- Type: `string`
|
|
210
|
+
- Default: `-`
|
|
211
|
+
|
|
212
|
+
### Types
|
|
213
|
+
|
|
214
|
+
No types documented.
|