@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/input.cjs
CHANGED
|
@@ -6,46 +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/input/sp-input.ts
|
|
9
|
-
var
|
|
10
|
-
"text",
|
|
11
|
-
"email",
|
|
12
|
-
"password",
|
|
13
|
-
"search",
|
|
14
|
-
"tel",
|
|
15
|
-
"url",
|
|
16
|
-
"number",
|
|
17
|
-
"date",
|
|
18
|
-
"datetime-local",
|
|
19
|
-
"month",
|
|
20
|
-
"time",
|
|
21
|
-
"week"
|
|
22
|
-
];
|
|
23
|
-
var spectreInputSizes = ["sm", "md", "lg"];
|
|
24
|
-
function isInputType(value) {
|
|
25
|
-
return spectreInputTypes.includes(value);
|
|
26
|
-
}
|
|
27
|
-
function isInputSize(value) {
|
|
28
|
-
return spectreInputSizes.includes(value);
|
|
29
|
-
}
|
|
30
|
-
var SpectreInputElement = class extends lit.LitElement {
|
|
9
|
+
var SpectreBaseElement = class extends lit.LitElement {
|
|
31
10
|
constructor() {
|
|
32
11
|
super(...arguments);
|
|
33
12
|
this.ariaLabel = null;
|
|
34
13
|
this.ariaLabelledBy = null;
|
|
35
14
|
this.ariaDescribedBy = null;
|
|
36
|
-
this.autofocus = false;
|
|
37
|
-
this.disabled = false;
|
|
38
|
-
this.fullWidth = false;
|
|
39
|
-
this.invalid = false;
|
|
40
|
-
this.loading = false;
|
|
41
|
-
this.pill = false;
|
|
42
|
-
this.readonly = false;
|
|
43
|
-
this.required = false;
|
|
44
|
-
this.size = "md";
|
|
45
|
-
this.success = false;
|
|
46
|
-
this.title = "";
|
|
47
|
-
this.type = "text";
|
|
48
|
-
this.value = "";
|
|
49
15
|
}
|
|
50
16
|
get id() {
|
|
51
17
|
return this._id ?? "";
|
|
@@ -61,6 +27,8 @@ var SpectreInputElement = class extends lit.LitElement {
|
|
|
61
27
|
}
|
|
62
28
|
this.requestUpdate();
|
|
63
29
|
}
|
|
30
|
+
// Spectre components intentionally render in light DOM so the global
|
|
31
|
+
// `@phcdevworks/spectre-ui` styling contract can apply directly.
|
|
64
32
|
createRenderRoot() {
|
|
65
33
|
return this;
|
|
66
34
|
}
|
|
@@ -97,6 +65,62 @@ var SpectreInputElement = class extends lit.LitElement {
|
|
|
97
65
|
}
|
|
98
66
|
super.removeAttribute(qualifiedName);
|
|
99
67
|
}
|
|
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
|
+
var spectreInputSizes = ["sm", "md", "lg"];
|
|
87
|
+
function isInputSize(value) {
|
|
88
|
+
return spectreInputSizes.includes(value);
|
|
89
|
+
}
|
|
90
|
+
var spectreInputTypes = [
|
|
91
|
+
"text",
|
|
92
|
+
"email",
|
|
93
|
+
"password",
|
|
94
|
+
"search",
|
|
95
|
+
"tel",
|
|
96
|
+
"url",
|
|
97
|
+
"number",
|
|
98
|
+
"date",
|
|
99
|
+
"datetime-local",
|
|
100
|
+
"month",
|
|
101
|
+
"time",
|
|
102
|
+
"week"
|
|
103
|
+
];
|
|
104
|
+
function isInputType(value) {
|
|
105
|
+
return spectreInputTypes.includes(value);
|
|
106
|
+
}
|
|
107
|
+
var SpectreInputElement = class extends SpectreBaseElement {
|
|
108
|
+
constructor() {
|
|
109
|
+
super(...arguments);
|
|
110
|
+
this.autofocus = false;
|
|
111
|
+
this.disabled = false;
|
|
112
|
+
this.fullWidth = false;
|
|
113
|
+
this.invalid = false;
|
|
114
|
+
this.loading = false;
|
|
115
|
+
this.pill = false;
|
|
116
|
+
this.readonly = false;
|
|
117
|
+
this.required = false;
|
|
118
|
+
this.size = "md";
|
|
119
|
+
this.success = false;
|
|
120
|
+
this.title = "";
|
|
121
|
+
this.type = "text";
|
|
122
|
+
this.value = "";
|
|
123
|
+
}
|
|
100
124
|
willUpdate(changedProperties) {
|
|
101
125
|
if (changedProperties.has("size") && !isInputSize(this.size)) {
|
|
102
126
|
this.size = "md";
|
|
@@ -132,18 +156,6 @@ var SpectreInputElement = class extends lit.LitElement {
|
|
|
132
156
|
get nativeInput() {
|
|
133
157
|
return this.querySelector("[data-sp-input-native]");
|
|
134
158
|
}
|
|
135
|
-
get forwardedAriaLabel() {
|
|
136
|
-
const ariaLabel = this.ariaLabel?.trim();
|
|
137
|
-
return ariaLabel ? ariaLabel : void 0;
|
|
138
|
-
}
|
|
139
|
-
get forwardedAriaLabelledBy() {
|
|
140
|
-
const ariaLabelledBy = this.ariaLabelledBy?.trim();
|
|
141
|
-
return ariaLabelledBy ? ariaLabelledBy : void 0;
|
|
142
|
-
}
|
|
143
|
-
get forwardedAriaDescribedBy() {
|
|
144
|
-
const ariaDescribedBy = this.ariaDescribedBy?.trim();
|
|
145
|
-
return ariaDescribedBy ? ariaDescribedBy : void 0;
|
|
146
|
-
}
|
|
147
159
|
handleInput(event) {
|
|
148
160
|
const input = event.currentTarget;
|
|
149
161
|
this.value = input.value;
|
|
@@ -171,6 +183,7 @@ var SpectreInputElement = class extends lit.LitElement {
|
|
|
171
183
|
class=${this.inputClasses}
|
|
172
184
|
data-sp-input-native
|
|
173
185
|
?disabled=${this.isDisabled}
|
|
186
|
+
form=${ifDefined_js.ifDefined(this.form)}
|
|
174
187
|
?readonly=${this.readonly}
|
|
175
188
|
?required=${this.required}
|
|
176
189
|
id=${ifDefined_js.ifDefined(this.id || void 0)}
|
|
@@ -192,27 +205,25 @@ var SpectreInputElement = class extends lit.LitElement {
|
|
|
192
205
|
}
|
|
193
206
|
};
|
|
194
207
|
SpectreInputElement.properties = {
|
|
195
|
-
|
|
196
|
-
ariaLabelledBy: { attribute: "aria-labelledby", type: String },
|
|
197
|
-
ariaDescribedBy: { attribute: "aria-describedby", type: String },
|
|
198
|
-
autocomplete: { type: String },
|
|
208
|
+
autocomplete: { type: String, reflect: true },
|
|
199
209
|
autofocus: { type: Boolean, reflect: true },
|
|
200
210
|
disabled: { type: Boolean, reflect: true },
|
|
211
|
+
form: { type: String },
|
|
201
212
|
fullWidth: { attribute: "full-width", type: Boolean, reflect: true },
|
|
202
|
-
inputmode: { type: String },
|
|
213
|
+
inputmode: { type: String, reflect: true },
|
|
203
214
|
invalid: { type: Boolean, reflect: true },
|
|
204
215
|
loading: { type: Boolean, reflect: true },
|
|
205
|
-
max: { type: String },
|
|
206
|
-
maxlength: { type: Number },
|
|
207
|
-
min: { type: String },
|
|
208
|
-
minlength: { type: Number },
|
|
209
|
-
name: { type: String },
|
|
216
|
+
max: { type: String, reflect: true },
|
|
217
|
+
maxlength: { type: Number, reflect: true },
|
|
218
|
+
min: { type: String, reflect: true },
|
|
219
|
+
minlength: { type: Number, reflect: true },
|
|
220
|
+
name: { type: String, reflect: true },
|
|
210
221
|
pill: { type: Boolean, reflect: true },
|
|
211
|
-
placeholder: { type: String },
|
|
222
|
+
placeholder: { type: String, reflect: true },
|
|
212
223
|
readonly: { type: Boolean, reflect: true },
|
|
213
224
|
required: { type: Boolean, reflect: true },
|
|
214
225
|
size: { type: String, reflect: true },
|
|
215
|
-
step: { type: String },
|
|
226
|
+
step: { type: String, reflect: true },
|
|
216
227
|
success: { type: Boolean, reflect: true },
|
|
217
228
|
title: { type: String, reflect: true },
|
|
218
229
|
type: { type: String, reflect: true },
|
package/dist/input.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/input/sp-input.ts"],"names":["LitElement","getInputClasses","html","ifDefined","live"],"mappings":"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","file":"input.cjs","sourcesContent":["import { LitElement, html } 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 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 const spectreInputSizes = ['sm', 'md', 'lg'] as const;\n\nexport type SpectreInputType = (typeof spectreInputTypes)[number];\nexport type SpectreInputSize = (typeof spectreInputSizes)[number];\n\nexport interface SpectreInputProps {\n autocomplete?: string;\n autofocus?: boolean;\n disabled?: boolean;\n fullWidth?: boolean;\n inputmode?: string;\n invalid?: boolean;\n loading?: boolean;\n max?: string;\n maxlength?: number | undefined;\n min?: string;\n minlength?: number | undefined;\n name?: string;\n pill?: boolean;\n placeholder?: string;\n readonly?: boolean;\n required?: boolean;\n size?: SpectreInputSize;\n step?: string;\n success?: boolean;\n title?: string;\n type?: SpectreInputType;\n value?: string;\n}\n\nfunction isInputType(value: string): value is SpectreInputType {\n return (spectreInputTypes as readonly string[]).includes(value);\n}\n\nexport function isInputSize(value: string): value is InputSize {\n return (spectreInputSizes as readonly string[]).includes(value);\n}\n\nexport class SpectreInputElement extends LitElement implements SpectreInputProps {\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 autocomplete: { type: String },\n autofocus: { type: Boolean, reflect: true },\n disabled: { type: Boolean, reflect: true },\n fullWidth: { attribute: 'full-width', type: Boolean, reflect: true },\n inputmode: { type: String },\n invalid: { type: Boolean, reflect: true },\n loading: { type: Boolean, reflect: true },\n max: { type: String },\n maxlength: { type: Number },\n min: { type: String },\n minlength: { type: Number },\n name: { type: String },\n pill: { type: Boolean, reflect: true },\n placeholder: { type: String },\n readonly: { type: Boolean, reflect: true },\n required: { type: Boolean, reflect: true },\n size: { type: String, reflect: true },\n step: { type: String },\n success: { type: Boolean, reflect: true },\n title: { type: String, reflect: true },\n type: { 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 autocomplete?: string;\n autofocus = false;\n disabled = false;\n fullWidth = false;\n inputmode?: string;\n invalid = false;\n loading = false;\n max?: string;\n maxlength?: number | undefined;\n min?: string;\n minlength?: number | undefined;\n name?: string;\n pill = false;\n placeholder?: string;\n readonly = false;\n required = false;\n size: SpectreInputSize = 'md';\n step?: string;\n success = false;\n override title = '';\n type: SpectreInputType = 'text';\n value = '';\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 createRenderRoot(): this {\n // Spectre components intentionally render in light DOM so the global\n // `@phcdevworks/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\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') && !isInputSize(this.size)) {\n this.size = 'md';\n }\n\n if (changedProperties.has('type') && !isInputType(this.type)) {\n this.type = 'text';\n }\n\n if (changedProperties.has('value') && this.value == null) {\n this.value = '';\n }\n\n if (changedProperties.has('maxlength')) {\n if (\n this.maxlength == null ||\n !Number.isInteger(this.maxlength) ||\n this.maxlength < 0\n ) {\n this.maxlength = undefined;\n }\n }\n\n if (changedProperties.has('minlength')) {\n if (\n this.minlength == null ||\n !Number.isInteger(this.minlength) ||\n this.minlength < 0\n ) {\n this.minlength = undefined;\n }\n }\n }\n\n private get inputClasses(): 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 nativeInput(): HTMLInputElement | null {\n return this.querySelector('[data-sp-input-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 handleInput(event: Event): void {\n const input = event.currentTarget as HTMLInputElement;\n this.value = input.value;\n }\n\n private handleChange(event: Event): void {\n const input = event.currentTarget as HTMLInputElement;\n this.value = input.value;\n }\n\n override focus(options?: FocusOptions): void {\n this.nativeInput?.focus(options);\n }\n\n override blur(): void {\n this.nativeInput?.blur();\n }\n\n override render() {\n return html`\n <input\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.inputClasses}\n data-sp-input-native\n ?disabled=${this.isDisabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n id=${ifDefined(this.id || undefined)}\n inputmode=${ifDefined(this.inputmode)}\n max=${ifDefined(this.max)}\n maxlength=${ifDefined(this.maxlength)}\n min=${ifDefined(this.min)}\n minlength=${ifDefined(this.minlength)}\n name=${ifDefined(this.name)}\n placeholder=${ifDefined(this.placeholder)}\n step=${ifDefined(this.step)}\n title=${ifDefined(this.title || undefined)}\n type=${this.type}\n .value=${live(this.value)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n />\n `;\n }\n}\n\nexport function defineSpectreInput(tagName = 'sp-input'): typeof SpectreInputElement {\n const existingElement = customElements.get(tagName);\n\n if (existingElement) {\n return existingElement as unknown as typeof SpectreInputElement;\n }\n\n customElements.define(tagName, SpectreInputElement);\n return SpectreInputElement;\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/utils/base.ts","../src/utils/form.ts","../src/components/input/sp-input.ts"],"names":["LitElement","getInputClasses","html","ifDefined","live"],"mappings":"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","file":"input.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","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 } from 'lit';\nimport { live } from 'lit/directives/live.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { SpectreBaseElement } from '../../utils/base';\nimport {\n spectreInputSizes,\n isInputSize,\n type SpectreInputSize,\n spectreInputTypes,\n isInputType,\n type SpectreInputType,\n} from '../../utils/form';\n\nimport { getInputClasses } from '@phcdevworks/spectre-ui';\n\nexport {\n spectreInputSizes,\n isInputSize,\n type SpectreInputSize,\n spectreInputTypes,\n isInputType,\n type SpectreInputType,\n};\n\nexport interface SpectreInputProps {\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 inputmode?: string;\n invalid?: boolean;\n loading?: boolean;\n max?: string;\n maxlength?: number | undefined;\n min?: string;\n minlength?: number | undefined;\n name?: string | undefined;\n pill?: boolean;\n placeholder?: string | undefined;\n readonly?: boolean;\n required?: boolean;\n size?: SpectreInputSize;\n step?: string;\n success?: boolean;\n title?: string;\n type?: SpectreInputType;\n value?: string;\n}\n\nexport class SpectreInputElement extends SpectreBaseElement implements SpectreInputProps {\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 inputmode: { type: String, reflect: true },\n invalid: { type: Boolean, reflect: true },\n loading: { type: Boolean, reflect: true },\n max: { type: String, reflect: true },\n maxlength: { type: Number, reflect: true },\n min: { type: String, reflect: true },\n minlength: { type: Number, reflect: true },\n name: { type: String, reflect: true },\n pill: { type: Boolean, reflect: true },\n placeholder: { type: String, reflect: true },\n readonly: { type: Boolean, reflect: true },\n required: { type: Boolean, reflect: true },\n size: { type: String, reflect: true },\n step: { type: String, reflect: true },\n success: { type: Boolean, reflect: true },\n title: { type: String, reflect: true },\n type: { 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 inputmode?: string;\n invalid = false;\n loading = false;\n max?: string;\n maxlength?: number | undefined;\n min?: string;\n minlength?: number | undefined;\n name?: string;\n pill = false;\n placeholder?: string;\n readonly = false;\n required = false;\n size: SpectreInputSize = 'md';\n step?: string;\n success = false;\n override title = '';\n type: SpectreInputType = 'text';\n value = '';\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('type') && !isInputType(this.type)) {\n this.type = 'text';\n }\n\n if (changedProperties.has('value') && this.value == null) {\n this.value = '';\n }\n\n if (changedProperties.has('maxlength')) {\n if (\n this.maxlength == null ||\n !Number.isInteger(this.maxlength) ||\n this.maxlength < 0\n ) {\n this.maxlength = undefined;\n }\n }\n\n if (changedProperties.has('minlength')) {\n if (\n this.minlength == null ||\n !Number.isInteger(this.minlength) ||\n this.minlength < 0\n ) {\n this.minlength = undefined;\n }\n }\n }\n\n private get inputClasses(): 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 nativeInput(): HTMLInputElement | null {\n return this.querySelector('[data-sp-input-native]');\n }\n\n private handleInput(event: Event): void {\n const input = event.currentTarget as HTMLInputElement;\n this.value = input.value;\n }\n\n private handleChange(event: Event): void {\n const input = event.currentTarget as HTMLInputElement;\n this.value = input.value;\n }\n\n override focus(options?: FocusOptions): void {\n this.nativeInput?.focus(options);\n }\n\n override blur(): void {\n this.nativeInput?.blur();\n }\n\n override render() {\n return html`\n <input\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.inputClasses}\n data-sp-input-native\n ?disabled=${this.isDisabled}\n form=${ifDefined(this.form)}\n ?readonly=${this.readonly}\n ?required=${this.required}\n id=${ifDefined(this.id || undefined)}\n inputmode=${ifDefined(this.inputmode)}\n max=${ifDefined(this.max)}\n maxlength=${ifDefined(this.maxlength)}\n min=${ifDefined(this.min)}\n minlength=${ifDefined(this.minlength)}\n name=${ifDefined(this.name)}\n placeholder=${ifDefined(this.placeholder)}\n step=${ifDefined(this.step)}\n title=${ifDefined(this.title || undefined)}\n type=${this.type}\n .value=${live(this.value)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n />\n `;\n }\n}\n\nexport function defineSpectreInput(tagName = 'sp-input'): typeof SpectreInputElement {\n const existingElement = customElements.get(tagName);\n\n if (existingElement) {\n return existingElement as unknown as typeof SpectreInputElement;\n }\n\n customElements.define(tagName, SpectreInputElement);\n return SpectreInputElement;\n}\n"]}
|
package/dist/input.d.cts
CHANGED
|
@@ -1,14 +1,17 @@
|
|
|
1
1
|
import * as lit_html from 'lit-html';
|
|
2
|
-
import {
|
|
2
|
+
import { S as SpectreBaseElement } from './base-DQtCQ-dP.cjs';
|
|
3
|
+
import { S as SpectreInputSize, a as SpectreInputType } from './form-iI7vV-3W.cjs';
|
|
4
|
+
export { s as spectreInputSizes, b as spectreInputTypes } from './form-iI7vV-3W.cjs';
|
|
5
|
+
import 'lit';
|
|
3
6
|
|
|
4
|
-
declare const spectreInputTypes: readonly ["text", "email", "password", "search", "tel", "url", "number", "date", "datetime-local", "month", "time", "week"];
|
|
5
|
-
declare const spectreInputSizes: readonly ["sm", "md", "lg"];
|
|
6
|
-
type SpectreInputType = (typeof spectreInputTypes)[number];
|
|
7
|
-
type SpectreInputSize = (typeof spectreInputSizes)[number];
|
|
8
7
|
interface SpectreInputProps {
|
|
8
|
+
ariaLabel?: string | null;
|
|
9
|
+
ariaLabelledBy?: string | null;
|
|
10
|
+
ariaDescribedBy?: string | null;
|
|
9
11
|
autocomplete?: string;
|
|
10
12
|
autofocus?: boolean;
|
|
11
13
|
disabled?: boolean;
|
|
14
|
+
form?: string;
|
|
12
15
|
fullWidth?: boolean;
|
|
13
16
|
inputmode?: string;
|
|
14
17
|
invalid?: boolean;
|
|
@@ -17,9 +20,9 @@ interface SpectreInputProps {
|
|
|
17
20
|
maxlength?: number | undefined;
|
|
18
21
|
min?: string;
|
|
19
22
|
minlength?: number | undefined;
|
|
20
|
-
name?: string;
|
|
23
|
+
name?: string | undefined;
|
|
21
24
|
pill?: boolean;
|
|
22
|
-
placeholder?: string;
|
|
25
|
+
placeholder?: string | undefined;
|
|
23
26
|
readonly?: boolean;
|
|
24
27
|
required?: boolean;
|
|
25
28
|
size?: SpectreInputSize;
|
|
@@ -29,22 +32,11 @@ interface SpectreInputProps {
|
|
|
29
32
|
type?: SpectreInputType;
|
|
30
33
|
value?: string;
|
|
31
34
|
}
|
|
32
|
-
declare class SpectreInputElement extends
|
|
35
|
+
declare class SpectreInputElement extends SpectreBaseElement implements SpectreInputProps {
|
|
33
36
|
static properties: {
|
|
34
|
-
ariaLabel: {
|
|
35
|
-
attribute: string;
|
|
36
|
-
type: StringConstructor;
|
|
37
|
-
};
|
|
38
|
-
ariaLabelledBy: {
|
|
39
|
-
attribute: string;
|
|
40
|
-
type: StringConstructor;
|
|
41
|
-
};
|
|
42
|
-
ariaDescribedBy: {
|
|
43
|
-
attribute: string;
|
|
44
|
-
type: StringConstructor;
|
|
45
|
-
};
|
|
46
37
|
autocomplete: {
|
|
47
38
|
type: StringConstructor;
|
|
39
|
+
reflect: boolean;
|
|
48
40
|
};
|
|
49
41
|
autofocus: {
|
|
50
42
|
type: BooleanConstructor;
|
|
@@ -54,6 +46,9 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
54
46
|
type: BooleanConstructor;
|
|
55
47
|
reflect: boolean;
|
|
56
48
|
};
|
|
49
|
+
form: {
|
|
50
|
+
type: StringConstructor;
|
|
51
|
+
};
|
|
57
52
|
fullWidth: {
|
|
58
53
|
attribute: string;
|
|
59
54
|
type: BooleanConstructor;
|
|
@@ -61,6 +56,7 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
61
56
|
};
|
|
62
57
|
inputmode: {
|
|
63
58
|
type: StringConstructor;
|
|
59
|
+
reflect: boolean;
|
|
64
60
|
};
|
|
65
61
|
invalid: {
|
|
66
62
|
type: BooleanConstructor;
|
|
@@ -72,18 +68,23 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
72
68
|
};
|
|
73
69
|
max: {
|
|
74
70
|
type: StringConstructor;
|
|
71
|
+
reflect: boolean;
|
|
75
72
|
};
|
|
76
73
|
maxlength: {
|
|
77
74
|
type: NumberConstructor;
|
|
75
|
+
reflect: boolean;
|
|
78
76
|
};
|
|
79
77
|
min: {
|
|
80
78
|
type: StringConstructor;
|
|
79
|
+
reflect: boolean;
|
|
81
80
|
};
|
|
82
81
|
minlength: {
|
|
83
82
|
type: NumberConstructor;
|
|
83
|
+
reflect: boolean;
|
|
84
84
|
};
|
|
85
85
|
name: {
|
|
86
86
|
type: StringConstructor;
|
|
87
|
+
reflect: boolean;
|
|
87
88
|
};
|
|
88
89
|
pill: {
|
|
89
90
|
type: BooleanConstructor;
|
|
@@ -91,6 +92,7 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
91
92
|
};
|
|
92
93
|
placeholder: {
|
|
93
94
|
type: StringConstructor;
|
|
95
|
+
reflect: boolean;
|
|
94
96
|
};
|
|
95
97
|
readonly: {
|
|
96
98
|
type: BooleanConstructor;
|
|
@@ -106,6 +108,7 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
106
108
|
};
|
|
107
109
|
step: {
|
|
108
110
|
type: StringConstructor;
|
|
111
|
+
reflect: boolean;
|
|
109
112
|
};
|
|
110
113
|
success: {
|
|
111
114
|
type: BooleanConstructor;
|
|
@@ -123,12 +126,10 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
123
126
|
type: StringConstructor;
|
|
124
127
|
};
|
|
125
128
|
};
|
|
126
|
-
ariaLabel: string | null;
|
|
127
|
-
ariaLabelledBy: string | null;
|
|
128
|
-
ariaDescribedBy: string | null;
|
|
129
129
|
autocomplete?: string;
|
|
130
130
|
autofocus: boolean;
|
|
131
131
|
disabled: boolean;
|
|
132
|
+
form?: string;
|
|
132
133
|
fullWidth: boolean;
|
|
133
134
|
inputmode?: string;
|
|
134
135
|
invalid: boolean;
|
|
@@ -148,22 +149,10 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
148
149
|
title: string;
|
|
149
150
|
type: SpectreInputType;
|
|
150
151
|
value: string;
|
|
151
|
-
private _id?;
|
|
152
|
-
get id(): string;
|
|
153
|
-
set id(value: string);
|
|
154
|
-
createRenderRoot(): this;
|
|
155
|
-
connectedCallback(): void;
|
|
156
|
-
getAttribute(qualifiedName: string): string | null;
|
|
157
|
-
hasAttribute(qualifiedName: string): boolean;
|
|
158
|
-
setAttribute(qualifiedName: string, value: string): void;
|
|
159
|
-
removeAttribute(qualifiedName: string): void;
|
|
160
152
|
protected willUpdate(changedProperties: Map<PropertyKey, unknown>): void;
|
|
161
153
|
private get inputClasses();
|
|
162
154
|
private get isDisabled();
|
|
163
155
|
private get nativeInput();
|
|
164
|
-
private get forwardedAriaLabel();
|
|
165
|
-
private get forwardedAriaLabelledBy();
|
|
166
|
-
private get forwardedAriaDescribedBy();
|
|
167
156
|
private handleInput;
|
|
168
157
|
private handleChange;
|
|
169
158
|
focus(options?: FocusOptions): void;
|
|
@@ -172,4 +161,4 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
172
161
|
}
|
|
173
162
|
declare function defineSpectreInput(tagName?: string): typeof SpectreInputElement;
|
|
174
163
|
|
|
175
|
-
export { SpectreInputElement, type SpectreInputProps,
|
|
164
|
+
export { SpectreInputElement, type SpectreInputProps, SpectreInputSize, SpectreInputType, defineSpectreInput };
|
package/dist/input.d.ts
CHANGED
|
@@ -1,14 +1,17 @@
|
|
|
1
1
|
import * as lit_html from 'lit-html';
|
|
2
|
-
import {
|
|
2
|
+
import { S as SpectreBaseElement } from './base-DQtCQ-dP.js';
|
|
3
|
+
import { S as SpectreInputSize, a as SpectreInputType } from './form-iI7vV-3W.js';
|
|
4
|
+
export { s as spectreInputSizes, b as spectreInputTypes } from './form-iI7vV-3W.js';
|
|
5
|
+
import 'lit';
|
|
3
6
|
|
|
4
|
-
declare const spectreInputTypes: readonly ["text", "email", "password", "search", "tel", "url", "number", "date", "datetime-local", "month", "time", "week"];
|
|
5
|
-
declare const spectreInputSizes: readonly ["sm", "md", "lg"];
|
|
6
|
-
type SpectreInputType = (typeof spectreInputTypes)[number];
|
|
7
|
-
type SpectreInputSize = (typeof spectreInputSizes)[number];
|
|
8
7
|
interface SpectreInputProps {
|
|
8
|
+
ariaLabel?: string | null;
|
|
9
|
+
ariaLabelledBy?: string | null;
|
|
10
|
+
ariaDescribedBy?: string | null;
|
|
9
11
|
autocomplete?: string;
|
|
10
12
|
autofocus?: boolean;
|
|
11
13
|
disabled?: boolean;
|
|
14
|
+
form?: string;
|
|
12
15
|
fullWidth?: boolean;
|
|
13
16
|
inputmode?: string;
|
|
14
17
|
invalid?: boolean;
|
|
@@ -17,9 +20,9 @@ interface SpectreInputProps {
|
|
|
17
20
|
maxlength?: number | undefined;
|
|
18
21
|
min?: string;
|
|
19
22
|
minlength?: number | undefined;
|
|
20
|
-
name?: string;
|
|
23
|
+
name?: string | undefined;
|
|
21
24
|
pill?: boolean;
|
|
22
|
-
placeholder?: string;
|
|
25
|
+
placeholder?: string | undefined;
|
|
23
26
|
readonly?: boolean;
|
|
24
27
|
required?: boolean;
|
|
25
28
|
size?: SpectreInputSize;
|
|
@@ -29,22 +32,11 @@ interface SpectreInputProps {
|
|
|
29
32
|
type?: SpectreInputType;
|
|
30
33
|
value?: string;
|
|
31
34
|
}
|
|
32
|
-
declare class SpectreInputElement extends
|
|
35
|
+
declare class SpectreInputElement extends SpectreBaseElement implements SpectreInputProps {
|
|
33
36
|
static properties: {
|
|
34
|
-
ariaLabel: {
|
|
35
|
-
attribute: string;
|
|
36
|
-
type: StringConstructor;
|
|
37
|
-
};
|
|
38
|
-
ariaLabelledBy: {
|
|
39
|
-
attribute: string;
|
|
40
|
-
type: StringConstructor;
|
|
41
|
-
};
|
|
42
|
-
ariaDescribedBy: {
|
|
43
|
-
attribute: string;
|
|
44
|
-
type: StringConstructor;
|
|
45
|
-
};
|
|
46
37
|
autocomplete: {
|
|
47
38
|
type: StringConstructor;
|
|
39
|
+
reflect: boolean;
|
|
48
40
|
};
|
|
49
41
|
autofocus: {
|
|
50
42
|
type: BooleanConstructor;
|
|
@@ -54,6 +46,9 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
54
46
|
type: BooleanConstructor;
|
|
55
47
|
reflect: boolean;
|
|
56
48
|
};
|
|
49
|
+
form: {
|
|
50
|
+
type: StringConstructor;
|
|
51
|
+
};
|
|
57
52
|
fullWidth: {
|
|
58
53
|
attribute: string;
|
|
59
54
|
type: BooleanConstructor;
|
|
@@ -61,6 +56,7 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
61
56
|
};
|
|
62
57
|
inputmode: {
|
|
63
58
|
type: StringConstructor;
|
|
59
|
+
reflect: boolean;
|
|
64
60
|
};
|
|
65
61
|
invalid: {
|
|
66
62
|
type: BooleanConstructor;
|
|
@@ -72,18 +68,23 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
72
68
|
};
|
|
73
69
|
max: {
|
|
74
70
|
type: StringConstructor;
|
|
71
|
+
reflect: boolean;
|
|
75
72
|
};
|
|
76
73
|
maxlength: {
|
|
77
74
|
type: NumberConstructor;
|
|
75
|
+
reflect: boolean;
|
|
78
76
|
};
|
|
79
77
|
min: {
|
|
80
78
|
type: StringConstructor;
|
|
79
|
+
reflect: boolean;
|
|
81
80
|
};
|
|
82
81
|
minlength: {
|
|
83
82
|
type: NumberConstructor;
|
|
83
|
+
reflect: boolean;
|
|
84
84
|
};
|
|
85
85
|
name: {
|
|
86
86
|
type: StringConstructor;
|
|
87
|
+
reflect: boolean;
|
|
87
88
|
};
|
|
88
89
|
pill: {
|
|
89
90
|
type: BooleanConstructor;
|
|
@@ -91,6 +92,7 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
91
92
|
};
|
|
92
93
|
placeholder: {
|
|
93
94
|
type: StringConstructor;
|
|
95
|
+
reflect: boolean;
|
|
94
96
|
};
|
|
95
97
|
readonly: {
|
|
96
98
|
type: BooleanConstructor;
|
|
@@ -106,6 +108,7 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
106
108
|
};
|
|
107
109
|
step: {
|
|
108
110
|
type: StringConstructor;
|
|
111
|
+
reflect: boolean;
|
|
109
112
|
};
|
|
110
113
|
success: {
|
|
111
114
|
type: BooleanConstructor;
|
|
@@ -123,12 +126,10 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
123
126
|
type: StringConstructor;
|
|
124
127
|
};
|
|
125
128
|
};
|
|
126
|
-
ariaLabel: string | null;
|
|
127
|
-
ariaLabelledBy: string | null;
|
|
128
|
-
ariaDescribedBy: string | null;
|
|
129
129
|
autocomplete?: string;
|
|
130
130
|
autofocus: boolean;
|
|
131
131
|
disabled: boolean;
|
|
132
|
+
form?: string;
|
|
132
133
|
fullWidth: boolean;
|
|
133
134
|
inputmode?: string;
|
|
134
135
|
invalid: boolean;
|
|
@@ -148,22 +149,10 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
148
149
|
title: string;
|
|
149
150
|
type: SpectreInputType;
|
|
150
151
|
value: string;
|
|
151
|
-
private _id?;
|
|
152
|
-
get id(): string;
|
|
153
|
-
set id(value: string);
|
|
154
|
-
createRenderRoot(): this;
|
|
155
|
-
connectedCallback(): void;
|
|
156
|
-
getAttribute(qualifiedName: string): string | null;
|
|
157
|
-
hasAttribute(qualifiedName: string): boolean;
|
|
158
|
-
setAttribute(qualifiedName: string, value: string): void;
|
|
159
|
-
removeAttribute(qualifiedName: string): void;
|
|
160
152
|
protected willUpdate(changedProperties: Map<PropertyKey, unknown>): void;
|
|
161
153
|
private get inputClasses();
|
|
162
154
|
private get isDisabled();
|
|
163
155
|
private get nativeInput();
|
|
164
|
-
private get forwardedAriaLabel();
|
|
165
|
-
private get forwardedAriaLabelledBy();
|
|
166
|
-
private get forwardedAriaDescribedBy();
|
|
167
156
|
private handleInput;
|
|
168
157
|
private handleChange;
|
|
169
158
|
focus(options?: FocusOptions): void;
|
|
@@ -172,4 +161,4 @@ declare class SpectreInputElement extends LitElement implements SpectreInputProp
|
|
|
172
161
|
}
|
|
173
162
|
declare function defineSpectreInput(tagName?: string): typeof SpectreInputElement;
|
|
174
163
|
|
|
175
|
-
export { SpectreInputElement, type SpectreInputProps,
|
|
164
|
+
export { SpectreInputElement, type SpectreInputProps, SpectreInputSize, SpectreInputType, defineSpectreInput };
|