@chelone/vue 0.6.0 → 0.9.0

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

@@ -0,0 +1,132 @@
+import { useCheloneNotifications } from "../../../context.js";
+import { useTranslate } from "../../../i18n/use-translate.js";
+import command_dialog_default from "../../ui/command/command-dialog.js";
+import command_menu_content_default from "./command-menu-content.js";
+import { CommandMenuKey } from "./command-menu-context.js";
+import { Fragment, computed, createElementBlock, createVNode, defineComponent, onBeforeUnmount, onMounted, onScopeDispose, openBlock, provide, ref, renderSlot, shallowRef, unref, withCtx } from "vue";
+import { DEFAULT_RECENTS_LIMIT, DEFAULT_SEARCH_DEBOUNCE_MS, createCommandRegistry, shouldHandleHotkey } from "@chelone/core";
+// src/components/admin/layout/command-menu.vue?vue&type=script&setup=true&lang.ts
+var command_menu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "command-menu",
+	props: {
+		hotkey: {
+			type: [String, Boolean],
+			default: "mod+k"
+		},
+		resources: { default: void 0 },
+		searchFields: { default: () => ({}) },
+		perResourceLimit: { default: 5 },
+		recentsLimit: { default: DEFAULT_RECENTS_LIMIT },
+		actions: { default: () => [] },
+		placeholder: { default: void 0 },
+		searchDebounceMs: { default: DEFAULT_SEARCH_DEBOUNCE_MS }
+	},
+	setup(__props) {
+		/**
+		* `<CommandMenu>` — a keyboard-driven menu to jump to a resource or a record
+		* and to run actions. The Vue twin of `@chelone/react`'s `CommandMenu`. Wrap
+		* the layout in it (`<CommandMenu><Layout /></CommandMenu>` in the `#layout`
+		* slot of `<Admin>`): the default slot renders inside the provider and outside
+		* the dialog, so descendants can call `useCommandMenu` and `useRegisterCommand`.
+		*
+		* It is a `CommandDialog` on every screen size.
+		*/
+		const props = __props;
+		const translate = useTranslate();
+		const notifications = useCheloneNotifications();
+		const isOpen = ref(false);
+		const query = ref("");
+		function open() {
+			isOpen.value = true;
+		}
+		function close() {
+			isOpen.value = false;
+			query.value = "";
+		}
+		function toggle() {
+			if (isOpen.value) close();
+			else open();
+		}
+		const registry = createCommandRegistry();
+		const registered = shallowRef(registry.store.getSnapshot().commands);
+		onScopeDispose(registry.store.subscribe(() => {
+			registered.value = registry.store.getSnapshot().commands;
+		}));
+		const commands = computed(() => [...registered.value, ...props.actions]);
+		provide(CommandMenuKey, {
+			isOpen,
+			open,
+			close,
+			toggle,
+			setQuery: (text) => {
+				query.value = text;
+			},
+			registerCommand: (action) => registry.register(action),
+			unregisterCommand: (id) => registry.unregister(id)
+		});
+		function onKeydown(event) {
+			if (props.hotkey === false) return;
+			const target = event.target instanceof HTMLElement ? event.target : null;
+			if (!shouldHandleHotkey(event, props.hotkey, target)) return;
+			event.preventDefault();
+			toggle();
+		}
+		onMounted(() => window.addEventListener("keydown", onKeydown));
+		onBeforeUnmount(() => window.removeEventListener("keydown", onKeydown));
+		function onOpenChange(next) {
+			if (next) open();
+			else close();
+		}
+		function fail() {
+			notifications?.notify("chelone.notification.http_error", { type: "error" });
+		}
+		function run(action) {
+			close();
+			try {
+				const result = action.onSelect();
+				if (result) Promise.resolve(result).then(void 0, fail);
+			} catch {
+				fail();
+			}
+		}
+		const title = computed(() => translate("chelone.command_menu.title", { _: "Command menu" }));
+		const description = computed(() => translate("chelone.command_menu.description", { _: "Jump to a page or record, or run an action." }));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [renderSlot(_ctx.$slots, "default"), createVNode(unref(command_dialog_default), {
+				open: isOpen.value,
+				title: title.value,
+				description: description.value,
+				"onUpdate:open": onOpenChange
+			}, {
+				default: withCtx(() => [createVNode(command_menu_content_default, {
+					query: query.value,
+					"onUpdate:query": _cache[0] || (_cache[0] = ($event) => query.value = $event),
+					resources: __props.resources,
+					"search-fields": __props.searchFields,
+					"per-resource-limit": __props.perResourceLimit,
+					"recents-limit": __props.recentsLimit,
+					"search-debounce-ms": __props.searchDebounceMs,
+					placeholder: __props.placeholder,
+					commands: commands.value,
+					onClose: close,
+					onRun: run
+				}, null, 8, [
+					"query",
+					"resources",
+					"search-fields",
+					"per-resource-limit",
+					"recents-limit",
+					"search-debounce-ms",
+					"placeholder",
+					"commands"
+				])]),
+				_: 1
+			}, 8, [
+				"open",
+				"title",
+				"description"
+			])], 64);
+		};
+	}
+});
+export { command_menu_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/dashboard-menu-item.js

@@ -0,0 +1,4 @@
+import dashboard_menu_item_vue_vue_type_script_setup_true_lang_default from "./dashboard-menu-item.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/dashboard-menu-item.vue
+var dashboard_menu_item_default = dashboard_menu_item_vue_vue_type_script_setup_true_lang_default;
+export { dashboard_menu_item_default as default };

package/dist/components/admin/layout/dashboard-menu-item.vue.d.ts

@@ -10,5 +10,6 @@ export interface DashboardMenuItemProps {
     /** Click handler invoked alongside the default navigation (e.g. close the drawer). */
     onClick?: () => void;
 }
-declare const _default: import("vue").DefineComponent<DashboardMenuItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardMenuItemProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<DashboardMenuItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardMenuItemProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/admin/layout/dashboard-menu-item.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,43 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { useBasename } from "../../../router/adapter.js";
+import { HouseIcon } from "./icons.js";
+import menu_item_link_default from "./menu-item-link.js";
+import { computed, createBlock, defineComponent, normalizeClass, openBlock } from "vue";
+// src/components/admin/layout/dashboard-menu-item.vue?vue&type=script&setup=true&lang.ts
+var dashboard_menu_item_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "dashboard-menu-item",
+	props: {
+		class: {},
+		icon: {},
+		label: {},
+		onClick: { type: Function }
+	},
+	setup(__props) {
+		/**
+		* `<DashboardMenuItem>` — the sidebar entry linking to the dashboard (`/`). The
+		* Vue twin of `@chelone/react`'s `layout/dashboard-menu-item.tsx`. The default
+		* `<Menu>` renders it when an `<Admin>` was given a `#dashboard` slot (via
+		* `useHasDashboard`). Composes `<MenuItemLink>` for the link + active-highlight.
+		*/
+		const props = __props;
+		const translate = useTranslate();
+		const to = `${useBasename()}/`;
+		const label = computed(() => props.label ?? translate("ra.page.dashboard", { _: "Dashboard" }));
+		const icon = computed(() => props.icon ?? HouseIcon);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(menu_item_link_default, {
+				to,
+				label: label.value,
+				icon: icon.value,
+				class: normalizeClass(props.class),
+				"on-click": __props.onClick
+			}, null, 8, [
+				"label",
+				"icon",
+				"class",
+				"on-click"
+			]);
+		};
+	}
+});
+export { dashboard_menu_item_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/data-provider-devtools-entry.js

@@ -0,0 +1,4 @@
+import data_provider_devtools_entry_vue_vue_type_script_setup_true_lang_default from "./data-provider-devtools-entry.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/data-provider-devtools-entry.vue
+var data_provider_devtools_entry_default = data_provider_devtools_entry_vue_vue_type_script_setup_true_lang_default;
+export { data_provider_devtools_entry_default as default };

package/dist/components/admin/layout/data-provider-devtools-entry.vue.d.ts

@@ -0,0 +1,12 @@
+/**
+ * One call in `<DataProviderDevtools>`: method, resource, duration, the error
+ * of a failed call, and its params and result as indented JSON under a
+ * disclosure.
+ */
+import { type DataProviderLogEntry } from "@chelone/core";
+type __VLS_Props = {
+    entry: DataProviderLogEntry;
+};
+declare const __VLS_export: 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: typeof __VLS_export;
+export default _default;

package/dist/components/admin/layout/data-provider-devtools-entry.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,61 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, openBlock, toDisplayString, unref } from "vue";
+import { DEVTOOLS_MAX_VALUE_LENGTH } from "@chelone/core";
+// src/components/admin/layout/data-provider-devtools-entry.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-status"];
+var _hoisted_2 = { class: "flex items-baseline gap-2" };
+var _hoisted_3 = { class: "font-semibold" };
+var _hoisted_4 = { class: "truncate" };
+var _hoisted_5 = { class: "ml-auto shrink-0 tabular-nums text-muted-foreground" };
+var _hoisted_6 = {
+	key: 0,
+	class: "break-all"
+};
+var _hoisted_7 = { class: "cursor-pointer text-muted-foreground" };
+var _hoisted_8 = { key: 0 };
+var _hoisted_9 = { class: "text-muted-foreground" };
+var _hoisted_10 = { class: "max-h-48 overflow-auto rounded bg-muted p-2 whitespace-pre-wrap break-all" };
+var _hoisted_11 = { key: 1 };
+var _hoisted_12 = { class: "text-muted-foreground" };
+var _hoisted_13 = { class: "max-h-48 overflow-auto rounded bg-muted p-2 whitespace-pre-wrap break-all" };
+var data_provider_devtools_entry_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "data-provider-devtools-entry",
+	props: { entry: {} },
+	setup(__props) {
+		/**
+		* One call in `<DataProviderDevtools>`: method, resource, duration, the error
+		* of a failed call, and its params and result as indented JSON under a
+		* disclosure.
+		*/
+		const props = __props;
+		const translate = useTranslate();
+		/** The value as indented JSON cut to `DEVTOOLS_MAX_VALUE_LENGTH`, or `undefined` when there is none to show. */
+		function show(value) {
+			try {
+				return JSON.stringify(value, null, 2)?.slice(0, DEVTOOLS_MAX_VALUE_LENGTH);
+			} catch {
+				return "[unserializable]";
+			}
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("li", {
+				"data-slot": "data-provider-devtools-entry",
+				"data-status": props.entry.status,
+				class: "border-b px-3 py-1.5 last:border-b-0 data-[status=error]:text-destructive"
+			}, [
+				createElementVNode("div", _hoisted_2, [
+					createElementVNode("span", _hoisted_3, toDisplayString(props.entry.method), 1),
+					createElementVNode("span", _hoisted_4, toDisplayString(props.entry.resource), 1),
+					createElementVNode("span", _hoisted_5, toDisplayString(props.entry.durationMs.toFixed(1)) + "ms ", 1)
+				]),
+				props.entry.error !== void 0 ? (openBlock(), createElementBlock("p", _hoisted_6, toDisplayString(props.entry.error), 1)) : createCommentVNode("", true),
+				createElementVNode("details", null, [
+					createElementVNode("summary", _hoisted_7, toDisplayString(unref(translate)("chelone.devtools.details", { _: "Details" })), 1),
+					show(props.entry.params) !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_8, [createElementVNode("div", _hoisted_9, toDisplayString(unref(translate)("chelone.devtools.params", { _: "Params" })), 1), createElementVNode("pre", _hoisted_10, toDisplayString(show(props.entry.params)), 1)])) : createCommentVNode("", true),
+					show(props.entry.result) !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_11, [createElementVNode("div", _hoisted_12, toDisplayString(unref(translate)("chelone.devtools.result", { _: "Result" })), 1), createElementVNode("pre", _hoisted_13, toDisplayString(show(props.entry.result)), 1)])) : createCommentVNode("", true)
+				])
+			], 8, _hoisted_1);
+		};
+	}
+});
+export { data_provider_devtools_entry_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/data-provider-devtools.js

@@ -0,0 +1,4 @@
+import data_provider_devtools_vue_vue_type_script_setup_true_lang_default from "./data-provider-devtools.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/data-provider-devtools.vue
+var data_provider_devtools_default = data_provider_devtools_vue_vue_type_script_setup_true_lang_default;
+export { data_provider_devtools_default as default };

package/dist/components/admin/layout/data-provider-devtools.vue.d.ts

@@ -0,0 +1,18 @@
+import type { DataProviderLog } from "@chelone/core";
+/** Props for {@link DataProviderDevtools}. */
+export interface DataProviderDevtoolsProps {
+    /** The log whose entries the panel shows. */
+    log: DataProviderLog;
+    /** Whether the panel starts expanded. @default true */
+    defaultOpen?: boolean;
+    /** Binding that shows or hides the panel, in the command menu's syntax. @default "mod+shift+d" */
+    shortcut?: string;
+    /** Extra class merged onto the panel. */
+    class?: string;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<DataProviderDevtoolsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataProviderDevtoolsProps> & Readonly<{}>, {
+    defaultOpen: boolean;
+    shortcut: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/admin/layout/data-provider-devtools.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,101 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { cn } from "../../../lib/utils.js";
+import button_default from "../../ui/button.js";
+import data_provider_devtools_entry_default from "./data-provider-devtools-entry.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderList, shallowRef, toDisplayString, unref, watch, withCtx } from "vue";
+import { shouldHandleHotkey } from "@chelone/core";
+// src/components/admin/layout/data-provider-devtools.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label", "data-open"];
+var _hoisted_2 = ["data-open"];
+var _hoisted_3 = { class: "font-semibold" };
+var _hoisted_4 = { class: "text-muted-foreground tabular-nums" };
+var _hoisted_5 = {
+	key: 0,
+	class: "px-3 py-2 text-muted-foreground"
+};
+var _hoisted_6 = {
+	key: 1,
+	class: "min-h-0 flex-1 overflow-y-auto"
+};
+var data_provider_devtools_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "data-provider-devtools",
+	props: {
+		log: {},
+		defaultOpen: {
+			type: Boolean,
+			default: true
+		},
+		shortcut: { default: "mod+shift+d" },
+		class: {}
+	},
+	setup(__props) {
+		/**
+		* `<DataProviderDevtools>` — a floating panel at the bottom right that lists
+		* the calls a `createDataProviderLog` log has recorded: method, resource,
+		* duration and, for a failed call, the error. The Vue twin of
+		* `@chelone/react`'s `layout/data-provider-devtools.tsx`. Wrap the data
+		* provider with `log.wrap`, then mount the panel once, in the layout.
+		*/
+		const props = __props;
+		const translate = useTranslate();
+		const open = ref(props.defaultOpen);
+		const snapshot = shallowRef(props.log.store.getSnapshot());
+		watch(() => props.log, (log, _previous, onCleanup) => {
+			const { store } = log;
+			snapshot.value = store.getSnapshot();
+			onCleanup(store.subscribe(() => {
+				snapshot.value = store.getSnapshot();
+			}));
+		}, { immediate: true });
+		const entries = computed(() => [...snapshot.value.entries].reverse());
+		function onKeydown(event) {
+			const target = event.target instanceof HTMLElement ? event.target : null;
+			if (!shouldHandleHotkey(event, props.shortcut, target)) return;
+			event.preventDefault();
+			open.value = !open.value;
+		}
+		onMounted(() => window.addEventListener("keydown", onKeydown));
+		onBeforeUnmount(() => window.removeEventListener("keydown", onKeydown));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("section", {
+				"aria-label": unref(translate)("chelone.devtools.title", { _: "Data provider" }),
+				"data-slot": "data-provider-devtools",
+				"data-open": open.value,
+				class: normalizeClass(unref(cn)("fixed right-4 bottom-4 z-50 flex max-h-[70vh] w-96 max-w-[calc(100vw-2rem)] flex-col rounded-lg border bg-popover text-xs text-popover-foreground shadow-lg", props.class))
+			}, [createElementVNode("header", {
+				class: "flex items-center gap-2 border-b px-3 py-1.5 data-[open=false]:border-b-0",
+				"data-open": open.value
+			}, [
+				createElementVNode("span", _hoisted_3, toDisplayString(unref(translate)("chelone.devtools.title", { _: "Data provider" })), 1),
+				createElementVNode("span", _hoisted_4, toDisplayString(snapshot.value.entries.length), 1),
+				createVNode(button_default, {
+					type: "button",
+					variant: "ghost",
+					size: "sm",
+					class: "ml-auto h-6 px-2",
+					onClick: _cache[0] || (_cache[0] = ($event) => props.log.clear())
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(translate)("chelone.devtools.clear", { _: "Clear" })), 1)]),
+					_: 1
+				}),
+				createVNode(button_default, {
+					type: "button",
+					variant: "ghost",
+					size: "sm",
+					class: "h-6 px-2",
+					"aria-expanded": open.value,
+					onClick: _cache[1] || (_cache[1] = ($event) => open.value = !open.value)
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(open.value ? unref(translate)("chelone.devtools.hide", { _: "Hide" }) : unref(translate)("chelone.devtools.show", { _: "Show" })), 1)]),
+					_: 1
+				}, 8, ["aria-expanded"])
+			], 8, _hoisted_2), open.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [entries.value.length === 0 ? (openBlock(), createElementBlock("p", _hoisted_5, toDisplayString(unref(translate)("chelone.devtools.empty", { _: "No calls yet" })), 1)) : (openBlock(), createElementBlock("ul", _hoisted_6, [(openBlock(true), createElementBlock(Fragment, null, renderList(entries.value, (entry) => {
+				return openBlock(), createBlock(data_provider_devtools_entry_default, {
+					key: entry.id,
+					entry
+				}, null, 8, ["entry"]);
+			}), 128))]))], 64)) : createCommentVNode("", true)], 10, _hoisted_1);
+		};
+	}
+});
+export { data_provider_devtools_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/hide-on-scroll.js

@@ -0,0 +1,4 @@
+import hide_on_scroll_vue_vue_type_script_setup_true_lang_default from "./hide-on-scroll.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/hide-on-scroll.vue
+var hide_on_scroll_default = hide_on_scroll_vue_vue_type_script_setup_true_lang_default;
+export { hide_on_scroll_default as default };

package/dist/components/admin/layout/hide-on-scroll.vue.d.ts

@@ -5,12 +5,13 @@ export interface HideOnScrollProps {
     /** Extra class merged onto the wrapper div. */
     class?: string;
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<HideOnScrollProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<HideOnScrollProps> & Readonly<{}>, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<HideOnScrollProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<HideOnScrollProps> & Readonly<{}>, {
     threshold: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 }>;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/components/admin/layout/hide-on-scroll.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,41 @@
+import { cn } from "../../../lib/utils.js";
+import { createElementBlock, defineComponent, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, unref } from "vue";
+// src/components/admin/layout/hide-on-scroll.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-state"];
+var hide_on_scroll_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "hide-on-scroll",
+	props: {
+		threshold: { default: 100 },
+		class: {}
+	},
+	setup(__props) {
+		/**
+		* `<HideOnScroll>` — wraps a header and sets `data-state="hidden"` on a
+		* downward scroll past `threshold`, `"visible"` on any upward scroll. The Vue
+		* twin of `@chelone/react`'s `layout/hide-on-scroll.tsx`.
+		*/
+		const props = __props;
+		const hidden = ref(false);
+		let lastY = 0;
+		function onScroll() {
+			const y = window.scrollY;
+			if (y > lastY && y > props.threshold) hidden.value = true;
+			else if (y < lastY) hidden.value = false;
+			lastY = y;
+		}
+		onMounted(() => {
+			lastY = window.scrollY;
+			window.addEventListener("scroll", onScroll, { passive: true });
+		});
+		onBeforeUnmount(() => {
+			window.removeEventListener("scroll", onScroll);
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-state": hidden.value ? "hidden" : "visible",
+				class: normalizeClass(unref(cn)("transition-transform duration-300 data-[state=hidden]:-translate-y-full", props.class))
+			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1);
+		};
+	}
+});
+export { hide_on_scroll_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/icons.d.ts

@@ -12,3 +12,11 @@ export declare const ListIcon: FunctionalComponent;
 export declare const HouseIcon: FunctionalComponent;
 /** The default logout glyph (a door + arrow) — the `<Logout>` item's default icon. */
 export declare const LogOutIcon: FunctionalComponent;
+/** The assistant trigger glyph (a speech bubble). */
+export declare const MessageCircleIcon: FunctionalComponent;
+/** The assistant send glyph (a paper plane). */
+export declare const SendIcon: FunctionalComponent;
+/** The assistant stop glyph (a square). */
+export declare const SquareIcon: FunctionalComponent;
+/** The assistant close glyph (a cross). */
+export declare const XIcon: FunctionalComponent;

package/dist/components/admin/layout/icons.js

@@ -1,34 +1,41 @@
 import { h } from "vue";
+// src/components/admin/layout/icons.ts
+/**
+* The two default menu glyphs (`ListIcon` / `HouseIcon`) as dependency-free
+* functional components. `@chelone/vue` carries no icon library (unlike the React
+* twin's `lucide-react`), so the menu family renders inline SVGs — the same
+* convention the rest of the Vue layout uses (see `app-sidebar.vue`). Kept in a
+* `.ts` sibling so the `.vue` SFCs stay component-file-per-component.
+*/
+/** A shared `<svg>` shell with the lucide stroke recipe around `paths`. */
 function glyph(paths) {
-  const icon = () => h(
-    "svg",
-    {
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      "stroke-width": "2",
-      "stroke-linecap": "round",
-      "stroke-linejoin": "round",
-      "aria-hidden": "true"
-    },
-    paths.map((d) => h("path", { d }))
-  );
-  return icon;
+	const icon = () => h("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		"stroke-width": "2",
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		"aria-hidden": "true"
+	}, paths.map((d) => h("path", { d })));
+	return icon;
 }
