npm - @adea-ai/ui - Versions diffs - 0.145.1 → 0.145.2 - Mend

@adea-ai/ui 0.145.1 → 0.145.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.

Files changed (14) hide show

package/dist/components/composites/workspace-switcher/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
+import { WorkspaceSwitcher } from "./workspace-switcher.js";
 import { moveTarget, moveWorkspace } from "./workspace-order.js";
 import { WorkspaceReorderDialog } from "./workspace-reorder-dialog.js";
-import { WorkspaceSwitcher } from "./workspace-switcher.js";
 export { WorkspaceReorderDialog, WorkspaceSwitcher, moveTarget, moveWorkspace };

package/dist/components/composites/workspace-switcher/workspace-reorder-dialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"workspace-reorder-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/workspace-switcher/workspace-reorder-dialog.tsx"],"names":[],"mappings":"AACA,OAAO,EAAwD,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAA;AAe9F,MAAM,MAAM,oBAAoB,GAAG;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,2BAA2B,GAAG;IACxC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAA;IACjC,UAAU,EAAE,SAAS,oBAAoB,EAAE,CAAA;IAC3C,2FAA2F;IAC3F,SAAS,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,0FAA0F;IAC1F,eAAe,CAAC,EAAE,QAAQ,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;CACpD,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,~~kCA6JxE~~"}
1	+ {"version":3,"file":"workspace-reorder-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/workspace-switcher/workspace-reorder-dialog.tsx"],"names":[],"mappings":"AACA,OAAO,EAAwD,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAA;AAe9F,MAAM,MAAM,oBAAoB,GAAG;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,2BAA2B,GAAG;IACxC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAA;IACjC,UAAU,EAAE,SAAS,oBAAoB,EAAE,CAAA;IAC3C,2FAA2F;IAC3F,SAAS,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,0FAA0F;IAC1F,eAAe,CAAC,EAAE,QAAQ,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;CACpD,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,kCAmKxE"}

package/dist/components/composites/workspace-switcher/workspace-reorder-dialog.js CHANGED Viewed

