@starwind-ui/core 1.6.1 → 1.6.2
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/index.js
CHANGED
|
@@ -19,7 +19,7 @@ var registry_default = {
|
|
|
19
19
|
{ name: "input", type: "component", version: "1.1.1", dependencies: [] },
|
|
20
20
|
{ name: "label", type: "component", version: "1.1.1", dependencies: [] },
|
|
21
21
|
{ name: "pagination", type: "component", version: "2.0.1", dependencies: [] },
|
|
22
|
-
{ name: "select", type: "component", version: "1.3.
|
|
22
|
+
{ name: "select", type: "component", version: "1.3.2", dependencies: [] },
|
|
23
23
|
{ name: "switch", type: "component", version: "1.1.0", dependencies: [] },
|
|
24
24
|
{ name: "table", type: "component", version: "1.0.0", dependencies: [] },
|
|
25
25
|
{ name: "tabs", type: "component", version: "1.2.0", dependencies: [] },
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/registry.json"],"sourcesContent":["import { join } from \"node:path\";\nimport { fileURLToPath } from \"node:url\";\nimport componentRegistry from \"./registry.json\" with { type: \"json\" };\n\n/**\n * Component metadata interface describing a Starwind UI component\n */\nexport interface ComponentMeta {\n\tname: string;\n\tversion: string;\n\ttype: \"component\";\n\tdependencies: string[];\n}\n\n/**\n * Registry interface containing all available components\n */\nexport interface Registry {\n\tcomponents: ComponentMeta[];\n}\n\nconst __dirname = fileURLToPath(new URL(\".\", import.meta.url));\n\n/**\n * Get the absolute path to a component file\n * @param {string} componentName - The name of the component\n * @param {string} fileName - The name of the file within the component\n * @returns {string} The absolute path to the component file\n */\nexport const getComponentPath = (componentName: string, fileName: string): string => {\n\t// In production (when installed as a dependency), the components will be in dist/src/components\n\t// In development, they will be in src/components\n\tconst componentsDir = __dirname.includes(\"dist\") ? \"src/components\" : \"src/components\";\n\treturn join(__dirname, componentsDir, componentName, fileName);\n};\n\n/**\n * Map of all components and their metadata from registry\n */\nexport const registry = componentRegistry.components as ComponentMeta[];\n","{\n\t\"$schema\": \"https://starwind.dev/registry-schema.json\",\n\t\"components\": [\n\t\t{ \"name\": \"accordion\", \"type\": \"component\", \"version\": \"1.1.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"alert\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"avatar\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"badge\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"breadcrumb\", \"type\": \"component\", \"version\": \"1.0.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"button\", \"type\": \"component\", \"version\": \"2.0.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"card\", \"type\": \"component\", \"version\": \"1.1.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"checkbox\", \"type\": \"component\", \"version\": \"1.2.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"dialog\", \"type\": \"component\", \"version\": \"1.1.3\", \"dependencies\": [] },\n\t\t{ \"name\": \"dropdown\", \"type\": \"component\", \"version\": \"1.0.3\", \"dependencies\": [] },\n\t\t{ \"name\": \"input\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"label\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"pagination\", \"type\": \"component\", \"version\": \"2.0.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"select\", \"type\": \"component\", \"version\": \"1.3.
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/registry.json"],"sourcesContent":["import { join } from \"node:path\";\nimport { fileURLToPath } from \"node:url\";\nimport componentRegistry from \"./registry.json\" with { type: \"json\" };\n\n/**\n * Component metadata interface describing a Starwind UI component\n */\nexport interface ComponentMeta {\n\tname: string;\n\tversion: string;\n\ttype: \"component\";\n\tdependencies: string[];\n}\n\n/**\n * Registry interface containing all available components\n */\nexport interface Registry {\n\tcomponents: ComponentMeta[];\n}\n\nconst __dirname = fileURLToPath(new URL(\".\", import.meta.url));\n\n/**\n * Get the absolute path to a component file\n * @param {string} componentName - The name of the component\n * @param {string} fileName - The name of the file within the component\n * @returns {string} The absolute path to the component file\n */\nexport const getComponentPath = (componentName: string, fileName: string): string => {\n\t// In production (when installed as a dependency), the components will be in dist/src/components\n\t// In development, they will be in src/components\n\tconst componentsDir = __dirname.includes(\"dist\") ? \"src/components\" : \"src/components\";\n\treturn join(__dirname, componentsDir, componentName, fileName);\n};\n\n/**\n * Map of all components and their metadata from registry\n */\nexport const registry = componentRegistry.components as ComponentMeta[];\n","{\n\t\"$schema\": \"https://starwind.dev/registry-schema.json\",\n\t\"components\": [\n\t\t{ \"name\": \"accordion\", \"type\": \"component\", \"version\": \"1.1.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"alert\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"avatar\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"badge\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"breadcrumb\", \"type\": \"component\", \"version\": \"1.0.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"button\", \"type\": \"component\", \"version\": \"2.0.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"card\", \"type\": \"component\", \"version\": \"1.1.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"checkbox\", \"type\": \"component\", \"version\": \"1.2.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"dialog\", \"type\": \"component\", \"version\": \"1.1.3\", \"dependencies\": [] },\n\t\t{ \"name\": \"dropdown\", \"type\": \"component\", \"version\": \"1.0.3\", \"dependencies\": [] },\n\t\t{ \"name\": \"input\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"label\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"pagination\", \"type\": \"component\", \"version\": \"2.0.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"select\", \"type\": \"component\", \"version\": \"1.3.2\", \"dependencies\": [] },\n\t\t{ \"name\": \"switch\", \"type\": \"component\", \"version\": \"1.1.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"table\", \"type\": \"component\", \"version\": \"1.0.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"tabs\", \"type\": \"component\", \"version\": \"1.2.0\", \"dependencies\": [] },\n\t\t{ \"name\": \"textarea\", \"type\": \"component\", \"version\": \"1.1.1\", \"dependencies\": [] },\n\t\t{ \"name\": \"tooltip\", \"type\": \"component\", \"version\": \"1.1.2\", \"dependencies\": [] }\n\t]\n}\n"],"mappings":";AAAA,SAAS,YAAY;AACrB,SAAS,qBAAqB;;;ACD9B;AAAA,EACC,SAAW;AAAA,EACX,YAAc;AAAA,IACb,EAAE,MAAQ,aAAa,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IACnF,EAAE,MAAQ,SAAS,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC/E,EAAE,MAAQ,UAAU,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAChF,EAAE,MAAQ,SAAS,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC/E,EAAE,MAAQ,cAAc,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IACpF,EAAE,MAAQ,UAAU,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAChF,EAAE,MAAQ,QAAQ,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC9E,EAAE,MAAQ,YAAY,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAClF,EAAE,MAAQ,UAAU,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAChF,EAAE,MAAQ,YAAY,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAClF,EAAE,MAAQ,SAAS,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC/E,EAAE,MAAQ,SAAS,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC/E,EAAE,MAAQ,cAAc,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IACpF,EAAE,MAAQ,UAAU,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAChF,EAAE,MAAQ,UAAU,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAChF,EAAE,MAAQ,SAAS,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC/E,EAAE,MAAQ,QAAQ,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAC9E,EAAE,MAAQ,YAAY,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,IAClF,EAAE,MAAQ,WAAW,MAAQ,aAAa,SAAW,SAAS,cAAgB,CAAC,EAAE;AAAA,EAClF;AACD;;;ADFA,IAAM,YAAY,cAAc,IAAI,IAAI,KAAK,YAAY,GAAG,CAAC;AAQtD,IAAM,mBAAmB,CAAC,eAAuB,aAA6B;AAGpF,QAAM,gBAAgB,UAAU,SAAS,MAAM,IAAI,mBAAmB;AACtE,SAAO,KAAK,WAAW,eAAe,eAAe,QAAQ;AAC9D;AAKO,IAAM,WAAW,iBAAkB;","names":[]}
|
|
@@ -38,6 +38,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
38
38
|
private animationDuration = 150;
|
|
39
39
|
private typeaheadTimerRef: number | null = null;
|
|
40
40
|
private typeaheadSearch = "";
|
|
41
|
+
private returnFocusOnClose: boolean = true;
|
|
41
42
|
|
|
42
43
|
constructor(select: HTMLElement, selectIdx: number) {
|
|
43
44
|
this.select = select;
|
|
@@ -134,6 +135,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
134
135
|
// but not when the control key is pressed (avoiding MacOS right click); also not for touch
|
|
135
136
|
// devices because that would open the menu on scroll. (pen devices behave as touch on iOS).
|
|
136
137
|
if (e.button === 0 && e.ctrlKey === false && e.pointerType === "mouse") {
|
|
138
|
+
this.returnFocusOnClose = true;
|
|
137
139
|
this.toggleSelect();
|
|
138
140
|
}
|
|
139
141
|
});
|
|
@@ -142,6 +144,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
142
144
|
this.trigger.addEventListener("click", (e) => {
|
|
143
145
|
if (window.matchMedia("(pointer: coarse)").matches) {
|
|
144
146
|
e.preventDefault();
|
|
147
|
+
this.returnFocusOnClose = true;
|
|
145
148
|
this.toggleSelect();
|
|
146
149
|
}
|
|
147
150
|
});
|
|
@@ -150,6 +153,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
150
153
|
this.trigger.addEventListener("keydown", (e) => {
|
|
151
154
|
if (e.key === "Enter" || e.key === " ") {
|
|
152
155
|
e.preventDefault();
|
|
156
|
+
this.returnFocusOnClose = true;
|
|
153
157
|
this.toggleSelect();
|
|
154
158
|
}
|
|
155
159
|
});
|
|
@@ -159,8 +163,10 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
159
163
|
if (e.key === "Enter" || e.key === " ") {
|
|
160
164
|
// set element based on current focused element
|
|
161
165
|
const activeElement = document.activeElement;
|
|
166
|
+
this.returnFocusOnClose = true;
|
|
162
167
|
this.handleSelection(activeElement as HTMLElement);
|
|
163
168
|
} else if (e.key === "Escape" && this.isOpen) {
|
|
169
|
+
this.returnFocusOnClose = true;
|
|
164
170
|
this.closeSelect();
|
|
165
171
|
}
|
|
166
172
|
|
|
@@ -203,6 +209,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
203
209
|
) &&
|
|
204
210
|
this.isOpen
|
|
205
211
|
) {
|
|
212
|
+
this.returnFocusOnClose = false;
|
|
206
213
|
this.closeSelect();
|
|
207
214
|
}
|
|
208
215
|
}
|
|
@@ -214,6 +221,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
214
221
|
!(this.trigger?.contains(e.target as Node) || this.content?.contains(e.target as Node)) &&
|
|
215
222
|
this.isOpen
|
|
216
223
|
) {
|
|
224
|
+
this.returnFocusOnClose = false;
|
|
217
225
|
this.closeSelect();
|
|
218
226
|
}
|
|
219
227
|
});
|
|
@@ -222,6 +230,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
222
230
|
this.content?.addEventListener("click", (e) => {
|
|
223
231
|
const item = (e.target as HTMLElement).closest("[role='option']");
|
|
224
232
|
if (item instanceof HTMLElement) {
|
|
233
|
+
this.returnFocusOnClose = true;
|
|
225
234
|
this.handleSelection(item);
|
|
226
235
|
}
|
|
227
236
|
});
|
|
@@ -358,11 +367,13 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
358
367
|
activeElement.blur();
|
|
359
368
|
}
|
|
360
369
|
|
|
361
|
-
// Set focus on trigger
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
370
|
+
// Set focus on trigger if returnFocusOnClose is true
|
|
371
|
+
if (this.returnFocusOnClose) {
|
|
372
|
+
requestAnimationFrame(() => {
|
|
373
|
+
if (!this.trigger) return;
|
|
374
|
+
this.trigger.focus();
|
|
375
|
+
});
|
|
376
|
+
}
|
|
366
377
|
|
|
367
378
|
// give the content time to animate before hiding
|
|
368
379
|
setTimeout(() => {
|
|
@@ -420,6 +431,7 @@ const { class: className, name, defaultValue, ...rest } = Astro.props;
|
|
|
420
431
|
const item = this.content?.querySelector(`[data-value="${defaultValue}"]`);
|
|
421
432
|
|
|
422
433
|
if (item && item instanceof HTMLElement) {
|
|
434
|
+
this.returnFocusOnClose = false;
|
|
423
435
|
this.handleSelection(item);
|
|
424
436
|
this.selectedItem = item;
|
|
425
437
|
}
|