-const ListIcon = glyph([
-  "M3 12h.01M3 18h.01M3 6h.01M8 6h13M8 12h13M8 18h13"
+/** The default resource-list glyph (three rows) — the `<ResourceMenuItem>` fallback. */
+var ListIcon = glyph(["M3 12h.01M3 18h.01M3 6h.01M8 6h13M8 12h13M8 18h13"]);
+/** The default dashboard glyph (a house) — the `<DashboardMenuItem>` default icon. */
+var HouseIcon = glyph(["M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8", "M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"]);
+/** The default logout glyph (a door + arrow) — the `<Logout>` item's default icon. */
+var LogOutIcon = glyph([
+	"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4",
+	"M16 17l5-5-5-5",
+	"M21 12H9"
 ]);
-const HouseIcon = glyph([
-  "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8",
-  "M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"
-]);
-const LogOutIcon = glyph([
-  "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4",
-  "M16 17l5-5-5-5",
-  "M21 12H9"
-]);
-export {
-  HouseIcon,
-  ListIcon,
-  LogOutIcon
-};
+/** The assistant trigger glyph (a speech bubble). */
+var MessageCircleIcon = glyph(["M7.9 20A9 9 0 1 0 4 16.1L2 22Z"]);
+/** The assistant send glyph (a paper plane). */
+var SendIcon = glyph(["M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z", "m21.854 2.147-10.94 10.939"]);
+/** The assistant stop glyph (a square). */
+var SquareIcon = glyph(["M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z"]);
+/** The assistant close glyph (a cross). */
+var XIcon = glyph(["M18 6 6 18", "m6 6 12 12"]);
+export { HouseIcon, ListIcon, LogOutIcon, MessageCircleIcon, SendIcon, SquareIcon, XIcon };

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

@@ -0,0 +1,4 @@
+import layout_vue_vue_type_script_setup_true_lang_default from "./layout.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/layout.vue
+var layout_default = layout_vue_vue_type_script_setup_true_lang_default;
+export { layout_default as default };

package/dist/components/admin/layout/layout.vue.d.ts

@@ -1,13 +1,16 @@
-declare var __VLS_9: {}, __VLS_14: {}, __VLS_19: {};
-type __VLS_Slots = {} & {
-    sidebar?: (props: typeof __VLS_9) => any;
-} & {
-    'app-bar'?: (props: typeof __VLS_14) => any;
-} & {
-    default?: (props: typeof __VLS_19) => any;
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        sidebar?: (props: {}) => any;
+    } & {
+        'app-bar'?: (props: {}) => any;
+    } & {
+        default?: (props: {}) => any;
+    };
 };
-declare const __VLS_component: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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 (): {

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

@@ -0,0 +1,48 @@
+import app_bar_default from "./app-bar.js";
+import app_sidebar_default from "./app-sidebar.js";
+import skip_navigation_button_default from "../buttons/skip-navigation-button.js";
+import notification_default from "../feedback/notification.js";
+import sidebar_provider_default from "../../ui/sidebar/sidebar-provider.js";
+import { createBlock, createElementVNode, createVNode, defineComponent, openBlock, renderSlot, unref, withCtx } from "vue";
+// src/components/admin/layout/layout.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	"data-slot": "layout-main",
+	class: "ml-auto flex h-svh w-full max-w-full min-w-0 flex-1 flex-col"
+};
+var _hoisted_2 = {
+	id: "main-content",
+	class: "flex flex-1 flex-col overflow-auto px-4 py-2"
+};
+var layout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "layout",
+	setup(__props) {
+		/**
+		* `<Layout>` — the default admin shell frame. The Vue twin of `@chelone/react`'s
+		* `layout/layout.tsx`. Wraps a `<SidebarProvider>` around the `<AppSidebar>` and
+		* a `<main>` content column (`<AppBar>` + the routed content), so `<Admin>`
+		* renders it as the default `#layout` when no override is supplied.
+		*
+		* The default slot is the routed content (`<Admin>` injects its dashboard slot +
+		* `<router-view>` there). The `#sidebar` / `#app-bar` slots override the sidebar
+		* and header for a custom shell without re-implementing the frame.
+		*
+		* `<SkipNavigationButton>` comes first, ahead of the sidebar it skips, and
+		* targets `#main-content`, the content area below the app bar.
+		*
+		* Vue divergence from the React twin: no error boundary yet — the content
+		* mounts directly.
+		*/
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(sidebar_provider_default), null, {
+				default: withCtx(() => [
+					createVNode(skip_navigation_button_default),
+					renderSlot(_ctx.$slots, "sidebar", {}, () => [createVNode(app_sidebar_default)]),
+					createElementVNode("main", _hoisted_1, [renderSlot(_ctx.$slots, "app-bar", {}, () => [createVNode(app_bar_default)]), createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default")])]),
+					createVNode(notification_default)
+				]),
+				_: 3
+			});
+		};
+	}
+});
+export { layout_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/layout/menu-item-link.js

@@ -0,0 +1,4 @@
+import menu_item_link_vue_vue_type_script_setup_true_lang_default from "./menu-item-link.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/layout/menu-item-link.vue
+var menu_item_link_default = menu_item_link_vue_vue_type_script_setup_true_lang_default;
+export { menu_item_link_default as default };