@@ -50,13 +50,18 @@ function WorkspaceReorderDialog(props) {
 	});
 	const focusMove = (owner, id, direction) => {
 		if (frame !== void 0) cancelAnimationFrame(frame);
-		frame = requestAnimationFrame(() => {
-			frame = void 0;
+		const restore = () => {
 			if (disposed || owner !== session || !props.open) return;
 			const row = list?.querySelector(`[data-reorder-id="${CSS.escape(id)}"]`);
 			const wanted = row?.querySelector(`[data-move="${direction}"]`);
 			const other = row?.querySelector(`[data-move="${direction === "up" ? "down" : "up"}"]`);
-			(wanted?.getAttribute("aria-disabled") === "true" ? other : wanted)?.focus({ preventScroll: true });
+			const target = wanted?.getAttribute("aria-disabled") === "true" ? other : wanted;
+			if (target && document.activeElement !== target) target.focus({ preventScroll: true });
+		};
+		restore();
+		frame = requestAnimationFrame(() => {
+			frame = void 0;
+			restore();
 		});
 	};
 	const move = async (item, direction) => {

package/dist/components/composites/workspace-switcher/workspace-reorder-dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"workspace-reorder-dialog.js","names":["ArrowDown","ArrowUp","For","Show","createEffect","createSignal","on","onCleanup","Accessor","Button","Dialog","DialogClose","DialogContent","DialogDescription","DialogFooter","DialogHeader","DialogTitle","createDialogFocusRestoration","ActionButton","moveTarget","moveWorkspace","WorkspaceMoveDirection","WorkspaceReorderItem","id","name","fixed","WorkspaceReorderDialogProps","open","onOpenChange","workspaces","onReorder","ids","Promise","title","restoreFocusRef","HTMLElement","WorkspaceReorderDialog","props","status","setStatus","error","setError","pending","setPending","list","HTMLOListElement","session","disposed","frame","undefined","cancelAnimationFrame","defer","focus","focusMove","owner","direction","requestAnimationFrame","row","querySelector","CSS","escape","wanted","other","target","getAttribute","preventScroll","move","item","next","current","indexOf","length","_$createComponent","children","onKeyDown","event","KeyboardEvent","key","defaultPrevented","preventDefault","onOpenAutoFocus","onCloseAutoFocus","_el$","_tmpl$","_$use","el","_$insert","each","_el$4","_tmpl$4","_el$5","firstChild","when","fallback","_tmpl$5","const","variant","size","aria-label","tooltip","disabled","onClick","_$effect","_$setAttribute","_el$2","_tmpl$2","_el$3","_tmpl$3","as","_$createComponent","_$setAttribute"],"sources":["../../../../src/components/composites/workspace-switcher/workspace-reorder-dialog.tsx"],"sourcesContent":["import { ArrowDown, ArrowUp } from 'lucide-solid'\nimport { For, Show, createEffect, createSignal, on, onCleanup, type Accessor } from 'solid-js'\nimport { Button } from '../../ui/button'\nimport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n} from '../../ui/dialog'\nimport { createDialogFocusRestoration } from '../../ui/dialog/dialog'\nimport { ActionButton } from '../action-button'\nimport { moveTarget, moveWorkspace, type WorkspaceMoveDirection } from './workspace-order'\n\nexport type WorkspaceReorderItem = {\n id: string\n name: string\n fixed?: boolean\n}\n\nexport type WorkspaceReorderDialogProps = {\n open: boolean\n onOpenChange(open: boolean): void\n workspaces: readonly WorkspaceReorderItem[]\n /** Receives the full id order after one move. May be async; a rejection shows an error. /\n onReorder(ids: readonly string[]): void \| Promise<void>\n title?: string\n /* Where focus returns on close; the menu item that opened the dialog is gone by then. /\n restoreFocusRef?: Accessor<HTMLElement \| undefined>\n}\n\n/\n WorkspaceReorderDialog.\n \n Ordering by buttons, not by dragging, so it works from the keyboard and with\n * a screen reader: every row has a labelled Move up and Move down. Each move is\n * reported to the host straight away (there is no Save), the moved row keeps\n * focus on the control that was used, and the new position is announced.\n \n One save runs at a time, even across a close and reopen: the moves stay\n * disabled until the host's promise settles. A save that finishes after the\n * dialog has closed reports nothing here (the host owns any failure it wants\n * to surface) and never moves focus.\n */\nexport function WorkspaceReorderDialog(props: WorkspaceReorderDialogProps) {\n const [status, setStatus] = createSignal('')\n const [error, setError] = createSignal('')\n const [pending, setPending] = createSignal(false)\n let list: HTMLOListElement \| undefined\n // Each open and each close starts a new session. A save belongs to the session\n // it began in; once the dialog has closed (or closed and reopened) its result\n // no longer speaks for what is on screen, so it must not touch the status\n // line or focus. `pending` is deliberately not reset with the session: the\n // host's save is still running, so the next move waits for it instead of\n // running a second save beside it.\n let session = 0\n let disposed = false\n let frame: number \| undefined\n\n createEffect(\n on(\n () => props.open,\n () => {\n session += 1\n if (frame !== undefined) cancelAnimationFrame(frame)\n frame = undefined\n setStatus('')\n setError('')\n },\n { defer: true }\n )\n )\n onCleanup(() => {\n disposed = true\n session += 1\n if (frame !== undefined) cancelAnimationFrame(frame)\n })\n\n const focus = createDialogFocusRestoration({\n open: () => props.open,\n restoreFocusRef: props.restoreFocusRef,\n })\n\n const focusMove = (owner: number, id: string, direction: WorkspaceMoveDirection) => {\n // The host re-renders the rows with the new order; focus the same control\n // once it exists, or its sibling when the move reached an edge.\n if (frame !== undefined) cancelAnimationFrame(frame)\n frame = requestAnimationFrame(() => {\n frame = undefined\n if (disposed \|\| owner !== session \|\| !props.open) return\n const row = list?.querySelector<HTMLElement>(`[data-reorder-id=\"${CSS.escape(id)}\"]`)\n const wanted = row?.querySelector<HTMLElement>(`[data-move=\"${direction}\"]`)\n const other = row?.querySelector<HTMLElement>(\n `[data-move=\"${direction === 'up' ? 'down' : 'up'}\"]`\n )\n const target = wanted?.getAttribute('aria-disabled') === 'true' ? other : wanted\n target?.focus({ preventScroll: true })\n })\n }\n\n const move = async (item: WorkspaceReorderItem, direction: WorkspaceMoveDirection) => {\n if (pending()) return\n const next = moveWorkspace(props.workspaces, item.id, direction)\n if (!next) return\n const owner = session\n const current = () => !disposed && owner === session && props.open\n setError('')\n setPending(true)\n try {\n await props.onReorder(next)\n if (current())\n setStatus(`Moved ${item.name} to position ${next.indexOf(item.id) + 1} of ${next.length}.`)\n } catch {\n if (current()) {\n setStatus('')\n setError('Could not save the order. Try again.')\n }\n } finally {\n if (!disposed) setPending(false)\n if (current()) focusMove(owner, item.id, direction)\n }\n }\n\n return (\n <Dialog open={props.open} onOpenChange={props.onOpenChange}>\n <DialogContent\n class=\"w-full max-w-sm\"\n onKeyDown={(event: KeyboardEvent) => {\n // Tooltip help on a focused move control would otherwise take the first Escape.\n if (event.key === 'Escape' && !event.defaultPrevented) {\n event.preventDefault()\n props.onOpenChange(false)\n }\n }}\n onOpenAutoFocus={focus.onOpenAutoFocus}\n onCloseAutoFocus={focus.onCloseAutoFocus}\n >\n <DialogHeader>\n <DialogTitle>{props.title ?? 'Reorder workspaces'}</DialogTitle>\n <DialogDescription>\n Move a workspace up or down. The order is saved as you go.\n </DialogDescription>\n </DialogHeader>\n <ol\n ref={(el) => (list = el)}\n class=\"flex flex-col gap-1\"\n aria-label=\"Workspace order\"\n aria-busy={pending()}\n >\n <For each={props.workspaces}>\n {(item) => (\n <li\n data-reorder-id={item.id}\n class=\"flex items-center gap-2 rounded-md border border-border px-3 py-1.5\"\n >\n <span class=\"min-w-0 flex-1 truncate text-sm\">{item.name}</span>\n <Show\n when={!item.fixed}\n fallback={<span class=\"text-xs text-muted-foreground\">Always first</span>}\n >\n <For each={['up', 'down'] as const}>\n {(direction) => (\n <ActionButton\n variant=\"ghost\"\n size=\"icon-sm\"\n data-move={direction}\n aria-label={`Move ${item.name} ${direction}`}\n tooltip={`Move ${direction}`}\n disabled={\n pending() \|\|\n moveTarget(props.workspaces, item.id, direction) === undefined\n }\n onClick={() => void move(item, direction)}\n >\n <Show when={direction === 'up'} fallback={<ArrowDown aria-hidden=\"true\" />}>\n <ArrowUp aria-hidden=\"true\" />\n </Show>\n </ActionButton>\n )}\n </For>\n </Show>\n </li>\n )}\n </For>\n </ol>\n <p role=\"status\" aria-live=\"polite\" class=\"min-h-5 text-xs text-muted-foreground\">\n {status()}\n </p>\n <Show when={error()}>\n <p role=\"alert\" class=\"text-xs text-destructive\">\n {error()}\n </p>\n </Show>\n <DialogFooter>\n <DialogClose as={Button} variant=\"outline\" size=\"sm\">\n Done\n </DialogClose>\n </DialogFooter>\n </DialogContent>\n </Dialog>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"workspace-reorder-dialog.js","names":["ArrowDown","ArrowUp","For","Show","createEffect","createSignal","on","onCleanup","Accessor","Button","Dialog","DialogClose","DialogContent","DialogDescription","DialogFooter","DialogHeader","DialogTitle","createDialogFocusRestoration","ActionButton","moveTarget","moveWorkspace","WorkspaceMoveDirection","WorkspaceReorderItem","id","name","fixed","WorkspaceReorderDialogProps","open","onOpenChange","workspaces","onReorder","ids","Promise","title","restoreFocusRef","HTMLElement","WorkspaceReorderDialog","props","status","setStatus","error","setError","pending","setPending","list","HTMLOListElement","session","disposed","frame","undefined","cancelAnimationFrame","defer","focus","focusMove","owner","direction","restore","row","querySelector","CSS","escape","wanted","other","target","getAttribute","document","activeElement","preventScroll","requestAnimationFrame","move","item","next","current","indexOf","length","_$createComponent","children","onKeyDown","event","KeyboardEvent","key","defaultPrevented","preventDefault","onOpenAutoFocus","onCloseAutoFocus","_el$","_tmpl$","_$use","el","_$insert","each","_el$4","_tmpl$4","_el$5","firstChild","when","fallback","_tmpl$5","const","variant","size","aria-label","tooltip","disabled","onClick","_$effect","_$setAttribute","_el$2","_tmpl$2","_el$3","_tmpl$3","as","_$createComponent","_$setAttribute"],"sources":["../../../../src/components/composites/workspace-switcher/workspace-reorder-dialog.tsx"],"sourcesContent":["import { ArrowDown, ArrowUp } from 'lucide-solid'\nimport { For, Show, createEffect, createSignal, on, onCleanup, type Accessor } from 'solid-js'\nimport { Button } from '../../ui/button'\nimport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n} from '../../ui/dialog'\nimport { createDialogFocusRestoration } from '../../ui/dialog/dialog'\nimport { ActionButton } from '../action-button'\nimport { moveTarget, moveWorkspace, type WorkspaceMoveDirection } from './workspace-order'\n\nexport type WorkspaceReorderItem = {\n id: string\n name: string\n fixed?: boolean\n}\n\nexport type WorkspaceReorderDialogProps = {\n open: boolean\n onOpenChange(open: boolean): void\n workspaces: readonly WorkspaceReorderItem[]\n /** Receives the full id order after one move. May be async; a rejection shows an error. /\n onReorder(ids: readonly string[]): void \| Promise<void>\n title?: string\n /* Where focus returns on close; the menu item that opened the dialog is gone by then. /\n restoreFocusRef?: Accessor<HTMLElement \| undefined>\n}\n\n/\n WorkspaceReorderDialog.\n \n Ordering by buttons, not by dragging, so it works from the keyboard and with\n * a screen reader: every row has a labelled Move up and Move down. Each move is\n * reported to the host straight away (there is no Save), the moved row keeps\n * focus on the control that was used, and the new position is announced.\n \n One save runs at a time, even across a close and reopen: the moves stay\n * disabled until the host's promise settles. A save that finishes after the\n * dialog has closed reports nothing here (the host owns any failure it wants\n * to surface) and never moves focus.\n */\nexport function WorkspaceReorderDialog(props: WorkspaceReorderDialogProps) {\n const [status, setStatus] = createSignal('')\n const [error, setError] = createSignal('')\n const [pending, setPending] = createSignal(false)\n let list: HTMLOListElement \| undefined\n // Each open and each close starts a new session. A save belongs to the session\n // it began in; once the dialog has closed (or closed and reopened) its result\n // no longer speaks for what is on screen, so it must not touch the status\n // line or focus. `pending` is deliberately not reset with the session: the\n // host's save is still running, so the next move waits for it instead of\n // running a second save beside it.\n let session = 0\n let disposed = false\n let frame: number \| undefined\n\n createEffect(\n on(\n () => props.open,\n () => {\n session += 1\n if (frame !== undefined) cancelAnimationFrame(frame)\n frame = undefined\n setStatus('')\n setError('')\n },\n { defer: true }\n )\n )\n onCleanup(() => {\n disposed = true\n session += 1\n if (frame !== undefined) cancelAnimationFrame(frame)\n })\n\n const focus = createDialogFocusRestoration({\n open: () => props.open,\n restoreFocusRef: props.restoreFocusRef,\n })\n\n const focusMove = (owner: number, id: string, direction: WorkspaceMoveDirection) => {\n // The host re-renders the rows with the new order, which replaces the control\n // that had focus; focus the same control once it exists, or its sibling when\n // the move reached an edge. Try at once so keys pressed right after a save\n // still reach the dialog, and again next frame for a host that renders later.\n if (frame !== undefined) cancelAnimationFrame(frame)\n const restore = () => {\n if (disposed \|\| owner !== session \|\| !props.open) return\n const row = list?.querySelector<HTMLElement>(`[data-reorder-id=\"${CSS.escape(id)}\"]`)\n const wanted = row?.querySelector<HTMLElement>(`[data-move=\"${direction}\"]`)\n const other = row?.querySelector<HTMLElement>(\n `[data-move=\"${direction === 'up' ? 'down' : 'up'}\"]`\n )\n const target = wanted?.getAttribute('aria-disabled') === 'true' ? other : wanted\n if (target && document.activeElement !== target) target.focus({ preventScroll: true })\n }\n restore()\n frame = requestAnimationFrame(() => {\n frame = undefined\n restore()\n })\n }\n\n const move = async (item: WorkspaceReorderItem, direction: WorkspaceMoveDirection) => {\n if (pending()) return\n const next = moveWorkspace(props.workspaces, item.id, direction)\n if (!next) return\n const owner = session\n const current = () => !disposed && owner === session && props.open\n setError('')\n setPending(true)\n try {\n await props.onReorder(next)\n if (current())\n setStatus(`Moved ${item.name} to position ${next.indexOf(item.id) + 1} of ${next.length}.`)\n } catch {\n if (current()) {\n setStatus('')\n setError('Could not save the order. Try again.')\n }\n } finally {\n if (!disposed) setPending(false)\n if (current()) focusMove(owner, item.id, direction)\n }\n }\n\n return (\n <Dialog open={props.open} onOpenChange={props.onOpenChange}>\n <DialogContent\n class=\"w-full max-w-sm\"\n onKeyDown={(event: KeyboardEvent) => {\n // Tooltip help on a focused move control would otherwise take the first Escape.\n if (event.key === 'Escape' && !event.defaultPrevented) {\n event.preventDefault()\n props.onOpenChange(false)\n }\n }}\n onOpenAutoFocus={focus.onOpenAutoFocus}\n onCloseAutoFocus={focus.onCloseAutoFocus}\n >\n <DialogHeader>\n <DialogTitle>{props.title ?? 'Reorder workspaces'}</DialogTitle>\n <DialogDescription>\n Move a workspace up or down. The order is saved as you go.\n </DialogDescription>\n </DialogHeader>\n <ol\n ref={(el) => (list = el)}\n class=\"flex flex-col gap-1\"\n aria-label=\"Workspace order\"\n aria-busy={pending()}\n >\n <For each={props.workspaces}>\n {(item) => (\n <li\n data-reorder-id={item.id}\n class=\"flex items-center gap-2 rounded-md border border-border px-3 py-1.5\"\n >\n <span class=\"min-w-0 flex-1 truncate text-sm\">{item.name}</span>\n <Show\n when={!item.fixed}\n fallback={<span class=\"text-xs text-muted-foreground\">Always first</span>}\n >\n <For each={['up', 'down'] as const}>\n {(direction) => (\n <ActionButton\n variant=\"ghost\"\n size=\"icon-sm\"\n data-move={direction}\n aria-label={`Move ${item.name} ${direction}`}\n tooltip={`Move ${direction}`}\n disabled={\n pending() \|\|\n moveTarget(props.workspaces, item.id, direction) === undefined\n }\n onClick={() => void move(item, direction)}\n >\n <Show when={direction === 'up'} fallback={<ArrowDown aria-hidden=\"true\" />}>\n <ArrowUp aria-hidden=\"true\" />\n </Show>\n </ActionButton>\n )}\n </For>\n </Show>\n </li>\n )}\n </For>\n </ol>\n <p role=\"status\" aria-live=\"polite\" class=\"min-h-5 text-xs text-muted-foreground\">\n {status()}\n </p>\n <Show when={error()}>\n <p role=\"alert\" class=\"text-xs text-destructive\">\n {error()}\n </p>\n </Show>\n <DialogFooter>\n <DialogClose as={Button} variant=\"outline\" size=\"sm\">\n Done\n </DialogClose>\n </DialogFooter>\n </DialogContent>\n </Dialog>\n )\n}\n"],"mappings":"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"}

package/dist/components/composites/workspace-switcher/workspace-switcher.d.ts CHANGED Viewed

@@ -50,6 +50,8 @@ export type WorkspaceSwitcherProps = {
      */
     onReorder?(ids: readonly string[]): void | Promise<void>;
     reorderLabel?: string;
+    /** Replaces the "Reorder workspaces…" item when the dialog could not be loaded. */
+    reorderErrorLabel?: string;
     /** The menu's heading; also the trigger's accessible-name prefix. */
     label?: string;
     /** Shown while no workspace is current. */

package/dist/components/composites/workspace-switcher/workspace-switcher.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"workspace-switcher.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/workspace-switcher/workspace-switcher.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;~~AAiBnC~~;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;;;;OAQG;IACH,IAAI,EAAE,GAAG,CAAC,OAAO,GAAG,CAAC,MAAM,GAAG,CAAC,OAAO,CAAC,CAAA;IACvC,2EAA2E;IAC3E,MAAM,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;IACpB,gGAAgG;IAChG,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,UAAU,EAAE,SAAS,qBAAqB,EAAE,CAAA;IAC5C,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;IACzB,aAAa,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,oDAAoD;IACpD,QAAQ,CAAC,IAAI,IAAI,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,4FAA4F;IAC5F,QAAQ,CAAC,IAAI,IAAI,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,SAAS,CAAC,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACxD,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2CAA2C;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAWD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,~~eA2F9D~~"}
1	+ {"version":3,"file":"workspace-switcher.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/workspace-switcher/workspace-switcher.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAsBnC;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;;;;OAQG;IACH,IAAI,EAAE,GAAG,CAAC,OAAO,GAAG,CAAC,MAAM,GAAG,CAAC,OAAO,CAAC,CAAA;IACvC,2EAA2E;IAC3E,MAAM,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;IACpB,gGAAgG;IAChG,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,UAAU,EAAE,SAAS,qBAAqB,EAAE,CAAA;IAC5C,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;IACzB,aAAa,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,oDAAoD;IACpD,QAAQ,CAAC,IAAI,IAAI,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,4FAA4F;IAC5F,QAAQ,CAAC,IAAI,IAAI,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,SAAS,CAAC,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACxD,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mFAAmF;IACnF,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2CAA2C;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAWD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAkJ9D"}

package/dist/components/composites/workspace-switcher/workspace-switcher.js CHANGED Viewed

@@ -1,14 +1,14 @@
 import { cn } from "../../../lib/utils.js";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuTrigger } from "../../ui/dropdown-menu/dropdown-menu.js";
 import { ActionButton } from "../action-button/action-button.js";
-import { WorkspaceReorderDialog } from "./workspace-reorder-dialog.js";
-import { createComponent, insert, memo, template } from "solid-js/web";
+import { Dynamic, createComponent, insert, memo, template } from "solid-js/web";
 import { ArrowDownUp, ChevronDown, Plus, Settings } from "lucide-solid";
-import { For, Show, createSignal } from "solid-js";
+import { For, Show, createSignal, onCleanup } from "solid-js";
 //#region src/components/composites/workspace-switcher/workspace-switcher.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<span aria-hidden=true class="flex shrink-0">`);
 var _tmpl$2 = /*#__PURE__*/ template(`<span class="min-w-0 max-w-40 truncate">`);
 var _tmpl$3 = /*#__PURE__*/ template(`<span class="min-w-0 flex-1 truncate">`);
+var loadReorderDialog = () => import("./workspace-reorder-dialog.js");
 /**
 * Draws one placement of a mark. A function draws anew each time; a node that is
 * already placed elsewhere is copied so the original stays where it is.
@@ -20,16 +20,56 @@ function drawMark(mark, copy) {
 function WorkspaceSwitcher(props) {
 	const [open, setOpen] = createSignal(false);
 	const [reordering, setReordering] = createSignal(false);
+	const [reorderDialog, setReorderDialog] = createSignal();
+	const [reorderFailed, setReorderFailed] = createSignal(false);
+	let cancelPending;
 	let trigger;
 	const current = () => props.workspaces.find((item) => item.id === props.value);
 	const label = () => props.label ?? "Workspaces";
 	const canReorder = () => props.onReorder !== void 0 && props.workspaces.filter((item) => !item.fixed).length > 1;
+	const loadDialog = () => loadReorderDialog().then((module) => {
+		setReorderDialog(() => module.WorkspaceReorderDialog);
+		return true;
+	}, () => {
+		setReorderFailed(true);
+		return false;
+	});
+	const warm = (next) => {
+		setOpen(next);
+		if (next && canReorder() && !reorderDialog()) loadDialog();
+	};
+	const requestReorder = () => {
+		cancelPending?.();
+		if (reorderDialog()) {
+			setReordering(true);
+			return;
+		}
+		let waiting = true;
+		const stop = () => {
+			waiting = false;
+			document.removeEventListener("keydown", onKey, true);
+			document.removeEventListener("pointerdown", stop, true);
+			if (cancelPending === stop) cancelPending = void 0;
+		};
+		const onKey = (event) => {
+			if (event.key === "Escape") stop();
+		};
+		document.addEventListener("keydown", onKey, true);
+		document.addEventListener("pointerdown", stop, true);
+		cancelPending = stop;
+		loadDialog().then((loaded) => {
+			const stillWanted = waiting;
+			stop();
+			if (loaded && stillWanted) setReordering(true);
+		});
+	};
+	onCleanup(() => cancelPending?.());
 	return [createComponent(DropdownMenu, {
 		modal: false,
 		get open() {
 			return open();
 		},
-		onOpenChange: setOpen,
+		onOpenChange: warm,
 		get children() {
 			return [createComponent(DropdownMenuTrigger, {
 				as: ActionButton,
@@ -152,9 +192,12 @@ function WorkspaceSwitcher(props) {
 									},
 									get children() {
 										return createComponent(DropdownMenuItem, {
-											onSelect: () => setReordering(true),
+											get disabled() {
+												return reorderFailed();
+											},
+											onSelect: requestReorder,
 											get children() {
-												return [createComponent(ArrowDownUp, { "aria-hidden": "true" }), memo(() => props.reorderLabel ?? "Reorder workspaces…")];
+												return [createComponent(ArrowDownUp, { "aria-hidden": "true" }), memo(() => memo(() => !!reorderFailed())() ? props.reorderErrorLabel ?? "Couldn’t load reordering. Reload to try again." : props.reorderLabel ?? "Reorder workspaces…")];
 											}
 										});
 									}
@@ -180,9 +223,12 @@ function WorkspaceSwitcher(props) {
 		}
 	}), createComponent(Show, {
 		get when() {
-			return props.onReorder;
+			return memo(() => !!reorderDialog())() && props.onReorder;
 		},
-		children: (onReorder) => createComponent(WorkspaceReorderDialog, {
+		children: (onReorder) => createComponent(Dynamic, {
+			get component() {
+				return reorderDialog();
+			},
 			get open() {
 				return reordering();
 			},

package/dist/components/composites/workspace-switcher/workspace-switcher.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"workspace-switcher.js","names":["ArrowDownUp","ChevronDown","Plus","Settings","JSX","For","Show","createSignal","cn","DropdownMenu","DropdownMenuContent","DropdownMenuGroup","DropdownMenuItem","DropdownMenuLabel","DropdownMenuRadioGroup","DropdownMenuRadioItem","DropdownMenuSeparator","DropdownMenuTrigger","ActionButton","WorkspaceReorderDialog","WorkspaceSwitcherItem","id","name","mark","Element","detail","fixed","WorkspaceSwitcherProps","workspaces","value","onValueChange","onCreate","createLabel","onManage","manageLabel","onReorder","ids","Promise","reorderLabel","label","placeholder","disabled","class","drawMark","copy","Node","cloneNode","WorkspaceSwitcher","props","open","setOpen","reordering","setReordering","trigger","HTMLElement","current","find","item","canReorder","undefined","filter","length","_$createComponent","modal","onOpenChange","children","as","variant","size","ref","el","tooltip","aria-label","_el$","_tmpl$","_$insert","_c$","_$memo","_el$2","_tmpl$2","align","sideOffset","onChange","String","each","closeOnSelect","data-workspace-id","_el$3","_el$4","_tmpl$3","when","onSelect","restoreFocusRef","_$createComponent","_$memo"],"sources":["../../../../src/components/composites/workspace-switcher/workspace-switcher.tsx"],"sourcesContent":["import { ArrowDownUp, ChevronDown, Plus, Settings } from 'lucide-solid'\nimport type { JSX } from 'solid-js'\nimport { For, Show, createSignal } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '../../ui/dropdown-menu'\nimport { ActionButton } from '../action-button'\nimport { WorkspaceReorderDialog } from './workspace-reorder-dialog'\n\n/*\n WorkspaceSwitcher.\n \n The workspace picker that sits in the top bar beside the sidebar toggle. One\n * ghost button shows the current workspace's mark and name; pressing it opens a\n * radio list of the others. Choosing one only changes what the window is\n * looking at: the switcher reports the id and the host decides what that means,\n * which is why it carries no status of its own and never closes, restarts or\n * moves anything.\n \n It is deliberately the simple interaction (a single menu, not a nested\n * accordion): the sidebar below it already shows what is inside the chosen\n * workspace, so the switcher's only job is to name the workspace and let the\n * user change it.\n /\nexport type WorkspaceSwitcherItem = {\n id: string\n name: string\n /\n The workspace's mark, drawn in the trigger and in its row. Decorative.\n \n A DOM node can sit in one place, so the current workspace's mark would have\n * to be in the trigger and its menu row at once. Pass a function to draw a\n * fresh mark in each place (the preferred form). A node built once is also\n * safe: the trigger keeps it and the current row gets a copy, which carries\n * no event handlers or reactive bindings, so keep marks static.\n /\n mark: JSX.Element \| (() => JSX.Element)\n /* A quiet trailing readout in the row, e.g. an unread count. Optional. /\n detail?: JSX.Element\n /* Pinned to the top of the order, e.g. Home: it cannot be moved and nothing moves above it. /\n fixed?: boolean\n}\n\nexport type WorkspaceSwitcherProps = {\n workspaces: readonly WorkspaceSwitcherItem[]\n /* The current workspace's id. /\n value: string \| undefined\n onValueChange(id: string): void\n /* Offered at the foot of the menu when present. /\n onCreate?(): void\n createLabel?: string\n /* Offered beside the create action when present: open the current workspace's settings. /\n onManage?(): void\n manageLabel?: string\n /\n Offered when present and at least two workspaces can move: opens a dialog\n * with Move up and Move down on each row. Receives the full id order after\n * each move; the host saves it and passes the workspaces back in that order.\n /\n onReorder?(ids: readonly string[]): void \| Promise<void>\n reorderLabel?: string\n /* The menu's heading; also the trigger's accessible-name prefix. /\n label?: string\n /* Shown while no workspace is current. /\n placeholder?: string\n disabled?: boolean\n class?: string\n}\n\n/\n Draws one placement of a mark. A function draws anew each time; a node that is\n * already placed elsewhere is copied so the original stays where it is.\n */\nfunction drawMark(mark: WorkspaceSwitcherItem['mark'], copy: boolean): JSX.Element {\n if (typeof mark === 'function') return mark()\n return copy && mark instanceof Node ? mark.cloneNode(true) : mark\n}\n\nexport function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {\n const [open, setOpen] = createSignal(false)\n const [reordering, setReordering] = createSignal(false)\n let trigger: HTMLElement \| undefined\n const current = () => props.workspaces.find((item) => item.id === props.value)\n const label = () => props.label ?? 'Workspaces'\n const canReorder = () =>\n props.onReorder !== undefined && props.workspaces.filter((item) => !item.fixed).length > 1\n\n return (\n <>\n <DropdownMenu modal={false} open={open()} onOpenChange={setOpen}>\n <DropdownMenuTrigger\n as={ActionButton}\n variant=\"ghost\"\n size=\"sm\"\n disabled={props.disabled}\n ref={(el: HTMLElement) => (trigger = el)}\n data-slot=\"workspace-switcher\"\n tooltip={`Workspace: ${current()?.name ?? props.placeholder ?? 'Choose workspace'}`}\n aria-label={`Switch workspace, current: ${current()?.name ?? 'none'}`}\n class={cn('max-w-full min-w-0 shrink', props.class)}\n >\n <span aria-hidden=\"true\" class=\"flex shrink-0\">\n {current() && drawMark(current()!.mark, false)}\n </span>\n <span class=\"min-w-0 max-w-40 truncate\">\n {current()?.name ?? props.placeholder ?? 'Choose workspace'}\n </span>\n <ChevronDown aria-hidden=\"true\" class=\"size-3.5 shrink-0 text-muted-foreground\" />\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" sideOffset={6} class=\"min-w-56\">\n <DropdownMenuGroup>\n <DropdownMenuLabel>{label()}</DropdownMenuLabel>\n <DropdownMenuRadioGroup\n value={props.value}\n onChange={(value) => {\n setOpen(false)\n const id = String(value)\n if (id !== props.value) props.onValueChange(id)\n }}\n >\n <For each={props.workspaces}>\n {(item) => (\n <DropdownMenuRadioItem value={item.id} closeOnSelect data-workspace-id={item.id}>\n <span aria-hidden=\"true\" class=\"flex shrink-0\">\n {drawMark(item.mark, item.id === props.value)}\n </span>\n <span class=\"min-w-0 flex-1 truncate\">{item.name}</span>\n <Show when={item.detail}>{item.detail}</Show>\n </DropdownMenuRadioItem>\n )}\n </For>\n </DropdownMenuRadioGroup>\n </DropdownMenuGroup>\n <Show when={props.onCreate \|\| props.onManage \|\| canReorder()}>\n <DropdownMenuSeparator />\n <Show when={props.onCreate}>\n <DropdownMenuItem onSelect={() => props.onCreate?.()}>\n <Plus aria-hidden=\"true\" />\n {props.createLabel ?? 'New workspace'}\n </DropdownMenuItem>\n </Show>\n <Show when={canReorder()}>\n <DropdownMenuItem onSelect={() => setReordering(true)}>\n <ArrowDownUp aria-hidden=\"true\" />\n {props.reorderLabel ?? 'Reorder workspaces…'}\n </DropdownMenuItem>\n </Show>\n <Show when={props.onManage}>\n <DropdownMenuItem onSelect={() => props.onManage?.()}>\n <Settings aria-hidden=\"true\" />\n {props.manageLabel ?? 'Workspace settings…'}\n </DropdownMenuItem>\n </Show>\n </Show>\n </DropdownMenuContent>\n </DropdownMenu>\n <Show when={props.onReorder}>\n {(onReorder) => (\n <WorkspaceReorderDialog\n open={reordering()}\n onOpenChange={setReordering}\n workspaces={props.workspaces}\n onReorder={onReorder()}\n restoreFocusRef={() => trigger}\n />\n )}\n </Show>\n </>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"workspace-switcher.js","names":["ArrowDownUp","ChevronDown","Plus","Settings","JSX","Dynamic","For","Show","createSignal","onCleanup","cn","DropdownMenu","DropdownMenuContent","DropdownMenuGroup","DropdownMenuItem","DropdownMenuLabel","DropdownMenuRadioGroup","DropdownMenuRadioItem","DropdownMenuSeparator","DropdownMenuTrigger","ActionButton","loadReorderDialog","ReorderDialog","Awaited","ReturnType","WorkspaceSwitcherItem","id","name","mark","Element","detail","fixed","WorkspaceSwitcherProps","workspaces","value","onValueChange","onCreate","createLabel","onManage","manageLabel","onReorder","ids","Promise","reorderLabel","reorderErrorLabel","label","placeholder","disabled","class","drawMark","copy","Node","cloneNode","WorkspaceSwitcher","props","open","setOpen","reordering","setReordering","reorderDialog","setReorderDialog","reorderFailed","setReorderFailed","cancelPending","trigger","HTMLElement","current","find","item","canReorder","undefined","filter","length","loadDialog","then","module","WorkspaceReorderDialog","warm","next","requestReorder","waiting","stop","document","removeEventListener","onKey","event","KeyboardEvent","key","addEventListener","loaded","stillWanted","_$createComponent","modal","onOpenChange","children","as","variant","size","ref","el","tooltip","aria-label","_el$","_tmpl$","_$insert","_c$","_$memo","_el$2","_tmpl$2","align","sideOffset","onChange","String","each","closeOnSelect","data-workspace-id","_el$3","_el$4","_tmpl$3","when","onSelect","component","restoreFocusRef","_$createComponent","_$memo"],"sources":["../../../../src/components/composites/workspace-switcher/workspace-switcher.tsx"],"sourcesContent":["import { ArrowDownUp, ChevronDown, Plus, Settings } from 'lucide-solid'\nimport type { JSX } from 'solid-js'\nimport { Dynamic } from 'solid-js/web'\nimport { For, Show, createSignal, onCleanup } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '../../ui/dropdown-menu'\nimport { ActionButton } from '../action-button'\n\n// The dialog is only reachable from a menu item, so it stays out of the code\n// that ships with the switcher and loads on demand.\nconst loadReorderDialog = () => import('./workspace-reorder-dialog')\ntype ReorderDialog = Awaited<ReturnType<typeof loadReorderDialog>>['WorkspaceReorderDialog']\n\n/*\n WorkspaceSwitcher.\n \n The workspace picker that sits in the top bar beside the sidebar toggle. One\n * ghost button shows the current workspace's mark and name; pressing it opens a\n * radio list of the others. Choosing one only changes what the window is\n * looking at: the switcher reports the id and the host decides what that means,\n * which is why it carries no status of its own and never closes, restarts or\n * moves anything.\n \n It is deliberately the simple interaction (a single menu, not a nested\n * accordion): the sidebar below it already shows what is inside the chosen\n * workspace, so the switcher's only job is to name the workspace and let the\n * user change it.\n /\nexport type WorkspaceSwitcherItem = {\n id: string\n name: string\n /\n The workspace's mark, drawn in the trigger and in its row. Decorative.\n \n A DOM node can sit in one place, so the current workspace's mark would have\n * to be in the trigger and its menu row at once. Pass a function to draw a\n * fresh mark in each place (the preferred form). A node built once is also\n * safe: the trigger keeps it and the current row gets a copy, which carries\n * no event handlers or reactive bindings, so keep marks static.\n /\n mark: JSX.Element \| (() => JSX.Element)\n /* A quiet trailing readout in the row, e.g. an unread count. Optional. /\n detail?: JSX.Element\n /* Pinned to the top of the order, e.g. Home: it cannot be moved and nothing moves above it. /\n fixed?: boolean\n}\n\nexport type WorkspaceSwitcherProps = {\n workspaces: readonly WorkspaceSwitcherItem[]\n /* The current workspace's id. /\n value: string \| undefined\n onValueChange(id: string): void\n /* Offered at the foot of the menu when present. /\n onCreate?(): void\n createLabel?: string\n /* Offered beside the create action when present: open the current workspace's settings. /\n onManage?(): void\n manageLabel?: string\n /\n Offered when present and at least two workspaces can move: opens a dialog\n * with Move up and Move down on each row. Receives the full id order after\n * each move; the host saves it and passes the workspaces back in that order.\n /\n onReorder?(ids: readonly string[]): void \| Promise<void>\n reorderLabel?: string\n /* Replaces the \"Reorder workspaces…\" item when the dialog could not be loaded. /\n reorderErrorLabel?: string\n /* The menu's heading; also the trigger's accessible-name prefix. /\n label?: string\n /* Shown while no workspace is current. /\n placeholder?: string\n disabled?: boolean\n class?: string\n}\n\n/\n Draws one placement of a mark. A function draws anew each time; a node that is\n * already placed elsewhere is copied so the original stays where it is.\n */\nfunction drawMark(mark: WorkspaceSwitcherItem['mark'], copy: boolean): JSX.Element {\n if (typeof mark === 'function') return mark()\n return copy && mark instanceof Node ? mark.cloneNode(true) : mark\n}\n\nexport function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {\n const [open, setOpen] = createSignal(false)\n const [reordering, setReordering] = createSignal(false)\n const [reorderDialog, setReorderDialog] = createSignal<ReorderDialog>()\n const [reorderFailed, setReorderFailed] = createSignal(false)\n let cancelPending: (() => void) \| undefined\n let trigger: HTMLElement \| undefined\n const current = () => props.workspaces.find((item) => item.id === props.value)\n const label = () => props.label ?? 'Workspaces'\n const canReorder = () =>\n props.onReorder !== undefined && props.workspaces.filter((item) => !item.fixed).length > 1\n\n // Fetch the dialog's code. Safe to call early and often: the browser keeps one\n // copy, and a failure is remembered here instead of surfacing as an unhandled\n // rejection, so the switcher keeps working without reordering.\n const loadDialog = () =>\n loadReorderDialog().then(\n (module) => {\n setReorderDialog(() => module.WorkspaceReorderDialog)\n return true\n },\n () => {\n setReorderFailed(true)\n return false\n }\n )\n // Warm the chunk while the menu is open, so choosing the item rarely waits.\n const warm = (next: boolean) => {\n setOpen(next)\n if (next && canReorder() && !reorderDialog()) void loadDialog()\n }\n // Choosing the item while the code is still arriving must not open the dialog\n // late: nothing on screen can take Escape or an outside click yet, so either\n // of them withdraws the request, and the dialog opens only if the user waits.\n const requestReorder = () => {\n cancelPending?.()\n if (reorderDialog()) {\n setReordering(true)\n return\n }\n let waiting = true\n const stop = () => {\n waiting = false\n document.removeEventListener('keydown', onKey, true)\n document.removeEventListener('pointerdown', stop, true)\n if (cancelPending === stop) cancelPending = undefined\n }\n const onKey = (event: KeyboardEvent) => {\n if (event.key === 'Escape') stop()\n }\n document.addEventListener('keydown', onKey, true)\n document.addEventListener('pointerdown', stop, true)\n cancelPending = stop\n void loadDialog().then((loaded) => {\n const stillWanted = waiting\n stop()\n if (loaded && stillWanted) setReordering(true)\n })\n }\n onCleanup(() => cancelPending?.())\n\n return (\n <>\n <DropdownMenu modal={false} open={open()} onOpenChange={warm}>\n <DropdownMenuTrigger\n as={ActionButton}\n variant=\"ghost\"\n size=\"sm\"\n disabled={props.disabled}\n ref={(el: HTMLElement) => (trigger = el)}\n data-slot=\"workspace-switcher\"\n tooltip={`Workspace: ${current()?.name ?? props.placeholder ?? 'Choose workspace'}`}\n aria-label={`Switch workspace, current: ${current()?.name ?? 'none'}`}\n class={cn('max-w-full min-w-0 shrink', props.class)}\n >\n <span aria-hidden=\"true\" class=\"flex shrink-0\">\n {current() && drawMark(current()!.mark, false)}\n </span>\n <span class=\"min-w-0 max-w-40 truncate\">\n {current()?.name ?? props.placeholder ?? 'Choose workspace'}\n </span>\n <ChevronDown aria-hidden=\"true\" class=\"size-3.5 shrink-0 text-muted-foreground\" />\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" sideOffset={6} class=\"min-w-56\">\n <DropdownMenuGroup>\n <DropdownMenuLabel>{label()}</DropdownMenuLabel>\n <DropdownMenuRadioGroup\n value={props.value}\n onChange={(value) => {\n setOpen(false)\n const id = String(value)\n if (id !== props.value) props.onValueChange(id)\n }}\n >\n <For each={props.workspaces}>\n {(item) => (\n <DropdownMenuRadioItem value={item.id} closeOnSelect data-workspace-id={item.id}>\n <span aria-hidden=\"true\" class=\"flex shrink-0\">\n {drawMark(item.mark, item.id === props.value)}\n </span>\n <span class=\"min-w-0 flex-1 truncate\">{item.name}</span>\n <Show when={item.detail}>{item.detail}</Show>\n </DropdownMenuRadioItem>\n )}\n </For>\n </DropdownMenuRadioGroup>\n </DropdownMenuGroup>\n <Show when={props.onCreate \|\| props.onManage \|\| canReorder()}>\n <DropdownMenuSeparator />\n <Show when={props.onCreate}>\n <DropdownMenuItem onSelect={() => props.onCreate?.()}>\n <Plus aria-hidden=\"true\" />\n {props.createLabel ?? 'New workspace'}\n </DropdownMenuItem>\n </Show>\n <Show when={canReorder()}>\n <DropdownMenuItem disabled={reorderFailed()} onSelect={requestReorder}>\n <ArrowDownUp aria-hidden=\"true\" />\n {reorderFailed()\n ? (props.reorderErrorLabel ?? 'Couldn’t load reordering. Reload to try again.')\n : (props.reorderLabel ?? 'Reorder workspaces…')}\n </DropdownMenuItem>\n </Show>\n <Show when={props.onManage}>\n <DropdownMenuItem onSelect={() => props.onManage?.()}>\n <Settings aria-hidden=\"true\" />\n {props.manageLabel ?? 'Workspace settings…'}\n </DropdownMenuItem>\n </Show>\n </Show>\n </DropdownMenuContent>\n </DropdownMenu>\n <Show when={reorderDialog() && props.onReorder}>\n {(onReorder) => (\n <Dynamic\n component={reorderDialog()}\n open={reordering()}\n onOpenChange={setReordering}\n workspaces={props.workspaces}\n onReorder={onReorder()}\n restoreFocusRef={() => trigger}\n />\n )}\n </Show>\n </>\n )\n}\n"],"mappings":"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"}

package/dist/index.js CHANGED Viewed

@@ -189,9 +189,9 @@ import { UpdateChannelControl } from "./components/composites/update-dialog/chan
 import { AboutDialog } from "./components/composites/about-dialog/about-dialog.js";
 import { HelpCenter } from "./components/composites/help-center/help-center.js";
 import { WorkspaceMark } from "./components/composites/workspace-mark/workspace-mark.js";
+import { WorkspaceSwitcher } from "./components/composites/workspace-switcher/workspace-switcher.js";
 import { moveTarget, moveWorkspace } from "./components/composites/workspace-switcher/workspace-order.js";
 import { WorkspaceReorderDialog } from "./components/composites/workspace-switcher/workspace-reorder-dialog.js";
-import { WorkspaceSwitcher } from "./components/composites/workspace-switcher/workspace-switcher.js";
 import { MARK_IMAGE_MAX_DATA_URL_LENGTH, MARK_IMAGE_MAX_SOURCE_BYTES, MARK_IMAGE_SIZE, MarkImageError, centredSquare, checkMarkImageFile, isMarkImageDataUrl, markImageFromFile, markImageProblemCopy } from "./components/composites/icon-picker/image-data-url.js";
 import { isShellIconKey, resolveShellIcon, shellIconEntries, shellIconLabel } from "./components/composites/icon-picker/shell-icons.js";
 import { IconPicker, IconPickerDropdown } from "./components/composites/icon-picker/icon-picker.js";

package/dist/r/src/components/composites/workspace-switcher/workspace-reorder-dialog.tsx CHANGED Viewed

@@ -84,11 +84,12 @@ export function WorkspaceReorderDialog(props: WorkspaceReorderDialogProps) {
   })
   const focusMove = (owner: number, id: string, direction: WorkspaceMoveDirection) => {
-    // The host re-renders the rows with the new order; focus the same control
-    // once it exists, or its sibling when the move reached an edge.
+    // The host re-renders the rows with the new order, which replaces the control
+    // that had focus; focus the same control once it exists, or its sibling when
+    // the move reached an edge. Try at once so keys pressed right after a save
+    // still reach the dialog, and again next frame for a host that renders later.
     if (frame !== undefined) cancelAnimationFrame(frame)
-    frame = requestAnimationFrame(() => {
-      frame = undefined
+    const restore = () => {
       if (disposed || owner !== session || !props.open) return
       const row = list?.querySelector<HTMLElement>(`[data-reorder-id="${CSS.escape(id)}"]`)
       const wanted = row?.querySelector<HTMLElement>(`[data-move="${direction}"]`)
@@ -96,7 +97,12 @@ export function WorkspaceReorderDialog(props: WorkspaceReorderDialogProps) {
         `[data-move="${direction === 'up' ? 'down' : 'up'}"]`
       )
       const target = wanted?.getAttribute('aria-disabled') === 'true' ? other : wanted
-      target?.focus({ preventScroll: true })
+      if (target && document.activeElement !== target) target.focus({ preventScroll: true })
+    }
+    restore()
+    frame = requestAnimationFrame(() => {
+      frame = undefined
+      restore()
     })
   }

package/dist/r/src/components/composites/workspace-switcher/workspace-switcher.tsx CHANGED Viewed

@@ -1,6 +1,7 @@
 import { ArrowDownUp, ChevronDown, Plus, Settings } from 'lucide-solid'
 import type { JSX } from 'solid-js'
-import { For, Show, createSignal } from 'solid-js'
+import { Dynamic } from 'solid-js/web'
+import { For, Show, createSignal, onCleanup } from 'solid-js'
 import { cn } from '../../../lib/utils'
 import {
   DropdownMenu,
@@ -14,7 +15,11 @@ import {
   DropdownMenuTrigger,
 } from '../../ui/dropdown-menu'
 import { ActionButton } from '../action-button'
-import { WorkspaceReorderDialog } from './workspace-reorder-dialog'
+// The dialog is only reachable from a menu item, so it stays out of the code
+// that ships with the switcher and loads on demand.
+const loadReorderDialog = () => import('./workspace-reorder-dialog')
+type ReorderDialog = Awaited<ReturnType<typeof loadReorderDialog>>['WorkspaceReorderDialog']
 /**
  * WorkspaceSwitcher.
@@ -68,6 +73,8 @@ export type WorkspaceSwitcherProps = {
    */
   onReorder?(ids: readonly string[]): void | Promise<void>
   reorderLabel?: string
+  /** Replaces the "Reorder workspaces…" item when the dialog could not be loaded. */
+  reorderErrorLabel?: string
   /** The menu's heading; also the trigger's accessible-name prefix. */
   label?: string
   /** Shown while no workspace is current. */
@@ -88,15 +95,67 @@ function drawMark(mark: WorkspaceSwitcherItem['mark'], copy: boolean): JSX.Eleme
 export function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {
   const [open, setOpen] = createSignal(false)
   const [reordering, setReordering] = createSignal(false)
+  const [reorderDialog, setReorderDialog] = createSignal<ReorderDialog>()
+  const [reorderFailed, setReorderFailed] = createSignal(false)
+  let cancelPending: (() => void) | undefined
   let trigger: HTMLElement | undefined
   const current = () => props.workspaces.find((item) => item.id === props.value)
   const label = () => props.label ?? 'Workspaces'
   const canReorder = () =>
     props.onReorder !== undefined && props.workspaces.filter((item) => !item.fixed).length > 1
+  // Fetch the dialog's code. Safe to call early and often: the browser keeps one
+  // copy, and a failure is remembered here instead of surfacing as an unhandled
+  // rejection, so the switcher keeps working without reordering.
+  const loadDialog = () =>
+    loadReorderDialog().then(
+      (module) => {
+        setReorderDialog(() => module.WorkspaceReorderDialog)
+        return true
+      },
+      () => {
+        setReorderFailed(true)
+        return false
+      }
+    )
+  // Warm the chunk while the menu is open, so choosing the item rarely waits.
+  const warm = (next: boolean) => {
+    setOpen(next)
+    if (next && canReorder() && !reorderDialog()) void loadDialog()
+  }
+  // Choosing the item while the code is still arriving must not open the dialog
+  // late: nothing on screen can take Escape or an outside click yet, so either
+  // of them withdraws the request, and the dialog opens only if the user waits.
+  const requestReorder = () => {
+    cancelPending?.()
+    if (reorderDialog()) {
+      setReordering(true)
+      return
+    }
+    let waiting = true
+    const stop = () => {
+      waiting = false
+      document.removeEventListener('keydown', onKey, true)
+      document.removeEventListener('pointerdown', stop, true)
+      if (cancelPending === stop) cancelPending = undefined
+    }
+    const onKey = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') stop()
+    }
+    document.addEventListener('keydown', onKey, true)
+    document.addEventListener('pointerdown', stop, true)
+    cancelPending = stop
+    void loadDialog().then((loaded) => {
+      const stillWanted = waiting
+      stop()
+      if (loaded && stillWanted) setReordering(true)
+    })
+  }
+  onCleanup(() => cancelPending?.())
   return (
     <>
-      <DropdownMenu modal={false} open={open()} onOpenChange={setOpen}>
+      <DropdownMenu modal={false} open={open()} onOpenChange={warm}>
         <DropdownMenuTrigger
           as={ActionButton}
           variant="ghost"
@@ -149,9 +208,11 @@ export function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {
               </DropdownMenuItem>
             </Show>
             <Show when={canReorder()}>
-              <DropdownMenuItem onSelect={() => setReordering(true)}>
+              <DropdownMenuItem disabled={reorderFailed()} onSelect={requestReorder}>
                 <ArrowDownUp aria-hidden="true" />
-                {props.reorderLabel ?? 'Reorder workspaces…'}
+                {reorderFailed()
+                  ? (props.reorderErrorLabel ?? 'Couldn’t load reordering. Reload to try again.')
+                  : (props.reorderLabel ?? 'Reorder workspaces…')}
               </DropdownMenuItem>
             </Show>
             <Show when={props.onManage}>
@@ -163,9 +224,10 @@ export function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {
           </Show>
         </DropdownMenuContent>
       </DropdownMenu>
-      <Show when={props.onReorder}>
+      <Show when={reorderDialog() && props.onReorder}>
         {(onReorder) => (
-          <WorkspaceReorderDialog
+          <Dynamic
+            component={reorderDialog()}
             open={reordering()}
             onOpenChange={setReordering}
             workspaces={props.workspaces}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@adea-ai/ui",
-  "version": "0.145.1",
+  "version": "0.145.2",
   "description": "The Adea design system: Kobalte-backed Solid components, semantic OKLCH tokens, and the app-shell layout primitives shared by Adea and Cortana.",
   "keywords": [
     "adea",

package/src/components/composites/workspace-switcher/workspace-reorder-dialog.tsx CHANGED Viewed

@@ -84,11 +84,12 @@ export function WorkspaceReorderDialog(props: WorkspaceReorderDialogProps) {
   })
   const focusMove = (owner: number, id: string, direction: WorkspaceMoveDirection) => {
-    // The host re-renders the rows with the new order; focus the same control
-    // once it exists, or its sibling when the move reached an edge.
+    // The host re-renders the rows with the new order, which replaces the control
+    // that had focus; focus the same control once it exists, or its sibling when
+    // the move reached an edge. Try at once so keys pressed right after a save
+    // still reach the dialog, and again next frame for a host that renders later.
     if (frame !== undefined) cancelAnimationFrame(frame)
-    frame = requestAnimationFrame(() => {
-      frame = undefined
+    const restore = () => {
       if (disposed || owner !== session || !props.open) return
       const row = list?.querySelector<HTMLElement>(`[data-reorder-id="${CSS.escape(id)}"]`)
       const wanted = row?.querySelector<HTMLElement>(`[data-move="${direction}"]`)
@@ -96,7 +97,12 @@ export function WorkspaceReorderDialog(props: WorkspaceReorderDialogProps) {
         `[data-move="${direction === 'up' ? 'down' : 'up'}"]`
       )
       const target = wanted?.getAttribute('aria-disabled') === 'true' ? other : wanted
-      target?.focus({ preventScroll: true })
+      if (target && document.activeElement !== target) target.focus({ preventScroll: true })
+    }
+    restore()
+    frame = requestAnimationFrame(() => {
+      frame = undefined
+      restore()
     })
   }

package/src/components/composites/workspace-switcher/workspace-switcher.tsx CHANGED Viewed

@@ -1,6 +1,7 @@
 import { ArrowDownUp, ChevronDown, Plus, Settings } from 'lucide-solid'
 import type { JSX } from 'solid-js'
-import { For, Show, createSignal } from 'solid-js'
+import { Dynamic } from 'solid-js/web'
+import { For, Show, createSignal, onCleanup } from 'solid-js'
 import { cn } from '#lib/utils'
 import {
   DropdownMenu,
@@ -14,7 +15,11 @@ import {
   DropdownMenuTrigger,
 } from '../../ui/dropdown-menu'
 import { ActionButton } from '../action-button'
-import { WorkspaceReorderDialog } from './workspace-reorder-dialog'
+// The dialog is only reachable from a menu item, so it stays out of the code
+// that ships with the switcher and loads on demand.
+const loadReorderDialog = () => import('./workspace-reorder-dialog')
+type ReorderDialog = Awaited<ReturnType<typeof loadReorderDialog>>['WorkspaceReorderDialog']
 /**
  * WorkspaceSwitcher.
@@ -68,6 +73,8 @@ export type WorkspaceSwitcherProps = {
    */
   onReorder?(ids: readonly string[]): void | Promise<void>
   reorderLabel?: string
+  /** Replaces the "Reorder workspaces…" item when the dialog could not be loaded. */
+  reorderErrorLabel?: string
   /** The menu's heading; also the trigger's accessible-name prefix. */
   label?: string
   /** Shown while no workspace is current. */
@@ -88,15 +95,67 @@ function drawMark(mark: WorkspaceSwitcherItem['mark'], copy: boolean): JSX.Eleme
 export function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {
   const [open, setOpen] = createSignal(false)
   const [reordering, setReordering] = createSignal(false)
+  const [reorderDialog, setReorderDialog] = createSignal<ReorderDialog>()
+  const [reorderFailed, setReorderFailed] = createSignal(false)
+  let cancelPending: (() => void) | undefined
   let trigger: HTMLElement | undefined
   const current = () => props.workspaces.find((item) => item.id === props.value)
   const label = () => props.label ?? 'Workspaces'
   const canReorder = () =>
     props.onReorder !== undefined && props.workspaces.filter((item) => !item.fixed).length > 1
+  // Fetch the dialog's code. Safe to call early and often: the browser keeps one
+  // copy, and a failure is remembered here instead of surfacing as an unhandled
+  // rejection, so the switcher keeps working without reordering.
+  const loadDialog = () =>
+    loadReorderDialog().then(
+      (module) => {
+        setReorderDialog(() => module.WorkspaceReorderDialog)
+        return true
+      },
+      () => {
+        setReorderFailed(true)
+        return false
+      }
+    )
+  // Warm the chunk while the menu is open, so choosing the item rarely waits.
+  const warm = (next: boolean) => {
+    setOpen(next)
+    if (next && canReorder() && !reorderDialog()) void loadDialog()
+  }
+  // Choosing the item while the code is still arriving must not open the dialog
+  // late: nothing on screen can take Escape or an outside click yet, so either
+  // of them withdraws the request, and the dialog opens only if the user waits.
+  const requestReorder = () => {
+    cancelPending?.()
+    if (reorderDialog()) {
+      setReordering(true)
+      return
+    }
+    let waiting = true
+    const stop = () => {
+      waiting = false
+      document.removeEventListener('keydown', onKey, true)
+      document.removeEventListener('pointerdown', stop, true)
+      if (cancelPending === stop) cancelPending = undefined
+    }
+    const onKey = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') stop()
+    }
+    document.addEventListener('keydown', onKey, true)
+    document.addEventListener('pointerdown', stop, true)
+    cancelPending = stop
+    void loadDialog().then((loaded) => {
+      const stillWanted = waiting
+      stop()
+      if (loaded && stillWanted) setReordering(true)
+    })
+  }
+  onCleanup(() => cancelPending?.())
   return (
     <>
-      <DropdownMenu modal={false} open={open()} onOpenChange={setOpen}>
+      <DropdownMenu modal={false} open={open()} onOpenChange={warm}>
         <DropdownMenuTrigger
           as={ActionButton}
           variant="ghost"
@@ -149,9 +208,11 @@ export function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {
               </DropdownMenuItem>
             </Show>
             <Show when={canReorder()}>
-              <DropdownMenuItem onSelect={() => setReordering(true)}>
+              <DropdownMenuItem disabled={reorderFailed()} onSelect={requestReorder}>
                 <ArrowDownUp aria-hidden="true" />
-                {props.reorderLabel ?? 'Reorder workspaces…'}
+                {reorderFailed()
+                  ? (props.reorderErrorLabel ?? 'Couldn’t load reordering. Reload to try again.')
+                  : (props.reorderLabel ?? 'Reorder workspaces…')}
               </DropdownMenuItem>
             </Show>
             <Show when={props.onManage}>
@@ -163,9 +224,10 @@ export function WorkspaceSwitcher(props: WorkspaceSwitcherProps) {
           </Show>
         </DropdownMenuContent>
       </DropdownMenu>
-      <Show when={props.onReorder}>
+      <Show when={reorderDialog() && props.onReorder}>
         {(onReorder) => (
-          <WorkspaceReorderDialog
+          <Dynamic
+            component={reorderDialog()}
             open={reordering()}
             onOpenChange={setReordering}
             workspaces={props.workspaces}