@phcdevworks/spectre-components 1.0.0 → 1.2.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 +586 -107
- package/dist/base-B_9DJkh2.d.cts +38 -0
- package/dist/base-B_9DJkh2.d.ts +38 -0
- package/dist/button.cjs +252 -90
- package/dist/button.cjs.map +1 -1
- package/dist/button.d.cts +39 -37
- package/dist/button.d.ts +39 -37
- package/dist/button.js +252 -90
- package/dist/button.js.map +1 -1
- package/dist/checkbox.cjs +228 -67
- package/dist/checkbox.cjs.map +1 -1
- package/dist/checkbox.d.cts +21 -21
- package/dist/checkbox.d.ts +21 -21
- package/dist/checkbox.js +228 -67
- package/dist/checkbox.js.map +1 -1
- package/dist/fieldset.cjs +245 -56
- package/dist/fieldset.cjs.map +1 -1
- package/dist/fieldset.d.cts +35 -14
- package/dist/fieldset.d.ts +35 -14
- package/dist/fieldset.js +245 -56
- package/dist/fieldset.js.map +1 -1
- package/dist/form-9cZG1E9P.d.cts +10 -0
- package/dist/form-9cZG1E9P.d.ts +10 -0
- package/dist/index.cjs +647 -328
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -4
- package/dist/index.d.ts +4 -4
- package/dist/index.js +647 -328
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +262 -77
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +72 -40
- package/dist/input.d.ts +72 -40
- package/dist/input.js +262 -77
- package/dist/input.js.map +1 -1
- package/dist/label.cjs +217 -55
- package/dist/label.cjs.map +1 -1
- package/dist/label.d.cts +17 -10
- package/dist/label.d.ts +17 -10
- package/dist/label.js +217 -55
- package/dist/label.js.map +1 -1
- package/dist/{projectable-DcnBRiko.d.cts → projectable-CIfxi7dv.d.cts} +1 -1
- package/dist/{projectable-SzbPvXfM.d.ts → projectable-Ksv9eoIr.d.ts} +1 -1
- package/dist/radio.cjs +248 -67
- package/dist/radio.cjs.map +1 -1
- package/dist/radio.d.cts +23 -21
- package/dist/radio.d.ts +23 -21
- package/dist/radio.js +248 -67
- package/dist/radio.js.map +1 -1
- package/dist/select.cjs +230 -67
- package/dist/select.cjs.map +1 -1
- package/dist/select.d.cts +27 -27
- package/dist/select.d.ts +27 -27
- package/dist/select.js +230 -67
- package/dist/select.js.map +1 -1
- package/dist/textarea.cjs +256 -77
- package/dist/textarea.cjs.map +1 -1
- package/dist/textarea.d.cts +53 -32
- package/dist/textarea.d.ts +53 -32
- package/dist/textarea.js +256 -77
- package/dist/textarea.js.map +1 -1
- package/package.json +22 -12
- package/dist/base-DQtCQ-dP.d.cts +0 -22
- package/dist/base-DQtCQ-dP.d.ts +0 -22
- package/dist/form-iI7vV-3W.d.cts +0 -6
- package/dist/form-iI7vV-3W.d.ts +0 -6
package/dist/button.js
CHANGED
|
@@ -1,27 +1,117 @@
|
|
|
1
|
+
import { getButtonClasses } from '@phcdevworks/spectre-ui';
|
|
1
2
|
import { LitElement, html, nothing } from 'lit';
|
|
2
3
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
3
|
-
import { getButtonClasses } from '@phcdevworks/spectre-ui';
|
|
4
4
|
|
|
5
|
-
// src/
|
|
5
|
+
// src/utils/form.ts
|
|
6
|
+
var spectreInputSizes = ["sm", "md", "lg"];
|
|
7
|
+
function isInputSize(value) {
|
|
8
|
+
return spectreInputSizes.includes(value);
|
|
9
|
+
}
|
|
10
|
+
var spectreButtonVariants = [
|
|
11
|
+
"primary",
|
|
12
|
+
"secondary",
|
|
13
|
+
"ghost",
|
|
14
|
+
"danger",
|
|
15
|
+
"success",
|
|
16
|
+
"cta",
|
|
17
|
+
"accent"
|
|
18
|
+
];
|
|
19
|
+
function isButtonVariant(value) {
|
|
20
|
+
return spectreButtonVariants.includes(value);
|
|
21
|
+
}
|
|
22
|
+
var spectreButtonTypes = ["button", "submit", "reset"];
|
|
23
|
+
function isButtonType(value) {
|
|
24
|
+
return spectreButtonTypes.includes(value);
|
|
25
|
+
}
|
|
6
26
|
var SpectreBaseElement = class extends LitElement {
|
|
7
27
|
constructor() {
|
|
8
28
|
super(...arguments);
|
|
9
|
-
this.
|
|
10
|
-
this.
|
|
11
|
-
this.
|
|
29
|
+
this._ariaLabel = null;
|
|
30
|
+
this._ariaLabelledBy = null;
|
|
31
|
+
this._ariaDescribedBy = null;
|
|
32
|
+
this._autocapitalize = "";
|
|
33
|
+
this._spellcheck = null;
|
|
34
|
+
this._title = "";
|
|
35
|
+
this._id = "";
|
|
36
|
+
}
|
|
37
|
+
get ariaLabel() {
|
|
38
|
+
return this._ariaLabel;
|
|
39
|
+
}
|
|
40
|
+
set ariaLabel(value) {
|
|
41
|
+
if (this._ariaLabel === value) {
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
this._ariaLabel = value;
|
|
45
|
+
this._removeHostAttribute("aria-label");
|
|
46
|
+
this.requestUpdate();
|
|
47
|
+
}
|
|
48
|
+
get ariaLabelledBy() {
|
|
49
|
+
return this._ariaLabelledBy;
|
|
50
|
+
}
|
|
51
|
+
set ariaLabelledBy(value) {
|
|
52
|
+
if (this._ariaLabelledBy === value) {
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
this._ariaLabelledBy = value;
|
|
56
|
+
this._removeHostAttribute("aria-labelledby");
|
|
57
|
+
this.requestUpdate();
|
|
58
|
+
}
|
|
59
|
+
get ariaDescribedBy() {
|
|
60
|
+
return this._ariaDescribedBy;
|
|
61
|
+
}
|
|
62
|
+
set ariaDescribedBy(value) {
|
|
63
|
+
if (this._ariaDescribedBy === value) {
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
this._ariaDescribedBy = value;
|
|
67
|
+
this._removeHostAttribute("aria-describedby");
|
|
68
|
+
this.requestUpdate();
|
|
69
|
+
}
|
|
70
|
+
get autocapitalize() {
|
|
71
|
+
return this._autocapitalize;
|
|
72
|
+
}
|
|
73
|
+
set autocapitalize(value) {
|
|
74
|
+
const normalizedValue = value ?? "";
|
|
75
|
+
if (this._autocapitalize === normalizedValue) {
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
this._autocapitalize = normalizedValue;
|
|
79
|
+
this._removeHostAttribute("autocapitalize");
|
|
80
|
+
this.requestUpdate();
|
|
81
|
+
}
|
|
82
|
+
get spellcheck() {
|
|
83
|
+
return this._spellcheck ?? super.spellcheck;
|
|
84
|
+
}
|
|
85
|
+
set spellcheck(value) {
|
|
86
|
+
if (this._spellcheck === value) {
|
|
87
|
+
return;
|
|
88
|
+
}
|
|
89
|
+
this._spellcheck = value ?? null;
|
|
90
|
+
this._removeHostAttribute("spellcheck");
|
|
91
|
+
this.requestUpdate();
|
|
92
|
+
}
|
|
93
|
+
get title() {
|
|
94
|
+
return this._title;
|
|
95
|
+
}
|
|
96
|
+
set title(value) {
|
|
97
|
+
const normalizedValue = value ?? "";
|
|
98
|
+
if (this._title === normalizedValue) {
|
|
99
|
+
return;
|
|
100
|
+
}
|
|
101
|
+
this._title = normalizedValue;
|
|
102
|
+
this._removeHostAttribute("title");
|
|
103
|
+
this.requestUpdate();
|
|
12
104
|
}
|
|
13
105
|
get id() {
|
|
14
|
-
return this._id
|
|
106
|
+
return this._id;
|
|
15
107
|
}
|
|
16
108
|
set id(value) {
|
|
17
|
-
|
|
109
|
+
const normalizedValue = value ?? "";
|
|
110
|
+
if (this._id === normalizedValue) {
|
|
18
111
|
return;
|
|
19
112
|
}
|
|
20
|
-
this._id =
|
|
21
|
-
|
|
22
|
-
if (HTMLElement.prototype.hasAttribute.call(host, "id")) {
|
|
23
|
-
HTMLElement.prototype.removeAttribute.call(host, "id");
|
|
24
|
-
}
|
|
113
|
+
this._id = normalizedValue;
|
|
114
|
+
this._removeHostAttribute("id");
|
|
25
115
|
this.requestUpdate();
|
|
26
116
|
}
|
|
27
117
|
// Spectre components intentionally render in light DOM so the global
|
|
@@ -31,36 +121,121 @@ var SpectreBaseElement = class extends LitElement {
|
|
|
31
121
|
}
|
|
32
122
|
connectedCallback() {
|
|
33
123
|
super.connectedCallback();
|
|
34
|
-
const
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
124
|
+
const proxiedAttributes = [
|
|
125
|
+
"id",
|
|
126
|
+
"title",
|
|
127
|
+
"autocapitalize",
|
|
128
|
+
"spellcheck",
|
|
129
|
+
"aria-label",
|
|
130
|
+
"aria-labelledby",
|
|
131
|
+
"aria-describedby"
|
|
132
|
+
];
|
|
133
|
+
proxiedAttributes.forEach((attr) => {
|
|
134
|
+
const value = super.getAttribute(attr);
|
|
135
|
+
if (value !== null) {
|
|
136
|
+
this.setAttribute(attr, value);
|
|
137
|
+
}
|
|
138
|
+
});
|
|
38
139
|
}
|
|
39
140
|
getAttribute(qualifiedName) {
|
|
40
|
-
|
|
41
|
-
|
|
141
|
+
switch (qualifiedName) {
|
|
142
|
+
case "id":
|
|
143
|
+
return this.id || null;
|
|
144
|
+
case "title":
|
|
145
|
+
return this.title || null;
|
|
146
|
+
case "autocapitalize":
|
|
147
|
+
return this.autocapitalize || null;
|
|
148
|
+
case "spellcheck":
|
|
149
|
+
return this._spellcheck !== null ? String(this._spellcheck) : null;
|
|
150
|
+
case "aria-label":
|
|
151
|
+
return this.ariaLabel;
|
|
152
|
+
case "aria-labelledby":
|
|
153
|
+
return this.ariaLabelledBy;
|
|
154
|
+
case "aria-describedby":
|
|
155
|
+
return this.ariaDescribedBy;
|
|
156
|
+
default:
|
|
157
|
+
return super.getAttribute(qualifiedName);
|
|
42
158
|
}
|
|
43
|
-
return super.getAttribute(qualifiedName);
|
|
44
159
|
}
|
|
45
160
|
hasAttribute(qualifiedName) {
|
|
46
|
-
|
|
47
|
-
|
|
161
|
+
switch (qualifiedName) {
|
|
162
|
+
case "id":
|
|
163
|
+
return this.id !== "";
|
|
164
|
+
case "title":
|
|
165
|
+
return this.title !== "";
|
|
166
|
+
case "autocapitalize":
|
|
167
|
+
return this.autocapitalize !== "";
|
|
168
|
+
case "spellcheck":
|
|
169
|
+
return this._spellcheck !== null;
|
|
170
|
+
case "aria-label":
|
|
171
|
+
return this.ariaLabel !== null;
|
|
172
|
+
case "aria-labelledby":
|
|
173
|
+
return this.ariaLabelledBy !== null;
|
|
174
|
+
case "aria-describedby":
|
|
175
|
+
return this.ariaDescribedBy !== null;
|
|
176
|
+
default:
|
|
177
|
+
return super.hasAttribute(qualifiedName);
|
|
48
178
|
}
|
|
49
|
-
return super.hasAttribute(qualifiedName);
|
|
50
179
|
}
|
|
51
180
|
setAttribute(qualifiedName, value) {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
181
|
+
switch (qualifiedName) {
|
|
182
|
+
case "id":
|
|
183
|
+
this.id = value;
|
|
184
|
+
break;
|
|
185
|
+
case "title":
|
|
186
|
+
this.title = value;
|
|
187
|
+
break;
|
|
188
|
+
case "autocapitalize":
|
|
189
|
+
this.autocapitalize = value;
|
|
190
|
+
break;
|
|
191
|
+
case "spellcheck":
|
|
192
|
+
this.spellcheck = value !== "false";
|
|
193
|
+
break;
|
|
194
|
+
case "aria-label":
|
|
195
|
+
this.ariaLabel = value;
|
|
196
|
+
break;
|
|
197
|
+
case "aria-labelledby":
|
|
198
|
+
this.ariaLabelledBy = value;
|
|
199
|
+
break;
|
|
200
|
+
case "aria-describedby":
|
|
201
|
+
this.ariaDescribedBy = value;
|
|
202
|
+
break;
|
|
203
|
+
default:
|
|
204
|
+
super.setAttribute(qualifiedName, value);
|
|
55
205
|
}
|
|
56
|
-
super.setAttribute(qualifiedName, value);
|
|
57
206
|
}
|
|
58
207
|
removeAttribute(qualifiedName) {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
208
|
+
switch (qualifiedName) {
|
|
209
|
+
case "id":
|
|
210
|
+
this.id = "";
|
|
211
|
+
break;
|
|
212
|
+
case "title":
|
|
213
|
+
this.title = "";
|
|
214
|
+
break;
|
|
215
|
+
case "autocapitalize":
|
|
216
|
+
this.autocapitalize = "";
|
|
217
|
+
break;
|
|
218
|
+
case "spellcheck":
|
|
219
|
+
this.spellcheck = null;
|
|
220
|
+
break;
|
|
221
|
+
case "aria-label":
|
|
222
|
+
this.ariaLabel = null;
|
|
223
|
+
break;
|
|
224
|
+
case "aria-labelledby":
|
|
225
|
+
this.ariaLabelledBy = null;
|
|
226
|
+
break;
|
|
227
|
+
case "aria-describedby":
|
|
228
|
+
this.ariaDescribedBy = null;
|
|
229
|
+
break;
|
|
230
|
+
default:
|
|
231
|
+
super.removeAttribute(qualifiedName);
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
_removeHostAttribute(name) {
|
|
235
|
+
const host = this;
|
|
236
|
+
if (HTMLElement.prototype.hasAttribute.call(host, name)) {
|
|
237
|
+
HTMLElement.prototype.removeAttribute.call(host, name);
|
|
62
238
|
}
|
|
63
|
-
super.removeAttribute(qualifiedName);
|
|
64
239
|
}
|
|
65
240
|
get forwardedAriaLabel() {
|
|
66
241
|
const value = this.ariaLabel?.trim();
|
|
@@ -75,11 +250,7 @@ var SpectreBaseElement = class extends LitElement {
|
|
|
75
250
|
return value ? value : void 0;
|
|
76
251
|
}
|
|
77
252
|
};
|
|
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
|
-
};
|
|
253
|
+
SpectreBaseElement.properties = {};
|
|
83
254
|
|
|
84
255
|
// src/utils/dom.ts
|
|
85
256
|
function hasMeaningfulContent(nodes) {
|
|
@@ -140,9 +311,9 @@ var SpectreProjectableElement = class extends SpectreBaseElement {
|
|
|
140
311
|
}
|
|
141
312
|
this.contentObserver = new MutationObserver((mutations) => {
|
|
142
313
|
const isInternalMovement = mutations.every(
|
|
143
|
-
(mutation) =>
|
|
314
|
+
(mutation) => [...mutation.removedNodes].every(
|
|
144
315
|
(node) => this.isInternalNode(node) || this.contains(node)
|
|
145
|
-
) &&
|
|
316
|
+
) && [...mutation.addedNodes].every((node) => this.isInternalNode(node))
|
|
146
317
|
);
|
|
147
318
|
if (isInternalMovement) {
|
|
148
319
|
return;
|
|
@@ -158,41 +329,33 @@ var SpectreProjectableElement = class extends SpectreBaseElement {
|
|
|
158
329
|
this.contentObserver = void 0;
|
|
159
330
|
}
|
|
160
331
|
};
|
|
161
|
-
var spectreButtonVariants = [
|
|
162
|
-
"primary",
|
|
163
|
-
"secondary",
|
|
164
|
-
"ghost",
|
|
165
|
-
"danger",
|
|
166
|
-
"success",
|
|
167
|
-
"cta",
|
|
168
|
-
"accent"
|
|
169
|
-
];
|
|
170
|
-
var spectreButtonSizes = ["sm", "md", "lg"];
|
|
171
|
-
var spectreButtonTypes = ["button", "submit", "reset"];
|
|
172
|
-
function isButtonVariant(value) {
|
|
173
|
-
return spectreButtonVariants.includes(value);
|
|
174
|
-
}
|
|
175
|
-
function isButtonSize(value) {
|
|
176
|
-
return spectreButtonSizes.includes(value);
|
|
177
|
-
}
|
|
178
|
-
function isButtonType(value) {
|
|
179
|
-
return spectreButtonTypes.includes(value);
|
|
180
|
-
}
|
|
181
332
|
var SpectreButtonElement = class extends SpectreProjectableElement {
|
|
182
333
|
constructor() {
|
|
183
334
|
super(...arguments);
|
|
184
335
|
this.autofocus = false;
|
|
185
336
|
this.disabled = false;
|
|
186
337
|
this.fullWidth = false;
|
|
338
|
+
this.iconOnly = false;
|
|
187
339
|
this.loading = false;
|
|
188
340
|
this.loadingLabel = "Loading";
|
|
189
341
|
this.pill = false;
|
|
190
342
|
this.size = "md";
|
|
191
|
-
this.title = "";
|
|
192
343
|
this.type = "button";
|
|
193
344
|
this.variant = "primary";
|
|
194
345
|
this.value = "";
|
|
195
346
|
}
|
|
347
|
+
get id() {
|
|
348
|
+
return super.id;
|
|
349
|
+
}
|
|
350
|
+
set id(value) {
|
|
351
|
+
super.id = value;
|
|
352
|
+
}
|
|
353
|
+
get title() {
|
|
354
|
+
return super.title;
|
|
355
|
+
}
|
|
356
|
+
set title(value) {
|
|
357
|
+
super.title = value;
|
|
358
|
+
}
|
|
196
359
|
getContentContainer() {
|
|
197
360
|
return this.querySelector("[data-sp-button-native]");
|
|
198
361
|
}
|
|
@@ -204,13 +367,13 @@ var SpectreButtonElement = class extends SpectreProjectableElement {
|
|
|
204
367
|
return el.hasAttribute("data-sp-button-native") || el.hasAttribute("data-sp-button-loading-label") || el.hasAttribute("data-sp-button-label-fallback");
|
|
205
368
|
}
|
|
206
369
|
willUpdate(changedProperties) {
|
|
207
|
-
if (changedProperties.has("variant") && !isButtonVariant(this.variant)) {
|
|
370
|
+
if (changedProperties.has("variant") && (this.variant == null || !isButtonVariant(this.variant))) {
|
|
208
371
|
this.variant = "primary";
|
|
209
372
|
}
|
|
210
|
-
if (changedProperties.has("size") && !
|
|
373
|
+
if (changedProperties.has("size") && (this.size == null || !isInputSize(this.size))) {
|
|
211
374
|
this.size = "md";
|
|
212
375
|
}
|
|
213
|
-
if (changedProperties.has("type") && !isButtonType(this.type)) {
|
|
376
|
+
if (changedProperties.has("type") && (this.type == null || !isButtonType(this.type))) {
|
|
214
377
|
this.type = "button";
|
|
215
378
|
}
|
|
216
379
|
if (changedProperties.has("loadingLabel")) {
|
|
@@ -225,15 +388,16 @@ var SpectreButtonElement = class extends SpectreProjectableElement {
|
|
|
225
388
|
get buttonClasses() {
|
|
226
389
|
return getButtonClasses({
|
|
227
390
|
disabled: this.isDisabled,
|
|
228
|
-
fullWidth: this.fullWidth,
|
|
229
|
-
|
|
230
|
-
|
|
391
|
+
fullWidth: this.fullWidth ?? false,
|
|
392
|
+
iconOnly: this.iconOnly ?? false,
|
|
393
|
+
loading: this.loading ?? false,
|
|
394
|
+
pill: this.pill ?? false,
|
|
231
395
|
size: this.size,
|
|
232
396
|
variant: this.variant
|
|
233
397
|
});
|
|
234
398
|
}
|
|
235
399
|
get isDisabled() {
|
|
236
|
-
return this.disabled || this.loading;
|
|
400
|
+
return (this.disabled ?? false) || (this.loading ?? false);
|
|
237
401
|
}
|
|
238
402
|
get visibleLabelFallback() {
|
|
239
403
|
const trimmedLabel = this.label?.trim();
|
|
@@ -247,34 +411,32 @@ var SpectreButtonElement = class extends SpectreProjectableElement {
|
|
|
247
411
|
}
|
|
248
412
|
renderButtonContent() {
|
|
249
413
|
if (this.loading) {
|
|
250
|
-
return html`<span data-sp-button-loading-label>${this.loadingLabel}</span>`;
|
|
414
|
+
return html`<span class="sp-label" data-sp-button-loading-label>${this.loadingLabel}</span>`;
|
|
251
415
|
}
|
|
252
416
|
if (this.hasProjectedContent) {
|
|
253
417
|
return this.projectedContent;
|
|
254
418
|
}
|
|
255
|
-
return this.visibleLabelFallback ? html`<span data-sp-button-label-fallback>${this.visibleLabelFallback}</span>` : nothing;
|
|
419
|
+
return this.visibleLabelFallback ? html`<span class="sp-label" data-sp-button-label-fallback>${this.visibleLabelFallback}</span>` : nothing;
|
|
256
420
|
}
|
|
257
421
|
render() {
|
|
258
|
-
return html
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
</button>
|
|
277
|
-
`;
|
|
422
|
+
return html`<button
|
|
423
|
+
aria-busy="${this.loading ? "true" : "false"}"
|
|
424
|
+
aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
|
|
425
|
+
aria-label="${ifDefined(this.forwardedAriaLabel)}"
|
|
426
|
+
aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
|
|
427
|
+
?autofocus="${this.autofocus}"
|
|
428
|
+
class="${this.buttonClasses}"
|
|
429
|
+
data-sp-button-native
|
|
430
|
+
?disabled="${this.isDisabled}"
|
|
431
|
+
form="${ifDefined(this.form || void 0)}"
|
|
432
|
+
id="${ifDefined(this.id || void 0)}"
|
|
433
|
+
name="${ifDefined(this.name || void 0)}"
|
|
434
|
+
title="${ifDefined(this.title || void 0)}"
|
|
435
|
+
type="${this.type}"
|
|
436
|
+
value="${ifDefined(this.value)}"
|
|
437
|
+
>
|
|
438
|
+
${this.renderButtonContent()}
|
|
439
|
+
</button>`;
|
|
278
440
|
}
|
|
279
441
|
};
|
|
280
442
|
SpectreButtonElement.properties = {
|
|
@@ -282,16 +444,16 @@ SpectreButtonElement.properties = {
|
|
|
282
444
|
disabled: { type: Boolean, reflect: true },
|
|
283
445
|
form: { type: String },
|
|
284
446
|
fullWidth: { attribute: "full-width", type: Boolean, reflect: true },
|
|
447
|
+
iconOnly: { attribute: "icon-only", type: Boolean, reflect: true },
|
|
285
448
|
label: { type: String, reflect: true },
|
|
286
449
|
loading: { type: Boolean, reflect: true },
|
|
287
450
|
loadingLabel: { attribute: "loading-label", type: String, reflect: true },
|
|
288
451
|
name: { type: String, reflect: true },
|
|
289
452
|
pill: { type: Boolean, reflect: true },
|
|
290
453
|
size: { type: String, reflect: true },
|
|
291
|
-
title: { type: String, reflect: true },
|
|
292
454
|
type: { type: String, reflect: true },
|
|
293
455
|
variant: { type: String, reflect: true },
|
|
294
|
-
value: { type: String
|
|
456
|
+
value: { type: String }
|
|
295
457
|
};
|
|
296
458
|
function defineSpectreButton(tagName = "sp-button") {
|
|
297
459
|
const existingElement = customElements.get(tagName);
|
|
@@ -302,6 +464,6 @@ function defineSpectreButton(tagName = "sp-button") {
|
|
|
302
464
|
return SpectreButtonElement;
|
|
303
465
|
}
|
|
304
466
|
|
|
305
|
-
export { SpectreButtonElement, defineSpectreButton, spectreButtonSizes, spectreButtonTypes, spectreButtonVariants };
|
|
467
|
+
export { SpectreButtonElement, defineSpectreButton, spectreInputSizes as spectreButtonSizes, spectreButtonTypes, spectreButtonVariants };
|
|
306
468
|
//# sourceMappingURL=button.js.map
|
|
307
469
|
//# sourceMappingURL=button.js.map
|
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":";;;;;AAEO,IAAM,kBAAA,GAAN,cAAiC,UAAA,CAAW;AAAA,EAA5C,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA;AAOL,IAAA,IAAA,CAAA,SAAA,GAA2B,IAAA;AAC3B,IAAA,IAAA,CAAA,cAAA,GAAgC,IAAA;AAChC,IAAA,IAAA,CAAA,eAAA,GAAiC,IAAA;AAAA,EAAA;AAAA,EAIjC,IAAa,EAAA,GAAa;AACxB,IAAA,OAAO,KAAK,GAAA,IAAO,EAAA;AAAA,EACrB;AAAA,EAEA,IAAa,GAAG,KAAA,EAAe;AAC7B,IAAA,IAAA,CAAK,IAAA,CAAK,GAAA,IAAO,EAAA,MAAQ,KAAA,EAAO;AAC9B,MAAA;AAAA,IACF;AAEA,IAAA,IAAA,CAAK,GAAA,GAAM,KAAA;AAEX,IAAA,MAAM,IAAA,GAAO,IAAA;AACb,IAAA,IAAI,YAAY,SAAA,CAAU,YAAA,CAAa,IAAA,CAAK,IAAA,EAAM,IAAI,CAAA,EAAG;AACvD,MAAA,WAAA,CAAY,SAAA,CAAU,eAAA,CAAgB,IAAA,CAAK,IAAA,EAAM,IAAI,CAAA;AAAA,IACvD;AAEA,IAAA,IAAA,CAAK,aAAA,EAAc;AAAA,EACrB;AAAA;AAAA;AAAA,EAIA,gBAAA,GAAyB;AACvB,IAAA,OAAO,IAAA;AAAA,EACT;AAAA,EAES,iBAAA,GAA0B;AACjC,IAAA,KAAA,CAAM,iBAAA,EAAkB;AAExB,IAAA,MAAM,MAAA,GAAS,KAAA,CAAM,YAAA,CAAa,IAAI,CAAA;AACtC,IAAA,IAAI,WAAW,IAAA,EAAM;AACnB,MAAA,IAAA,CAAK,EAAA,GAAK,MAAA;AAAA,IACZ;AAAA,EACF;AAAA,EAES,aAAa,aAAA,EAAsC;AAC1D,IAAA,IAAI,kBAAkB,IAAA,EAAM;AAC1B,MAAA,OAAO,KAAK,EAAA,IAAM,IAAA;AAAA,IACpB;AAEA,IAAA,OAAO,KAAA,CAAM,aAAa,aAAa,CAAA;AAAA,EACzC;AAAA,EAES,aAAa,aAAA,EAAgC;AACpD,IAAA,IAAI,kBAAkB,IAAA,EAAM;AAC1B,MAAA,OAAO,KAAK,EAAA,KAAO,EAAA;AAAA,IACrB;AAEA,IAAA,OAAO,KAAA,CAAM,aAAa,aAAa,CAAA;AAAA,EACzC;AAAA,EAES,YAAA,CAAa,eAAuB,KAAA,EAAqB;AAChE,IAAA,IAAI,kBAAkB,IAAA,EAAM;AAC1B,MAAA,IAAA,CAAK,EAAA,GAAK,KAAA;AACV,MAAA;AAAA,IACF;AAEA,IAAA,KAAA,CAAM,YAAA,CAAa,eAAe,KAAK,CAAA;AAAA,EACzC;AAAA,EAES,gBAAgB,aAAA,EAA6B;AACpD,IAAA,IAAI,kBAAkB,IAAA,EAAM;AAC1B,MAAA,IAAA,CAAK,EAAA,GAAK,EAAA;AACV,MAAA;AAAA,IACF;AAEA,IAAA,KAAA,CAAM,gBAAgB,aAAa,CAAA;AAAA,EACrC;AAAA,EAEA,IAAc,kBAAA,GAAyC;AACrD,IAAA,MAAM,KAAA,GAAQ,IAAA,CAAK,SAAA,EAAW,IAAA,EAAK;AACnC,IAAA,OAAO,QAAQ,KAAA,GAAQ,MAAA;AAAA,EACzB;AAAA,EAEA,IAAc,uBAAA,GAA8C;AAC1D,IAAA,MAAM,KAAA,GAAQ,IAAA,CAAK,cAAA,EAAgB,IAAA,EAAK;AACxC,IAAA,OAAO,QAAQ,KAAA,GAAQ,MAAA;AAAA,EACzB;AAAA,EAEA,IAAc,wBAAA,GAA+C;AAC3D,IAAA,MAAM,KAAA,GAAQ,IAAA,CAAK,eAAA,EAAiB,IAAA,EAAK;AACzC,IAAA,OAAO,QAAQ,KAAA,GAAQ,MAAA;AAAA,EACzB;AACF,CAAA;AA/Fa,kBAAA,CACJ,UAAA,GAAmC;AAAA,EACxC,SAAA,EAAW,EAAE,SAAA,EAAW,YAAA,EAAc,MAAM,MAAA,EAAO;AAAA,EACnD,cAAA,EAAgB,EAAE,SAAA,EAAW,iBAAA,EAAmB,MAAM,MAAA,EAAO;AAAA,EAC7D,eAAA,EAAiB,EAAE,SAAA,EAAW,kBAAA,EAAoB,MAAM,MAAA;AAC1D,CAAA;;;ACPK,SAAS,qBAAqB,KAAA,EAAiC;AACpE,EAAA,OAAO,KAAA,CAAM,IAAA,CAAK,CAAC,IAAA,KAAS;AAC1B,IAAA,IAAI,IAAA,CAAK,QAAA,KAAa,IAAA,CAAK,YAAA,EAAc;AACvC,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,IAAI,IAAA,CAAK,QAAA,KAAa,IAAA,CAAK,SAAA,EAAW;AACpC,MAAA,OAAA,CAAQ,IAAA,CAAK,WAAA,EAAa,IAAA,EAAK,CAAE,UAAU,CAAA,IAAK,CAAA;AAAA,IAClD;AAEA,IAAA,OAAO,KAAA;AAAA,EACT,CAAC,CAAA;AACH;;;ACTO,IAAe,yBAAA,GAAf,cAAiD,kBAAA,CAAmB;AAAA,EAApE,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA;AACL,IAAA,IAAA,CAAU,mBAA2B,EAAC;AAAA,EAAA;AAAA,EAWtC,IAAc,mBAAA,GAA+B;AAC3C,IAAA,OAAO,oBAAA,CAAqB,KAAK,gBAAgB,CAAA;AAAA,EACnD;AAAA,EAES,iBAAA,GAA0B;AACjC,IAAA,KAAA,CAAM,iBAAA,EAAkB;AACxB,IAAA,IAAA,CAAK,oBAAA,EAAqB;AAC1B,IAAA,IAAA,CAAK,oBAAA,EAAqB;AAAA,EAC5B;AAAA,EAES,oBAAA,GAA6B;AACpC,IAAA,IAAA,CAAK,mBAAA,EAAoB;AACzB,IAAA,KAAA,CAAM,oBAAA,EAAqB;AAAA,EAC7B;AAAA,EAEmB,OAAO,iBAAA,EAAoD;AAC5E,IAAA,IAAA,CAAK,mBAAA,EAAoB;AACzB,IAAA,KAAA,CAAM,OAAO,iBAAiB,CAAA;AAC9B,IAAA,IAAA,CAAK,oBAAA,EAAqB;AAAA,EAC5B;AAAA,EAEU,oBAAA,GAAgC;AACxC,IAAA,MAAM,uBAA+B,EAAC;AACtC,IAAA,MAAM,WAAA,GAAc;AAAA,MAClB,GAAG,IAAA,CAAK,UAAA;AAAA,MACR,GAAI,IAAA,CAAK,mBAAA,EAAoB,EAAG,cAAc;AAAC,KACjD;AAEA,IAAA,WAAA,CAAY,OAAA,CAAQ,CAAC,IAAA,KAAS;AAC5B,MAAA,IAAI,CAAC,KAAK,cAAA,CAAe,IAAI,KAAK,CAAC,oBAAA,CAAqB,QAAA,CAAS,IAAI,CAAA,EAAG;AACtE,QAAA,oBAAA,CAAqB,KAAK,IAAI,CAAA;AAAA,MAChC;AAAA,IACF,CAAC,CAAA;AAED,IAAA,MAAM,UAAA,GACJ,oBAAA,CAAqB,MAAA,KAAW,IAAA,CAAK,iBAAiB,MAAA,IACtD,oBAAA,CAAqB,IAAA,CAAK,CAAC,MAAM,KAAA,KAAU,IAAA,KAAS,IAAA,CAAK,gBAAA,CAAiB,KAAK,CAAC,CAAA;AAElF,IAAA,IAAI,UAAA,EAAY;AACd,MAAA,IAAA,CAAK,gBAAA,GAAmB,oBAAA;AAAA,IAC1B;AAEA,IAAA,OAAO,UAAA;AAAA,EACT;AAAA,EAEQ,oBAAA,GAA6B;AACnC,IAAA,IAAI,KAAK,eAAA,EAAiB;AACxB,MAAA;AAAA,IACF;AAEA,IAAA,IAAA,CAAK,eAAA,GAAkB,IAAI,gBAAA,CAAiB,CAAC,SAAA,KAAc;AACzD,MAAA,MAAM,qBAAqB,SAAA,CAAU,KAAA;AAAA,QAAM,CAAC,QAAA,KAC1C,KAAA,CAAM,IAAA,CAAK,QAAA,CAAS,YAAY,CAAA,CAAE,KAAA;AAAA,UAChC,CAAC,SAAS,IAAA,CAAK,cAAA,CAAe,IAAI,CAAA,IAAK,IAAA,CAAK,SAAS,IAAI;AAAA,SAC3D,IACA,KAAA,CAAM,IAAA,CAAK,QAAA,CAAS,UAAU,CAAA,CAAE,KAAA,CAAM,CAAC,IAAA,KAAS,IAAA,CAAK,cAAA,CAAe,IAAI,CAAC;AAAA,OAC3E;AAEA,MAAA,IAAI,kBAAA,EAAoB;AACtB,QAAA;AAAA,MACF;AAEA,MAAA,IAAI,IAAA,CAAK,sBAAqB,EAAG;AAC/B,QAAA,IAAA,CAAK,aAAA,EAAc;AAAA,MACrB;AAAA,IACF,CAAC,CAAA;AAED,IAAA,IAAA,CAAK,gBAAgB,OAAA,CAAQ,IAAA,EAAM,EAAE,SAAA,EAAW,MAAM,CAAA;AAAA,EACxD;AAAA,EAEQ,mBAAA,GAA4B;AAClC,IAAA,IAAA,CAAK,iBAAiB,UAAA,EAAW;AACjC,IAAA,IAAA,CAAK,eAAA,GAAkB,MAAA;AAAA,EACzB;AACF,CAAA;AC9EO,IAAM,qBAAA,GAAwB;AAAA,EACnC,SAAA;AAAA,EACA,WAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,KAAA;AAAA,EACA;AACF;AAEO,IAAM,kBAAA,GAAqB,CAAC,IAAA,EAAM,IAAA,EAAM,IAAI;AAC5C,IAAM,kBAAA,GAAqB,CAAC,QAAA,EAAU,QAAA,EAAU,OAAO;AA0B9D,SAAS,gBAAgB,KAAA,EAAuC;AAC9D,EAAA,OAAQ,qBAAA,CAA4C,SAAS,KAAK,CAAA;AACpE;AAEA,SAAS,aAAa,KAAA,EAAoC;AACxD,EAAA,OAAQ,kBAAA,CAAyC,SAAS,KAAK,CAAA;AACjE;AAEA,SAAS,aAAa,KAAA,EAA2C;AAC/D,EAAA,OAAQ,kBAAA,CAAyC,SAAS,KAAK,CAAA;AACjE;AAEO,IAAM,oBAAA,GAAN,cAAmC,yBAAA,CAAwD;AAAA,EAA3F,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA;AAkBL,IAAA,IAAA,CAAA,SAAA,GAAY,KAAA;AACZ,IAAA,IAAA,CAAA,QAAA,GAAW,KAAA;AAEX,IAAA,IAAA,CAAA,SAAA,GAAY,KAAA;AAEZ,IAAA,IAAA,CAAA,OAAA,GAAU,KAAA;AACV,IAAA,IAAA,CAAA,YAAA,GAAe,SAAA;AAEf,IAAA,IAAA,CAAA,IAAA,GAAO,KAAA;AACP,IAAA,IAAA,CAAA,IAAA,GAA0B,IAAA;AAC1B,IAAA,IAAA,CAAS,KAAA,GAAQ,EAAA;AACjB,IAAA,IAAA,CAAA,IAAA,GAA0B,QAAA;AAC1B,IAAA,IAAA,CAAA,OAAA,GAAgC,SAAA;AAChC,IAAA,IAAA,CAAA,KAAA,GAAQ,EAAA;AAAA,EAAA;AAAA,EAEW,mBAAA,GAAsC;AACvD,IAAA,OAAO,IAAA,CAAK,cAAc,yBAAyB,CAAA;AAAA,EACrD;AAAA,EAEmB,eAAe,IAAA,EAAqB;AACrD,IAAA,IAAI,IAAA,CAAK,QAAA,KAAa,IAAA,CAAK,YAAA,EAAc;AACvC,MAAA,OAAO,KAAA;AAAA,IACT;AAEA,IAAA,MAAM,EAAA,GAAK,IAAA;AACX,IAAA,OACE,EAAA,CAAG,YAAA,CAAa,uBAAuB,CAAA,IACvC,EAAA,CAAG,aAAa,8BAA8B,CAAA,IAC9C,EAAA,CAAG,YAAA,CAAa,+BAA+B,CAAA;AAAA,EAEnD;AAAA,EAEmB,WAAW,iBAAA,EAAoD;AAChF,IAAA,IAAI,iBAAA,CAAkB,IAAI,SAAS,CAAA,IAAK,CAAC,eAAA,CAAgB,IAAA,CAAK,OAAO,CAAA,EAAG;AACtE,MAAA,IAAA,CAAK,OAAA,GAAU,SAAA;AAAA,IACjB;AAEA,IAAA,IAAI,iBAAA,CAAkB,IAAI,MAAM,CAAA,IAAK,CAAC,YAAA,CAAa,IAAA,CAAK,IAAI,CAAA,EAAG;AAC7D,MAAA,IAAA,CAAK,IAAA,GAAO,IAAA;AAAA,IACd;AAEA,IAAA,IAAI,iBAAA,CAAkB,IAAI,MAAM,CAAA,IAAK,CAAC,YAAA,CAAa,IAAA,CAAK,IAAI,CAAA,EAAG;AAC7D,MAAA,IAAA,CAAK,IAAA,GAAO,QAAA;AAAA,IACd;AAEA,IAAA,IAAI,iBAAA,CAAkB,GAAA,CAAI,cAAc,CAAA,EAAG;AACzC,MAAA,IAAI,KAAK,YAAA,IAAgB,IAAA,IAAQ,KAAK,YAAA,CAAa,IAAA,OAAW,EAAA,EAAI;AAChE,QAAA,IAAA,CAAK,YAAA,GAAe,SAAA;AAAA,MACtB;AAAA,IACF;AAEA,IAAA,IAAI,kBAAkB,GAAA,CAAI,OAAO,CAAA,IAAK,IAAA,CAAK,SAAS,IAAA,EAAM;AACxD,MAAA,IAAA,CAAK,KAAA,GAAQ,EAAA;AAAA,IACf;AAAA,EACF;AAAA,EAEA,IAAY,aAAA,GAAwB;AAClC,IAAA,OAAO,gBAAA,CAAiB;AAAA,MACtB,UAAU,IAAA,CAAK,UAAA;AAAA,MACf,WAAW,IAAA,CAAK,SAAA;AAAA,MAChB,SAAS,IAAA,CAAK,OAAA;AAAA,MACd,MAAM,IAAA,CAAK,IAAA;AAAA,MACX,MAAM,IAAA,CAAK,IAAA;AAAA,MACX,SAAS,IAAA,CAAK;AAAA,KACf,CAAA;AAAA,EACH;AAAA,EAEA,IAAY,UAAA,GAAsB;AAChC,IAAA,OAAO,IAAA,CAAK,YAAY,IAAA,CAAK,OAAA;AAAA,EAC/B;AAAA,EAEA,IAAY,oBAAA,GAA2C;AACrD,IAAA,MAAM,YAAA,GAAe,IAAA,CAAK,KAAA,EAAO,IAAA,EAAK;AACtC,IAAA,OAAO,eAAe,YAAA,GAAe,MAAA;AAAA,EACvC;AAAA,EAES,MAAM,OAAA,EAA8B;AAC3C,IAAC,IAAA,CAAK,mBAAA,EAAoB,EAAgC,KAAA,CAAM,OAAO,CAAA;AAAA,EACzE;AAAA,EAES,IAAA,GAAa;AACpB,IAAC,IAAA,CAAK,mBAAA,EAAoB,EAAgC,IAAA,EAAK;AAAA,EACjE;AAAA,EAEQ,mBAAA,GAAgE;AACtE,IAAA,IAAI,KAAK,OAAA,EAAS;AAChB,MAAA,OAAO,IAAA,CAAA,mCAAA,EAA0C,KAAK,YAAY,CAAA,OAAA,CAAA;AAAA,IACpE;AAEA,IAAA,IAAI,KAAK,mBAAA,EAAqB;AAC5B,MAAA,OAAO,IAAA,CAAK,gBAAA;AAAA,IACd;AAEA,IAAA,OAAO,IAAA,CAAK,oBAAA,GACR,IAAA,CAAA,oCAAA,EAA2C,IAAA,CAAK,oBAAoB,CAAA,OAAA,CAAA,GACpE,OAAA;AAAA,EACN;AAAA,EAES,MAAA,GAAS;AAChB,IAAA,OAAO,IAAA;AAAA;AAAA,kBAAA,EAES,IAAA,CAAK,OAAA,GAAU,MAAA,GAAS,OAAO;AAAA,yBAAA,EACxB,SAAA,CAAU,IAAA,CAAK,wBAAwB,CAAC;AAAA,mBAAA,EAC9C,SAAA,CAAU,IAAA,CAAK,kBAAkB,CAAC;AAAA,wBAAA,EAC7B,SAAA,CAAU,IAAA,CAAK,uBAAuB,CAAC;AAAA,mBAAA,EAC5C,KAAK,SAAS;AAAA,cAAA,EACnB,KAAK,aAAa;AAAA;AAAA,kBAAA,EAEd,KAAK,UAAU;AAAA,aAAA,EACpB,SAAA,CAAU,IAAA,CAAK,IAAI,CAAC;AAAA,WAAA,EACtB,SAAA,CAAU,IAAA,CAAK,EAAA,IAAM,MAAS,CAAC;AAAA,aAAA,EAC7B,SAAA,CAAU,IAAA,CAAK,IAAI,CAAC;AAAA,cAAA,EACnB,SAAA,CAAU,IAAA,CAAK,KAAA,IAAS,MAAS,CAAC;AAAA,aAAA,EACnC,KAAK,IAAI;AAAA,cAAA,EACR,SAAA,CAAU,IAAA,CAAK,KAAK,CAAC;AAAA;AAAA,QAAA,EAE3B,IAAA,CAAK,mBAAA,EAAoB,IAAK,OAAO;AAAA;AAAA,IAAA,CAAA;AAAA,EAG7C;AACF;AA1Ia,oBAAA,CACJ,UAAA,GAAa;AAAA,EAClB,SAAA,EAAW,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA,EAAK;AAAA,EAC1C,QAAA,EAAU,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA,EAAK;AAAA,EACzC,IAAA,EAAM,EAAE,IAAA,EAAM,MAAA,EAAO;AAAA,EACrB,WAAW,EAAE,SAAA,EAAW,cAAc,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA,EAAK;AAAA,EACnE,KAAA,EAAO,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACrC,OAAA,EAAS,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA,EAAK;AAAA,EACxC,cAAc,EAAE,SAAA,EAAW,iBAAiB,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACxE,IAAA,EAAM,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACpC,IAAA,EAAM,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA,EAAK;AAAA,EACrC,IAAA,EAAM,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACpC,KAAA,EAAO,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACrC,IAAA,EAAM,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACpC,OAAA,EAAS,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA,EAAK;AAAA,EACvC,KAAA,EAAO,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,IAAA;AAClC,CAAA;AA4HK,SAAS,mBAAA,CAAoB,UAAU,WAAA,EAA0C;AACtF,EAAA,MAAM,eAAA,GAAkB,cAAA,CAAe,GAAA,CAAI,OAAO,CAAA;AAElD,EAAA,IAAI,eAAA,EAAiB;AACnB,IAAA,OAAO,eAAA;AAAA,EACT;AAEA,EAAA,cAAA,CAAe,MAAA,CAAO,SAAS,oBAAoB,CAAA;AACnD,EAAA,OAAO,oBAAA;AACT","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/form.ts","../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 {\n type ButtonSize,\n type ButtonVariant,\n type InputSize,\n} from '@phcdevworks/spectre-ui';\n\nexport const spectreInputSizes = ['sm', 'md', 'lg'] as const;\nexport type SpectreInputSize = (typeof spectreInputSizes)[number];\n\nexport function isInputSize(value: unknown): value is InputSize | ButtonSize {\n return (spectreInputSizes as readonly string[]).includes(value as string);\n}\n\nexport const spectreButtonVariants = [\n 'primary',\n 'secondary',\n 'ghost',\n 'danger',\n 'success',\n 'cta',\n 'accent',\n] as const;\n\nexport type SpectreButtonVariant = (typeof spectreButtonVariants)[number];\n\nexport function isButtonVariant(value: unknown): value is ButtonVariant {\n return (spectreButtonVariants as readonly string[]).includes(value as string);\n}\n\nexport const spectreButtonTypes = ['button', 'submit', 'reset'] as const;\n\nexport type SpectreButtonType = (typeof spectreButtonTypes)[number];\n\nexport function isButtonType(value: unknown): value is SpectreButtonType {\n return (spectreButtonTypes as readonly string[]).includes(value as string);\n}\n\nexport const spectreInputTypes = [\n 'text',\n 'email',\n 'password',\n 'search',\n 'tel',\n 'url',\n 'number',\n 'date',\n 'datetime-local',\n 'month',\n 'time',\n 'week',\n] as const;\n\nexport type SpectreInputType = (typeof spectreInputTypes)[number];\n\nexport function isInputType(value: unknown): value is SpectreInputType {\n return (spectreInputTypes as readonly string[]).includes(value as string);\n}\n\nexport function normalizeInt(\n value: unknown,\n fallback: number | undefined,\n min = 0,\n): number | undefined {\n if (\n value == null ||\n typeof value !== 'number' ||\n !Number.isInteger(value) ||\n value < min\n ) {\n return fallback;\n }\n return value;\n}\n","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 _autocapitalize = '';\n private _spellcheck: boolean | 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 autocapitalize(): string {\n return this._autocapitalize;\n }\n\n override set autocapitalize(value: string | undefined | null) {\n const normalizedValue = value ?? '';\n if (this._autocapitalize === normalizedValue) {\n return;\n }\n this._autocapitalize = normalizedValue;\n this._removeHostAttribute('autocapitalize');\n this.requestUpdate();\n }\n\n override get spellcheck(): boolean {\n return this._spellcheck ?? super.spellcheck;\n }\n\n override set spellcheck(value: boolean | undefined | null) {\n if (this._spellcheck === value) {\n return;\n }\n this._spellcheck = value ?? null;\n this._removeHostAttribute('spellcheck');\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 'autocapitalize',\n 'spellcheck',\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 'autocapitalize':\n return this.autocapitalize || null;\n case 'spellcheck':\n return this._spellcheck !== null ? String(this._spellcheck) : 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 'autocapitalize':\n return this.autocapitalize !== '';\n case 'spellcheck':\n return this._spellcheck !== null;\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 'autocapitalize':\n this.autocapitalize = value;\n break;\n case 'spellcheck':\n this.spellcheck = value !== 'false';\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 'autocapitalize':\n this.autocapitalize = '';\n break;\n case 'spellcheck':\n this.spellcheck = null;\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 // Use the native removeAttribute to avoid our own overridden version\n // which would reset the internal state.\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';\nimport {\n isButtonType,\n isButtonVariant,\n isInputSize,\n type SpectreButtonType,\n type SpectreButtonVariant,\n type SpectreInputSize,\n} from '../../utils/form';\n\nimport {\n getButtonClasses,\n type ButtonSize,\n type ButtonVariant,\n} from '@phcdevworks/spectre-ui';\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 iconOnly?: boolean | undefined;\n id?: string | null | undefined;\n label?: string | undefined;\n loading?: boolean | undefined;\n loadingLabel?: string | undefined;\n name?: string | undefined;\n pill?: boolean | undefined;\n size?: SpectreInputSize | undefined;\n title?: string | null | undefined;\n type?: SpectreButtonType | undefined;\n variant?: SpectreButtonVariant | undefined;\n value?: string | undefined;\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 iconOnly: { attribute: 'icon-only', 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 iconOnly = false;\n label: string | undefined;\n loading = false;\n loadingLabel: string | undefined = 'Loading';\n name: string | undefined;\n pill = false;\n size: SpectreInputSize | undefined = 'md';\n type: SpectreButtonType | undefined = 'button';\n variant: SpectreButtonVariant | undefined = 'primary';\n value: string | undefined = '';\n\n override get id(): string {\n return super.id;\n }\n\n override set id(value: string | null | undefined) {\n super.id = value;\n }\n\n override get title(): string {\n return super.title;\n }\n\n override set title(value: string | null | undefined) {\n super.title = value;\n }\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') && (this.variant == null || !isButtonVariant(this.variant))) {\n this.variant = 'primary';\n }\n\n if (changedProperties.has('size') && (this.size == null || !isInputSize(this.size))) {\n this.size = 'md';\n }\n\n if (changedProperties.has('type') && (this.type == null || !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 ?? false,\n iconOnly: this.iconOnly ?? false,\n loading: this.loading ?? false,\n pill: this.pill ?? false,\n size: this.size as ButtonSize,\n variant: this.variant as ButtonVariant,\n });\n }\n\n private get isDisabled(): boolean {\n return (this.disabled ?? false) || (this.loading ?? false);\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 class=\"sp-label\" data-sp-button-loading-label>${this.loadingLabel}</span>`;\n }\n\n if (this.hasProjectedContent) {\n return this.projectedContent;\n }\n\n return this.visibleLabelFallback\n ? html`<span class=\"sp-label\" 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)}\"\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"]}
|