@vaadin/button 25.2.0-alpha8 → 25.2.0-beta1
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/custom-elements.json +32 -4
- package/package.json +11 -11
- package/src/vaadin-button-mixin.js +0 -5
- package/src/vaadin-button.d.ts +6 -8
- package/src/vaadin-button.js +6 -11
- package/web-types.json +5 -9
- package/web-types.lit.json +2 -2
package/custom-elements.json
CHANGED
|
@@ -25,7 +25,22 @@
|
|
|
25
25
|
"kind": "mixin",
|
|
26
26
|
"description": "A mixin providing common button functionality.",
|
|
27
27
|
"name": "ButtonMixin",
|
|
28
|
-
"members": [
|
|
28
|
+
"members": [
|
|
29
|
+
{
|
|
30
|
+
"kind": "field",
|
|
31
|
+
"name": "disabled",
|
|
32
|
+
"privacy": "public",
|
|
33
|
+
"type": {
|
|
34
|
+
"text": "boolean"
|
|
35
|
+
},
|
|
36
|
+
"description": "If true, the user cannot interact with this element.",
|
|
37
|
+
"attribute": "disabled",
|
|
38
|
+
"inheritedFrom": {
|
|
39
|
+
"name": "DisabledMixin",
|
|
40
|
+
"package": "@vaadin/a11y-base/src/disabled-mixin.js"
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
],
|
|
29
44
|
"mixins": [
|
|
30
45
|
{
|
|
31
46
|
"name": "ActiveMixin",
|
|
@@ -45,7 +60,20 @@
|
|
|
45
60
|
"name": "superClass"
|
|
46
61
|
}
|
|
47
62
|
],
|
|
48
|
-
"attributes": [
|
|
63
|
+
"attributes": [
|
|
64
|
+
{
|
|
65
|
+
"name": "disabled",
|
|
66
|
+
"type": {
|
|
67
|
+
"text": "boolean"
|
|
68
|
+
},
|
|
69
|
+
"description": "If true, the user cannot interact with this element.",
|
|
70
|
+
"fieldName": "disabled",
|
|
71
|
+
"inheritedFrom": {
|
|
72
|
+
"name": "DisabledMixin",
|
|
73
|
+
"package": "@vaadin/a11y-base/src/disabled-mixin.js"
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
]
|
|
49
77
|
}
|
|
50
78
|
],
|
|
51
79
|
"exports": [
|
|
@@ -75,7 +103,7 @@
|
|
|
75
103
|
"type": {
|
|
76
104
|
"text": "boolean"
|
|
77
105
|
},
|
|
78
|
-
"description": "When disabled, the button is rendered as \"dimmed\"
|
|
106
|
+
"description": "When disabled, the button is rendered as \"dimmed\".\n\nBy default, disabled buttons are not focusable and don't react to hover.\nAs a result, they are hidden from assistive technologies, and it's not\npossible to show a tooltip to explain why they are disabled. This can\nbe addressed by enabling the feature flag `accessibleDisabledButtons`,\nwhich makes disabled buttons focusable and hoverable, while still\npreventing them from being activated:\n\n```js\n// Set before any button is attached to the DOM.\nwindow.Vaadin.featureFlags.accessibleDisabledButtons = true\n```",
|
|
79
107
|
"attribute": "disabled"
|
|
80
108
|
}
|
|
81
109
|
],
|
|
@@ -85,7 +113,7 @@
|
|
|
85
113
|
"type": {
|
|
86
114
|
"text": "boolean"
|
|
87
115
|
},
|
|
88
|
-
"description": "When disabled, the button is rendered as \"dimmed\"
|
|
116
|
+
"description": "When disabled, the button is rendered as \"dimmed\".\n\nBy default, disabled buttons are not focusable and don't react to hover.\nAs a result, they are hidden from assistive technologies, and it's not\npossible to show a tooltip to explain why they are disabled. This can\nbe addressed by enabling the feature flag `accessibleDisabledButtons`,\nwhich makes disabled buttons focusable and hoverable, while still\npreventing them from being activated:\n\n```js\n// Set before any button is attached to the DOM.\nwindow.Vaadin.featureFlags.accessibleDisabledButtons = true\n```",
|
|
89
117
|
"fieldName": "disabled"
|
|
90
118
|
}
|
|
91
119
|
],
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/button",
|
|
3
|
-
"version": "25.2.0-
|
|
3
|
+
"version": "25.2.0-beta1",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -35,19 +35,19 @@
|
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
38
|
-
"@vaadin/a11y-base": "25.2.0-
|
|
39
|
-
"@vaadin/component-base": "25.2.0-
|
|
40
|
-
"@vaadin/vaadin-themable-mixin": "25.2.0-
|
|
38
|
+
"@vaadin/a11y-base": "25.2.0-beta1",
|
|
39
|
+
"@vaadin/component-base": "25.2.0-beta1",
|
|
40
|
+
"@vaadin/vaadin-themable-mixin": "25.2.0-beta1",
|
|
41
41
|
"lit": "^3.0.0"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
|
-
"@vaadin/aura": "25.2.0-
|
|
45
|
-
"@vaadin/chai-plugins": "25.2.0-
|
|
46
|
-
"@vaadin/icon": "25.2.0-
|
|
47
|
-
"@vaadin/icons": "25.2.0-
|
|
48
|
-
"@vaadin/test-runner-commands": "25.2.0-
|
|
44
|
+
"@vaadin/aura": "25.2.0-beta1",
|
|
45
|
+
"@vaadin/chai-plugins": "25.2.0-beta1",
|
|
46
|
+
"@vaadin/icon": "25.2.0-beta1",
|
|
47
|
+
"@vaadin/icons": "25.2.0-beta1",
|
|
48
|
+
"@vaadin/test-runner-commands": "25.2.0-beta1",
|
|
49
49
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
50
|
-
"@vaadin/vaadin-lumo-styles": "25.2.0-
|
|
50
|
+
"@vaadin/vaadin-lumo-styles": "25.2.0-beta1",
|
|
51
51
|
"sinon": "^21.0.2"
|
|
52
52
|
},
|
|
53
53
|
"customElements": "custom-elements.json",
|
|
@@ -55,5 +55,5 @@
|
|
|
55
55
|
"web-types.json",
|
|
56
56
|
"web-types.lit.json"
|
|
57
57
|
],
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "471a23f60d1eb725f98a33f62cb9664d9c0a4163"
|
|
59
59
|
}
|
|
@@ -11,11 +11,6 @@ const INTERACTION_EVENTS = ['mousedown', 'mouseup', 'click', 'dblclick', 'keypre
|
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* A mixin providing common button functionality.
|
|
14
|
-
*
|
|
15
|
-
* @polymerMixin
|
|
16
|
-
* @mixes ActiveMixin
|
|
17
|
-
* @mixes FocusMixin
|
|
18
|
-
* @mixes TabindexMixin
|
|
19
14
|
*/
|
|
20
15
|
export const ButtonMixin = (superClass) =>
|
|
21
16
|
class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {
|
package/src/vaadin-button.d.ts
CHANGED
|
@@ -55,16 +55,14 @@ import { ButtonMixin } from './vaadin-button-mixin.js';
|
|
|
55
55
|
*/
|
|
56
56
|
declare class Button extends ButtonMixin(ElementMixin(ThemableMixin(HTMLElement))) {
|
|
57
57
|
/**
|
|
58
|
-
* When disabled, the button is rendered as "dimmed"
|
|
59
|
-
* user interactions (mouse and keyboard).
|
|
58
|
+
* When disabled, the button is rendered as "dimmed".
|
|
60
59
|
*
|
|
61
|
-
*
|
|
62
|
-
*
|
|
63
|
-
*
|
|
64
|
-
*
|
|
65
|
-
* addressed by enabling the feature flag `accessibleDisabledButtons`,
|
|
60
|
+
* By default, disabled buttons are not focusable and don't react to hover.
|
|
61
|
+
* As a result, they are hidden from assistive technologies, and it's not
|
|
62
|
+
* possible to show a tooltip to explain why they are disabled. This can
|
|
63
|
+
* be addressed by enabling the feature flag `accessibleDisabledButtons`,
|
|
66
64
|
* which makes disabled buttons focusable and hoverable, while still
|
|
67
|
-
* preventing them from being
|
|
65
|
+
* preventing them from being activated:
|
|
68
66
|
*
|
|
69
67
|
* ```js
|
|
70
68
|
* // Set before any button is attached to the DOM.
|
package/src/vaadin-button.js
CHANGED
|
@@ -61,9 +61,6 @@ import { ButtonMixin } from './vaadin-button-mixin.js';
|
|
|
61
61
|
*
|
|
62
62
|
* @customElement vaadin-button
|
|
63
63
|
* @extends HTMLElement
|
|
64
|
-
* @mixes ButtonMixin
|
|
65
|
-
* @mixes ElementMixin
|
|
66
|
-
* @mixes ThemableMixin
|
|
67
64
|
*/
|
|
68
65
|
class Button extends ButtonMixin(ElementMixin(ThemableMixin(PolylitMixin(LumoInjectionMixin(LitElement))))) {
|
|
69
66
|
static get is() {
|
|
@@ -77,16 +74,14 @@ class Button extends ButtonMixin(ElementMixin(ThemableMixin(PolylitMixin(LumoInj
|
|
|
77
74
|
static get properties() {
|
|
78
75
|
return {
|
|
79
76
|
/**
|
|
80
|
-
* When disabled, the button is rendered as "dimmed"
|
|
81
|
-
* user interactions (mouse and keyboard).
|
|
77
|
+
* When disabled, the button is rendered as "dimmed".
|
|
82
78
|
*
|
|
83
|
-
*
|
|
84
|
-
*
|
|
85
|
-
*
|
|
86
|
-
*
|
|
87
|
-
* addressed by enabling the feature flag `accessibleDisabledButtons`,
|
|
79
|
+
* By default, disabled buttons are not focusable and don't react to hover.
|
|
80
|
+
* As a result, they are hidden from assistive technologies, and it's not
|
|
81
|
+
* possible to show a tooltip to explain why they are disabled. This can
|
|
82
|
+
* be addressed by enabling the feature flag `accessibleDisabledButtons`,
|
|
88
83
|
* which makes disabled buttons focusable and hoverable, while still
|
|
89
|
-
* preventing them from being
|
|
84
|
+
* preventing them from being activated:
|
|
90
85
|
*
|
|
91
86
|
* ```js
|
|
92
87
|
* // Set before any button is attached to the DOM.
|
package/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/button",
|
|
4
|
-
"version": "25.2.0-
|
|
4
|
+
"version": "25.2.0-beta1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -12,12 +12,10 @@
|
|
|
12
12
|
"attributes": [
|
|
13
13
|
{
|
|
14
14
|
"name": "disabled",
|
|
15
|
-
"description": "When disabled, the button is rendered as \"dimmed\"
|
|
15
|
+
"description": "When disabled, the button is rendered as \"dimmed\".\n\nBy default, disabled buttons are not focusable and don't react to hover.\nAs a result, they are hidden from assistive technologies, and it's not\npossible to show a tooltip to explain why they are disabled. This can\nbe addressed by enabling the feature flag `accessibleDisabledButtons`,\nwhich makes disabled buttons focusable and hoverable, while still\npreventing them from being activated:\n\n```js\n// Set before any button is attached to the DOM.\nwindow.Vaadin.featureFlags.accessibleDisabledButtons = true\n```",
|
|
16
16
|
"value": {
|
|
17
17
|
"type": [
|
|
18
|
-
"boolean"
|
|
19
|
-
"null",
|
|
20
|
-
"undefined"
|
|
18
|
+
"boolean"
|
|
21
19
|
]
|
|
22
20
|
}
|
|
23
21
|
},
|
|
@@ -37,12 +35,10 @@
|
|
|
37
35
|
"properties": [
|
|
38
36
|
{
|
|
39
37
|
"name": "disabled",
|
|
40
|
-
"description": "When disabled, the button is rendered as \"dimmed\"
|
|
38
|
+
"description": "When disabled, the button is rendered as \"dimmed\".\n\nBy default, disabled buttons are not focusable and don't react to hover.\nAs a result, they are hidden from assistive technologies, and it's not\npossible to show a tooltip to explain why they are disabled. This can\nbe addressed by enabling the feature flag `accessibleDisabledButtons`,\nwhich makes disabled buttons focusable and hoverable, while still\npreventing them from being activated:\n\n```js\n// Set before any button is attached to the DOM.\nwindow.Vaadin.featureFlags.accessibleDisabledButtons = true\n```",
|
|
41
39
|
"value": {
|
|
42
40
|
"type": [
|
|
43
|
-
"boolean"
|
|
44
|
-
"null",
|
|
45
|
-
"undefined"
|
|
41
|
+
"boolean"
|
|
46
42
|
]
|
|
47
43
|
}
|
|
48
44
|
}
|
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/button",
|
|
4
|
-
"version": "25.2.0-
|
|
4
|
+
"version": "25.2.0-beta1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"framework": "lit",
|
|
7
7
|
"framework-config": {
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"attributes": [
|
|
22
22
|
{
|
|
23
23
|
"name": "?disabled",
|
|
24
|
-
"description": "When disabled, the button is rendered as \"dimmed\"
|
|
24
|
+
"description": "When disabled, the button is rendered as \"dimmed\".\n\nBy default, disabled buttons are not focusable and don't react to hover.\nAs a result, they are hidden from assistive technologies, and it's not\npossible to show a tooltip to explain why they are disabled. This can\nbe addressed by enabling the feature flag `accessibleDisabledButtons`,\nwhich makes disabled buttons focusable and hoverable, while still\npreventing them from being activated:\n\n```js\n// Set before any button is attached to the DOM.\nwindow.Vaadin.featureFlags.accessibleDisabledButtons = true\n```",
|
|
25
25
|
"value": {
|
|
26
26
|
"kind": "expression"
|
|
27
27
|
}
|