@alfakit/vue 0.0.0-stage → 0.1.0

package/dist/components/panel/DebugTreeNode.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,93 @@
+import { useT as e } from "../../context.js";
+import { cn as t } from "../../lib/utils.js";
+import n from "../ui/Badge2.js";
+import r from "../ui/Collapsible.js";
+import i from "../ui/CollapsibleContent.js";
+import a from "../ui/CollapsibleTrigger.js";
+import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, normalizeClass as h, normalizeStyle as g, openBlock as _, ref as v, renderList as y, resolveComponent as b, toDisplayString as x, unref as S, withCtx as C } from "vue";
+import { ChevronRightIcon as w } from "@lucide/vue";
+//#region src/components/panel/DebugTreeNode.vue?vue&type=script&setup=true&lang.ts
+var T = {
+	key: 0,
+	class: "truncate"
+}, E = {
+	key: 1,
+	class: "text-muted-foreground truncate"
+}, D = { class: "space-y-0.5" }, O = {
+	key: 0,
+	class: "truncate"
+}, k = {
+	key: 1,
+	class: "text-muted-foreground truncate"
+}, A = /*@__PURE__*/ m({
+	__name: "DebugTreeNode",
+	props: {
+		node: {},
+		depth: {}
+	},
+	setup(m) {
+		let A = m, j = e(), M = v(A.depth < 2), N = s(() => A.node.children ?? []), P = s(() => Object.entries(A.node.details ?? {}).filter(([, e]) => e !== null && e !== !1 && e !== "")), F = s(() => A.node.authorized === !1 ? j("debug.unauthorized", {}, "unauthorized") : A.node.reason ?? j("debug.hidden", {}, "hidden"));
+		return (e, s) => {
+			let m = b("DebugTreeNode", !0);
+			return _(), u("li", { style: g({ paddingInlineStart: `${A.depth * 12}px` }) }, [N.value.length > 0 ? (_(), c(r, {
+				key: 0,
+				open: M.value,
+				"onUpdate:open": s[0] ||= (e) => M.value = e
+			}, {
+				default: C(() => [p(a, { class: "hover:bg-muted/60 w-full rounded text-start" }, {
+					default: C(() => [d("div", { class: h(S(t)("flex min-w-0 items-center gap-1.5 rounded px-1 py-0.5", !A.node.visible && "text-muted-foreground")) }, [
+						p(S(w), { class: h(S(t)("size-3.5 shrink-0 transition-transform rtl:rotate-180", M.value && "rotate-90 rtl:rotate-90")) }, null, 8, ["class"]),
+						d("span", { class: h(S(t)("font-semibold", !A.node.visible && "line-through")) }, x(A.node.type), 3),
+						A.node.key ? (_(), u("span", T, x(A.node.key), 1)) : l("", !0),
+						A.node.label && A.node.label !== A.node.key ? (_(), u("span", E, "“" + x(A.node.label) + "”", 1)) : l("", !0),
+						(_(!0), u(o, null, y(P.value, ([e, t]) => (_(), u("span", {
+							key: e,
+							class: "text-muted-foreground truncate"
+						}, x(t === !0 ? e : `${e}=${String(t)}`), 1))), 128)),
+						A.node.visible ? l("", !0) : (_(), c(n, {
+							key: 2,
+							variant: A.node.authorized === !1 ? "destructive" : "outline",
+							class: "ms-auto shrink-0 font-sans"
+						}, {
+							default: C(() => [f(x(F.value), 1)]),
+							_: 1
+						}, 8, ["variant"]))
+					], 2)]),
+					_: 1
+				}), p(i, null, {
+					default: C(() => [d("ul", D, [(_(!0), u(o, null, y(N.value, (e, t) => (_(), c(m, {
+						key: `${e.key ?? e.type}-${t}`,
+						node: e,
+						depth: 1
+					}, null, 8, ["node"]))), 128))])]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["open"])) : (_(), u("div", {
+				key: 1,
+				class: h(S(t)("flex min-w-0 items-center gap-1.5 rounded px-1 py-0.5", !A.node.visible && "text-muted-foreground"))
+			}, [
+				s[1] ||= d("span", { class: "size-3.5 shrink-0" }, null, -1),
+				d("span", { class: h(S(t)("font-semibold", !A.node.visible && "line-through")) }, x(A.node.type), 3),
+				A.node.key ? (_(), u("span", O, x(A.node.key), 1)) : l("", !0),
+				A.node.label && A.node.label !== A.node.key ? (_(), u("span", k, "“" + x(A.node.label) + "”", 1)) : l("", !0),
+				(_(!0), u(o, null, y(P.value, ([e, t]) => (_(), u("span", {
+					key: e,
+					class: "text-muted-foreground truncate"
+				}, x(t === !0 ? e : `${e}=${String(t)}`), 1))), 128)),
+				A.node.visible ? l("", !0) : (_(), c(n, {
+					key: 2,
+					variant: A.node.authorized === !1 ? "destructive" : "outline",
+					class: "ms-auto shrink-0 font-sans"
+				}, {
+					default: C(() => [f(x(F.value), 1)]),
+					_: 1
+				}, 8, ["variant"]))
+			], 2))], 4);
+		};
+	}
+});
+//#endregion
+export { A as default };
+
+//# sourceMappingURL=DebugTreeNode.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/panel/DebugTreeNode.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugTreeNode.vue_vue_type_script_setup_true_lang.js","names":["_resolveComponent","_openBlock","_createElementBlock","_normalizeStyle","_createBlock","Collapsible","_withCtx","_createVNode","CollapsibleTrigger","_createElementVNode","_normalizeClass","_unref","_toDisplayString","_createCommentVNode","_Fragment","_renderList","Badge","_createTextVNode","CollapsibleContent","Badge_default","Collapsible_default","CollapsibleContent_default","CollapsibleTrigger_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","DebugTreeNode_vue_vue_type_script_setup_true_lang_default","props","__props","t","useT","open","ref","children","computed","details","value","badge","_component_DebugTreeNode","resolveComponent","openBlock","createElementBlock","normalizeStyle","createBlock","_cache","$event","withCtx","createVNode","createElementVNode","normalizeClass","unref","cn","ChevronRightIcon","toDisplayString","createCommentVNode","Fragment","renderList","name","createTextVNode","child","index"],"sources":["../../../src/components/panel/DebugTreeNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { DebugNode } from '@alfakit/core'\nimport { ChevronRightIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport { useT } from '../../context'\nimport { cn } from '../../lib/utils'\nimport Badge from '../ui/Badge.vue'\nimport Collapsible from '../ui/Collapsible.vue'\nimport CollapsibleContent from '../ui/CollapsibleContent.vue'\nimport CollapsibleTrigger from '../ui/CollapsibleTrigger.vue'\n\n/** One node of the debug panel's schema tree, collapsible when it has children. */\nconst props = defineProps<{ node: DebugNode; depth: number }>()\nconst t = useT()\nconst open = ref(props.depth < 2)\nconst children = computed(() => props.node.children ?? [])\nconst details = computed(() =>\n  Object.entries(props.node.details ?? {}).filter(\n    ([, value]) => value !== null && value !== false && value !== '',\n  ),\n)\nconst badge = computed(() =>\n  props.node.authorized === false\n    ? t('debug.unauthorized', {}, 'unauthorized')\n    : (props.node.reason ?? t('debug.hidden', {}, 'hidden')),\n)\n</script>\n\n<template>\n  <li :style=\"{ paddingInlineStart: `${props.depth * 12}px` }\">\n    <Collapsible v-if=\"children.length > 0\" v-model:open=\"open\">\n      <CollapsibleTrigger class=\"hover:bg-muted/60 w-full rounded text-start\">\n        <div\n          :class=\"\n            cn(\n              'flex min-w-0 items-center gap-1.5 rounded px-1 py-0.5',\n              !props.node.visible && 'text-muted-foreground',\n            )\n          \"\n        >\n          <ChevronRightIcon\n            :class=\"\n              cn(\n                'size-3.5 shrink-0 transition-transform rtl:rotate-180',\n                open && 'rotate-90 rtl:rotate-90',\n              )\n            \"\n          />\n          <span :class=\"cn('font-semibold', !props.node.visible && 'line-through')\">{{\n            props.node.type\n          }}</span>\n          <span v-if=\"props.node.key\" class=\"truncate\">{{ props.node.key }}</span>\n          <span\n            v-if=\"props.node.label && props.node.label !== props.node.key\"\n            class=\"text-muted-foreground truncate\"\n            >“{{ props.node.label }}”</span\n          >\n          <span v-for=\"[name, value] in details\" :key=\"name\" class=\"text-muted-foreground truncate\">\n            {{ value === true ? name : `${name}=${String(value)}` }}\n          </span>\n          <Badge\n            v-if=\"!props.node.visible\"\n            :variant=\"props.node.authorized === false ? 'destructive' : 'outline'\"\n            class=\"ms-auto shrink-0 font-sans\"\n            >{{ badge }}</Badge\n          >\n        </div>\n      </CollapsibleTrigger>\n      <CollapsibleContent>\n        <ul class=\"space-y-0.5\">\n          <DebugTreeNode\n            v-for=\"(child, index) in children\"\n            :key=\"`${child.key ?? child.type}-${index}`\"\n            :node=\"child\"\n            :depth=\"1\"\n          />\n        </ul>\n      </CollapsibleContent>\n    </Collapsible>\n    <div\n      v-else\n      :class=\"\n        cn(\n          'flex min-w-0 items-center gap-1.5 rounded px-1 py-0.5',\n          !props.node.visible && 'text-muted-foreground',\n        )\n      \"\n    >\n      <span class=\"size-3.5 shrink-0\" />\n      <span :class=\"cn('font-semibold', !props.node.visible && 'line-through')\">{{\n        props.node.type\n      }}</span>\n      <span v-if=\"props.node.key\" class=\"truncate\">{{ props.node.key }}</span>\n      <span\n        v-if=\"props.node.label && props.node.label !== props.node.key\"\n        class=\"text-muted-foreground truncate\"\n        >“{{ props.node.label }}”</span\n      >\n      <span v-for=\"[name, value] in details\" :key=\"name\" class=\"text-muted-foreground truncate\">\n        {{ value === true ? name : `${name}=${String(value)}` }}\n      </span>\n      <Badge\n        v-if=\"!props.node.visible\"\n        :variant=\"props.node.authorized === false ? 'destructive' : 'outline'\"\n        class=\"ms-auto shrink-0 font-sans\"\n        >{{ badge }}</Badge\n      >\n    </div>\n  </li>\n</template>\n"],"mappings":"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"}

package/dist/components/panel/GlobalSearch.js

@@ -0,0 +1,7 @@
+import e from "./GlobalSearch.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/panel/GlobalSearch.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GlobalSearch.js.map

package/dist/components/panel/GlobalSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalSearch.js","names":["_sfc_main","GlobalSearch_vue_vue_type_script_setup_true_lang_default","GlobalSearch_default"],"sources":["../../../src/components/panel/GlobalSearch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { formatKeyBinding, globalSearchSuffix, SHORTCUT_IDS, shortcuts } from '@alfakit/core'\nimport { router } from '@inertiajs/vue3'\nimport { SearchIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, onMounted, ref, shallowRef, watch, type Component } from 'vue'\nimport { useHydrated } from '../../composables/use-hydrated'\nimport { usePanel, useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport Slot from './Slot.vue'\nimport { Icon } from '../../lib/icons'\nimport { globalSearchPalette } from './lazy-chrome'\n\n/**\n * The search field and its command palette (`GlobalSearchPalette`, loaded on first open):\n * global search results plus (with `alfakit.commandPalette`) the page's header actions,\n * panel commands, navigation, \"create\" links, recent records, theme switching and the\n * shortcuts overlay. `variant=\"sidebar\"`: the full-width field in the sidebar header\n * (`globalSearch(position: Sidebar)`).\n */\nconst props = withDefaults(defineProps<{ variant?: 'topbar' | 'sidebar' }>(), { variant: 'topbar' })\n\nconst t = useT()\nconst panel = usePanel()\n// The shortcut hint depends on the visitor's platform (⌘ or Ctrl): rendered after hydration.\nconst hydrated = useHydrated()\nconst open = ref(false)\n// Null on the server and during hydration (nothing loads there), so the markup matches.\nconst Palette = shallowRef<Component | null>(globalSearchPalette.current)\nconst config = computed(() => panel.value.globalSearch)\nconst palette = computed(() => panel.value.commandPalette)\nconst endpoint = computed(() => (config.value ? panel.value.endpoints.globalSearch : undefined))\nconst placeholder = computed(\n  () =>\n    config.value?.placeholder ??\n    palette.value?.placeholder ??\n    t('palette.placeholder', {}, 'Type a command or search…'),\n)\n// `globalSearchFieldSuffix()`, or the first key binding (default); ⌘K / Ctrl+K without global search.\nconst suffix = computed(() =>\n  globalSearchSuffix(\n    config.value ??\n      (palette.value ? { keyBindings: ['mod+k'], placeholder: placeholder.value } : undefined),\n  ),\n)\nconst keys = computed(() =>\n  config.value || palette.value ? JSON.stringify(config.value?.keyBindings ?? ['mod+k']) : '',\n)\n\n// The palette's key bindings: essential, so they keep working with `keyboardShortcuts(false)`.\nwatch(\n  keys,\n  (value, _old, onCleanup) => {\n    // Never during a server render: the registry is shared by every request there.\n    if (!value || typeof window === 'undefined') return\n\n    onCleanup(\n      shortcuts.register({\n        id: SHORTCUT_IDS.palette,\n        keys: JSON.parse(value) as string[],\n        label: t('shortcuts.open_palette', {}, 'Open the command palette'),\n        group: 'general',\n        essential: true,\n        handler: () => {\n          open.value = true\n        },\n      }),\n    )\n  },\n  { immediate: true },\n)\n\n// Opening before the code has arrived (a click or `mod+k` right after the page loads)\n// keeps `open` set; the palette mounts open once it has loaded.\nwatch(open, (value, _old, onCleanup) => {\n  if (!value) return\n\n  // Already loaded (by another instance): mount it straight away.\n  if (globalSearchPalette.current) {\n    Palette.value = globalSearchPalette.current\n\n    return\n  }\n\n  let active = true\n  onCleanup(() => {\n    active = false\n  })\n\n  globalSearchPalette.load().then(\n    (component) => {\n      if (active) Palette.value = component\n    },\n    () => {\n      if (active) open.value = false\n    },\n  )\n})\n\nconst preload = () => void globalSearchPalette.load().catch(() => undefined)\n\n// A palette opened while its code was still loading closes when the page changes.\nlet stopListening: (() => void) | undefined\n\nonMounted(() => {\n  stopListening = router.on('navigate', () => {\n    open.value = false\n  })\n})\n\nonBeforeUnmount(() => stopListening?.())\n</script>\n\n<template>\n  <template v-if=\"(config && endpoint) || palette\">\n    <Slot name=\"global-search.before\" />\n    <Button\n      type=\"button\"\n      variant=\"outline\"\n      size=\"sm\"\n      :data-variant=\"props.variant\"\n      :class=\"\n        props.variant === 'sidebar'\n          ? 'text-muted-foreground w-full justify-start gap-2 px-2.5 font-normal group-data-[collapsible=icon]:size-8 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:px-0'\n          : 'text-muted-foreground size-8 justify-center gap-2 px-0 font-normal sm:w-56 sm:justify-start sm:px-2.5'\n      \"\n      @click=\"open = true\"\n      @pointerenter=\"preload\"\n      @focus=\"preload\"\n    >\n      <Icon name=\"alfakit::panels.global-search.field\" :fallback=\"SearchIcon\" class=\"size-4\" />\n      <span\n        :class=\"\n          props.variant === 'sidebar'\n            ? 'flex-1 truncate text-start group-data-[collapsible=icon]:sr-only'\n            : 'sr-only sm:not-sr-only sm:flex-1 sm:text-start'\n        \"\n        >{{ placeholder }}</span\n      >\n      <span\n        v-if=\"suffix?.type === 'text'\"\n        data-slot=\"global-search-suffix\"\n        class=\"text-muted-foreground hidden text-[10px] sm:inline\"\n        >{{ suffix.text }}</span\n      >\n      <kbd\n        v-if=\"hydrated && suffix?.type === 'keyBinding'\"\n        class=\"bg-muted hidden rounded px-1 font-mono text-[10px] sm:inline\"\n        >{{ formatKeyBinding(suffix.keyBinding) }}</kbd\n      >\n    </Button>\n    <Slot name=\"global-search.after\" />\n    <!-- The dialog's code loads on first open (click or shortcut); hovering or focusing the\n         field fetches it ahead. Not rendered on the server, like the closed dialog before it. -->\n    <component :is=\"Palette\" v-if=\"Palette\" v-model:open=\"open\" />\n  </template>\n</template>\n"],"mappings":""}

package/dist/components/panel/GlobalSearch.vue.d.ts

@@ -0,0 +1,15 @@
+/**
+ * The search field and its command palette (`GlobalSearchPalette`, loaded on first open):
+ * global search results plus (with `alfakit.commandPalette`) the page's header actions,
+ * panel commands, navigation, "create" links, recent records, theme switching and the
+ * shortcuts overlay. `variant="sidebar"`: the full-width field in the sidebar header
+ * (`globalSearch(position: Sidebar)`).
+ */
+type __VLS_Props = {
+    variant?: 'topbar' | 'sidebar';
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    variant: "topbar" | "sidebar";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=GlobalSearch.vue.d.ts.map

package/dist/components/panel/GlobalSearch.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalSearch.vue.d.ts","sourceRoot":"","sources":["../../../src/components/panel/GlobalSearch.vue"],"names":[],"mappings":"AAyKA;;;;;;GAMG;AACH,KAAK,WAAW,GAAG;IAAE,OAAO,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;CAAE,CAAC;;aAAvB,QAAQ,GAAG,SAAS;;AA6PnD,wBAOG"}

package/dist/components/panel/GlobalSearch.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,94 @@
+import { usePanel as e, useT as t } from "../../context.js";
+import n from "../../lib/Icon.js";
+import r from "../ui/Button2.js";
+import i from "./Slot.js";
+import { globalSearchPalette as a } from "./lazy-chrome.js";
+import { useHydrated as o } from "../../composables/use-hydrated.js";
+import { SHORTCUT_IDS as s, formatKeyBinding as c, globalSearchSuffix as l, shortcuts as u } from "@alfakit/core";
+import { router as d } from "@inertiajs/vue3";
+import { Fragment as f, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createVNode as v, defineComponent as y, normalizeClass as b, onBeforeUnmount as x, onMounted as S, openBlock as C, ref as w, resolveDynamicComponent as T, shallowRef as E, toDisplayString as D, unref as O, watch as k, withCtx as A } from "vue";
+import { SearchIcon as j } from "@lucide/vue";
+//#region src/components/panel/GlobalSearch.vue?vue&type=script&setup=true&lang.ts
+var M = {
+	key: 0,
+	"data-slot": "global-search-suffix",
+	class: "text-muted-foreground hidden text-[10px] sm:inline"
+}, N = {
+	key: 1,
+	class: "bg-muted hidden rounded px-1 font-mono text-[10px] sm:inline"
+}, P = /*@__PURE__*/ y({
+	__name: "GlobalSearch",
+	props: { variant: { default: "topbar" } },
+	setup(y) {
+		let P = y, F = t(), I = e(), L = o(), R = w(!1), z = E(a.current), B = p(() => I.value.globalSearch), V = p(() => I.value.commandPalette), H = p(() => B.value ? I.value.endpoints.globalSearch : void 0), U = p(() => B.value?.placeholder ?? V.value?.placeholder ?? F("palette.placeholder", {}, "Type a command or search…")), W = p(() => l(B.value ?? (V.value ? {
+			keyBindings: ["mod+k"],
+			placeholder: U.value
+		} : void 0))), G = p(() => B.value || V.value ? JSON.stringify(B.value?.keyBindings ?? ["mod+k"]) : "");
+		k(G, (e, t, n) => {
+			e && typeof window < "u" && n(u.register({
+				id: s.palette,
+				keys: JSON.parse(e),
+				label: F("shortcuts.open_palette", {}, "Open the command palette"),
+				group: "general",
+				essential: !0,
+				handler: () => {
+					R.value = !0;
+				}
+			}));
+		}, { immediate: !0 }), k(R, (e, t, n) => {
+			if (!e) return;
+			if (a.current) {
+				z.value = a.current;
+				return;
+			}
+			let r = !0;
+			n(() => {
+				r = !1;
+			}), a.load().then((e) => {
+				r && (z.value = e);
+			}, () => {
+				r && (R.value = !1);
+			});
+		});
+		let K = () => void a.load().catch(() => void 0), q;
+		return S(() => {
+			q = d.on("navigate", () => {
+				R.value = !1;
+			});
+		}), x(() => q?.()), (e, t) => B.value && H.value || V.value ? (C(), g(f, { key: 0 }, [
+			v(i, { name: "global-search.before" }),
+			v(r, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				"data-variant": P.variant,
+				class: b(P.variant === "sidebar" ? "text-muted-foreground w-full justify-start gap-2 px-2.5 font-normal group-data-[collapsible=icon]:size-8 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:px-0" : "text-muted-foreground size-8 justify-center gap-2 px-0 font-normal sm:w-56 sm:justify-start sm:px-2.5"),
+				onClick: t[0] ||= (e) => R.value = !0,
+				onPointerenter: K,
+				onFocus: K
+			}, {
+				default: A(() => [
+					v(O(n), {
+						name: "alfakit::panels.global-search.field",
+						fallback: O(j),
+						class: "size-4"
+					}, null, 8, ["fallback"]),
+					_("span", { class: b(P.variant === "sidebar" ? "flex-1 truncate text-start group-data-[collapsible=icon]:sr-only" : "sr-only sm:not-sr-only sm:flex-1 sm:text-start") }, D(U.value), 3),
+					W.value?.type === "text" ? (C(), g("span", M, D(W.value.text), 1)) : h("", !0),
+					O(L) && W.value?.type === "keyBinding" ? (C(), g("kbd", N, D(O(c)(W.value.keyBinding)), 1)) : h("", !0)
+				]),
+				_: 1
+			}, 8, ["data-variant", "class"]),
+			v(i, { name: "global-search.after" }),
+			z.value ? (C(), m(T(z.value), {
+				key: 0,
+				open: R.value,
+				"onUpdate:open": t[1] ||= (e) => R.value = e
+			}, null, 40, ["open"])) : h("", !0)
+		], 64)) : h("", !0);
+	}
+});
+//#endregion
+export { P as default };
+
+//# sourceMappingURL=GlobalSearch.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/panel/GlobalSearch.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalSearch.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_createVNode","Slot","Button","_normalizeClass","_withCtx","_unref","Icon","_createElementVNode","_toDisplayString","_createCommentVNode","_createBlock","_resolveDynamicComponent","Icon_default","Button_default","Slot_default","_hoisted_1","_hoisted_2","GlobalSearch_vue_vue_type_script_setup_true_lang_default","props","__props","t","useT","panel","usePanel","hydrated","useHydrated","open","ref","Palette","shallowRef","globalSearchPalette","config","computed","palette","endpoint","placeholder","suffix","globalSearchSuffix","keys","watch","value","onCleanup","shortcuts","SHORTCUT_IDS","active","component","preload","stopListening","onMounted","router","onBeforeUnmount","openBlock","createElementBlock","Fragment","createVNode","normalizeClass","_cache","withCtx","unref","SearchIcon","createElementVNode","toDisplayString","createCommentVNode","formatKeyBinding","createBlock","resolveDynamicComponent","$event"],"sources":["../../../src/components/panel/GlobalSearch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { formatKeyBinding, globalSearchSuffix, SHORTCUT_IDS, shortcuts } from '@alfakit/core'\nimport { router } from '@inertiajs/vue3'\nimport { SearchIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, onMounted, ref, shallowRef, watch, type Component } from 'vue'\nimport { useHydrated } from '../../composables/use-hydrated'\nimport { usePanel, useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport Slot from './Slot.vue'\nimport { Icon } from '../../lib/icons'\nimport { globalSearchPalette } from './lazy-chrome'\n\n/**\n * The search field and its command palette (`GlobalSearchPalette`, loaded on first open):\n * global search results plus (with `alfakit.commandPalette`) the page's header actions,\n * panel commands, navigation, \"create\" links, recent records, theme switching and the\n * shortcuts overlay. `variant=\"sidebar\"`: the full-width field in the sidebar header\n * (`globalSearch(position: Sidebar)`).\n */\nconst props = withDefaults(defineProps<{ variant?: 'topbar' | 'sidebar' }>(), { variant: 'topbar' })\n\nconst t = useT()\nconst panel = usePanel()\n// The shortcut hint depends on the visitor's platform (⌘ or Ctrl): rendered after hydration.\nconst hydrated = useHydrated()\nconst open = ref(false)\n// Null on the server and during hydration (nothing loads there), so the markup matches.\nconst Palette = shallowRef<Component | null>(globalSearchPalette.current)\nconst config = computed(() => panel.value.globalSearch)\nconst palette = computed(() => panel.value.commandPalette)\nconst endpoint = computed(() => (config.value ? panel.value.endpoints.globalSearch : undefined))\nconst placeholder = computed(\n  () =>\n    config.value?.placeholder ??\n    palette.value?.placeholder ??\n    t('palette.placeholder', {}, 'Type a command or search…'),\n)\n// `globalSearchFieldSuffix()`, or the first key binding (default); ⌘K / Ctrl+K without global search.\nconst suffix = computed(() =>\n  globalSearchSuffix(\n    config.value ??\n      (palette.value ? { keyBindings: ['mod+k'], placeholder: placeholder.value } : undefined),\n  ),\n)\nconst keys = computed(() =>\n  config.value || palette.value ? JSON.stringify(config.value?.keyBindings ?? ['mod+k']) : '',\n)\n\n// The palette's key bindings: essential, so they keep working with `keyboardShortcuts(false)`.\nwatch(\n  keys,\n  (value, _old, onCleanup) => {\n    // Never during a server render: the registry is shared by every request there.\n    if (!value || typeof window === 'undefined') return\n\n    onCleanup(\n      shortcuts.register({\n        id: SHORTCUT_IDS.palette,\n        keys: JSON.parse(value) as string[],\n        label: t('shortcuts.open_palette', {}, 'Open the command palette'),\n        group: 'general',\n        essential: true,\n        handler: () => {\n          open.value = true\n        },\n      }),\n    )\n  },\n  { immediate: true },\n)\n\n// Opening before the code has arrived (a click or `mod+k` right after the page loads)\n// keeps `open` set; the palette mounts open once it has loaded.\nwatch(open, (value, _old, onCleanup) => {\n  if (!value) return\n\n  // Already loaded (by another instance): mount it straight away.\n  if (globalSearchPalette.current) {\n    Palette.value = globalSearchPalette.current\n\n    return\n  }\n\n  let active = true\n  onCleanup(() => {\n    active = false\n  })\n\n  globalSearchPalette.load().then(\n    (component) => {\n      if (active) Palette.value = component\n    },\n    () => {\n      if (active) open.value = false\n    },\n  )\n})\n\nconst preload = () => void globalSearchPalette.load().catch(() => undefined)\n\n// A palette opened while its code was still loading closes when the page changes.\nlet stopListening: (() => void) | undefined\n\nonMounted(() => {\n  stopListening = router.on('navigate', () => {\n    open.value = false\n  })\n})\n\nonBeforeUnmount(() => stopListening?.())\n</script>\n\n<template>\n  <template v-if=\"(config && endpoint) || palette\">\n    <Slot name=\"global-search.before\" />\n    <Button\n      type=\"button\"\n      variant=\"outline\"\n      size=\"sm\"\n      :data-variant=\"props.variant\"\n      :class=\"\n        props.variant === 'sidebar'\n          ? 'text-muted-foreground w-full justify-start gap-2 px-2.5 font-normal group-data-[collapsible=icon]:size-8 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:px-0'\n          : 'text-muted-foreground size-8 justify-center gap-2 px-0 font-normal sm:w-56 sm:justify-start sm:px-2.5'\n      \"\n      @click=\"open = true\"\n      @pointerenter=\"preload\"\n      @focus=\"preload\"\n    >\n      <Icon name=\"alfakit::panels.global-search.field\" :fallback=\"SearchIcon\" class=\"size-4\" />\n      <span\n        :class=\"\n          props.variant === 'sidebar'\n            ? 'flex-1 truncate text-start group-data-[collapsible=icon]:sr-only'\n            : 'sr-only sm:not-sr-only sm:flex-1 sm:text-start'\n        \"\n        >{{ placeholder }}</span\n      >\n      <span\n        v-if=\"suffix?.type === 'text'\"\n        data-slot=\"global-search-suffix\"\n        class=\"text-muted-foreground hidden text-[10px] sm:inline\"\n        >{{ suffix.text }}</span\n      >\n      <kbd\n        v-if=\"hydrated && suffix?.type === 'keyBinding'\"\n        class=\"bg-muted hidden rounded px-1 font-mono text-[10px] sm:inline\"\n        >{{ formatKeyBinding(suffix.keyBinding) }}</kbd\n      >\n    </Button>\n    <Slot name=\"global-search.after\" />\n    <!-- The dialog's code loads on first open (click or shortcut); hovering or focusing the\n         field fetches it ahead. Not rendered on the server, like the closed dialog before it. -->\n    <component :is=\"Palette\" v-if=\"Palette\" v-model:open=\"open\" />\n  </template>\n</template>\n"],"mappings":"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"}

package/dist/components/panel/GlobalSearchPalette.js

@@ -0,0 +1,7 @@
+import e from "./GlobalSearchPalette.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/panel/GlobalSearchPalette.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GlobalSearchPalette.js.map

package/dist/components/panel/GlobalSearchPalette.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalSearchPalette.js","names":["_sfc_main","GlobalSearchPalette_vue_vue_type_script_setup_true_lang_default","GlobalSearchPalette_default"],"sources":["../../../src/components/panel/GlobalSearchPalette.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type {\n  ActionSchema,\n  CommandPaletteResponse,\n  GlobalSearchGroupSchema,\n  PaletteGroup,\n  PaletteItem,\n} from '@alfakit/core'\nimport {\n  canInstallPwa,\n  commandPaletteItems,\n  createLatestRequest,\n  debounce,\n  filterCommandPalette,\n  globalSearchDebounce,\n  globalSearchStatus,\n  paletteGroupKey,\n  pwaStore,\n  requestJson,\n  setAppearance,\n  shortcuts,\n} from '@alfakit/core'\nimport { router } from '@inertiajs/vue3'\nimport { computed, onBeforeUnmount, onMounted, onScopeDispose, ref, watch } from 'vue'\nimport { useStore } from '../../composables/use-store'\nimport { useActionRunner, useChoice, usePageSchema, usePanel, useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport CommandDialog from '../ui/CommandDialog.vue'\nimport CommandEmpty from '../ui/CommandEmpty.vue'\nimport CommandGroup from '../ui/CommandGroup.vue'\nimport CommandInput from '../ui/CommandInput.vue'\nimport CommandItem from '../ui/CommandItem.vue'\nimport CommandList from '../ui/CommandList.vue'\nimport Spinner from '../ui/Spinner.vue'\nimport ShortcutKeys from './ShortcutKeys.vue'\nimport { installPwa } from './pwa'\nimport Slot from './Slot.vue'\nimport { Icon } from '../../lib/icons'\n\ntype SearchGroup = GlobalSearchGroupSchema\n\n/**\n * The command palette behind `GlobalSearch`: global search results plus (with\n * `alfakit.commandPalette`) the page's header actions, panel commands, navigation, \"create\"\n * links, recent records, theme switching and the shortcuts overlay. Its code loads the first\n * time the palette opens; the trigger and `mod+k` stay in the shell.\n */\nconst open = defineModel<boolean>('open', { default: false })\n\n/** Groups listed after the global search results. */\nconst TRAILING_GROUPS = new Set(['theme', 'help'])\n\nconst t = useT()\nconst choice = useChoice()\nconst panel = usePanel()\nconst page = usePageSchema()\nconst runner = useActionRunner()\nconst query = ref('')\nconst groups = ref<SearchGroup[]>([])\nconst loading = ref(false)\nconst loaded = ref<CommandPaletteResponse | null>(null)\nconst config = computed(() => panel.value.globalSearch)\nconst palette = computed(() => panel.value.commandPalette)\nconst endpoint = computed(() => (config.value ? panel.value.endpoints.globalSearch : undefined))\nconst placeholder = computed(\n  () =>\n    config.value?.placeholder ??\n    palette.value?.placeholder ??\n    t('palette.placeholder', {}, 'Type a command or search…'),\n)\nconst overlay = computed(\n  () => panel.value.keyboardShortcuts !== false && panel.value.keyboardShortcuts !== undefined,\n)\n\n// Create links and recent records, loaded each time the palette opens (also when it mounts\n// open: the first time, its code arrives after the click or `mod+k`).\nwatch(\n  open,\n  (value, _old, onCleanup) => {\n    const url = panel.value.endpoints.commandPalette\n\n    if (!value || !palette.value || !url) return\n\n    let active = true\n    onCleanup(() => {\n      active = false\n    })\n\n    requestJson<CommandPaletteResponse>(url)\n      .then((response) => {\n        if (active) loaded.value = response\n      })\n      .catch(() => {\n        if (active) loaded.value = { create: [], recent: [] }\n      })\n  },\n  { immediate: true },\n)\n\nconst latest = createLatestRequest()\n\nconst search = debounce((term: string) => {\n  const url = endpoint.value\n\n  if (!url || term.trim() === '') {\n    latest.cancel()\n    groups.value = []\n    loading.value = false\n\n    return\n  }\n\n  // Only the newest request may update the results: older responses are aborted/dropped.\n  void latest\n    .run(\n      (signal) => requestJson<{ groups: SearchGroup[] }>(url, { query: { search: term }, signal }),\n      (response) => {\n        groups.value = response.groups\n      },\n      () => {\n        loading.value = false\n      },\n    )\n    .catch(() => {\n      groups.value = []\n    })\n}, globalSearchDebounce(config.value))\n\nwatch(query, (term) => {\n  loading.value = endpoint.value !== undefined && term.trim() !== ''\n  search(term)\n})\n\nonScopeDispose(() => {\n  search.cancel()\n  latest.cancel()\n})\n\n// Closing the palette (or navigating away) starts the next search from scratch.\nconst reset = () => {\n  search.cancel()\n  latest.cancel()\n  query.value = ''\n  groups.value = []\n  loading.value = false\n  loaded.value = null\n}\n\nwatch(open, (value) => {\n  if (!value) reset()\n})\n\nlet stopListening: (() => void) | undefined\n\nonMounted(() => {\n  stopListening = router.on('navigate', () => {\n    open.value = false\n    reset()\n  })\n})\n\nonBeforeUnmount(() => stopListening?.())\n\n// `Panel::pwa()`: \"Install app\" while the browser offers it (or on iOS Safari).\nconst pwaState = useStore(pwaStore)\nconst installable = computed(() => Boolean(panel.value.pwa) && canInstallPwa(pwaState.value))\n\nconst items = computed(() =>\n  commandPaletteItems({\n    panel: panel.value,\n    page: page.value,\n    loaded: loaded.value,\n    shortcutsOverlay: overlay.value,\n    ...(installable.value ? { install: t('pwa.install', {}, 'Install app') } : {}),\n    labels: {\n      light: t('palette.theme.light', {}, 'Light theme'),\n      dark: t('palette.theme.dark', {}, 'Dark theme'),\n      system: t('palette.theme.system', {}, 'System theme'),\n      shortcuts: t('palette.shortcuts', {}, 'Keyboard shortcuts'),\n    },\n  }),\n)\nconst local = computed(() => filterCommandPalette(items.value, query.value))\nconst leading = computed(() => local.value.filter((group) => !TRAILING_GROUPS.has(group.id)))\nconst trailing = computed(() => local.value.filter((group) => TRAILING_GROUPS.has(group.id)))\n\n// Announced by the `aria-live` region once a search has finished.\nconst status = computed(() =>\n  globalSearchStatus(\n    query.value,\n    loading.value,\n    [...groups.value, ...local.value.map((group) => ({ results: group.items }))],\n    { t, choice },\n  ),\n)\n\nconst defaultGroupLabels: Record<string, string> = {\n  recent: 'Recent',\n  actions: 'Actions',\n  commands: 'Commands',\n  create: 'Create',\n  navigation: 'Go to',\n  theme: 'Theme',\n  help: 'Help',\n}\n\nconst heading = (group: PaletteGroup) => {\n  const id = group.id.startsWith('commands:') ? 'commands' : group.id\n\n  return group.label ?? t(paletteGroupKey(group.id), {}, defaultGroupLabels[id] ?? id)\n}\n\nconst subtitle = (group: PaletteGroup, item: PaletteItem) =>\n  item.description ??\n  (group.id === 'recent' || group.id === 'navigation' ? item.groupLabel : undefined)\n\nconst run = (item: PaletteItem) => {\n  open.value = false\n\n  if (item.kind === 'action' && item.action && item.context) {\n    void runner.trigger(item.action, item.context)\n  } else if (item.kind === 'url' && item.url) {\n    if (item.openInNewTab) {\n      window.open(item.url, '_blank', 'noopener,noreferrer')\n    } else {\n      router.visit(item.url)\n    }\n  } else if (item.kind === 'theme' && item.appearance) {\n    setAppearance(item.appearance, panel.value)\n  } else if (item.kind === 'shortcut' && item.shortcutId) {\n    const id = item.shortcutId\n    // After the dialog closed, so focus returns to the page before the overlay opens.\n    setTimeout(() => shortcuts.trigger(id), 0)\n  } else if (item.kind === 'install') {\n    void installPwa(t)\n  }\n}\n\nconst select = (url: string) => {\n  open.value = false\n  router.visit(url)\n}\n\n// A URL action next to a search result (`getGlobalSearchResultActions()`); the item itself\n// navigates on select, so the click must not reach it.\nconst visitAction = (event: MouseEvent, action: ActionSchema) => {\n  event.stopPropagation()\n\n  if (!action.url || action.openUrlInNewTab || event.metaKey || event.ctrlKey) return\n\n  event.preventDefault()\n  open.value = false\n  router.visit(action.url)\n}\n\nconst details = (result: SearchGroup['results'][number]) =>\n  Object.entries(result.details ?? {})\n    .map(([key, value]) => `${key}: ${String(value)}`)\n    .join(' · ')\n\nconst hasResults = computed(() => groups.value.length > 0 || local.value.length > 0)\n</script>\n\n<template>\n  <CommandDialog\n    :open=\"open\"\n    :title=\"palette ? t('command_palette', {}, 'Command palette') : t('search', {}, 'Search')\"\n    :description=\"placeholder\"\n    @update:open=\"open = $event\"\n  >\n    <Slot name=\"global-search.start\" />\n    <div role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\">{{ status }}</div>\n    <CommandInput\n      :placeholder=\"placeholder\"\n      :model-value=\"query\"\n      @update:model-value=\"query = $event\"\n    />\n    <CommandList>\n      <CommandEmpty v-if=\"!loading && !hasResults\">{{\n        query ? t('no_results', {}, 'No results.') : placeholder\n      }}</CommandEmpty>\n      <CommandGroup\n        v-for=\"group in leading\"\n        :key=\"group.id\"\n        :heading=\"heading(group)\"\n        :data-group=\"group.id\"\n      >\n        <CommandItem\n          v-for=\"item in group.items\"\n          :key=\"item.id\"\n          :value=\"item.id\"\n          :data-kind=\"item.kind\"\n          @select=\"run(item)\"\n        >\n          <Icon v-if=\"item.icon\" :name=\"item.icon\" class=\"size-4\" />\n          <div class=\"flex min-w-0 flex-1 flex-col\">\n            <span class=\"truncate\">{{ item.label }}</span>\n            <span v-if=\"subtitle(group, item)\" class=\"text-muted-foreground truncate text-xs\">{{\n              subtitle(group, item)\n            }}</span>\n          </div>\n          <ShortcutKeys v-if=\"item.shortcut\" :binding=\"item.shortcut\" class=\"ms-auto\" />\n        </CommandItem>\n      </CommandGroup>\n      <div v-if=\"loading\" class=\"flex justify-center py-6\"><Spinner /></div>\n      <CommandGroup\n        v-for=\"group in groups\"\n        :key=\"group.label\"\n        :heading=\"group.label\"\n        data-group=\"search\"\n      >\n        <CommandItem\n          v-for=\"result in group.results\"\n          :key=\"result.url\"\n          :value=\"`search:${group.label}:${result.url}`\"\n          @select=\"select(result.url)\"\n        >\n          <div class=\"flex min-w-0 flex-1 flex-col\">\n            <span>{{ result.title }}</span>\n            <span v-if=\"result.details\" class=\"text-muted-foreground text-xs\">{{\n              details(result)\n            }}</span>\n          </div>\n          <div\n            v-if=\"result.actions?.length\"\n            data-slot=\"global-search-actions\"\n            class=\"ms-auto flex shrink-0 gap-1\"\n          >\n            <Button\n              v-for=\"action in result.actions.filter((item) => item.url)\"\n              :key=\"action.name\"\n              as-child\n              variant=\"ghost\"\n              size=\"xs\"\n              class=\"h-6 px-2 text-xs\"\n            >\n              <a\n                :href=\"action.url\"\n                :target=\"action.openUrlInNewTab ? '_blank' : undefined\"\n                :rel=\"action.openUrlInNewTab ? 'noopener noreferrer' : undefined\"\n                :aria-label=\"action.label ? undefined : (action.tooltip ?? action.name)\"\n                @pointerdown.stop\n                @click=\"visitAction($event, action)\"\n              >\n                <Icon v-if=\"action.icon\" :name=\"action.icon\" class=\"size-3.5\" />\n                {{ action.label }}\n              </a>\n            </Button>\n          </div>\n        </CommandItem>\n      </CommandGroup>\n      <CommandGroup\n        v-for=\"group in trailing\"\n        :key=\"group.id\"\n        :heading=\"heading(group)\"\n        :data-group=\"group.id\"\n      >\n        <CommandItem\n          v-for=\"item in group.items\"\n          :key=\"item.id\"\n          :value=\"item.id\"\n          :data-kind=\"item.kind\"\n          @select=\"run(item)\"\n        >\n          <Icon v-if=\"item.icon\" :name=\"item.icon\" class=\"size-4\" />\n          <span class=\"min-w-0 flex-1 truncate\">{{ item.label }}</span>\n          <ShortcutKeys v-if=\"item.shortcut\" :binding=\"item.shortcut\" class=\"ms-auto\" />\n        </CommandItem>\n      </CommandGroup>\n    </CommandList>\n    <Slot name=\"global-search.end\" />\n  </CommandDialog>\n</template>\n"],"mappings":""}

package/dist/components/panel/GlobalSearchPalette.vue.d.ts

@@ -0,0 +1,16 @@
+type __VLS_PublicProps = {
+    /**
+     * The command palette behind `GlobalSearch`: global search results plus (with
+     * `alfakit.commandPalette`) the page's header actions, panel commands, navigation, "create"
+     * links, recent records, theme switching and the shortcuts overlay. Its code loads the first
+     * time the palette opens; the trigger and `mod+k` stay in the shell.
+     */
+    'open'?: boolean;
+};
+declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=GlobalSearchPalette.vue.d.ts.map

package/dist/components/panel/GlobalSearchPalette.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalSearchPalette.vue.d.ts","sourceRoot":"","sources":["../../../src/components/panel/GlobalSearchPalette.vue"],"names":[],"mappings":"AA4nBA,KAAK,iBAAiB,GAAG;IACzB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;;;;;;AA6bF,wBAOG"}

package/dist/components/panel/GlobalSearchPalette.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,279 @@
+import { useActionRunner as e, useChoice as t, usePageSchema as n, usePanel as r, useT as i } from "../../context.js";
+import { useStore as ee } from "../../composables/use-store.js";
+import a from "../../lib/Icon.js";
+import te from "../ui/Button2.js";
+import ne from "../ui/Spinner.js";
+import o from "./Slot.js";
+import s from "../ui/CommandEmpty.js";
+import c from "../ui/CommandGroup.js";
+import re from "../ui/CommandInput.js";
+import l from "../ui/CommandItem.js";
+import ie from "../ui/CommandList.js";
+import { installPwa as ae } from "./pwa.js";
+import u from "./ShortcutKeys.js";
+import oe from "../ui/CommandDialog.js";
+import { canInstallPwa as se, commandPaletteItems as ce, createLatestRequest as le, debounce as ue, filterCommandPalette as de, globalSearchDebounce as fe, globalSearchStatus as pe, paletteGroupKey as me, pwaStore as he, requestJson as d, setAppearance as ge, shortcuts as _e } from "@alfakit/core";
+import { router as f } from "@inertiajs/vue3";
+import { Fragment as p, computed as m, createBlock as h, createCommentVNode as g, createElementBlock as _, createElementVNode as v, createTextVNode as y, createVNode as b, defineComponent as x, onBeforeUnmount as ve, onMounted as ye, onScopeDispose as be, openBlock as S, ref as C, renderList as w, toDisplayString as T, unref as E, useModel as xe, watch as D, withCtx as O, withModifiers as k } from "vue";
+//#region src/components/panel/GlobalSearchPalette.vue?vue&type=script&setup=true&lang.ts
+var A = {
+	role: "status",
+	"aria-live": "polite",
+	"aria-atomic": "true",
+	class: "sr-only"
+}, j = { class: "flex min-w-0 flex-1 flex-col" }, M = { class: "truncate" }, Se = {
+	key: 0,
+	class: "text-muted-foreground truncate text-xs"
+}, Ce = {
+	key: 1,
+	class: "flex justify-center py-6"
+}, we = { class: "flex min-w-0 flex-1 flex-col" }, Te = {
+	key: 0,
+	class: "text-muted-foreground text-xs"
+}, Ee = {
+	key: 0,
+	"data-slot": "global-search-actions",
+	class: "ms-auto flex shrink-0 gap-1"
+}, De = [
+	"href",
+	"target",
+	"rel",
+	"aria-label",
+	"onClick"
+], Oe = { class: "min-w-0 flex-1 truncate" }, N = /*@__PURE__*/ x({
+	__name: "GlobalSearchPalette",
+	props: {
+		open: {
+			type: Boolean,
+			default: !1
+		},
+		openModifiers: {}
+	},
+	emits: ["update:open"],
+	setup(x) {
+		let N = xe(x, "open"), P = /* @__PURE__ */ new Set(["theme", "help"]), F = i(), ke = t(), I = r(), Ae = n(), je = e(), L = C(""), R = C([]), z = C(!1), B = C(null), V = m(() => I.value.globalSearch), H = m(() => I.value.commandPalette), U = m(() => V.value ? I.value.endpoints.globalSearch : void 0), W = m(() => V.value?.placeholder ?? H.value?.placeholder ?? F("palette.placeholder", {}, "Type a command or search…")), Me = m(() => I.value.keyboardShortcuts !== !1 && I.value.keyboardShortcuts !== void 0);
+		D(N, (e, t, n) => {
+			let r = I.value.endpoints.commandPalette;
+			if (!e || !H.value || !r) return;
+			let i = !0;
+			n(() => {
+				i = !1;
+			}), d(r).then((e) => {
+				i && (B.value = e);
+			}).catch(() => {
+				i && (B.value = {
+					create: [],
+					recent: []
+				});
+			});
+		}, { immediate: !0 });
+		let G = le(), K = ue((e) => {
+			let t = U.value;
+			if (!t || e.trim() === "") {
+				G.cancel(), R.value = [], z.value = !1;
+				return;
+			}
+			G.run((n) => d(t, {
+				query: { search: e },
+				signal: n
+			}), (e) => {
+				R.value = e.groups;
+			}, () => {
+				z.value = !1;
+			}).catch(() => {
+				R.value = [];
+			});
+		}, fe(V.value));
+		D(L, (e) => {
+			z.value = U.value !== void 0 && e.trim() !== "", K(e);
+		}), be(() => {
+			K.cancel(), G.cancel();
+		});
+		let q = () => {
+			K.cancel(), G.cancel(), L.value = "", R.value = [], z.value = !1, B.value = null;
+		};
+		D(N, (e) => {
+			e || q();
+		});
+		let J;
+		ye(() => {
+			J = f.on("navigate", () => {
+				N.value = !1, q();
+			});
+		}), ve(() => J?.());
+		let Ne = ee(he), Pe = m(() => !!I.value.pwa && se(Ne.value)), Fe = m(() => ce({
+			panel: I.value,
+			page: Ae.value,
+			loaded: B.value,
+			shortcutsOverlay: Me.value,
+			...Pe.value ? { install: F("pwa.install", {}, "Install app") } : {},
+			labels: {
+				light: F("palette.theme.light", {}, "Light theme"),
+				dark: F("palette.theme.dark", {}, "Dark theme"),
+				system: F("palette.theme.system", {}, "System theme"),
+				shortcuts: F("palette.shortcuts", {}, "Keyboard shortcuts")
+			}
+		})), Y = m(() => de(Fe.value, L.value)), Ie = m(() => Y.value.filter((e) => !P.has(e.id))), Le = m(() => Y.value.filter((e) => P.has(e.id))), X = m(() => pe(L.value, z.value, [...R.value, ...Y.value.map((e) => ({ results: e.items }))], {
+			t: F,
+			choice: ke
+		})), Re = {
+			recent: "Recent",
+			actions: "Actions",
+			commands: "Commands",
+			create: "Create",
+			navigation: "Go to",
+			theme: "Theme",
+			help: "Help"
+		}, Z = (e) => {
+			let t = e.id.startsWith("commands:") ? "commands" : e.id;
+			return e.label ?? F(me(e.id), {}, Re[t] ?? t);
+		}, Q = (e, t) => t.description ?? (e.id === "recent" || e.id === "navigation" ? t.groupLabel : void 0), $ = (e) => {
+			if (N.value = !1, e.kind === "action" && e.action && e.context) je.trigger(e.action, e.context);
+			else if (e.kind === "url" && e.url) e.openInNewTab ? window.open(e.url, "_blank", "noopener,noreferrer") : f.visit(e.url);
+			else if (e.kind === "theme" && e.appearance) ge(e.appearance, I.value);
+			else if (e.kind === "shortcut" && e.shortcutId) {
+				let t = e.shortcutId;
+				setTimeout(() => _e.trigger(t), 0);
+			} else e.kind === "install" && ae(F);
+		}, ze = (e) => {
+			N.value = !1, f.visit(e);
+		}, Be = (e, t) => {
+			e.stopPropagation(), !(!t.url || t.openUrlInNewTab || e.metaKey || e.ctrlKey) && (e.preventDefault(), N.value = !1, f.visit(t.url));
+		}, Ve = (e) => Object.entries(e.details ?? {}).map(([e, t]) => `${e}: ${String(t)}`).join(" · "), He = m(() => R.value.length > 0 || Y.value.length > 0);
+		return (e, t) => (S(), h(oe, {
+			open: N.value,
+			title: H.value ? E(F)("command_palette", {}, "Command palette") : E(F)("search", {}, "Search"),
+			description: W.value,
+			"onUpdate:open": t[2] ||= (e) => N.value = e
+		}, {
+			default: O(() => [
+				b(o, { name: "global-search.start" }),
+				v("div", A, T(X.value), 1),
+				b(re, {
+					placeholder: W.value,
+					"model-value": L.value,
+					"onUpdate:modelValue": t[0] ||= (e) => L.value = e
+				}, null, 8, ["placeholder", "model-value"]),
+				b(ie, null, {
+					default: O(() => [
+						!z.value && !He.value ? (S(), h(s, { key: 0 }, {
+							default: O(() => [y(T(L.value ? E(F)("no_results", {}, "No results.") : W.value), 1)]),
+							_: 1
+						})) : g("", !0),
+						(S(!0), _(p, null, w(Ie.value, (e) => (S(), h(c, {
+							key: e.id,
+							heading: Z(e),
+							"data-group": e.id
+						}, {
+							default: O(() => [(S(!0), _(p, null, w(e.items, (t) => (S(), h(l, {
+								key: t.id,
+								value: t.id,
+								"data-kind": t.kind,
+								onSelect: (e) => $(t)
+							}, {
+								default: O(() => [
+									t.icon ? (S(), h(E(a), {
+										key: 0,
+										name: t.icon,
+										class: "size-4"
+									}, null, 8, ["name"])) : g("", !0),
+									v("div", j, [v("span", M, T(t.label), 1), Q(e, t) ? (S(), _("span", Se, T(Q(e, t)), 1)) : g("", !0)]),
+									t.shortcut ? (S(), h(u, {
+										key: 1,
+										binding: t.shortcut,
+										class: "ms-auto"
+									}, null, 8, ["binding"])) : g("", !0)
+								]),
+								_: 2
+							}, 1032, [
+								"value",
+								"data-kind",
+								"onSelect"
+							]))), 128))]),
+							_: 2
+						}, 1032, ["heading", "data-group"]))), 128)),
+						z.value ? (S(), _("div", Ce, [b(ne)])) : g("", !0),
+						(S(!0), _(p, null, w(R.value, (e) => (S(), h(c, {
+							key: e.label,
+							heading: e.label,
+							"data-group": "search"
+						}, {
+							default: O(() => [(S(!0), _(p, null, w(e.results, (n) => (S(), h(l, {
+								key: n.url,
+								value: `search:${e.label}:${n.url}`,
+								onSelect: (e) => ze(n.url)
+							}, {
+								default: O(() => [v("div", we, [v("span", null, T(n.title), 1), n.details ? (S(), _("span", Te, T(Ve(n)), 1)) : g("", !0)]), n.actions?.length ? (S(), _("div", Ee, [(S(!0), _(p, null, w(n.actions.filter((e) => e.url), (e) => (S(), h(te, {
+									key: e.name,
+									"as-child": "",
+									variant: "ghost",
+									size: "xs",
+									class: "h-6 px-2 text-xs"
+								}, {
+									default: O(() => [v("a", {
+										href: e.url,
+										target: e.openUrlInNewTab ? "_blank" : void 0,
+										rel: e.openUrlInNewTab ? "noopener noreferrer" : void 0,
+										"aria-label": e.label ? void 0 : e.tooltip ?? e.name,
+										onPointerdown: t[1] ||= k(() => {}, ["stop"]),
+										onClick: (t) => Be(t, e)
+									}, [e.icon ? (S(), h(E(a), {
+										key: 0,
+										name: e.icon,
+										class: "size-3.5"
+									}, null, 8, ["name"])) : g("", !0), y(" " + T(e.label), 1)], 40, De)]),
+									_: 2
+								}, 1024))), 128))])) : g("", !0)]),
+								_: 2
+							}, 1032, ["value", "onSelect"]))), 128))]),
+							_: 2
+						}, 1032, ["heading"]))), 128)),
+						(S(!0), _(p, null, w(Le.value, (e) => (S(), h(c, {
+							key: e.id,
+							heading: Z(e),
+							"data-group": e.id
+						}, {
+							default: O(() => [(S(!0), _(p, null, w(e.items, (e) => (S(), h(l, {
+								key: e.id,
+								value: e.id,
+								"data-kind": e.kind,
+								onSelect: (t) => $(e)
+							}, {
+								default: O(() => [
+									e.icon ? (S(), h(E(a), {
+										key: 0,
+										name: e.icon,
+										class: "size-4"
+									}, null, 8, ["name"])) : g("", !0),
+									v("span", Oe, T(e.label), 1),
+									e.shortcut ? (S(), h(u, {
+										key: 1,
+										binding: e.shortcut,
+										class: "ms-auto"
+									}, null, 8, ["binding"])) : g("", !0)
+								]),
+								_: 2
+							}, 1032, [
+								"value",
+								"data-kind",
+								"onSelect"
+							]))), 128))]),
+							_: 2
+						}, 1032, ["heading", "data-group"]))), 128))
+					]),
+					_: 1
+				}),
+				b(o, { name: "global-search.end" })
+			]),
+			_: 1
+		}, 8, [
+			"open",
+			"title",
+			"description"
+		]));
+	}
+});
+//#endregion
+export { N as default };
+
+//# sourceMappingURL=GlobalSearchPalette.vue_vue_type_script_setup_true_lang.js.map