@chelone/vue 0.6.0 → 0.7.0

package/dist/components/admin/layout/assistant.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,244 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { cn } from "../../../lib/utils.js";
+import { useMicroStore } from "../../../store/use-micro-store.js";
+import button_default from "../../ui/button.js";
+import confirm_default from "../feedback/confirm.js";
+import { MessageCircleIcon, SendIcon, SquareIcon, XIcon } from "./icons.js";
+import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, effectScope, nextTick, normalizeClass, onBeforeUnmount, openBlock, renderList, shallowRef, toDisplayString, unref, useId, vModelText, watch, withCtx, withDirectives } from "vue";
+import { createAssistantSession } from "@chelone/core";
+// src/components/admin/layout/assistant.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["id", "aria-labelledby"];
+var _hoisted_2 = { class: "flex items-center justify-between border-b p-3" };
+var _hoisted_3 = ["id"];
+var _hoisted_4 = ["aria-label"];
+var _hoisted_5 = {
+	key: 0,
+	class: "text-sm text-muted-foreground"
+};
+var _hoisted_6 = {
+	key: 0,
+	"data-role": "tool",
+	class: "rounded-md bg-muted/40 px-2 py-1 font-mono text-xs"
+};
+var _hoisted_7 = ["data-role"];
+var _hoisted_8 = {
+	key: 2,
+	class: "text-xs italic text-muted-foreground"
+};
+var _hoisted_9 = {
+	key: 0,
+	role: "alert",
+	class: "flex items-center justify-between gap-2 border-t px-3 py-2 text-sm text-destructive"
+};
+var _hoisted_10 = { class: "flex gap-2 border-t p-2" };
+var _hoisted_11 = ["placeholder", "aria-label"];
+var _hoisted_12 = { class: "overflow-auto whitespace-pre-wrap font-mono text-xs" };
+var assistant_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "assistant",
+	props: {
+		transport: {},
+		tools: { default: () => ({}) },
+		placement: { default: "bottom-right" },
+		triggerLabel: {},
+		welcomeMessage: {},
+		maxToolRounds: {}
+	},
+	setup(__props) {
+		/**
+		* `<Assistant>` — a floating chat that streams a model's replies and runs the
+		* app's tools. The Vue twin of `@chelone/react`'s `layout/assistant.tsx`. The
+		* session (messages, streaming, tool rounds, stop) lives in `@chelone/core`;
+		* this file is the Vue shell around it, with the same markup, `data-slot`
+		* names, roles and translate keys.
+		*
+		* A tool with `confirm` opens `<Confirm>`. Closing the panel keeps the stream
+		* running; unmounting, or a new `transport`, `tools` or `maxToolRounds`, ends
+		* the turn: no tool runs after it and no dialog stays open.
+		*
+		* @example
+		* <Assistant :transport="httpAssistantTransport({ url: '/api/assistant' })" :tools="tools" />
+		*/
+		const props = __props;
+		const triggerPosition = {
+			"bottom-right": "bottom-4 right-4",
+			"bottom-left": "bottom-4 left-4",
+			sidebar: "top-4 right-4"
+		};
+		const panelPosition = {
+			"bottom-right": "bottom-20 right-4",
+			"bottom-left": "bottom-20 left-4",
+			sidebar: "top-20 right-4"
+		};
+		const translate = useTranslate();
+		const open = shallowRef(false);
+		const input = shallowRef("");
+		const pending = shallowRef(null);
+		const logEl = shallowRef(null);
+		const panelId = useId();
+		const titleId = useId();
+		function settle(answer) {
+			pending.value?.resolve(answer);
+			pending.value = null;
+		}
+		function start() {
+			const session = createAssistantSession({
+				transport: props.transport,
+				tools: props.tools,
+				maxToolRounds: props.maxToolRounds,
+				confirmTool: (call) => new Promise((resolve) => {
+					pending.value = {
+						call,
+						resolve
+					};
+				})
+			});
+			const scope = effectScope();
+			const state = scope.run(() => useMicroStore(session));
+			if (!state) throw new Error("Assistant: the session scope is not active");
+			return {
+				session,
+				state,
+				scope
+			};
+		}
+		function end({ session, scope }) {
+			scope.stop();
+			session.stop();
+			settle(false);
+		}
+		const live = shallowRef(start());
+		watch(() => [
+			props.transport,
+			props.tools,
+			props.maxToolRounds
+		], () => {
+			end(live.value);
+			live.value = start();
+		});
+		onBeforeUnmount(() => end(live.value));
+		watch([() => live.value.state.value, open], async () => {
+			await nextTick();
+			const el = logEl.value;
+			if (el) el.scrollTop = el.scrollHeight;
+		}, { flush: "post" });
+		function send() {
+			const { session, state } = live.value;
+			if (state.value.status === "streaming" || !input.value.trim()) return;
+			session.send(input.value);
+			input.value = "";
+		}
+		function retry() {
+			live.value.session.retry();
+		}
+		function onKeydown(event) {
+			if (event.key !== "Enter" || event.shiftKey || event.isComposing) return;
+			event.preventDefault();
+			send();
+		}
+		const label = () => props.triggerLabel ?? translate("chelone.assistant.trigger", { _: "Ask" });
+		const welcome = () => props.welcomeMessage ?? translate("chelone.assistant.welcome", { _: "Hi! Ask me anything." });
+		const placeholder = () => translate("chelone.assistant.placeholder", { _: "Ask…" });
+		const confirmTitle = () => translate("chelone.assistant.confirm", {
+			_: "Run {name}?",
+			name: pending.value?.call.toolName ?? ""
+		});
+		const confirmContent = () => JSON.stringify(pending.value?.call.args ?? {}, null, 2);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [
+				createVNode(button_default, {
+					class: normalizeClass(unref(cn)("fixed z-50 gap-2 rounded-full shadow-lg", triggerPosition[__props.placement])),
+					"aria-expanded": open.value,
+					"aria-controls": open.value ? unref(panelId) : void 0,
+					"data-slot": "assistant-trigger",
+					onClick: _cache[0] || (_cache[0] = ($event) => open.value = !open.value)
+				}, {
+					default: withCtx(() => [createVNode(unref(MessageCircleIcon), { class: "size-4" }), createTextVNode(" " + toDisplayString(label()), 1)]),
+					_: 1
+				}, 8, [
+					"class",
+					"aria-expanded",
+					"aria-controls"
+				]),
+				open.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					id: unref(panelId),
+					role: "dialog",
+					"aria-labelledby": unref(titleId),
+					"data-slot": "assistant-panel",
+					class: normalizeClass(unref(cn)("fixed z-50 flex max-h-[80vh] w-96 flex-col rounded-md border bg-background shadow-xl", panelPosition[__props.placement]))
+				}, [
+					createElementVNode("div", _hoisted_2, [createElementVNode("div", {
+						id: unref(titleId),
+						class: "text-sm font-medium"
+					}, toDisplayString(label()), 9, _hoisted_3), createElementVNode("button", {
+						type: "button",
+						"aria-label": unref(translate)("chelone.assistant.close", { _: "Close" }),
+						class: "rounded-md p-1 text-muted-foreground hover:bg-accent",
+						onClick: _cache[1] || (_cache[1] = ($event) => open.value = false)
+					}, [createVNode(unref(XIcon), { class: "size-4" })], 8, _hoisted_4)]),
+					createElementVNode("div", {
+						ref_key: "logEl",
+						ref: logEl,
+						role: "log",
+						"aria-live": "polite",
+						class: "flex flex-1 flex-col gap-2 overflow-y-auto p-3"
+					}, [live.value.state.value.messages.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_5, toDisplayString(welcome()), 1)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(live.value.state.value.messages, (message, index) => {
+						return openBlock(), createElementBlock(Fragment, { key: index }, [message.role === "tool" ? (openBlock(), createElementBlock("div", _hoisted_6, toDisplayString(message.toolName) + " → " + toDisplayString(message.error ?? JSON.stringify(message.result)), 1)) : message.role === "user" || message.content ? (openBlock(), createElementBlock("div", {
+							key: 1,
+							"data-role": message.role,
+							class: normalizeClass(unref(cn)("max-w-[85%] whitespace-pre-wrap rounded-md px-2 py-1 text-sm", message.role === "user" ? "self-end bg-primary text-primary-foreground" : "self-start bg-muted"))
+						}, toDisplayString(message.content), 11, _hoisted_7)) : createCommentVNode("", true)], 64);
+					}), 128)), live.value.state.value.status === "streaming" ? (openBlock(), createElementBlock("div", _hoisted_8, toDisplayString(unref(translate)("chelone.assistant.thinking", { _: "Thinking…" })), 1)) : createCommentVNode("", true)], 512),
+					live.value.state.value.status === "error" ? (openBlock(), createElementBlock("div", _hoisted_9, [createElementVNode("span", null, toDisplayString(unref(translate)("chelone.assistant.error", { _: "Something went wrong." })) + " " + toDisplayString(live.value.state.value.error?.message), 1), createVNode(button_default, {
+						variant: "outline",
+						size: "sm",
+						onClick: retry
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(translate)("chelone.assistant.retry", { _: "Retry" })), 1)]),
+						_: 1
+					})])) : createCommentVNode("", true),
+					createElementVNode("div", _hoisted_10, [withDirectives(createElementVNode("input", {
+						"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => input.value = $event),
+						type: "text",
+						placeholder: placeholder(),
+						"aria-label": placeholder(),
+						"data-slot": "assistant-input",
+						class: "flex-1 rounded-md border bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring",
+						onKeydown
+					}, null, 40, _hoisted_11), [[vModelText, input.value]]), live.value.state.value.status === "streaming" ? (openBlock(), createBlock(button_default, {
+						key: 0,
+						variant: "outline",
+						size: "icon",
+						class: "size-8",
+						"aria-label": unref(translate)("chelone.assistant.stop", { _: "Stop" }),
+						"data-slot": "assistant-stop",
+						onClick: _cache[3] || (_cache[3] = ($event) => live.value.session.stop())
+					}, {
+						default: withCtx(() => [createVNode(unref(SquareIcon), { class: "size-3" })]),
+						_: 1
+					}, 8, ["aria-label"])) : (openBlock(), createBlock(button_default, {
+						key: 1,
+						size: "icon",
+						class: "size-8",
+						disabled: !input.value.trim(),
+						"aria-label": unref(translate)("chelone.assistant.send", { _: "Send" }),
+						onClick: send
+					}, {
+						default: withCtx(() => [createVNode(unref(SendIcon), { class: "size-3" })]),
+						_: 1
+					}, 8, ["disabled", "aria-label"]))])
+				], 10, _hoisted_1)) : createCommentVNode("", true),
+				createVNode(confirm_default, {
+					"is-open": pending.value !== null,
+					title: confirmTitle(),
+					onConfirm: _cache[4] || (_cache[4] = ($event) => settle(true)),
+					onClose: _cache[5] || (_cache[5] = ($event) => settle(false))
+				}, {
+					default: withCtx(() => [createElementVNode("pre", _hoisted_12, toDisplayString(confirmContent()), 1)]),
+					_: 1
+				}, 8, ["is-open", "title"])
+			], 64);
+		};
+	}
+});
+export { assistant_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/command-menu-content.js

@@ -0,0 +1,4 @@
+import command_menu_content_vue_vue_type_script_setup_true_lang_default from "./command-menu-content.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/command-menu-content.vue
+var command_menu_content_default = command_menu_content_vue_vue_type_script_setup_true_lang_default;
+export { command_menu_content_default as default };

package/dist/components/admin/layout/command-menu-content.vue.d.ts

@@ -10,7 +10,9 @@ export interface CommandMenuContentProps {
     /** Registered commands plus the `actions` prop, in order. */
     commands: CommandMenuAction[];
 }
-declare const _default: import("vue").DefineComponent<CommandMenuContentProps & {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<CommandMenuContentProps & {
     query: string;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: () => any;
@@ -23,4 +25,3 @@ declare const _default: import("vue").DefineComponent<CommandMenuContentProps &
     "onUpdate:query"?: ((value: string) => any) | undefined;
     onRun?: ((action: CommandMenuAction) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/components/admin/layout/command-menu-content.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,289 @@
+import { useResourceRegistry } from "../../../admin/resource-registry.js";
+import { useCheloneContext } from "../../../context.js";
+import { useRefresh } from "../../../data/use-refresh.js";
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { useGetResourceLabel } from "../../../label/use-get-resource-label.js";
+import { useCreatePath, useNavigate } from "../../../router/nav-composables.js";
+import { useStore } from "../../../store/use-store-item.js";
+import { CommandEmpty, CommandList, CommandShortcut } from "../../ui/command/parts.js";
+import command_group_default from "../../ui/command/command-group.js";
+import command_input_default from "../../ui/command/command-input.js";
+import command_item_default from "../../ui/command/command-item.js";
+import { useCommand } from "../../ui/command/context.js";
+import command_menu_gate_default from "./command-menu-gate.js";
+import command_menu_logout_default from "./command-menu-logout.js";
+import command_menu_record_search_default from "./command-menu-record-search.js";
+import { ListIcon } from "./icons.js";
+import { useTheme } from "./theme-context.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, onScopeDispose, openBlock, ref, renderList, resolveDynamicComponent, toDisplayString, unref, useModel, watch, withCtx } from "vue";
+import { getVisibleCommands, groupCommands, recentsKey, rememberRecent } from "@chelone/core";
+// src/components/admin/layout/command-menu-content.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	class: "flex items-center gap-4 border-t px-3 py-2 text-xs text-muted-foreground",
+	"data-slot": "command-menu-footer"
+};
+var _hoisted_2 = { class: "flex items-center gap-1" };
+var _hoisted_3 = { class: "flex items-center gap-1" };
+var _hoisted_4 = { class: "flex items-center gap-1" };
+var command_menu_content_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "command-menu-content",
+	props: /*@__PURE__*/ mergeModels({
+		resources: {},
+		searchFields: {},
+		perResourceLimit: {},
+		recentsLimit: {},
+		searchDebounceMs: {},
+		placeholder: {},
+		commands: {}
+	}, {
+		"query": { required: true },
+		"queryModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["close", "run"], ["update:query"]),
+	setup(__props, { emit: __emit }) {
+		/**
+		* The inside of the menu: the search box, the groups and the footer. It sits
+		* under a `<Command>`, in the dialog or in the bottom sheet, and mirrors that
+		* command's search text into the menu's `query` so `setQuery` and the record
+		* search see one value.
+		*/
+		const props = __props;
+		const query = useModel(__props, "query");
+		const emit = __emit;
+		const translate = useTranslate();
+		const getResourceLabel = useGetResourceLabel();
+		const registry = useResourceRegistry();
+		const createPath = useCreatePath();
+		const navigate = useNavigate();
+		const refresh = useRefresh();
+		const { setTheme } = useTheme();
+		const { authProvider, store } = useCheloneContext();
+		const command = useCommand();
+		watch(() => command.search.value, (text) => {
+			if (text !== query.value) query.value = text;
+		});
+		watch(query, (text) => {
+			if (text !== command.search.value) command.setSearch(text);
+		}, { immediate: true });
+		const settled = ref("");
+		let timer;
+		watch([query, () => props.searchDebounceMs], ([text, wait]) => {
+			clearTimeout(timer);
+			if (text.trim() === "") {
+				settled.value = "";
+				return;
+			}
+			timer = setTimeout(() => {
+				settled.value = text;
+			}, wait);
+		}, { immediate: true });
+		onScopeDispose(() => clearTimeout(timer));
+		const names = computed(() => {
+			const listed = Object.keys(registry.definitions).filter((name) => registry.definitions[name]?.list != null);
+			const only = props.resources;
+			return only ? listed.filter((name) => only.includes(name)) : listed;
+		});
+		/** The record view a hit opens: show when the resource has one, else edit. */
+		function recordView(resource) {
+			const definition = registry.definitions[resource];
+			if (definition?.show) return "show";
+			return definition?.edit ? "edit" : void 0;
+		}
+		const searched = computed(() => names.value.filter((name) => recordView(name) !== void 0));
+		const [stored, setStored] = store ? useStore(recentsKey, []) : [ref([]), (_) => {}];
+		const recents = computed(() => (stored.value ?? []).filter((entry) => entry.type === "resource" ? registry.definitions[entry.resource]?.list != null : recordView(entry.resource) !== void 0).slice(0, props.recentsLimit));
+		const showRecents = computed(() => query.value.trim() === "" && recents.value.length > 0);
+		function remember(entry) {
+			setStored(rememberRecent(stored.value ?? [], entry, props.recentsLimit));
+		}
+		function go(entry) {
+			emit("close");
+			remember(entry);
+			if (entry.type === "resource") {
+				navigate(createPath({
+					resource: entry.resource,
+					type: "list"
+				}));
+				return;
+			}
+			const type = recordView(entry.resource);
+			if (type && entry.id !== void 0) navigate(createPath({
+				resource: entry.resource,
+				id: entry.id,
+				type
+			}));
+		}
+		const builtIns = computed(() => {
+			const theme = translate("chelone.command_menu.theme", { _: "Theme" });
+			return [{
+				id: "refresh",
+				label: translate("chelone.command_menu.refresh", { _: "Refresh" }),
+				keywords: ["reload", "data"],
+				onSelect: refresh
+			}, ...[
+				"light",
+				"dark",
+				"system"
+			].map((mode) => ({
+				id: `theme-${mode}`,
+				label: translate(`chelone.command_menu.theme_${mode}`, { _: `${mode[0]?.toUpperCase()}${mode.slice(1)} theme` }),
+				group: theme,
+				keywords: [
+					"theme",
+					"appearance",
+					"mode"
+				],
+				onSelect: () => setTheme(mode)
+			}))];
+		});
+		const groups = computed(() => groupCommands(getVisibleCommands([...props.commands, ...builtIns.value]).map((action) => ({
+			...action,
+			keywords: [...action.keywords ?? [], action.id]
+		}))));
+		const resourceItems = computed(() => names.value.map((name) => ({
+			name,
+			label: getResourceLabel(name, 2),
+			keywords: [name]
+		})));
+		const recentItems = computed(() => recents.value.map((entry) => ({
+			entry,
+			key: `${entry.type}/${entry.resource}/${entry.id ?? ""}`,
+			keywords: [entry.label]
+		})));
+		function heading(group) {
+			return group === "actions" ? translate("chelone.command_menu.actions", { _: "Actions" }) : group;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [
+				createVNode(unref(command_input_default), { placeholder: __props.placeholder ?? unref(translate)("chelone.command_menu.placeholder", { _: "Type a command or search..." }) }, null, 8, ["placeholder"]),
+				createVNode(unref(CommandList), null, {
+					default: withCtx(() => [
+						createVNode(unref(CommandEmpty), null, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(translate)("chelone.command_menu.empty", { _: "No results found." })), 1)]),
+							_: 1
+						}),
+						showRecents.value ? (openBlock(), createBlock(unref(command_group_default), {
+							key: 0,
+							heading: unref(translate)("chelone.command_menu.recent", { _: "Recent" })
+						}, {
+							default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(recentItems.value, ({ entry, key, keywords }) => {
+								return openBlock(), createBlock(command_menu_gate_default, {
+									key,
+									resource: entry.resource
+								}, {
+									default: withCtx(() => [createVNode(unref(command_item_default), {
+										value: `recent/${key}`,
+										keywords,
+										onSelect: ($event) => go(entry)
+									}, {
+										default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(unref(registry).definitions[entry.resource]?.icon ?? unref(ListIcon)))), createTextVNode(" " + toDisplayString(entry.label), 1)]),
+										_: 2
+									}, 1032, [
+										"value",
+										"keywords",
+										"onSelect"
+									])]),
+									_: 2
+								}, 1032, ["resource"]);
+							}), 128))]),
+							_: 1
+						}, 8, ["heading"])) : createCommentVNode("", true),
+						createVNode(unref(command_group_default), { heading: unref(translate)("chelone.command_menu.resources", { _: "Resources" }) }, {
+							default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(resourceItems.value, (item) => {
+								return openBlock(), createBlock(command_menu_gate_default, {
+									key: item.name,
+									resource: item.name
+								}, {
+									default: withCtx(() => [createVNode(unref(command_item_default), {
+										value: item.label,
+										keywords: item.keywords,
+										onSelect: ($event) => go({
+											type: "resource",
+											resource: item.name,
+											label: item.label
+										})
+									}, {
+										default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(unref(registry).definitions[item.name]?.icon ?? unref(ListIcon)))), createTextVNode(" " + toDisplayString(item.label), 1)]),
+										_: 2
+									}, 1032, [
+										"value",
+										"keywords",
+										"onSelect"
+									])]),
+									_: 2
+								}, 1032, ["resource"]);
+							}), 128))]),
+							_: 1
+						}, 8, ["heading"]),
+						(openBlock(true), createElementBlock(Fragment, null, renderList(searched.value, (name) => {
+							return openBlock(), createBlock(command_menu_record_search_default, {
+								key: name,
+								resource: name,
+								query: settled.value,
+								field: __props.searchFields[name] ?? "q",
+								limit: __props.perResourceLimit,
+								onSelect: (hit) => go({
+									type: "record",
+									resource: name,
+									id: hit.id,
+									label: hit.label
+								})
+							}, null, 8, [
+								"resource",
+								"query",
+								"field",
+								"limit",
+								"onSelect"
+							]);
+						}), 128)),
+						(openBlock(true), createElementBlock(Fragment, null, renderList(groups.value, ([group, members]) => {
+							return openBlock(), createBlock(unref(command_group_default), {
+								key: group,
+								heading: heading(group)
+							}, {
+								default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(members, (action) => {
+									return openBlock(), createBlock(unref(command_item_default), {
+										key: action.id,
+										value: action.label,
+										keywords: action.keywords,
+										onSelect: ($event) => emit("run", action)
+									}, {
+										default: withCtx(() => [
+											action.icon ? (openBlock(), createBlock(resolveDynamicComponent(action.icon), { key: 0 })) : createCommentVNode("", true),
+											createTextVNode(" " + toDisplayString(action.label) + " ", 1),
+											action.shortcut ? (openBlock(), createBlock(unref(CommandShortcut), { key: 1 }, {
+												default: withCtx(() => [createTextVNode(toDisplayString(action.shortcut), 1)]),
+												_: 2
+											}, 1024)) : createCommentVNode("", true)
+										]),
+										_: 2
+									}, 1032, [
+										"value",
+										"keywords",
+										"onSelect"
+									]);
+								}), 128))]),
+								_: 2
+							}, 1032, ["heading"]);
+						}), 128)),
+						unref(authProvider) ? (openBlock(), createBlock(command_menu_logout_default, {
+							key: 1,
+							onSelect: _cache[0] || (_cache[0] = ($event) => emit("close"))
+						})) : createCommentVNode("", true)
+					]),
+					_: 1
+				}),
+				createElementVNode("div", _hoisted_1, [
+					createElementVNode("span", _hoisted_2, [
+						_cache[1] || (_cache[1] = createElementVNode("kbd", { class: "rounded border px-1 font-mono" }, "↑", -1)),
+						_cache[2] || (_cache[2] = createElementVNode("kbd", { class: "rounded border px-1 font-mono" }, "↓", -1)),
+						createTextVNode(" " + toDisplayString(unref(translate)("chelone.command_menu.navigate", { _: "Navigate" })), 1)
+					]),
+					createElementVNode("span", _hoisted_3, [_cache[3] || (_cache[3] = createElementVNode("kbd", { class: "rounded border px-1 font-mono" }, "↵", -1)), createTextVNode(" " + toDisplayString(unref(translate)("chelone.command_menu.select", { _: "Select" })), 1)]),
+					createElementVNode("span", _hoisted_4, [_cache[4] || (_cache[4] = createElementVNode("kbd", { class: "rounded border px-1 font-mono" }, "Esc", -1)), createTextVNode(" " + toDisplayString(unref(translate)("chelone.command_menu.close", { _: "Close" })), 1)])
+				])
+			], 64);
+		};
+	}
+});
+export { command_menu_content_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/command-menu-context.d.ts

@@ -4,8 +4,13 @@
  */
 import type { CommandAction } from "@chelone/core";
 import { type Component, type InjectionKey, type MaybeRefOrGetter, type Ref } from "vue";
-/** A command in the menu. The label is text and the icon is a Vue component. */
-export type CommandMenuAction = CommandAction<string, Component>;
+/**
+ * A command in the menu. The label is text and the icon is a Vue component.
+ * `onSelect` may return a promise; the menu reports a rejection as an error.
+ */
+export type CommandMenuAction = Omit<CommandAction<string, Component>, "onSelect"> & {
+    onSelect: () => void | Promise<void>;
+};
 /** What `useCommandMenu()` returns. */
 export interface CommandMenuContextValue {
     isOpen: Readonly<Ref<boolean>>;

package/dist/components/admin/layout/command-menu-context.js

@@ -1,31 +1,27 @@
-import { inject, watch, toValue, onScopeDispose } from "vue";
-const CommandMenuKey = /* @__PURE__ */ Symbol(
-  "chelone-command-menu"
-);
+import { inject, onScopeDispose, toValue, watch } from "vue";
+// src/components/admin/layout/command-menu-context.ts
+var CommandMenuKey = Symbol("chelone-command-menu");
+/** Throws outside a `<CommandMenu>`, so a missing provider fails loudly. */
 function useCommandMenu() {
-  const ctx = inject(CommandMenuKey, null);
-  if (!ctx) {
-    throw new Error(
-      "useCommandMenu: no <CommandMenu> found above this component."
-    );
-  }
-  return ctx;
+	const ctx = inject(CommandMenuKey, null);
+	if (!ctx) throw new Error("useCommandMenu: no <CommandMenu> found above this component.");
+	return ctx;
 }
+/**
+* Adds a command to the menu while the calling scope lives. It registers in
+* setup, registers again when `action` changes, and removes the command when
+* the scope is disposed.
+*/
 function useRegisterCommand(action) {
-  const { registerCommand } = useCommandMenu();
-  let remove;
-  watch(
-    () => toValue(action),
-    (next) => {
-      remove?.();
-      remove = registerCommand(next);
-    },
-    { immediate: true, flush: "sync" }
-  );
-  onScopeDispose(() => remove?.());
+	const { registerCommand } = useCommandMenu();
+	let remove;
+	watch(() => toValue(action), (next) => {
+		remove?.();
+		remove = registerCommand(next);
+	}, {
+		immediate: true,
+		flush: "sync"
+	});
+	onScopeDispose(() => remove?.());
 }
-export {
-  CommandMenuKey,
-  useCommandMenu,
-  useRegisterCommand
-};
+export { CommandMenuKey, useCommandMenu, useRegisterCommand };

package/dist/components/admin/layout/command-menu-gate.js

@@ -0,0 +1,4 @@
+import command_menu_gate_vue_vue_type_script_setup_true_lang_default from "./command-menu-gate.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/command-menu-gate.vue
+var command_menu_gate_default = command_menu_gate_vue_vue_type_script_setup_true_lang_default;
+export { command_menu_gate_default as default };

package/dist/components/admin/layout/command-menu-gate.vue.d.ts

@@ -1,12 +1,15 @@
 type __VLS_Props = {
     resource: string;
 };
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        default?: (props: {}) => any;
+    };
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {