@phcdevworks/spectre-components 1.0.0 → 1.1.0
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 +113 -40
- package/dist/{base-DQtCQ-dP.d.cts → base-2rD8EmdC.d.cts} +15 -5
- package/dist/{base-DQtCQ-dP.d.ts → base-2rD8EmdC.d.ts} +15 -5
- package/dist/button.cjs +158 -58
- package/dist/button.cjs.map +1 -1
- package/dist/button.d.cts +22 -28
- package/dist/button.d.ts +22 -28
- package/dist/button.js +158 -58
- package/dist/button.js.map +1 -1
- package/dist/checkbox.cjs +164 -64
- package/dist/checkbox.cjs.map +1 -1
- package/dist/checkbox.d.cts +18 -23
- package/dist/checkbox.d.ts +18 -23
- package/dist/checkbox.js +164 -64
- package/dist/checkbox.js.map +1 -1
- package/dist/fieldset.cjs +154 -55
- package/dist/fieldset.cjs.map +1 -1
- package/dist/fieldset.d.cts +13 -18
- package/dist/fieldset.d.ts +13 -18
- package/dist/fieldset.js +154 -55
- package/dist/fieldset.js.map +1 -1
- package/dist/index.cjs +324 -261
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +324 -261
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +174 -72
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +33 -38
- package/dist/input.d.ts +33 -38
- package/dist/input.js +174 -72
- package/dist/input.js.map +1 -1
- package/dist/label.cjs +152 -56
- package/dist/label.cjs.map +1 -1
- package/dist/label.d.cts +8 -13
- package/dist/label.d.ts +8 -13
- package/dist/label.js +152 -56
- package/dist/label.js.map +1 -1
- package/dist/{projectable-DcnBRiko.d.cts → projectable-BzDQ4xp_.d.cts} +1 -1
- package/dist/{projectable-SzbPvXfM.d.ts → projectable-s3SgvjGX.d.ts} +1 -1
- package/dist/radio.cjs +164 -64
- package/dist/radio.cjs.map +1 -1
- package/dist/radio.d.cts +18 -23
- package/dist/radio.d.ts +18 -23
- package/dist/radio.js +164 -64
- package/dist/radio.js.map +1 -1
- package/dist/select.cjs +161 -61
- package/dist/select.cjs.map +1 -1
- package/dist/select.d.cts +22 -27
- package/dist/select.d.ts +22 -27
- package/dist/select.js +161 -61
- package/dist/select.js.map +1 -1
- package/dist/textarea.cjs +172 -72
- package/dist/textarea.cjs.map +1 -1
- package/dist/textarea.d.cts +27 -32
- package/dist/textarea.d.ts +27 -32
- package/dist/textarea.js +172 -72
- package/dist/textarea.js.map +1 -1
- package/package.json +9 -8
package/dist/button.d.cts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { TemplateResult } from 'lit';
|
|
2
|
-
import { S as SpectreProjectableElement } from './projectable-
|
|
3
|
-
import './base-
|
|
2
|
+
import { S as SpectreProjectableElement } from './projectable-BzDQ4xp_.cjs';
|
|
3
|
+
import './base-2rD8EmdC.cjs';
|
|
4
4
|
|
|
5
5
|
declare const spectreButtonVariants: readonly ["primary", "secondary", "ghost", "danger", "success", "cta", "accent"];
|
|
6
6
|
declare const spectreButtonSizes: readonly ["sm", "md", "lg"];
|
|
@@ -9,23 +9,23 @@ type SpectreButtonVariant = (typeof spectreButtonVariants)[number];
|
|
|
9
9
|
type SpectreButtonSize = (typeof spectreButtonSizes)[number];
|
|
10
10
|
type SpectreButtonType = (typeof spectreButtonTypes)[number];
|
|
11
11
|
interface SpectreButtonProps {
|
|
12
|
-
ariaLabel
|
|
13
|
-
ariaLabelledBy
|
|
14
|
-
ariaDescribedBy
|
|
15
|
-
autofocus?: boolean;
|
|
16
|
-
disabled?: boolean;
|
|
17
|
-
form?: string;
|
|
18
|
-
fullWidth?: boolean;
|
|
19
|
-
label?: string;
|
|
20
|
-
loading?: boolean;
|
|
21
|
-
loadingLabel?: string;
|
|
22
|
-
name?: string;
|
|
23
|
-
pill?: boolean;
|
|
24
|
-
size?: SpectreButtonSize;
|
|
25
|
-
title?: string;
|
|
26
|
-
type?: SpectreButtonType;
|
|
27
|
-
variant?: SpectreButtonVariant;
|
|
28
|
-
value?: string;
|
|
12
|
+
ariaLabel: string | null;
|
|
13
|
+
ariaLabelledBy: string | null;
|
|
14
|
+
ariaDescribedBy: string | null;
|
|
15
|
+
autofocus?: boolean | undefined;
|
|
16
|
+
disabled?: boolean | undefined;
|
|
17
|
+
form?: string | undefined;
|
|
18
|
+
fullWidth?: boolean | undefined;
|
|
19
|
+
label?: string | undefined;
|
|
20
|
+
loading?: boolean | undefined;
|
|
21
|
+
loadingLabel?: string | undefined;
|
|
22
|
+
name?: string | undefined;
|
|
23
|
+
pill?: boolean | undefined;
|
|
24
|
+
size?: SpectreButtonSize | undefined;
|
|
25
|
+
title?: string | undefined;
|
|
26
|
+
type?: SpectreButtonType | undefined;
|
|
27
|
+
variant?: SpectreButtonVariant | undefined;
|
|
28
|
+
value?: string | undefined;
|
|
29
29
|
}
|
|
30
30
|
declare class SpectreButtonElement extends SpectreProjectableElement implements SpectreButtonProps {
|
|
31
31
|
static properties: {
|
|
@@ -70,10 +70,6 @@ declare class SpectreButtonElement extends SpectreProjectableElement implements
|
|
|
70
70
|
type: StringConstructor;
|
|
71
71
|
reflect: boolean;
|
|
72
72
|
};
|
|
73
|
-
title: {
|
|
74
|
-
type: StringConstructor;
|
|
75
|
-
reflect: boolean;
|
|
76
|
-
};
|
|
77
73
|
type: {
|
|
78
74
|
type: StringConstructor;
|
|
79
75
|
reflect: boolean;
|
|
@@ -84,20 +80,18 @@ declare class SpectreButtonElement extends SpectreProjectableElement implements
|
|
|
84
80
|
};
|
|
85
81
|
value: {
|
|
86
82
|
type: StringConstructor;
|
|
87
|
-
reflect: boolean;
|
|
88
83
|
};
|
|
89
84
|
};
|
|
90
85
|
autofocus: boolean;
|
|
91
86
|
disabled: boolean;
|
|
92
|
-
form
|
|
87
|
+
form: string | undefined;
|
|
93
88
|
fullWidth: boolean;
|
|
94
|
-
label
|
|
89
|
+
label: string | undefined;
|
|
95
90
|
loading: boolean;
|
|
96
91
|
loadingLabel: string;
|
|
97
|
-
name
|
|
92
|
+
name: string | undefined;
|
|
98
93
|
pill: boolean;
|
|
99
94
|
size: SpectreButtonSize;
|
|
100
|
-
title: string;
|
|
101
95
|
type: SpectreButtonType;
|
|
102
96
|
variant: SpectreButtonVariant;
|
|
103
97
|
value: string;
|
package/dist/button.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { TemplateResult } from 'lit';
|
|
2
|
-
import { S as SpectreProjectableElement } from './projectable-
|
|
3
|
-
import './base-
|
|
2
|
+
import { S as SpectreProjectableElement } from './projectable-s3SgvjGX.js';
|
|
3
|
+
import './base-2rD8EmdC.js';
|
|
4
4
|
|
|
5
5
|
declare const spectreButtonVariants: readonly ["primary", "secondary", "ghost", "danger", "success", "cta", "accent"];
|
|
6
6
|
declare const spectreButtonSizes: readonly ["sm", "md", "lg"];
|
|
@@ -9,23 +9,23 @@ type SpectreButtonVariant = (typeof spectreButtonVariants)[number];
|
|
|
9
9
|
type SpectreButtonSize = (typeof spectreButtonSizes)[number];
|
|
10
10
|
type SpectreButtonType = (typeof spectreButtonTypes)[number];
|
|
11
11
|
interface SpectreButtonProps {
|
|
12
|
-
ariaLabel
|
|
13
|
-
ariaLabelledBy
|
|
14
|
-
ariaDescribedBy
|
|
15
|
-
autofocus?: boolean;
|
|
16
|
-
disabled?: boolean;
|
|
17
|
-
form?: string;
|
|
18
|
-
fullWidth?: boolean;
|
|
19
|
-
label?: string;
|
|
20
|
-
loading?: boolean;
|
|
21
|
-
loadingLabel?: string;
|
|
22
|
-
name?: string;
|
|
23
|
-
pill?: boolean;
|
|
24
|
-
size?: SpectreButtonSize;
|
|
25
|
-
title?: string;
|
|
26
|
-
type?: SpectreButtonType;
|
|
27
|
-
variant?: SpectreButtonVariant;
|
|
28
|
-
value?: string;
|
|
12
|
+
ariaLabel: string | null;
|
|
13
|
+
ariaLabelledBy: string | null;
|
|
14
|
+
ariaDescribedBy: string | null;
|
|
15
|
+
autofocus?: boolean | undefined;
|
|
16
|
+
disabled?: boolean | undefined;
|
|
17
|
+
form?: string | undefined;
|
|
18
|
+
fullWidth?: boolean | undefined;
|
|
19
|
+
label?: string | undefined;
|
|
20
|
+
loading?: boolean | undefined;
|
|
21
|
+
loadingLabel?: string | undefined;
|
|
22
|
+
name?: string | undefined;
|
|
23
|
+
pill?: boolean | undefined;
|
|
24
|
+
size?: SpectreButtonSize | undefined;
|
|
25
|
+
title?: string | undefined;
|
|
26
|
+
type?: SpectreButtonType | undefined;
|
|
27
|
+
variant?: SpectreButtonVariant | undefined;
|
|
28
|
+
value?: string | undefined;
|
|
29
29
|
}
|
|
30
30
|
declare class SpectreButtonElement extends SpectreProjectableElement implements SpectreButtonProps {
|
|
31
31
|
static properties: {
|
|
@@ -70,10 +70,6 @@ declare class SpectreButtonElement extends SpectreProjectableElement implements
|
|
|
70
70
|
type: StringConstructor;
|
|
71
71
|
reflect: boolean;
|
|
72
72
|
};
|
|
73
|
-
title: {
|
|
74
|
-
type: StringConstructor;
|
|
75
|
-
reflect: boolean;
|
|
76
|
-
};
|
|
77
73
|
type: {
|
|
78
74
|
type: StringConstructor;
|
|
79
75
|
reflect: boolean;
|
|
@@ -84,20 +80,18 @@ declare class SpectreButtonElement extends SpectreProjectableElement implements
|
|
|
84
80
|
};
|
|
85
81
|
value: {
|
|
86
82
|
type: StringConstructor;
|
|
87
|
-
reflect: boolean;
|
|
88
83
|
};
|
|
89
84
|
};
|
|
90
85
|
autofocus: boolean;
|
|
91
86
|
disabled: boolean;
|
|
92
|
-
form
|
|
87
|
+
form: string | undefined;
|
|
93
88
|
fullWidth: boolean;
|
|
94
|
-
label
|
|
89
|
+
label: string | undefined;
|
|
95
90
|
loading: boolean;
|
|
96
91
|
loadingLabel: string;
|
|
97
|
-
name
|
|
92
|
+
name: string | undefined;
|
|
98
93
|
pill: boolean;
|
|
99
94
|
size: SpectreButtonSize;
|
|
100
|
-
title: string;
|
|
101
95
|
type: SpectreButtonType;
|
|
102
96
|
variant: SpectreButtonVariant;
|
|
103
97
|
value: string;
|
package/dist/button.js
CHANGED
|
@@ -6,22 +6,67 @@ import { getButtonClasses } from '@phcdevworks/spectre-ui';
|
|
|
6
6
|
var SpectreBaseElement = class extends LitElement {
|
|
7
7
|
constructor() {
|
|
8
8
|
super(...arguments);
|
|
9
|
-
this.
|
|
10
|
-
this.
|
|
11
|
-
this.
|
|
9
|
+
this._ariaLabel = null;
|
|
10
|
+
this._ariaLabelledBy = null;
|
|
11
|
+
this._ariaDescribedBy = null;
|
|
12
|
+
this._title = "";
|
|
13
|
+
this._id = "";
|
|
14
|
+
}
|
|
15
|
+
get ariaLabel() {
|
|
16
|
+
return this._ariaLabel;
|
|
17
|
+
}
|
|
18
|
+
set ariaLabel(value) {
|
|
19
|
+
if (this._ariaLabel === value) {
|
|
20
|
+
return;
|
|
21
|
+
}
|
|
22
|
+
this._ariaLabel = value;
|
|
23
|
+
this._removeHostAttribute("aria-label");
|
|
24
|
+
this.requestUpdate();
|
|
25
|
+
}
|
|
26
|
+
get ariaLabelledBy() {
|
|
27
|
+
return this._ariaLabelledBy;
|
|
28
|
+
}
|
|
29
|
+
set ariaLabelledBy(value) {
|
|
30
|
+
if (this._ariaLabelledBy === value) {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
this._ariaLabelledBy = value;
|
|
34
|
+
this._removeHostAttribute("aria-labelledby");
|
|
35
|
+
this.requestUpdate();
|
|
36
|
+
}
|
|
37
|
+
get ariaDescribedBy() {
|
|
38
|
+
return this._ariaDescribedBy;
|
|
39
|
+
}
|
|
40
|
+
set ariaDescribedBy(value) {
|
|
41
|
+
if (this._ariaDescribedBy === value) {
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
this._ariaDescribedBy = value;
|
|
45
|
+
this._removeHostAttribute("aria-describedby");
|
|
46
|
+
this.requestUpdate();
|
|
47
|
+
}
|
|
48
|
+
get title() {
|
|
49
|
+
return this._title;
|
|
50
|
+
}
|
|
51
|
+
set title(value) {
|
|
52
|
+
const normalizedValue = value ?? "";
|
|
53
|
+
if (this._title === normalizedValue) {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
this._title = normalizedValue;
|
|
57
|
+
this._removeHostAttribute("title");
|
|
58
|
+
this.requestUpdate();
|
|
12
59
|
}
|
|
13
60
|
get id() {
|
|
14
|
-
return this._id
|
|
61
|
+
return this._id;
|
|
15
62
|
}
|
|
16
63
|
set id(value) {
|
|
17
|
-
|
|
64
|
+
const normalizedValue = value ?? "";
|
|
65
|
+
if (this._id === normalizedValue) {
|
|
18
66
|
return;
|
|
19
67
|
}
|
|
20
|
-
this._id =
|
|
21
|
-
|
|
22
|
-
if (HTMLElement.prototype.hasAttribute.call(host, "id")) {
|
|
23
|
-
HTMLElement.prototype.removeAttribute.call(host, "id");
|
|
24
|
-
}
|
|
68
|
+
this._id = normalizedValue;
|
|
69
|
+
this._removeHostAttribute("id");
|
|
25
70
|
this.requestUpdate();
|
|
26
71
|
}
|
|
27
72
|
// Spectre components intentionally render in light DOM so the global
|
|
@@ -31,36 +76,99 @@ var SpectreBaseElement = class extends LitElement {
|
|
|
31
76
|
}
|
|
32
77
|
connectedCallback() {
|
|
33
78
|
super.connectedCallback();
|
|
34
|
-
const
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
79
|
+
const proxiedAttributes = [
|
|
80
|
+
"id",
|
|
81
|
+
"title",
|
|
82
|
+
"aria-label",
|
|
83
|
+
"aria-labelledby",
|
|
84
|
+
"aria-describedby"
|
|
85
|
+
];
|
|
86
|
+
proxiedAttributes.forEach((attr) => {
|
|
87
|
+
const value = super.getAttribute(attr);
|
|
88
|
+
if (value !== null) {
|
|
89
|
+
this.setAttribute(attr, value);
|
|
90
|
+
}
|
|
91
|
+
});
|
|
38
92
|
}
|
|
39
93
|
getAttribute(qualifiedName) {
|
|
40
|
-
|
|
41
|
-
|
|
94
|
+
switch (qualifiedName) {
|
|
95
|
+
case "id":
|
|
96
|
+
return this.id || null;
|
|
97
|
+
case "title":
|
|
98
|
+
return this.title || null;
|
|
99
|
+
case "aria-label":
|
|
100
|
+
return this.ariaLabel;
|
|
101
|
+
case "aria-labelledby":
|
|
102
|
+
return this.ariaLabelledBy;
|
|
103
|
+
case "aria-describedby":
|
|
104
|
+
return this.ariaDescribedBy;
|
|
105
|
+
default:
|
|
106
|
+
return super.getAttribute(qualifiedName);
|
|
42
107
|
}
|
|
43
|
-
return super.getAttribute(qualifiedName);
|
|
44
108
|
}
|
|
45
109
|
hasAttribute(qualifiedName) {
|
|
46
|
-
|
|
47
|
-
|
|
110
|
+
switch (qualifiedName) {
|
|
111
|
+
case "id":
|
|
112
|
+
return this.id !== "";
|
|
113
|
+
case "title":
|
|
114
|
+
return this.title !== "";
|
|
115
|
+
case "aria-label":
|
|
116
|
+
return this.ariaLabel !== null;
|
|
117
|
+
case "aria-labelledby":
|
|
118
|
+
return this.ariaLabelledBy !== null;
|
|
119
|
+
case "aria-describedby":
|
|
120
|
+
return this.ariaDescribedBy !== null;
|
|
121
|
+
default:
|
|
122
|
+
return super.hasAttribute(qualifiedName);
|
|
48
123
|
}
|
|
49
|
-
return super.hasAttribute(qualifiedName);
|
|
50
124
|
}
|
|
51
125
|
setAttribute(qualifiedName, value) {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
126
|
+
switch (qualifiedName) {
|
|
127
|
+
case "id":
|
|
128
|
+
this.id = value;
|
|
129
|
+
break;
|
|
130
|
+
case "title":
|
|
131
|
+
this.title = value;
|
|
132
|
+
break;
|
|
133
|
+
case "aria-label":
|
|
134
|
+
this.ariaLabel = value;
|
|
135
|
+
break;
|
|
136
|
+
case "aria-labelledby":
|
|
137
|
+
this.ariaLabelledBy = value;
|
|
138
|
+
break;
|
|
139
|
+
case "aria-describedby":
|
|
140
|
+
this.ariaDescribedBy = value;
|
|
141
|
+
break;
|
|
142
|
+
default:
|
|
143
|
+
super.setAttribute(qualifiedName, value);
|
|
55
144
|
}
|
|
56
|
-
super.setAttribute(qualifiedName, value);
|
|
57
145
|
}
|
|
58
146
|
removeAttribute(qualifiedName) {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
147
|
+
switch (qualifiedName) {
|
|
148
|
+
case "id":
|
|
149
|
+
this.id = "";
|
|
150
|
+
break;
|
|
151
|
+
case "title":
|
|
152
|
+
this.title = "";
|
|
153
|
+
break;
|
|
154
|
+
case "aria-label":
|
|
155
|
+
this.ariaLabel = null;
|
|
156
|
+
break;
|
|
157
|
+
case "aria-labelledby":
|
|
158
|
+
this.ariaLabelledBy = null;
|
|
159
|
+
break;
|
|
160
|
+
case "aria-describedby":
|
|
161
|
+
this.ariaDescribedBy = null;
|
|
162
|
+
break;
|
|
163
|
+
default:
|
|
164
|
+
super.removeAttribute(qualifiedName);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
_removeHostAttribute(name) {
|
|
168
|
+
const host = this;
|
|
169
|
+
if (HTMLElement.prototype.hasAttribute.call(host, name)) {
|
|
170
|
+
HTMLElement.prototype.removeAttribute.call(host, name);
|
|
62
171
|
}
|
|
63
|
-
super.removeAttribute(qualifiedName);
|
|
64
172
|
}
|
|
65
173
|
get forwardedAriaLabel() {
|
|
66
174
|
const value = this.ariaLabel?.trim();
|
|
@@ -75,11 +183,7 @@ var SpectreBaseElement = class extends LitElement {
|
|
|
75
183
|
return value ? value : void 0;
|
|
76
184
|
}
|
|
77
185
|
};
|
|
78
|
-
SpectreBaseElement.properties = {
|
|
79
|
-
ariaLabel: { attribute: "aria-label", type: String },
|
|
80
|
-
ariaLabelledBy: { attribute: "aria-labelledby", type: String },
|
|
81
|
-
ariaDescribedBy: { attribute: "aria-describedby", type: String }
|
|
82
|
-
};
|
|
186
|
+
SpectreBaseElement.properties = {};
|
|
83
187
|
|
|
84
188
|
// src/utils/dom.ts
|
|
85
189
|
function hasMeaningfulContent(nodes) {
|
|
@@ -140,9 +244,9 @@ var SpectreProjectableElement = class extends SpectreBaseElement {
|
|
|
140
244
|
}
|
|
141
245
|
this.contentObserver = new MutationObserver((mutations) => {
|
|
142
246
|
const isInternalMovement = mutations.every(
|
|
143
|
-
(mutation) =>
|
|
247
|
+
(mutation) => [...mutation.removedNodes].every(
|
|
144
248
|
(node) => this.isInternalNode(node) || this.contains(node)
|
|
145
|
-
) &&
|
|
249
|
+
) && [...mutation.addedNodes].every((node) => this.isInternalNode(node))
|
|
146
250
|
);
|
|
147
251
|
if (isInternalMovement) {
|
|
148
252
|
return;
|
|
@@ -188,7 +292,6 @@ var SpectreButtonElement = class extends SpectreProjectableElement {
|
|
|
188
292
|
this.loadingLabel = "Loading";
|
|
189
293
|
this.pill = false;
|
|
190
294
|
this.size = "md";
|
|
191
|
-
this.title = "";
|
|
192
295
|
this.type = "button";
|
|
193
296
|
this.variant = "primary";
|
|
194
297
|
this.value = "";
|
|
@@ -255,26 +358,24 @@ var SpectreButtonElement = class extends SpectreProjectableElement {
|
|
|
255
358
|
return this.visibleLabelFallback ? html`<span data-sp-button-label-fallback>${this.visibleLabelFallback}</span>` : nothing;
|
|
256
359
|
}
|
|
257
360
|
render() {
|
|
258
|
-
return html
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
</button>
|
|
277
|
-
`;
|
|
361
|
+
return html`<button
|
|
362
|
+
aria-busy="${this.loading ? "true" : "false"}"
|
|
363
|
+
aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
|
|
364
|
+
aria-label="${ifDefined(this.forwardedAriaLabel)}"
|
|
365
|
+
aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
|
|
366
|
+
?autofocus="${this.autofocus}"
|
|
367
|
+
class="${this.buttonClasses}"
|
|
368
|
+
data-sp-button-native
|
|
369
|
+
?disabled="${this.isDisabled}"
|
|
370
|
+
form="${ifDefined(this.form || void 0)}"
|
|
371
|
+
id="${ifDefined(this.id || void 0)}"
|
|
372
|
+
name="${ifDefined(this.name || void 0)}"
|
|
373
|
+
title="${ifDefined(this.title || void 0)}"
|
|
374
|
+
type="${this.type}"
|
|
375
|
+
value="${ifDefined(this.value || void 0)}"
|
|
376
|
+
>
|
|
377
|
+
${this.renderButtonContent()}
|
|
378
|
+
</button>`;
|
|
278
379
|
}
|
|
279
380
|
};
|
|
280
381
|
SpectreButtonElement.properties = {
|
|
@@ -288,10 +389,9 @@ SpectreButtonElement.properties = {
|
|
|
288
389
|
name: { type: String, reflect: true },
|
|
289
390
|
pill: { type: Boolean, reflect: true },
|
|
290
391
|
size: { type: String, reflect: true },
|
|
291
|
-
title: { type: String, reflect: true },
|
|
292
392
|
type: { type: String, reflect: true },
|
|
293
393
|
variant: { type: String, reflect: true },
|
|
294
|
-
value: { type: String
|
|
394
|
+
value: { type: String }
|
|
295
395
|
};
|
|
296
396
|
function defineSpectreButton(tagName = "sp-button") {
|
|
297
397
|
const existingElement = customElements.get(tagName);
|
package/dist/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/base.ts","../src/utils/dom.ts","../src/utils/projectable.ts","../src/components/button/sp-button.ts"],"names":[],"mappings":"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","file":"button.js","sourcesContent":["import { LitElement, type PropertyDeclarations } from 'lit';\n\nexport class SpectreBaseElement extends LitElement {\n static properties: PropertyDeclarations = {\n ariaLabel: { attribute: 'aria-label', type: String },\n ariaLabelledBy: { attribute: 'aria-labelledby', type: String },\n ariaDescribedBy: { attribute: 'aria-describedby', type: String },\n };\n\n ariaLabel: string | null = null;\n ariaLabelledBy: string | null = null;\n ariaDescribedBy: string | null = null;\n\n private _id?: string;\n\n override get id(): string {\n return this._id ?? '';\n }\n\n override set id(value: string) {\n if ((this._id ?? '') === value) {\n return;\n }\n\n this._id = value;\n\n const host = this as unknown as HTMLElement;\n if (HTMLElement.prototype.hasAttribute.call(host, 'id')) {\n HTMLElement.prototype.removeAttribute.call(host, 'id');\n }\n\n this.requestUpdate();\n }\n\n // Spectre components intentionally render in light DOM so the global\n // `@phcdevworks/spectre-ui` styling contract can apply directly.\n createRenderRoot(): this {\n return this;\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n const hostId = super.getAttribute('id');\n if (hostId !== null) {\n this.id = hostId;\n }\n }\n\n override getAttribute(qualifiedName: string): string | null {\n if (qualifiedName === 'id') {\n return this.id || null;\n }\n\n return super.getAttribute(qualifiedName);\n }\n\n override hasAttribute(qualifiedName: string): boolean {\n if (qualifiedName === 'id') {\n return this.id !== '';\n }\n\n return super.hasAttribute(qualifiedName);\n }\n\n override setAttribute(qualifiedName: string, value: string): void {\n if (qualifiedName === 'id') {\n this.id = value;\n return;\n }\n\n super.setAttribute(qualifiedName, value);\n }\n\n override removeAttribute(qualifiedName: string): void {\n if (qualifiedName === 'id') {\n this.id = '';\n return;\n }\n\n super.removeAttribute(qualifiedName);\n }\n\n protected get forwardedAriaLabel(): string | undefined {\n const value = this.ariaLabel?.trim();\n return value ? value : undefined;\n }\n\n protected get forwardedAriaLabelledBy(): string | undefined {\n const value = this.ariaLabelledBy?.trim();\n return value ? value : undefined;\n }\n\n protected get forwardedAriaDescribedBy(): string | undefined {\n const value = this.ariaDescribedBy?.trim();\n return value ? value : undefined;\n }\n}\n","export function hasMeaningfulContent(nodes: readonly Node[]): boolean {\n return nodes.some((node) => {\n if (node.nodeType === Node.ELEMENT_NODE) {\n return true;\n }\n\n if (node.nodeType === Node.TEXT_NODE) {\n return (node.textContent?.trim().length ?? 0) > 0;\n }\n\n return false;\n });\n}\n","import { SpectreBaseElement } from './base';\nimport { hasMeaningfulContent } from './dom';\n\nexport abstract class SpectreProjectableElement extends SpectreBaseElement {\n protected projectedContent: Node[] = [];\n private contentObserver?: MutationObserver | undefined;\n\n // Return the native container whose existing children are also treated as\n // projected content sources (e.g. the rendered <button>, <select>, <label>).\n protected abstract getContentContainer(): Element | null;\n\n // Return true if the node was rendered by this component and should not be\n // treated as external projected content.\n protected abstract isInternalNode(node: Node): boolean;\n\n protected get hasProjectedContent(): boolean {\n return hasMeaningfulContent(this.projectedContent);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.syncProjectedContent();\n this.startContentObserver();\n }\n\n override disconnectedCallback(): void {\n this.stopContentObserver();\n super.disconnectedCallback();\n }\n\n protected override update(changedProperties: Map<PropertyKey, unknown>): void {\n this.stopContentObserver();\n super.update(changedProperties);\n this.startContentObserver();\n }\n\n protected syncProjectedContent(): boolean {\n const nextProjectedContent: Node[] = [];\n const sourceNodes = [\n ...this.childNodes,\n ...(this.getContentContainer()?.childNodes ?? []),\n ];\n\n sourceNodes.forEach((node) => {\n if (!this.isInternalNode(node) && !nextProjectedContent.includes(node)) {\n nextProjectedContent.push(node);\n }\n });\n\n const hasChanged =\n nextProjectedContent.length !== this.projectedContent.length ||\n nextProjectedContent.some((node, index) => node !== this.projectedContent[index]);\n\n if (hasChanged) {\n this.projectedContent = nextProjectedContent;\n }\n\n return hasChanged;\n }\n\n private startContentObserver(): void {\n if (this.contentObserver) {\n return;\n }\n\n this.contentObserver = new MutationObserver((mutations) => {\n const isInternalMovement = mutations.every((mutation) =>\n Array.from(mutation.removedNodes).every(\n (node) => this.isInternalNode(node) || this.contains(node),\n ) &&\n Array.from(mutation.addedNodes).every((node) => this.isInternalNode(node)),\n );\n\n if (isInternalMovement) {\n return;\n }\n\n if (this.syncProjectedContent()) {\n this.requestUpdate();\n }\n });\n\n this.contentObserver.observe(this, { childList: true });\n }\n\n private stopContentObserver(): void {\n this.contentObserver?.disconnect();\n this.contentObserver = undefined;\n }\n}\n","import { html, nothing, type TemplateResult } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { SpectreProjectableElement } from '../../utils/projectable';\n\nimport {\n getButtonClasses,\n type ButtonSize,\n type ButtonVariant,\n} from '@phcdevworks/spectre-ui';\n\nexport const spectreButtonVariants = [\n 'primary',\n 'secondary',\n 'ghost',\n 'danger',\n 'success',\n 'cta',\n 'accent',\n] as const;\n\nexport const spectreButtonSizes = ['sm', 'md', 'lg'] as const;\nexport const spectreButtonTypes = ['button', 'submit', 'reset'] as const;\n\nexport type SpectreButtonVariant = (typeof spectreButtonVariants)[number];\nexport type SpectreButtonSize = (typeof spectreButtonSizes)[number];\nexport type SpectreButtonType = (typeof spectreButtonTypes)[number];\n\nexport interface SpectreButtonProps {\n ariaLabel?: string | null;\n ariaLabelledBy?: string | null;\n ariaDescribedBy?: string | null;\n autofocus?: boolean;\n disabled?: boolean;\n form?: string;\n fullWidth?: boolean;\n label?: string;\n loading?: boolean;\n loadingLabel?: string;\n name?: string;\n pill?: boolean;\n size?: SpectreButtonSize;\n title?: string;\n type?: SpectreButtonType;\n variant?: SpectreButtonVariant;\n value?: string;\n}\n\nfunction isButtonVariant(value: string): value is ButtonVariant {\n return (spectreButtonVariants as readonly string[]).includes(value);\n}\n\nfunction isButtonSize(value: string): value is ButtonSize {\n return (spectreButtonSizes as readonly string[]).includes(value);\n}\n\nfunction isButtonType(value: string): value is SpectreButtonType {\n return (spectreButtonTypes as readonly string[]).includes(value);\n}\n\nexport class SpectreButtonElement extends SpectreProjectableElement implements SpectreButtonProps {\n static properties = {\n autofocus: { type: Boolean, reflect: true },\n disabled: { type: Boolean, reflect: true },\n form: { type: String },\n fullWidth: { attribute: 'full-width', type: Boolean, reflect: true },\n label: { type: String, reflect: true },\n loading: { type: Boolean, reflect: true },\n loadingLabel: { attribute: 'loading-label', type: String, reflect: true },\n name: { type: String, reflect: true },\n pill: { type: Boolean, reflect: true },\n size: { type: String, reflect: true },\n title: { type: String, reflect: true },\n type: { type: String, reflect: true },\n variant: { type: String, reflect: true },\n value: { type: String, reflect: true },\n };\n\n autofocus = false;\n disabled = false;\n form?: string;\n fullWidth = false;\n label?: string;\n loading = false;\n loadingLabel = 'Loading';\n name?: string;\n pill = false;\n size: SpectreButtonSize = 'md';\n override title = '';\n type: SpectreButtonType = 'button';\n variant: SpectreButtonVariant = 'primary';\n value = '';\n\n protected override getContentContainer(): Element | null {\n return this.querySelector('[data-sp-button-native]');\n }\n\n protected override isInternalNode(node: Node): boolean {\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return false;\n }\n\n const el = node as Element;\n return (\n el.hasAttribute('data-sp-button-native') ||\n el.hasAttribute('data-sp-button-loading-label') ||\n el.hasAttribute('data-sp-button-label-fallback')\n );\n }\n\n protected override willUpdate(changedProperties: Map<PropertyKey, unknown>): void {\n if (changedProperties.has('variant') && !isButtonVariant(this.variant)) {\n this.variant = 'primary';\n }\n\n if (changedProperties.has('size') && !isButtonSize(this.size)) {\n this.size = 'md';\n }\n\n if (changedProperties.has('type') && !isButtonType(this.type)) {\n this.type = 'button';\n }\n\n if (changedProperties.has('loadingLabel')) {\n if (this.loadingLabel == null || this.loadingLabel.trim() === '') {\n this.loadingLabel = 'Loading';\n }\n }\n\n if (changedProperties.has('value') && this.value == null) {\n this.value = '';\n }\n }\n\n private get buttonClasses(): string {\n return getButtonClasses({\n disabled: this.isDisabled,\n fullWidth: this.fullWidth,\n loading: this.loading,\n pill: this.pill,\n size: this.size,\n variant: this.variant,\n });\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.loading;\n }\n\n private get visibleLabelFallback(): string | undefined {\n const trimmedLabel = this.label?.trim();\n return trimmedLabel ? trimmedLabel : undefined;\n }\n\n override focus(options?: FocusOptions): void {\n (this.getContentContainer() as HTMLButtonElement | null)?.focus(options);\n }\n\n override blur(): void {\n (this.getContentContainer() as HTMLButtonElement | null)?.blur();\n }\n\n private renderButtonContent(): TemplateResult | Node[] | typeof nothing {\n if (this.loading) {\n return html`<span data-sp-button-loading-label>${this.loadingLabel}</span>`;\n }\n\n if (this.hasProjectedContent) {\n return this.projectedContent as Node[];\n }\n\n return this.visibleLabelFallback\n ? html`<span data-sp-button-label-fallback>${this.visibleLabelFallback}</span>`\n : nothing;\n }\n\n override render() {\n return html`\n <button\n aria-busy=${this.loading ? 'true' : 'false'}\n aria-describedby=${ifDefined(this.forwardedAriaDescribedBy)}\n aria-label=${ifDefined(this.forwardedAriaLabel)}\n aria-labelledby=${ifDefined(this.forwardedAriaLabelledBy)}\n ?autofocus=${this.autofocus}\n class=${this.buttonClasses}\n data-sp-button-native\n ?disabled=${this.isDisabled}\n form=${ifDefined(this.form)}\n id=${ifDefined(this.id || undefined)}\n name=${ifDefined(this.name)}\n title=${ifDefined(this.title || undefined)}\n type=${this.type}\n value=${ifDefined(this.value)}\n >\n ${this.renderButtonContent() || nothing}\n </button>\n `;\n }\n}\n\nexport function defineSpectreButton(tagName = 'sp-button'): typeof SpectreButtonElement {\n const existingElement = customElements.get(tagName);\n\n if (existingElement) {\n return existingElement as unknown as typeof SpectreButtonElement;\n }\n\n customElements.define(tagName, SpectreButtonElement);\n return SpectreButtonElement;\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/utils/base.ts","../src/utils/dom.ts","../src/utils/projectable.ts","../src/components/button/sp-button.ts"],"names":[],"mappings":"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","file":"button.js","sourcesContent":["import { LitElement, type PropertyDeclarations } from 'lit';\n\nexport class SpectreBaseElement extends LitElement {\n static properties: PropertyDeclarations = {};\n\n private _ariaLabel: string | null = null;\n private _ariaLabelledBy: string | null = null;\n private _ariaDescribedBy: string | null = null;\n private _title = '';\n private _id = '';\n\n get ariaLabel(): string | null {\n return this._ariaLabel;\n }\n\n set ariaLabel(value: string | null) {\n if (this._ariaLabel === value) {\n return;\n }\n this._ariaLabel = value;\n this._removeHostAttribute('aria-label');\n this.requestUpdate();\n }\n\n get ariaLabelledBy(): string | null {\n return this._ariaLabelledBy;\n }\n\n set ariaLabelledBy(value: string | null) {\n if (this._ariaLabelledBy === value) {\n return;\n }\n this._ariaLabelledBy = value;\n this._removeHostAttribute('aria-labelledby');\n this.requestUpdate();\n }\n\n get ariaDescribedBy(): string | null {\n return this._ariaDescribedBy;\n }\n\n set ariaDescribedBy(value: string | null) {\n if (this._ariaDescribedBy === value) {\n return;\n }\n this._ariaDescribedBy = value;\n this._removeHostAttribute('aria-describedby');\n this.requestUpdate();\n }\n\n override get title(): string {\n return this._title;\n }\n\n override set title(value: string | undefined | null) {\n const normalizedValue = value ?? '';\n if (this._title === normalizedValue) {\n return;\n }\n this._title = normalizedValue;\n this._removeHostAttribute('title');\n this.requestUpdate();\n }\n\n override get id(): string {\n return this._id;\n }\n\n override set id(value: string | undefined | null) {\n const normalizedValue = value ?? '';\n if (this._id === normalizedValue) {\n return;\n }\n this._id = normalizedValue;\n this._removeHostAttribute('id');\n this.requestUpdate();\n }\n\n // Spectre components intentionally render in light DOM so the global\n // `@phcdevworks/spectre-ui` styling contract can apply directly.\n createRenderRoot(): this {\n return this;\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n const proxiedAttributes = [\n 'id',\n 'title',\n 'aria-label',\n 'aria-labelledby',\n 'aria-describedby',\n ];\n\n proxiedAttributes.forEach((attr) => {\n const value = super.getAttribute(attr);\n if (value !== null) {\n this.setAttribute(attr, value);\n }\n });\n }\n\n override getAttribute(qualifiedName: string): string | null {\n switch (qualifiedName) {\n case 'id':\n return this.id || null;\n case 'title':\n return this.title || null;\n case 'aria-label':\n return this.ariaLabel;\n case 'aria-labelledby':\n return this.ariaLabelledBy;\n case 'aria-describedby':\n return this.ariaDescribedBy;\n default:\n return super.getAttribute(qualifiedName);\n }\n }\n\n override hasAttribute(qualifiedName: string): boolean {\n switch (qualifiedName) {\n case 'id':\n return this.id !== '';\n case 'title':\n return this.title !== '';\n case 'aria-label':\n return this.ariaLabel !== null;\n case 'aria-labelledby':\n return this.ariaLabelledBy !== null;\n case 'aria-describedby':\n return this.ariaDescribedBy !== null;\n default:\n return super.hasAttribute(qualifiedName);\n }\n }\n\n override setAttribute(qualifiedName: string, value: string): void {\n switch (qualifiedName) {\n case 'id':\n this.id = value;\n break;\n case 'title':\n this.title = value;\n break;\n case 'aria-label':\n this.ariaLabel = value;\n break;\n case 'aria-labelledby':\n this.ariaLabelledBy = value;\n break;\n case 'aria-describedby':\n this.ariaDescribedBy = value;\n break;\n default:\n super.setAttribute(qualifiedName, value);\n }\n }\n\n override removeAttribute(qualifiedName: string): void {\n switch (qualifiedName) {\n case 'id':\n this.id = '';\n break;\n case 'title':\n this.title = '';\n break;\n case 'aria-label':\n this.ariaLabel = null;\n break;\n case 'aria-labelledby':\n this.ariaLabelledBy = null;\n break;\n case 'aria-describedby':\n this.ariaDescribedBy = null;\n break;\n default:\n super.removeAttribute(qualifiedName);\n }\n }\n\n private _removeHostAttribute(name: string): void {\n const host = this as unknown as HTMLElement;\n if (HTMLElement.prototype.hasAttribute.call(host, name)) {\n HTMLElement.prototype.removeAttribute.call(host, name);\n }\n }\n\n protected get forwardedAriaLabel(): string | undefined {\n const value = this.ariaLabel?.trim();\n return value ? value : undefined;\n }\n\n protected get forwardedAriaLabelledBy(): string | undefined {\n const value = this.ariaLabelledBy?.trim();\n return value ? value : undefined;\n }\n\n protected get forwardedAriaDescribedBy(): string | undefined {\n const value = this.ariaDescribedBy?.trim();\n return value ? value : undefined;\n }\n}\n","export function hasMeaningfulContent(nodes: readonly Node[]): boolean {\n return nodes.some((node) => {\n if (node.nodeType === Node.ELEMENT_NODE) {\n return true;\n }\n\n if (node.nodeType === Node.TEXT_NODE) {\n return (node.textContent?.trim().length ?? 0) > 0;\n }\n\n return false;\n });\n}\n","import { SpectreBaseElement } from './base';\nimport { hasMeaningfulContent } from './dom';\n\nexport abstract class SpectreProjectableElement extends SpectreBaseElement {\n protected projectedContent: Node[] = [];\n private contentObserver?: MutationObserver | undefined;\n\n // Return the native container whose existing children are also treated as\n // projected content sources (e.g. the rendered <button>, <select>, <label>).\n protected abstract getContentContainer(): Element | null;\n\n // Return true if the node was rendered by this component and should not be\n // treated as external projected content.\n protected abstract isInternalNode(node: Node): boolean;\n\n protected get hasProjectedContent(): boolean {\n return hasMeaningfulContent(this.projectedContent);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.syncProjectedContent();\n this.startContentObserver();\n }\n\n override disconnectedCallback(): void {\n this.stopContentObserver();\n super.disconnectedCallback();\n }\n\n protected override update(changedProperties: Map<PropertyKey, unknown>): void {\n this.stopContentObserver();\n super.update(changedProperties);\n this.startContentObserver();\n }\n\n protected syncProjectedContent(): boolean {\n const nextProjectedContent: Node[] = [];\n const sourceNodes = [\n ...this.childNodes,\n ...(this.getContentContainer()?.childNodes ?? []),\n ];\n\n sourceNodes.forEach((node) => {\n if (!this.isInternalNode(node) && !nextProjectedContent.includes(node)) {\n nextProjectedContent.push(node);\n }\n });\n\n const hasChanged =\n nextProjectedContent.length !== this.projectedContent.length ||\n nextProjectedContent.some((node, index) => node !== this.projectedContent[index]);\n\n if (hasChanged) {\n this.projectedContent = nextProjectedContent;\n }\n\n return hasChanged;\n }\n\n private startContentObserver(): void {\n if (this.contentObserver) {\n return;\n }\n\n this.contentObserver = new MutationObserver((mutations) => {\n const isInternalMovement = mutations.every((mutation) =>\n [...mutation.removedNodes].every(\n (node) => this.isInternalNode(node) || this.contains(node),\n ) &&\n [...mutation.addedNodes].every((node) => this.isInternalNode(node)),\n );\n\n if (isInternalMovement) {\n return;\n }\n\n if (this.syncProjectedContent()) {\n this.requestUpdate();\n }\n });\n\n this.contentObserver.observe(this, { childList: true });\n }\n\n private stopContentObserver(): void {\n this.contentObserver?.disconnect();\n this.contentObserver = undefined;\n }\n}\n","import { html, nothing, type TemplateResult } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { SpectreProjectableElement } from '../../utils/projectable';\n\nimport {\n getButtonClasses,\n type ButtonSize,\n type ButtonVariant,\n} from '@phcdevworks/spectre-ui';\n\nexport const spectreButtonVariants = [\n 'primary',\n 'secondary',\n 'ghost',\n 'danger',\n 'success',\n 'cta',\n 'accent',\n] as const;\n\nexport const spectreButtonSizes = ['sm', 'md', 'lg'] as const;\nexport const spectreButtonTypes = ['button', 'submit', 'reset'] as const;\n\nexport type SpectreButtonVariant = (typeof spectreButtonVariants)[number];\nexport type SpectreButtonSize = (typeof spectreButtonSizes)[number];\nexport type SpectreButtonType = (typeof spectreButtonTypes)[number];\n\nexport interface SpectreButtonProps {\n ariaLabel: string | null;\n ariaLabelledBy: string | null;\n ariaDescribedBy: string | null;\n autofocus?: boolean | undefined;\n disabled?: boolean | undefined;\n form?: string | undefined;\n fullWidth?: boolean | undefined;\n label?: string | undefined;\n loading?: boolean | undefined;\n loadingLabel?: string | undefined;\n name?: string | undefined;\n pill?: boolean | undefined;\n size?: SpectreButtonSize | undefined;\n title?: string | undefined;\n type?: SpectreButtonType | undefined;\n variant?: SpectreButtonVariant | undefined;\n value?: string | undefined;\n}\n\nfunction isButtonVariant(value: string): value is ButtonVariant {\n return (spectreButtonVariants as readonly string[]).includes(value);\n}\n\nfunction isButtonSize(value: string): value is ButtonSize {\n return (spectreButtonSizes as readonly string[]).includes(value);\n}\n\nfunction isButtonType(value: string): value is SpectreButtonType {\n return (spectreButtonTypes as readonly string[]).includes(value);\n}\n\nexport class SpectreButtonElement extends SpectreProjectableElement implements SpectreButtonProps {\n static properties = {\n autofocus: { type: Boolean, reflect: true },\n disabled: { type: Boolean, reflect: true },\n form: { type: String },\n fullWidth: { attribute: 'full-width', type: Boolean, reflect: true },\n label: { type: String, reflect: true },\n loading: { type: Boolean, reflect: true },\n loadingLabel: { attribute: 'loading-label', type: String, reflect: true },\n name: { type: String, reflect: true },\n pill: { type: Boolean, reflect: true },\n size: { type: String, reflect: true },\n type: { type: String, reflect: true },\n variant: { type: String, reflect: true },\n value: { type: String },\n };\n\n autofocus = false;\n disabled = false;\n form: string | undefined;\n fullWidth = false;\n label: string | undefined;\n loading = false;\n loadingLabel = 'Loading';\n name: string | undefined;\n pill = false;\n size: SpectreButtonSize = 'md';\n type: SpectreButtonType = 'button';\n variant: SpectreButtonVariant = 'primary';\n value = '';\n\n protected override getContentContainer(): Element | null {\n return this.querySelector('[data-sp-button-native]');\n }\n\n protected override isInternalNode(node: Node): boolean {\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return false;\n }\n\n const el = node as Element;\n return (\n el.hasAttribute('data-sp-button-native') ||\n el.hasAttribute('data-sp-button-loading-label') ||\n el.hasAttribute('data-sp-button-label-fallback')\n );\n }\n\n protected override willUpdate(changedProperties: Map<PropertyKey, unknown>): void {\n if (changedProperties.has('variant') && !isButtonVariant(this.variant)) {\n this.variant = 'primary';\n }\n\n if (changedProperties.has('size') && !isButtonSize(this.size)) {\n this.size = 'md';\n }\n\n if (changedProperties.has('type') && !isButtonType(this.type)) {\n this.type = 'button';\n }\n\n if (changedProperties.has('loadingLabel')) {\n if (this.loadingLabel == null || this.loadingLabel.trim() === '') {\n this.loadingLabel = 'Loading';\n }\n }\n\n if (changedProperties.has('value') && this.value == null) {\n this.value = '';\n }\n }\n\n private get buttonClasses(): string {\n return getButtonClasses({\n disabled: this.isDisabled,\n fullWidth: this.fullWidth,\n loading: this.loading,\n pill: this.pill,\n size: this.size,\n variant: this.variant,\n });\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.loading;\n }\n\n private get visibleLabelFallback(): string | undefined {\n const trimmedLabel = this.label?.trim();\n return trimmedLabel ? trimmedLabel : undefined;\n }\n\n override focus(options?: FocusOptions): void {\n (this.getContentContainer() as HTMLButtonElement | null)?.focus(options);\n }\n\n override blur(): void {\n (this.getContentContainer() as HTMLButtonElement | null)?.blur();\n }\n\n private renderButtonContent(): TemplateResult | Node[] | typeof nothing {\n if (this.loading) {\n return html`<span data-sp-button-loading-label>${this.loadingLabel}</span>`;\n }\n\n if (this.hasProjectedContent) {\n return this.projectedContent as Node[];\n }\n\n return this.visibleLabelFallback\n ? html`<span data-sp-button-label-fallback>${this.visibleLabelFallback}</span>`\n : nothing;\n }\n\n override render() {\n return html`<button\n aria-busy=\"${this.loading ? 'true' : 'false'}\"\n aria-describedby=\"${ifDefined(this.forwardedAriaDescribedBy)}\"\n aria-label=\"${ifDefined(this.forwardedAriaLabel)}\"\n aria-labelledby=\"${ifDefined(this.forwardedAriaLabelledBy)}\"\n ?autofocus=\"${this.autofocus}\"\n class=\"${this.buttonClasses}\"\n data-sp-button-native\n ?disabled=\"${this.isDisabled}\"\n form=\"${ifDefined(this.form || undefined)}\"\n id=\"${ifDefined(this.id || undefined)}\"\n name=\"${ifDefined(this.name || undefined)}\"\n title=\"${ifDefined(this.title || undefined)}\"\n type=\"${this.type}\"\n value=\"${ifDefined(this.value || undefined)}\"\n >\n ${this.renderButtonContent()}\n </button>`;\n }\n}\n\nexport function defineSpectreButton(tagName = 'sp-button'): typeof SpectreButtonElement {\n const existingElement = customElements.get(tagName);\n\n if (existingElement) {\n return existingElement as unknown as typeof SpectreButtonElement;\n }\n\n customElements.define(tagName, SpectreButtonElement);\n return SpectreButtonElement;\n}\n"]}
|