@phcdevworks/spectre-components 0.0.1 → 1.0.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/dist/base-DQtCQ-dP.d.cts +22 -0
- package/dist/base-DQtCQ-dP.d.ts +22 -0
- package/dist/button.cjs +149 -124
- package/dist/button.cjs.map +1 -1
- package/dist/button.d.cts +15 -40
- package/dist/button.d.ts +15 -40
- package/dist/button.js +150 -125
- package/dist/button.js.map +1 -1
- package/dist/checkbox.cjs +140 -25
- package/dist/checkbox.cjs.map +1 -1
- package/dist/checkbox.d.cts +32 -32
- package/dist/checkbox.d.ts +32 -32
- package/dist/checkbox.js +141 -26
- package/dist/checkbox.js.map +1 -1
- package/dist/fieldset.cjs +96 -50
- package/dist/fieldset.cjs.map +1 -1
- package/dist/fieldset.d.cts +24 -36
- package/dist/fieldset.d.ts +24 -36
- package/dist/fieldset.js +96 -50
- package/dist/fieldset.js.map +1 -1
- package/dist/form-iI7vV-3W.d.cts +6 -0
- package/dist/form-iI7vV-3W.d.ts +6 -0
- package/dist/index.cjs +298 -826
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -2
- package/dist/index.d.ts +5 -2
- package/dist/index.js +300 -827
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +70 -59
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +25 -36
- package/dist/input.d.ts +25 -36
- package/dist/input.js +70 -59
- package/dist/input.js.map +1 -1
- package/dist/label.cjs +101 -38
- package/dist/label.cjs.map +1 -1
- package/dist/label.d.cts +16 -20
- package/dist/label.d.ts +16 -20
- package/dist/label.js +101 -38
- package/dist/label.js.map +1 -1
- package/dist/projectable-DcnBRiko.d.cts +17 -0
- package/dist/projectable-SzbPvXfM.d.ts +17 -0
- package/dist/radio.cjs +140 -25
- package/dist/radio.cjs.map +1 -1
- package/dist/radio.d.cts +32 -32
- package/dist/radio.d.ts +32 -32
- package/dist/radio.js +141 -26
- package/dist/radio.js.map +1 -1
- package/dist/select.cjs +142 -113
- package/dist/select.cjs.map +1 -1
- package/dist/select.d.cts +23 -41
- package/dist/select.d.ts +23 -41
- package/dist/select.js +143 -113
- package/dist/select.js.map +1 -1
- package/dist/textarea.cjs +24 -223
- package/dist/textarea.cjs.map +1 -1
- package/dist/textarea.d.cts +20 -32
- package/dist/textarea.d.ts +20 -32
- package/dist/textarea.js +24 -223
- package/dist/textarea.js.map +1 -1
- package/package.json +11 -11
package/dist/select.cjs
CHANGED
|
@@ -6,38 +6,12 @@ var ifDefined_js = require('lit/directives/if-defined.js');
|
|
|
6
6
|
var spectreUi = require('@phcdevworks/spectre-ui');
|
|
7
7
|
|
|
8
8
|
// src/components/select/sp-select.ts
|
|
9
|
-
var
|
|
10
|
-
function isSelectSize(value) {
|
|
11
|
-
return spectreSelectSizes.includes(value);
|
|
12
|
-
}
|
|
13
|
-
function isSelectableContent(node) {
|
|
14
|
-
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
15
|
-
const tagName = node.tagName;
|
|
16
|
-
return tagName === "OPTION" || tagName === "OPTGROUP";
|
|
17
|
-
}
|
|
18
|
-
if (node.nodeType === Node.TEXT_NODE) {
|
|
19
|
-
return (node.textContent?.trim().length ?? 0) > 0;
|
|
20
|
-
}
|
|
21
|
-
return false;
|
|
22
|
-
}
|
|
23
|
-
var SpectreSelectElement = class extends lit.LitElement {
|
|
9
|
+
var SpectreBaseElement = class extends lit.LitElement {
|
|
24
10
|
constructor() {
|
|
25
11
|
super(...arguments);
|
|
26
12
|
this.ariaLabel = null;
|
|
27
13
|
this.ariaLabelledBy = null;
|
|
28
14
|
this.ariaDescribedBy = null;
|
|
29
|
-
this.autofocus = false;
|
|
30
|
-
this.disabled = false;
|
|
31
|
-
this.fullWidth = false;
|
|
32
|
-
this.invalid = false;
|
|
33
|
-
this.loading = false;
|
|
34
|
-
this.pill = false;
|
|
35
|
-
this.required = false;
|
|
36
|
-
this.size = "md";
|
|
37
|
-
this.success = false;
|
|
38
|
-
this.title = "";
|
|
39
|
-
this.value = "";
|
|
40
|
-
this.projectedOptions = [];
|
|
41
15
|
}
|
|
42
16
|
get id() {
|
|
43
17
|
return this._id ?? "";
|
|
@@ -53,6 +27,8 @@ var SpectreSelectElement = class extends lit.LitElement {
|
|
|
53
27
|
}
|
|
54
28
|
this.requestUpdate();
|
|
55
29
|
}
|
|
30
|
+
// Spectre components intentionally render in light DOM so the global
|
|
31
|
+
// `@phcdevworks/spectre-ui` styling contract can apply directly.
|
|
56
32
|
createRenderRoot() {
|
|
57
33
|
return this;
|
|
58
34
|
}
|
|
@@ -62,12 +38,6 @@ var SpectreSelectElement = class extends lit.LitElement {
|
|
|
62
38
|
if (hostId !== null) {
|
|
63
39
|
this.id = hostId;
|
|
64
40
|
}
|
|
65
|
-
this.syncProjectedOptions();
|
|
66
|
-
this.startContentObserver();
|
|
67
|
-
}
|
|
68
|
-
disconnectedCallback() {
|
|
69
|
-
this.stopContentObserver();
|
|
70
|
-
super.disconnectedCallback();
|
|
71
41
|
}
|
|
72
42
|
getAttribute(qualifiedName) {
|
|
73
43
|
if (qualifiedName === "id") {
|
|
@@ -95,110 +65,169 @@ var SpectreSelectElement = class extends lit.LitElement {
|
|
|
95
65
|
}
|
|
96
66
|
super.removeAttribute(qualifiedName);
|
|
97
67
|
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
68
|
+
get forwardedAriaLabel() {
|
|
69
|
+
const value = this.ariaLabel?.trim();
|
|
70
|
+
return value ? value : void 0;
|
|
71
|
+
}
|
|
72
|
+
get forwardedAriaLabelledBy() {
|
|
73
|
+
const value = this.ariaLabelledBy?.trim();
|
|
74
|
+
return value ? value : void 0;
|
|
75
|
+
}
|
|
76
|
+
get forwardedAriaDescribedBy() {
|
|
77
|
+
const value = this.ariaDescribedBy?.trim();
|
|
78
|
+
return value ? value : void 0;
|
|
79
|
+
}
|
|
80
|
+
};
|
|
81
|
+
SpectreBaseElement.properties = {
|
|
82
|
+
ariaLabel: { attribute: "aria-label", type: String },
|
|
83
|
+
ariaLabelledBy: { attribute: "aria-labelledby", type: String },
|
|
84
|
+
ariaDescribedBy: { attribute: "aria-describedby", type: String }
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
// src/utils/dom.ts
|
|
88
|
+
function hasMeaningfulContent(nodes) {
|
|
89
|
+
return nodes.some((node) => {
|
|
90
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
91
|
+
return true;
|
|
101
92
|
}
|
|
102
|
-
if (
|
|
103
|
-
|
|
93
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
94
|
+
return (node.textContent?.trim().length ?? 0) > 0;
|
|
104
95
|
}
|
|
96
|
+
return false;
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
// src/utils/projectable.ts
|
|
101
|
+
var SpectreProjectableElement = class extends SpectreBaseElement {
|
|
102
|
+
constructor() {
|
|
103
|
+
super(...arguments);
|
|
104
|
+
this.projectedContent = [];
|
|
105
|
+
}
|
|
106
|
+
get hasProjectedContent() {
|
|
107
|
+
return hasMeaningfulContent(this.projectedContent);
|
|
108
|
+
}
|
|
109
|
+
connectedCallback() {
|
|
110
|
+
super.connectedCallback();
|
|
111
|
+
this.syncProjectedContent();
|
|
112
|
+
this.startContentObserver();
|
|
113
|
+
}
|
|
114
|
+
disconnectedCallback() {
|
|
115
|
+
this.stopContentObserver();
|
|
116
|
+
super.disconnectedCallback();
|
|
105
117
|
}
|
|
106
118
|
update(changedProperties) {
|
|
107
119
|
this.stopContentObserver();
|
|
108
120
|
super.update(changedProperties);
|
|
109
121
|
this.startContentObserver();
|
|
110
122
|
}
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
const
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
}
|
|
121
|
-
if (this.value === "" && !this.hasAttribute("value")) {
|
|
122
|
-
const nativeValue = nativeSelect.value ?? "";
|
|
123
|
-
if (nativeValue !== "") {
|
|
124
|
-
this.value = nativeValue;
|
|
123
|
+
syncProjectedContent() {
|
|
124
|
+
const nextProjectedContent = [];
|
|
125
|
+
const sourceNodes = [
|
|
126
|
+
...this.childNodes,
|
|
127
|
+
...this.getContentContainer()?.childNodes ?? []
|
|
128
|
+
];
|
|
129
|
+
sourceNodes.forEach((node) => {
|
|
130
|
+
if (!this.isInternalNode(node) && !nextProjectedContent.includes(node)) {
|
|
131
|
+
nextProjectedContent.push(node);
|
|
125
132
|
}
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
get selectClasses() {
|
|
129
|
-
return spectreUi.getInputClasses({
|
|
130
|
-
fullWidth: this.fullWidth,
|
|
131
|
-
pill: this.pill,
|
|
132
|
-
size: this.size,
|
|
133
|
-
state: this.isDisabled ? this.disabled ? "disabled" : "loading" : this.invalid ? "error" : this.success ? "success" : "default"
|
|
134
133
|
});
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
return this.querySelector("[data-sp-select-native]");
|
|
141
|
-
}
|
|
142
|
-
get forwardedAriaLabel() {
|
|
143
|
-
const ariaLabel = this.ariaLabel?.trim();
|
|
144
|
-
return ariaLabel ? ariaLabel : void 0;
|
|
145
|
-
}
|
|
146
|
-
get forwardedAriaLabelledBy() {
|
|
147
|
-
const ariaLabelledBy = this.ariaLabelledBy?.trim();
|
|
148
|
-
return ariaLabelledBy ? ariaLabelledBy : void 0;
|
|
149
|
-
}
|
|
150
|
-
get forwardedAriaDescribedBy() {
|
|
151
|
-
const ariaDescribedBy = this.ariaDescribedBy?.trim();
|
|
152
|
-
return ariaDescribedBy ? ariaDescribedBy : void 0;
|
|
134
|
+
const hasChanged = nextProjectedContent.length !== this.projectedContent.length || nextProjectedContent.some((node, index) => node !== this.projectedContent[index]);
|
|
135
|
+
if (hasChanged) {
|
|
136
|
+
this.projectedContent = nextProjectedContent;
|
|
137
|
+
}
|
|
138
|
+
return hasChanged;
|
|
153
139
|
}
|
|
154
140
|
startContentObserver() {
|
|
155
141
|
if (this.contentObserver) {
|
|
156
142
|
return;
|
|
157
143
|
}
|
|
158
144
|
this.contentObserver = new MutationObserver((mutations) => {
|
|
159
|
-
const isInternalMovement = mutations.every(
|
|
160
|
-
|
|
161
|
-
(node) => this.
|
|
162
|
-
) && Array.from(mutation.addedNodes).every((node) => this.
|
|
163
|
-
|
|
145
|
+
const isInternalMovement = mutations.every(
|
|
146
|
+
(mutation) => Array.from(mutation.removedNodes).every(
|
|
147
|
+
(node) => this.isInternalNode(node) || this.contains(node)
|
|
148
|
+
) && Array.from(mutation.addedNodes).every((node) => this.isInternalNode(node))
|
|
149
|
+
);
|
|
164
150
|
if (isInternalMovement) {
|
|
165
151
|
return;
|
|
166
152
|
}
|
|
167
|
-
if (this.
|
|
153
|
+
if (this.syncProjectedContent()) {
|
|
168
154
|
this.requestUpdate();
|
|
169
155
|
}
|
|
170
156
|
});
|
|
171
|
-
this.contentObserver.observe(this, {
|
|
172
|
-
childList: true
|
|
173
|
-
});
|
|
157
|
+
this.contentObserver.observe(this, { childList: true });
|
|
174
158
|
}
|
|
175
159
|
stopContentObserver() {
|
|
176
160
|
this.contentObserver?.disconnect();
|
|
177
161
|
this.contentObserver = void 0;
|
|
178
162
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
163
|
+
};
|
|
164
|
+
var spectreInputSizes = ["sm", "md", "lg"];
|
|
165
|
+
function isInputSize(value) {
|
|
166
|
+
return spectreInputSizes.includes(value);
|
|
167
|
+
}
|
|
168
|
+
var SpectreSelectElement = class extends SpectreProjectableElement {
|
|
169
|
+
constructor() {
|
|
170
|
+
super(...arguments);
|
|
171
|
+
this.autofocus = false;
|
|
172
|
+
this.disabled = false;
|
|
173
|
+
this.fullWidth = false;
|
|
174
|
+
this.invalid = false;
|
|
175
|
+
this.loading = false;
|
|
176
|
+
this.pill = false;
|
|
177
|
+
this.required = false;
|
|
178
|
+
this.size = "md";
|
|
179
|
+
this.success = false;
|
|
180
|
+
this.title = "";
|
|
181
|
+
this.value = "";
|
|
182
|
+
}
|
|
183
|
+
getContentContainer() {
|
|
184
|
+
return this.querySelector("[data-sp-select-native]");
|
|
185
|
+
}
|
|
186
|
+
isInternalNode(node) {
|
|
187
|
+
if (node.nodeType !== Node.ELEMENT_NODE) {
|
|
188
|
+
return false;
|
|
189
|
+
}
|
|
190
|
+
const el = node;
|
|
191
|
+
return el.hasAttribute("data-sp-select-native");
|
|
192
|
+
}
|
|
193
|
+
willUpdate(changedProperties) {
|
|
194
|
+
if (changedProperties.has("size") && !isInputSize(this.size)) {
|
|
195
|
+
this.size = "md";
|
|
196
|
+
}
|
|
197
|
+
if (changedProperties.has("value") && this.value == null) {
|
|
198
|
+
this.value = "";
|
|
199
|
+
}
|
|
200
|
+
}
|
|
201
|
+
updated(changedProperties) {
|
|
202
|
+
super.updated(changedProperties);
|
|
203
|
+
const nativeSelect = this.getContentContainer();
|
|
204
|
+
if (!nativeSelect) {
|
|
205
|
+
return;
|
|
206
|
+
}
|
|
207
|
+
if (this.value !== "" && nativeSelect.value !== this.value) {
|
|
208
|
+
nativeSelect.value = this.value;
|
|
209
|
+
}
|
|
210
|
+
if (this.value === "" && !this.hasAttribute("value")) {
|
|
211
|
+
const nativeValue = nativeSelect.value ?? "";
|
|
212
|
+
if (nativeValue !== "" && nativeValue !== this.value) {
|
|
213
|
+
this.updateComplete.then(() => {
|
|
214
|
+
if (this.value === "" && !this.hasAttribute("value")) {
|
|
215
|
+
this.value = nativeValue;
|
|
186
216
|
}
|
|
187
217
|
});
|
|
188
|
-
return;
|
|
189
|
-
}
|
|
190
|
-
if (isSelectableContent(node)) {
|
|
191
|
-
nextProjectedOptions.push(node);
|
|
192
218
|
}
|
|
193
|
-
});
|
|
194
|
-
const hasChanged = nextProjectedOptions.length !== this.projectedOptions.length || nextProjectedOptions.some((node, index) => node !== this.projectedOptions[index]);
|
|
195
|
-
if (hasChanged) {
|
|
196
|
-
this.projectedOptions = nextProjectedOptions;
|
|
197
219
|
}
|
|
198
|
-
return hasChanged;
|
|
199
220
|
}
|
|
200
|
-
|
|
201
|
-
return
|
|
221
|
+
get selectClasses() {
|
|
222
|
+
return spectreUi.getInputClasses({
|
|
223
|
+
fullWidth: this.fullWidth,
|
|
224
|
+
pill: this.pill,
|
|
225
|
+
size: this.size,
|
|
226
|
+
state: this.isDisabled ? this.disabled ? "disabled" : "loading" : this.invalid ? "error" : this.success ? "success" : "default"
|
|
227
|
+
});
|
|
228
|
+
}
|
|
229
|
+
get isDisabled() {
|
|
230
|
+
return this.disabled || this.loading;
|
|
202
231
|
}
|
|
203
232
|
handleInput(event) {
|
|
204
233
|
const select = event.currentTarget;
|
|
@@ -209,10 +238,10 @@ var SpectreSelectElement = class extends lit.LitElement {
|
|
|
209
238
|
this.value = select.value;
|
|
210
239
|
}
|
|
211
240
|
focus(options) {
|
|
212
|
-
this.
|
|
241
|
+
this.getContentContainer()?.focus(options);
|
|
213
242
|
}
|
|
214
243
|
blur() {
|
|
215
|
-
this.
|
|
244
|
+
this.getContentContainer()?.blur();
|
|
216
245
|
}
|
|
217
246
|
render() {
|
|
218
247
|
return lit.html`
|
|
@@ -222,10 +251,12 @@ var SpectreSelectElement = class extends lit.LitElement {
|
|
|
222
251
|
aria-invalid=${ifDefined_js.ifDefined(this.invalid ? "true" : void 0)}
|
|
223
252
|
aria-label=${ifDefined_js.ifDefined(this.forwardedAriaLabel)}
|
|
224
253
|
aria-labelledby=${ifDefined_js.ifDefined(this.forwardedAriaLabelledBy)}
|
|
254
|
+
autocomplete=${ifDefined_js.ifDefined(this.autocomplete)}
|
|
225
255
|
?autofocus=${this.autofocus}
|
|
226
256
|
class=${this.selectClasses}
|
|
227
257
|
data-sp-select-native
|
|
228
258
|
?disabled=${this.isDisabled}
|
|
259
|
+
form=${ifDefined_js.ifDefined(this.form)}
|
|
229
260
|
id=${ifDefined_js.ifDefined(this.id || void 0)}
|
|
230
261
|
name=${ifDefined_js.ifDefined(this.name)}
|
|
231
262
|
?required=${this.required}
|
|
@@ -234,21 +265,20 @@ var SpectreSelectElement = class extends lit.LitElement {
|
|
|
234
265
|
@change=${this.handleChange}
|
|
235
266
|
@input=${this.handleInput}
|
|
236
267
|
>
|
|
237
|
-
${this.
|
|
268
|
+
${this.hasProjectedContent ? this.projectedContent : lit.nothing}
|
|
238
269
|
</select>
|
|
239
270
|
`;
|
|
240
271
|
}
|
|
241
272
|
};
|
|
242
273
|
SpectreSelectElement.properties = {
|
|
243
|
-
|
|
244
|
-
ariaLabelledBy: { attribute: "aria-labelledby", type: String },
|
|
245
|
-
ariaDescribedBy: { attribute: "aria-describedby", type: String },
|
|
274
|
+
autocomplete: { type: String, reflect: true },
|
|
246
275
|
autofocus: { type: Boolean, reflect: true },
|
|
247
276
|
disabled: { type: Boolean, reflect: true },
|
|
277
|
+
form: { type: String },
|
|
248
278
|
fullWidth: { attribute: "full-width", type: Boolean, reflect: true },
|
|
249
279
|
invalid: { type: Boolean, reflect: true },
|
|
250
280
|
loading: { type: Boolean, reflect: true },
|
|
251
|
-
name: { type: String },
|
|
281
|
+
name: { type: String, reflect: true },
|
|
252
282
|
pill: { type: Boolean, reflect: true },
|
|
253
283
|
required: { type: Boolean, reflect: true },
|
|
254
284
|
size: { type: String, reflect: true },
|
|
@@ -267,6 +297,5 @@ function defineSpectreSelect(tagName = "sp-select") {
|
|
|
267
297
|
|
|
268
298
|
exports.SpectreSelectElement = SpectreSelectElement;
|
|
269
299
|
exports.defineSpectreSelect = defineSpectreSelect;
|
|
270
|
-
exports.spectreSelectSizes = spectreSelectSizes;
|
|
271
300
|
//# sourceMappingURL=select.cjs.map
|
|
272
301
|
//# sourceMappingURL=select.cjs.map
|
package/dist/select.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/select/sp-select.ts"],"names":["LitElement","getInputClasses","html","ifDefined","live","nothing"],"mappings":"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","file":"select.cjs","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { live } from 'lit/directives/live.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport {\n getInputClasses,\n type InputSize,\n} from '@phcdevworks/spectre-ui';\n\nexport const spectreSelectSizes = ['sm', 'md', 'lg'] as const;\n\nexport type SpectreSelectSize = (typeof spectreSelectSizes)[number];\n\nexport interface SpectreSelectProps {\n autofocus?: boolean;\n disabled?: boolean;\n fullWidth?: boolean;\n invalid?: boolean;\n loading?: boolean;\n name?: string;\n pill?: boolean;\n required?: boolean;\n size?: SpectreSelectSize;\n success?: boolean;\n title?: string;\n value?: string;\n}\n\nfunction isSelectSize(value: string): value is InputSize {\n return (spectreSelectSizes as readonly string[]).includes(value);\n}\n\nfunction isSelectableContent(node: Node): boolean {\n if (node.nodeType === Node.ELEMENT_NODE) {\n const tagName = (node as Element).tagName;\n return tagName === 'OPTION' || tagName === 'OPTGROUP';\n }\n\n if (node.nodeType === Node.TEXT_NODE) {\n return (node.textContent?.trim().length ?? 0) > 0;\n }\n\n return false;\n}\n\nexport class SpectreSelectElement extends LitElement implements SpectreSelectProps {\n static properties = {\n ariaLabel: { attribute: 'aria-label', type: String },\n ariaLabelledBy: { attribute: 'aria-labelledby', type: String },\n ariaDescribedBy: { attribute: 'aria-describedby', type: String },\n autofocus: { type: Boolean, reflect: true },\n disabled: { type: Boolean, reflect: true },\n fullWidth: { attribute: 'full-width', type: Boolean, reflect: true },\n invalid: { type: Boolean, reflect: true },\n loading: { type: Boolean, reflect: true },\n name: { type: String },\n pill: { type: Boolean, reflect: true },\n required: { type: Boolean, reflect: true },\n size: { type: String, reflect: true },\n success: { type: Boolean, reflect: true },\n title: { type: String, reflect: true },\n value: { type: String },\n };\n\n ariaLabel: string | null = null;\n ariaLabelledBy: string | null = null;\n ariaDescribedBy: string | null = null;\n autofocus = false;\n disabled = false;\n fullWidth = false;\n invalid = false;\n loading = false;\n name?: string;\n pill = false;\n required = false;\n size: SpectreSelectSize = 'md';\n success = false;\n override title = '';\n value = '';\n private _id?: string;\n private projectedOptions: Node[] = [];\n private contentObserver?: MutationObserver | undefined;\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 createRenderRoot(): this {\n // Spectre components intentionally render in light DOM so the global\n // Spectre UI styling contract can apply directly.\n return this;\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n const hostId = super.getAttribute('id');\n\n if (hostId !== null) {\n this.id = hostId;\n }\n\n this.syncProjectedOptions();\n this.startContentObserver();\n }\n\n override disconnectedCallback(): void {\n this.stopContentObserver();\n super.disconnectedCallback();\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 override willUpdate(changedProperties: Map<PropertyKey, unknown>): void {\n if (changedProperties.has('size') && !isSelectSize(this.size)) {\n this.size = 'md';\n }\n\n if (changedProperties.has('value') && this.value == null) {\n this.value = '';\n }\n\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 override updated(changedProperties: Map<PropertyKey, unknown>): void {\n super.updated(changedProperties);\n\n const nativeSelect = this.nativeSelect;\n if (!nativeSelect) {\n return;\n }\n\n if (this.value !== '' && nativeSelect.value !== this.value) {\n nativeSelect.value = this.value;\n return;\n }\n\n if (this.value === '' && !this.hasAttribute('value')) {\n const nativeValue = nativeSelect.value ?? '';\n if (nativeValue !== '') {\n this.value = nativeValue;\n }\n }\n }\n\n private get selectClasses(): string {\n return getInputClasses({\n fullWidth: this.fullWidth,\n pill: this.pill,\n size: this.size,\n state: this.isDisabled\n ? this.disabled\n ? 'disabled'\n : 'loading'\n : this.invalid\n ? 'error'\n : this.success\n ? 'success'\n : 'default',\n });\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.loading;\n }\n\n private get nativeSelect(): HTMLSelectElement | null {\n return this.querySelector('[data-sp-select-native]');\n }\n\n private get forwardedAriaLabel(): string | undefined {\n const ariaLabel = this.ariaLabel?.trim();\n return ariaLabel ? ariaLabel : undefined;\n }\n\n private get forwardedAriaLabelledBy(): string | undefined {\n const ariaLabelledBy = this.ariaLabelledBy?.trim();\n return ariaLabelledBy ? ariaLabelledBy : undefined;\n }\n\n private get forwardedAriaDescribedBy(): string | undefined {\n const ariaDescribedBy = this.ariaDescribedBy?.trim();\n return ariaDescribedBy ? ariaDescribedBy : undefined;\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 return (\n Array.from(mutation.removedNodes).every(\n (node) => this.isInternalSelectNode(node) || this.contains(node),\n ) &&\n Array.from(mutation.addedNodes).every((node) => this.isInternalSelectNode(node))\n );\n });\n\n if (isInternalMovement) {\n return;\n }\n\n if (this.syncProjectedOptions()) {\n this.requestUpdate();\n }\n });\n\n this.contentObserver.observe(this, {\n childList: true,\n });\n }\n\n private stopContentObserver(): void {\n this.contentObserver?.disconnect();\n this.contentObserver = undefined;\n }\n\n private syncProjectedOptions(): boolean {\n const nextProjectedOptions: Node[] = [];\n\n Array.from(this.childNodes).forEach((node) => {\n if (this.isInternalSelectNode(node)) {\n this.projectedOptions.forEach((projectedNode) => {\n if (projectedNode.parentNode !== this && this.contains(projectedNode)) {\n nextProjectedOptions.push(projectedNode);\n }\n });\n return;\n }\n\n if (isSelectableContent(node)) {\n nextProjectedOptions.push(node);\n }\n });\n\n const hasChanged =\n nextProjectedOptions.length !== this.projectedOptions.length ||\n nextProjectedOptions.some((node, index) => node !== this.projectedOptions[index]);\n\n if (hasChanged) {\n this.projectedOptions = nextProjectedOptions;\n }\n\n return hasChanged;\n }\n\n private isInternalSelectNode(node: Node): boolean {\n return (\n node.nodeType === Node.ELEMENT_NODE && (node as Element).hasAttribute('data-sp-select-native')\n );\n }\n\n private handleInput(event: Event): void {\n const select = event.currentTarget as HTMLSelectElement;\n this.value = select.value;\n }\n\n private handleChange(event: Event): void {\n const select = event.currentTarget as HTMLSelectElement;\n this.value = select.value;\n }\n\n override focus(options?: FocusOptions): void {\n this.nativeSelect?.focus(options);\n }\n\n override blur(): void {\n this.nativeSelect?.blur();\n }\n\n\n override render() {\n return html`\n <select\n aria-busy=${this.loading ? 'true' : 'false'}\n aria-describedby=${ifDefined(this.forwardedAriaDescribedBy)}\n aria-invalid=${ifDefined(this.invalid ? 'true' : undefined)}\n aria-label=${ifDefined(this.forwardedAriaLabel)}\n aria-labelledby=${ifDefined(this.forwardedAriaLabelledBy)}\n ?autofocus=${this.autofocus}\n class=${this.selectClasses}\n data-sp-select-native\n ?disabled=${this.isDisabled}\n id=${ifDefined(this.id || undefined)}\n name=${ifDefined(this.name)}\n ?required=${this.required}\n title=${ifDefined(this.title || undefined)}\n .value=${live(this.value)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n >\n ${this.projectedOptions.length > 0 ? this.projectedOptions : nothing}\n </select>\n `;\n }\n}\n\nexport function defineSpectreSelect(tagName = 'sp-select'): typeof SpectreSelectElement {\n const existingElement = customElements.get(tagName);\n\n if (existingElement) {\n return existingElement as unknown as typeof SpectreSelectElement;\n }\n\n customElements.define(tagName, SpectreSelectElement);\n return SpectreSelectElement;\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/utils/base.ts","../src/utils/dom.ts","../src/utils/projectable.ts","../src/utils/form.ts","../src/components/select/sp-select.ts"],"names":["LitElement","getInputClasses","html","ifDefined","live","nothing"],"mappings":"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","file":"select.cjs","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 { type InputSize } from '@phcdevworks/spectre-ui';\n\nexport const spectreInputSizes = ['sm', 'md', 'lg'] as const;\nexport type SpectreInputSize = (typeof spectreInputSizes)[number];\n\nexport function isInputSize(value: string): value is InputSize {\n return (spectreInputSizes as readonly string[]).includes(value);\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: string): value is SpectreInputType {\n return (spectreInputTypes as readonly string[]).includes(value);\n}\n","import { html, nothing } from 'lit';\nimport { live } from 'lit/directives/live.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { SpectreProjectableElement } from '../../utils/projectable';\nimport { isInputSize, type SpectreInputSize } from '../../utils/form';\n\nimport { getInputClasses } from '@phcdevworks/spectre-ui';\n\nexport interface SpectreSelectProps {\n ariaLabel?: string | null;\n ariaLabelledBy?: string | null;\n ariaDescribedBy?: string | null;\n autocomplete?: string;\n autofocus?: boolean;\n disabled?: boolean;\n form?: string;\n fullWidth?: boolean;\n invalid?: boolean;\n loading?: boolean;\n name?: string;\n pill?: boolean;\n required?: boolean;\n size?: SpectreInputSize;\n success?: boolean;\n title?: string;\n value?: string;\n}\n\nexport class SpectreSelectElement extends SpectreProjectableElement implements SpectreSelectProps {\n static properties = {\n autocomplete: { type: String, reflect: true },\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 invalid: { type: Boolean, reflect: true },\n loading: { type: Boolean, reflect: true },\n name: { type: String, reflect: true },\n pill: { type: Boolean, reflect: true },\n required: { type: Boolean, reflect: true },\n size: { type: String, reflect: true },\n success: { type: Boolean, reflect: true },\n title: { type: String, reflect: true },\n value: { type: String },\n };\n\n autocomplete?: string;\n autofocus = false;\n disabled = false;\n form?: string;\n fullWidth = false;\n invalid = false;\n loading = false;\n name?: string;\n pill = false;\n required = false;\n size: SpectreInputSize = 'md';\n success = false;\n override title = '';\n value = '';\n\n protected override getContentContainer(): Element | null {\n return this.querySelector('[data-sp-select-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 el.hasAttribute('data-sp-select-native');\n }\n\n protected override willUpdate(changedProperties: Map<PropertyKey, unknown>): void {\n if (changedProperties.has('size') && !isInputSize(this.size)) {\n this.size = 'md';\n }\n\n if (changedProperties.has('value') && this.value == null) {\n this.value = '';\n }\n }\n\n protected override updated(changedProperties: Map<PropertyKey, unknown>): void {\n super.updated(changedProperties);\n\n const nativeSelect = this.getContentContainer() as HTMLSelectElement | null;\n if (!nativeSelect) {\n return;\n }\n\n if (this.value !== '' && nativeSelect.value !== this.value) {\n nativeSelect.value = this.value;\n }\n\n if (this.value === '' && !this.hasAttribute('value')) {\n const nativeValue = nativeSelect.value ?? '';\n if (nativeValue !== '' && nativeValue !== this.value) {\n this.updateComplete.then(() => {\n if (this.value === '' && !this.hasAttribute('value')) {\n this.value = nativeValue;\n }\n });\n }\n }\n }\n\n private get selectClasses(): string {\n return getInputClasses({\n fullWidth: this.fullWidth,\n pill: this.pill,\n size: this.size,\n state: this.isDisabled\n ? this.disabled\n ? 'disabled'\n : 'loading'\n : this.invalid\n ? 'error'\n : this.success\n ? 'success'\n : 'default',\n });\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.loading;\n }\n\n private handleInput(event: Event): void {\n const select = event.currentTarget as HTMLSelectElement;\n this.value = select.value;\n }\n\n private handleChange(event: Event): void {\n const select = event.currentTarget as HTMLSelectElement;\n this.value = select.value;\n }\n\n override focus(options?: FocusOptions): void {\n (this.getContentContainer() as HTMLSelectElement | null)?.focus(options);\n }\n\n override blur(): void {\n (this.getContentContainer() as HTMLSelectElement | null)?.blur();\n }\n\n override render() {\n return html`\n <select\n aria-busy=${this.loading ? 'true' : 'false'}\n aria-describedby=${ifDefined(this.forwardedAriaDescribedBy)}\n aria-invalid=${ifDefined(this.invalid ? 'true' : undefined)}\n aria-label=${ifDefined(this.forwardedAriaLabel)}\n aria-labelledby=${ifDefined(this.forwardedAriaLabelledBy)}\n autocomplete=${ifDefined(this.autocomplete)}\n ?autofocus=${this.autofocus}\n class=${this.selectClasses}\n data-sp-select-native\n ?disabled=${this.isDisabled}\n form=${ifDefined(this.form)}\n id=${ifDefined(this.id || undefined)}\n name=${ifDefined(this.name)}\n ?required=${this.required}\n title=${ifDefined(this.title || undefined)}\n .value=${live(this.value)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n >\n ${this.hasProjectedContent ? this.projectedContent : nothing}\n </select>\n `;\n }\n}\n\nexport function defineSpectreSelect(tagName = 'sp-select'): typeof SpectreSelectElement {\n const existingElement = customElements.get(tagName);\n\n if (existingElement) {\n return existingElement as unknown as typeof SpectreSelectElement;\n }\n\n customElements.define(tagName, SpectreSelectElement);\n return SpectreSelectElement;\n}\n"]}
|
package/dist/select.d.cts
CHANGED
|
@@ -1,35 +1,33 @@
|
|
|
1
1
|
import * as lit_html from 'lit-html';
|
|
2
|
-
import {
|
|
2
|
+
import { S as SpectreProjectableElement } from './projectable-DcnBRiko.cjs';
|
|
3
|
+
import { S as SpectreInputSize } from './form-iI7vV-3W.cjs';
|
|
4
|
+
import './base-DQtCQ-dP.cjs';
|
|
5
|
+
import 'lit';
|
|
3
6
|
|
|
4
|
-
declare const spectreSelectSizes: readonly ["sm", "md", "lg"];
|
|
5
|
-
type SpectreSelectSize = (typeof spectreSelectSizes)[number];
|
|
6
7
|
interface SpectreSelectProps {
|
|
8
|
+
ariaLabel?: string | null;
|
|
9
|
+
ariaLabelledBy?: string | null;
|
|
10
|
+
ariaDescribedBy?: string | null;
|
|
11
|
+
autocomplete?: string;
|
|
7
12
|
autofocus?: boolean;
|
|
8
13
|
disabled?: boolean;
|
|
14
|
+
form?: string;
|
|
9
15
|
fullWidth?: boolean;
|
|
10
16
|
invalid?: boolean;
|
|
11
17
|
loading?: boolean;
|
|
12
18
|
name?: string;
|
|
13
19
|
pill?: boolean;
|
|
14
20
|
required?: boolean;
|
|
15
|
-
size?:
|
|
21
|
+
size?: SpectreInputSize;
|
|
16
22
|
success?: boolean;
|
|
17
23
|
title?: string;
|
|
18
24
|
value?: string;
|
|
19
25
|
}
|
|
20
|
-
declare class SpectreSelectElement extends
|
|
26
|
+
declare class SpectreSelectElement extends SpectreProjectableElement implements SpectreSelectProps {
|
|
21
27
|
static properties: {
|
|
22
|
-
|
|
23
|
-
attribute: string;
|
|
24
|
-
type: StringConstructor;
|
|
25
|
-
};
|
|
26
|
-
ariaLabelledBy: {
|
|
27
|
-
attribute: string;
|
|
28
|
-
type: StringConstructor;
|
|
29
|
-
};
|
|
30
|
-
ariaDescribedBy: {
|
|
31
|
-
attribute: string;
|
|
28
|
+
autocomplete: {
|
|
32
29
|
type: StringConstructor;
|
|
30
|
+
reflect: boolean;
|
|
33
31
|
};
|
|
34
32
|
autofocus: {
|
|
35
33
|
type: BooleanConstructor;
|
|
@@ -39,6 +37,9 @@ declare class SpectreSelectElement extends LitElement implements SpectreSelectPr
|
|
|
39
37
|
type: BooleanConstructor;
|
|
40
38
|
reflect: boolean;
|
|
41
39
|
};
|
|
40
|
+
form: {
|
|
41
|
+
type: StringConstructor;
|
|
42
|
+
};
|
|
42
43
|
fullWidth: {
|
|
43
44
|
attribute: string;
|
|
44
45
|
type: BooleanConstructor;
|
|
@@ -54,6 +55,7 @@ declare class SpectreSelectElement extends LitElement implements SpectreSelectPr
|
|
|
54
55
|
};
|
|
55
56
|
name: {
|
|
56
57
|
type: StringConstructor;
|
|
58
|
+
reflect: boolean;
|
|
57
59
|
};
|
|
58
60
|
pill: {
|
|
59
61
|
type: BooleanConstructor;
|
|
@@ -79,46 +81,26 @@ declare class SpectreSelectElement extends LitElement implements SpectreSelectPr
|
|
|
79
81
|
type: StringConstructor;
|
|
80
82
|
};
|
|
81
83
|
};
|
|
82
|
-
|
|
83
|
-
ariaLabelledBy: string | null;
|
|
84
|
-
ariaDescribedBy: string | null;
|
|
84
|
+
autocomplete?: string;
|
|
85
85
|
autofocus: boolean;
|
|
86
86
|
disabled: boolean;
|
|
87
|
+
form?: string;
|
|
87
88
|
fullWidth: boolean;
|
|
88
89
|
invalid: boolean;
|
|
89
90
|
loading: boolean;
|
|
90
91
|
name?: string;
|
|
91
92
|
pill: boolean;
|
|
92
93
|
required: boolean;
|
|
93
|
-
size:
|
|
94
|
+
size: SpectreInputSize;
|
|
94
95
|
success: boolean;
|
|
95
96
|
title: string;
|
|
96
97
|
value: string;
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
private contentObserver?;
|
|
100
|
-
get id(): string;
|
|
101
|
-
set id(value: string);
|
|
102
|
-
createRenderRoot(): this;
|
|
103
|
-
connectedCallback(): void;
|
|
104
|
-
disconnectedCallback(): void;
|
|
105
|
-
getAttribute(qualifiedName: string): string | null;
|
|
106
|
-
hasAttribute(qualifiedName: string): boolean;
|
|
107
|
-
setAttribute(qualifiedName: string, value: string): void;
|
|
108
|
-
removeAttribute(qualifiedName: string): void;
|
|
98
|
+
protected getContentContainer(): Element | null;
|
|
99
|
+
protected isInternalNode(node: Node): boolean;
|
|
109
100
|
protected willUpdate(changedProperties: Map<PropertyKey, unknown>): void;
|
|
110
|
-
protected update(changedProperties: Map<PropertyKey, unknown>): void;
|
|
111
101
|
protected updated(changedProperties: Map<PropertyKey, unknown>): void;
|
|
112
102
|
private get selectClasses();
|
|
113
103
|
private get isDisabled();
|
|
114
|
-
private get nativeSelect();
|
|
115
|
-
private get forwardedAriaLabel();
|
|
116
|
-
private get forwardedAriaLabelledBy();
|
|
117
|
-
private get forwardedAriaDescribedBy();
|
|
118
|
-
private startContentObserver;
|
|
119
|
-
private stopContentObserver;
|
|
120
|
-
private syncProjectedOptions;
|
|
121
|
-
private isInternalSelectNode;
|
|
122
104
|
private handleInput;
|
|
123
105
|
private handleChange;
|
|
124
106
|
focus(options?: FocusOptions): void;
|
|
@@ -127,4 +109,4 @@ declare class SpectreSelectElement extends LitElement implements SpectreSelectPr
|
|
|
127
109
|
}
|
|
128
110
|
declare function defineSpectreSelect(tagName?: string): typeof SpectreSelectElement;
|
|
129
111
|
|
|
130
|
-
export { SpectreSelectElement, type SpectreSelectProps,
|
|
112
|
+
export { SpectreSelectElement, type SpectreSelectProps, defineSpectreSelect };
|