@ecsplico/editor 2.1.2 → 3.1.0

package/dist/vue/components/EditorToolbar.js

@@ -1,7 +1,5 @@
-import { abilitiesAtSelection } from "../../core/abilities.js";
-import { mergeToolbarGroups } from "../../core/toolbar.js";
-import { contributions } from "../../core/define-editor.js";
 import { borrowedFeatureContext, editorEntryOf } from "../../core/editor-ui.js";
+import { commandState, toolbarOf } from "../../core/commands.js";
 import { useUiKit } from "../kit/use-ui-kit.js";
 import { useEditorContext } from "../context.js";
 import { useEditorI18n } from "../use-editor-i18n.js";
@@ -17,15 +15,12 @@ const _hoisted_2 = {
 };
 /**
 * The toolbar of an editor, placed anywhere on the page. `editor` is the instance it works on (from the surface's
-* `ready` event); the preset registered for that instance supplies the groups, `preset` renders them (disabled) while
-* there is no editor yet. Never reads a global active editor.
+* `ready` event); the preset registered for that instance (`editorEntryOf`) supplies the groups. Without an editor
+* (not mounted yet, or read-only by the host's choice) it renders no groups. Never reads a global active editor.
 */
 const _sfc_main = /*@__PURE__*/ defineComponent({
 	__name: "EditorToolbar",
-	props: {
-		editor: {},
-		preset: {}
-	},
+	props: { editor: {} },
 	setup(__props) {
 		const props = __props;
 		const { Button: UButton, DropdownMenu: UDropdownMenu, FieldGroup: UFieldGroup, Tooltip: UTooltip } = useUiKit();
@@ -43,38 +38,35 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			if (!preset) return [];
 			const cached = built.get(preset);
 			if (cached) return cached;
-			const build = () => mergeToolbarGroups(contributions(preset, "toolbar").flatMap((factory) => factory(ctx)));
+			const build = () => toolbarOf(preset, ctx);
 			const groups = instance ? instance.appContext.app.runWithContext(build) : build();
 			built.set(preset, groups);
 			return groups;
 		}
-		groupsOf(props.preset);
+		const NO_EDITOR = {
+			visible: true,
+			enabled: false,
+			active: false
+		};
 		const visibleGroups = computed(() => {
-			const editor = props.editor;
-			return groupsOf(editorEntryOf(editor && toRaw(editor))?.preset ?? props.preset).filter((group) => !editor || !group.visible || group.visible(editor)).map((group) => ({
+			const editor = props.editor && toRaw(props.editor);
+			return groupsOf(editorEntryOf(editor)?.preset).filter((group) => !editor || !group.visible || group.visible(editor)).map((group) => ({
 				group,
-				items: group.items.filter((item) => !editor || !item.visible || item.visible(editor))
+				items: group.items.map((cmd) => ({
+					cmd,
+					state: editor ? commandState(editor, cmd, "selection") : NO_EDITOR
+				})).filter(({ state }) => state.visible)
 			})).filter(({ items }) => items.length > 0);
 		});
-		const abilities = computed(() => props.editor ? abilitiesAtSelection(props.editor) : /* @__PURE__ */ new Set());
-		function active(item) {
-			return !!props.editor && !!item.active?.(props.editor);
-		}
-		function disabled(item) {
-			const editor = props.editor;
-			if (!editor) return true;
-			if (item.disabled?.(editor)) return true;
-			return !active(item) && !!item.ability && !abilities.value.has(item.ability);
-		}
-		function run(item) {
-			if (props.editor) item.run?.(props.editor);
+		function run(cmd) {
+			if (props.editor && "run" in cmd) cmd.run(props.editor);
 		}
-		function menuOf(item) {
-			return props.editor && item.menu ? item.menu(props.editor) : [];
+		function menuOf(cmd) {
+			return props.editor && "menu" in cmd ? cmd.menu(props.editor) : [];
 		}
 		/** Descriptors are framework-agnostic (`component: unknown`); in this Vue toolbar they are Vue components. */
-		function componentOf(item) {
-			return item.component;
+		function componentOf(cmd) {
+			return "component" in cmd ? cmd.component : void 0;
 		}
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
@@ -83,25 +75,25 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				"aria-label": unref(t)("toolbar.label")
 			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleGroups.value, ({ group, items }, gi) => {
 				return openBlock(), createElementBlock(Fragment, { key: group.id }, [gi > 0 ? (openBlock(), createElementBlock("span", _hoisted_2)) : createCommentVNode("v-if", true), createVNode(unref(UFieldGroup), { size: "sm" }, {
-					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(items, (item) => {
-						return openBlock(), createElementBlock(Fragment, { key: item.id }, [componentOf(item) ? (openBlock(), createBlock(resolveDynamicComponent(componentOf(item)), {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(items, ({ cmd, state }) => {
+						return openBlock(), createElementBlock(Fragment, { key: cmd.id }, [componentOf(cmd) ? (openBlock(), createBlock(resolveDynamicComponent(componentOf(cmd)), {
 							key: 0,
 							editor: props.editor
-						}, null, 8, ["editor"])) : item.menu ? (openBlock(), createBlock(unref(UDropdownMenu), {
+						}, null, 8, ["editor"])) : "menu" in cmd ? (openBlock(), createBlock(unref(UDropdownMenu), {
 							key: 1,
-							items: menuOf(item)
+							items: menuOf(cmd)
 						}, {
 							default: withCtx(() => [createVNode(unref(UTooltip), {
-								text: item.label,
-								kbds: item.kbds
+								text: cmd.label,
+								kbds: cmd.kbds
 							}, {
 								default: withCtx(() => [(openBlock(), createBlock(unref(UButton), {
-									key: item.icon,
+									key: cmd.icon,
 									color: "neutral",
 									variant: "ghost",
-									icon: item.icon,
-									"aria-label": item.label,
-									disabled: disabled(item),
+									icon: cmd.icon,
+									"aria-label": cmd.label,
+									disabled: !state.enabled,
 									onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {}, ["prevent"]))
 								}, null, 8, [
 									"icon",
@@ -113,22 +105,22 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 							_: 2
 						}, 1032, ["items"])) : (openBlock(), createBlock(unref(UTooltip), {
 							key: 2,
-							text: item.label,
-							kbds: item.kbds
+							text: cmd.label,
+							kbds: cmd.kbds
 						}, {
 							default: withCtx(() => [(openBlock(), createBlock(unref(UButton), {
-								key: item.icon,
+								key: cmd.icon,
 								color: "neutral",
 								variant: "ghost",
 								"active-color": "primary",
 								"active-variant": "soft",
-								icon: item.icon,
-								"aria-label": item.label,
-								active: active(item),
-								"aria-pressed": item.active ? active(item) : void 0,
-								disabled: disabled(item),
+								icon: cmd.icon,
+								"aria-label": cmd.label,
+								active: state.active,
+								"aria-pressed": cmd.active ? state.active : void 0,
+								disabled: !state.enabled,
 								onMousedown: _cache[1] || (_cache[1] = withModifiers(() => {}, ["prevent"])),
-								onClick: ($event) => run(item)
+								onClick: ($event) => run(cmd)
 							}, null, 8, [
 								"icon",
 								"aria-label",

package/dist/vue/components/EditorToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditorToolbar.js","names":["_openBlock","_createElementBlock","_unref","_Fragment","_renderList","_createCommentVNode","_createVNode","_withCtx","_createBlock","_resolveDynamicComponent","_withModifiers"],"sources":["../../../src/vue/components/EditorToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useUiKit } from '../kit/use-ui-kit'\nimport type { Editor } from '@tiptap/core'\nimport { type Component, computed, getCurrentInstance, toRaw } from 'vue'\nimport { abilitiesAtSelection } from '../../core/abilities'\nimport { contributions } from '../../core/define-editor'\nimport { borrowedFeatureContext, editorEntryOf } from '../../core/editor-ui'\nimport { useEditorContext } from '../context'\nimport { useEditorI18n } from '../use-editor-i18n'\nimport { trackedStore } from '../store-ref'\nimport type { EditorPreset } from '../../core/feature'\nimport type { Ability } from '../../core/schema/abilities'\nimport { mergeToolbarGroups, type MenuItem, type ToolbarGroup, type ToolbarItem } from '../../core/toolbar'\n\n/**\n * The toolbar of an editor, placed anywhere on the page. `editor` is the instance it works on (from the surface's\n * `ready` event); the preset registered for that instance supplies the groups, `preset` renders them (disabled) while\n * there is no editor yet. Never reads a global active editor.\n */\nconst props = defineProps<{ editor?: Editor, preset?: EditorPreset }>()\n\nconst { Button: UButton, DropdownMenu: UDropdownMenu, FieldGroup: UFieldGroup, Tooltip: UTooltip } = useUiKit()\n\nconst appContext = useEditorContext()\nconst { t } = useEditorI18n()\nconst instance = getCurrentInstance()\n\n// The context toolbar factories see: settings and fetch of the app, everything per-surface delegates to the editor's\n// registered context while there is one.\nconst ctx = borrowedFeatureContext({\n  app: appContext,\n  getEditor: () => props.editor,\n  unwrap: toRaw,\n  // Tracked: `active`/`visible`/`menu` read the settings during render, which must re-run when they change.\n  settings: trackedStore(appContext.settings),\n})\n\n// Factories run during setup (they may use composables that inject); a later preset is built within the app context.\nconst built = new WeakMap<EditorPreset, ToolbarGroup[]>()\nfunction groupsOf(preset: EditorPreset | undefined): ToolbarGroup[] {\n  if (!preset) return []\n  const cached = built.get(preset)\n  if (cached) return cached\n  const build = () => mergeToolbarGroups(contributions(preset, 'toolbar').flatMap(factory => factory(ctx)))\n  const groups = instance ? instance.appContext.app.runWithContext(build) : build()\n  built.set(preset, groups)\n  return groups\n}\ngroupsOf(props.preset)\n\nconst visibleGroups = computed(() => {\n  const editor = props.editor\n  const groups = groupsOf(editorEntryOf(editor && toRaw(editor))?.preset ?? props.preset)\n  return groups\n    .filter(group => !editor || !group.visible || group.visible(editor))\n    .map(group => ({ group, items: group.items.filter(item => !editor || !item.visible || item.visible(editor)) }))\n    .filter(({ items }) => items.length > 0)\n})\n\n// `active`, `can()` and the abilities read the vue-3 Editor's reactive `state`, so these re-evaluate on every transaction.\nconst abilities = computed(() => props.editor ? abilitiesAtSelection(props.editor) : new Set<Ability>())\nfunction active(item: ToolbarItem): boolean {\n  return !!props.editor && !!item.active?.(props.editor)\n}\nfunction disabled(item: ToolbarItem): boolean {\n  const editor = props.editor\n  if (!editor) return true\n  if (item.disabled?.(editor)) return true\n  return !active(item) && !!item.ability && !abilities.value.has(item.ability)\n}\nfunction run(item: ToolbarItem) {\n  if (props.editor) item.run?.(props.editor)\n}\nfunction menuOf(item: ToolbarItem): MenuItem[] {\n  return props.editor && item.menu ? item.menu(props.editor) : []\n}\n/** Descriptors are framework-agnostic (`component: unknown`); in this Vue toolbar they are Vue components. */\nfunction componentOf(item: ToolbarItem): Component | undefined {\n  return item.component as Component | undefined\n}\n</script>\n\n<template>\n  <div class=\"flex flex-wrap items-center gap-1.5\" role=\"toolbar\" :aria-label=\"t('toolbar.label')\">\n    <template v-for=\"({ group, items }, gi) in visibleGroups\" :key=\"group.id\">\n      <span v-if=\"gi > 0\" role=\"separator\" aria-orientation=\"vertical\" class=\"mx-2 h-6 w-[2px] shrink-0 bg-[var(--sk-border-accented)]\" />\n      <UFieldGroup size=\"sm\">\n        <template v-for=\"item in items\" :key=\"item.id\">\n          <component :is=\"componentOf(item)\" v-if=\"componentOf(item)\" :editor=\"props.editor\" />\n          <UDropdownMenu v-else-if=\"item.menu\" :items=\"menuOf(item)\">\n            <UTooltip :text=\"item.label\" :kbds=\"item.kbds\">\n              <UButton\n                :key=\"item.icon\"\n                color=\"neutral\"\n                variant=\"ghost\"\n                :icon=\"item.icon\"\n                :aria-label=\"item.label\"\n                :disabled=\"disabled(item)\"\n                @mousedown.prevent\n              />\n            </UTooltip>\n          </UDropdownMenu>\n          <UTooltip v-else :text=\"item.label\" :kbds=\"item.kbds\">\n            <UButton\n              :key=\"item.icon\"\n              color=\"neutral\"\n              variant=\"ghost\"\n              active-color=\"primary\"\n              active-variant=\"soft\"\n              :icon=\"item.icon\"\n              :aria-label=\"item.label\"\n              :active=\"active(item)\"\n              :aria-pressed=\"item.active ? active(item) : undefined\"\n              :disabled=\"disabled(item)\"\n              @mousedown.prevent\n              @click=\"run(item)\"\n            />\n          </UTooltip>\n        </template>\n      </UFieldGroup>\n    </template>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"EditorToolbar.js","names":["_openBlock","_createElementBlock","_unref","_Fragment","_renderList","_createCommentVNode","_createVNode","_withCtx","_createBlock","_resolveDynamicComponent","_withModifiers"],"sources":["../../../src/vue/components/EditorToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useUiKit } from '../kit/use-ui-kit'\nimport type { Editor } from '@tiptap/core'\nimport { type Component, computed, getCurrentInstance, toRaw } from 'vue'\nimport { type CommandDef, type CommandState, commandState, type MenuItem, type PlacedToolbarGroup, toolbarOf } from '../../core/commands'\nimport { borrowedFeatureContext, editorEntryOf } from '../../core/editor-ui'\nimport { useEditorContext } from '../context'\nimport { useEditorI18n } from '../use-editor-i18n'\nimport { trackedStore } from '../store-ref'\nimport type { EditorPreset } from '../../core/feature'\n\n/**\n * The toolbar of an editor, placed anywhere on the page. `editor` is the instance it works on (from the surface's\n * `ready` event); the preset registered for that instance (`editorEntryOf`) supplies the groups. Without an editor\n * (not mounted yet, or read-only by the host's choice) it renders no groups. Never reads a global active editor.\n */\nconst props = defineProps<{ editor?: Editor }>()\n\nconst { Button: UButton, DropdownMenu: UDropdownMenu, FieldGroup: UFieldGroup, Tooltip: UTooltip } = useUiKit()\n\nconst appContext = useEditorContext()\nconst { t } = useEditorI18n()\nconst instance = getCurrentInstance()\n\n// The context toolbar factories see: settings and fetch of the app, everything per-surface delegates to the editor's\n// registered context while there is one.\nconst ctx = borrowedFeatureContext({\n  app: appContext,\n  getEditor: () => props.editor,\n  unwrap: toRaw,\n  // Tracked: `active`/`visible`/`menu` read the settings during render, which must re-run when they change.\n  settings: trackedStore(appContext.settings),\n})\n\n// Factories run during setup (they may use composables that inject); a later preset is built within the app context.\nconst built = new WeakMap<EditorPreset, PlacedToolbarGroup[]>()\nfunction groupsOf(preset: EditorPreset | undefined): PlacedToolbarGroup[] {\n  if (!preset) return []\n  const cached = built.get(preset)\n  if (cached) return cached\n  const build = () => toolbarOf(preset, ctx)\n  const groups = instance ? instance.appContext.app.runWithContext(build) : build()\n  built.set(preset, groups)\n  return groups\n}\n\n// Every enabled/visible/active state comes from `commandState`. It reads the vue-3 Editor's reactive `state`\n// (through `can()` and the abilities), so this re-evaluates on every transaction. The raw instance is what the\n// registered entry (and with it the insert guards) is keyed by.\nconst NO_EDITOR: CommandState = { visible: true, enabled: false, active: false }\nconst visibleGroups = computed(() => {\n  const editor = props.editor && toRaw(props.editor)\n  const groups = groupsOf(editorEntryOf(editor)?.preset)\n  return groups\n    .filter(group => !editor || !group.visible || group.visible(editor))\n    .map(group => ({\n      group,\n      items: group.items\n        .map(cmd => ({ cmd, state: editor ? commandState(editor, cmd, 'selection') : NO_EDITOR }))\n        .filter(({ state }) => state.visible),\n    }))\n    .filter(({ items }) => items.length > 0)\n})\n\nfunction run(cmd: CommandDef) {\n  if (props.editor && 'run' in cmd) cmd.run(props.editor)\n}\nfunction menuOf(cmd: CommandDef): MenuItem[] {\n  return props.editor && 'menu' in cmd ? cmd.menu(props.editor) : []\n}\n/** Descriptors are framework-agnostic (`component: unknown`); in this Vue toolbar they are Vue components. */\nfunction componentOf(cmd: CommandDef): Component | undefined {\n  return 'component' in cmd ? cmd.component as Component : undefined\n}\n</script>\n\n<template>\n  <div class=\"flex flex-wrap items-center gap-1.5\" role=\"toolbar\" :aria-label=\"t('toolbar.label')\">\n    <template v-for=\"({ group, items }, gi) in visibleGroups\" :key=\"group.id\">\n      <span v-if=\"gi > 0\" role=\"separator\" aria-orientation=\"vertical\" class=\"mx-2 h-6 w-[2px] shrink-0 bg-[var(--sk-border-accented)]\" />\n      <UFieldGroup size=\"sm\">\n        <template v-for=\"{ cmd, state } in items\" :key=\"cmd.id\">\n          <component :is=\"componentOf(cmd)\" v-if=\"componentOf(cmd)\" :editor=\"props.editor\" />\n          <UDropdownMenu v-else-if=\"'menu' in cmd\" :items=\"menuOf(cmd)\">\n            <UTooltip :text=\"cmd.label\" :kbds=\"cmd.kbds\">\n              <UButton\n                :key=\"cmd.icon\"\n                color=\"neutral\"\n                variant=\"ghost\"\n                :icon=\"cmd.icon\"\n                :aria-label=\"cmd.label\"\n                :disabled=\"!state.enabled\"\n                @mousedown.prevent\n              />\n            </UTooltip>\n          </UDropdownMenu>\n          <UTooltip v-else :text=\"cmd.label\" :kbds=\"cmd.kbds\">\n            <UButton\n              :key=\"cmd.icon\"\n              color=\"neutral\"\n              variant=\"ghost\"\n              active-color=\"primary\"\n              active-variant=\"soft\"\n              :icon=\"cmd.icon\"\n              :aria-label=\"cmd.label\"\n              :active=\"state.active\"\n              :aria-pressed=\"cmd.active ? state.active : undefined\"\n              :disabled=\"!state.enabled\"\n              @mousedown.prevent\n              @click=\"run(cmd)\"\n            />\n          </UTooltip>\n        </template>\n      </UFieldGroup>\n    </template>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;EAEd,MAAM,EAAE,QAAQ,SAAS,cAAc,eAAe,YAAY,aAAa,SAAS,aAAa,SAAS;EAE9G,MAAM,aAAa,iBAAiB;EACpC,MAAM,EAAE,MAAM,cAAc;EAC5B,MAAM,WAAW,mBAAmB;EAIpC,MAAM,MAAM,uBAAuB;GACjC,KAAK;GACL,iBAAiB,MAAM;GACvB,QAAQ;GAER,UAAU,aAAa,WAAW,QAAQ;EAC5C,CAAC;EAGD,MAAM,wBAAQ,IAAI,QAA4C;EAC9D,SAAS,SAAS,QAAwD;GACxE,IAAI,CAAC,QAAQ,OAAO,CAAC;GACrB,MAAM,SAAS,MAAM,IAAI,MAAM;GAC/B,IAAI,QAAQ,OAAO;GACnB,MAAM,cAAc,UAAU,QAAQ,GAAG;GACzC,MAAM,SAAS,WAAW,SAAS,WAAW,IAAI,eAAe,KAAK,IAAI,MAAM;GAChF,MAAM,IAAI,QAAQ,MAAM;GACxB,OAAO;EACT;EAKA,MAAM,YAA0B;GAAE,SAAS;GAAM,SAAS;GAAO,QAAQ;EAAM;EAC/E,MAAM,gBAAgB,eAAe;GACnC,MAAM,SAAS,MAAM,UAAU,MAAM,MAAM,MAAM;GAEjD,OADe,SAAS,cAAc,MAAM,CAAC,EAAE,MACxC,CAAA,CACJ,QAAO,UAAS,CAAC,UAAU,CAAC,MAAM,WAAW,MAAM,QAAQ,MAAM,CAAC,CAAA,CAClE,KAAI,WAAU;IACb;IACA,OAAO,MAAM,MACV,KAAI,SAAQ;KAAE;KAAK,OAAO,SAAS,aAAa,QAAQ,KAAK,WAAW,IAAI;IAAU,EAAE,CAAA,CACxF,QAAQ,EAAE,YAAY,MAAM,OAAO;GACxC,EAAE,CAAA,CACD,QAAQ,EAAE,YAAY,MAAM,SAAS,CAAC;EAC3C,CAAC;EAED,SAAS,IAAI,KAAiB;GAC5B,IAAI,MAAM,UAAU,SAAS,KAAK,IAAI,IAAI,MAAM,MAAM;EACxD;EACA,SAAS,OAAO,KAA6B;GAC3C,OAAO,MAAM,UAAU,UAAU,MAAM,IAAI,KAAK,MAAM,MAAM,IAAI,CAAC;EACnE;;EAEA,SAAS,YAAY,KAAwC;GAC3D,OAAO,eAAe,MAAM,IAAI,YAAyB,KAAA;EAC3D;;GAIE,OAAAA,UAAA,GAAAC,mBAsCM,OAAA;IAtCD,OAAM;IAAsC,MAAK;IAAW,cAAYC,MAAA,CAAA,CAAC,CAAA,eAAA;GAC5E,GAAA,EAAAF,UAAA,IAAA,GAAAC,mBAoCWE,UAAA,MAAAC,WApCgC,cAAA,QAAa,EAApC,OAAO,SAAS,OAAE;IAA0B,OAAA,UAAA,GAAA,mBAAA,UAAA,EAAA,KAAA,MAAM,GAAA,GACxD,CAAA,KAAE,KAAdJ,UAAA,GAAAC,mBAAoI,QAApI,UAAoI,KAAAI,mBAAA,QAAA,IAAA,GACpIC,YAiCcJ,MAAA,WAAA,GAAA,EAjCD,MAAK,KAAI,GAAA;KACV,SAAAK,cAA+B,EAAzCP,UAAA,IAAA,GAAAC,mBA+BWE,UAAA,MAAAC,WA/BwB,QAAK,EAArB,KAAK,YAAK;MAAmB,OAAA,UAAA,GAAA,mBAAA,UAAA,EAAA,KAAA,IAAI,GAAA,GACV,CAAA,YAAY,GAAG,KAAvDJ,UAAA,GAAAQ,YAAmFC,wBAAnE,YAAY,GAAG,CAAA,GAAA;;OAA4B,QAAQ,MAAM;MACrC,GAAA,MAAA,GAAA,CAAA,QAAA,CAAA,KAAA,UAAA,OAApCT,UAAA,GAAAQ,YAYgBN,MAAA,aAAA,GAAA;;OAZ0B,OAAO,OAAO,GAAG;;OACzD,SAAAK,cAUW,CAVXD,YAUWJ,MAAA,QAAA,GAAA;QAVA,MAAM,IAAI;QAAQ,MAAM,IAAI;;QACrC,SAAAK,cAQE,EARFP,UAAA,GAAAQ,YAQEN,MAAA,OAAA,GAAA;SAPC,KAAK,IAAI;SACV,OAAM;SACN,SAAQ;SACP,MAAM,IAAI;SACV,cAAY,IAAI;SAChB,UAAQ,CAAG,MAAM;SACjB,aAAS,OAAA,OAAA,OAAA,KAAAQ,oBAAV,CAAA,GAAkB,CAAA,SAAA,CAAA;;;;;;;;;MAIxB,GAAA,MAAA,CAAA,OAAA,CAAA,MAAAV,UAAA,GAAAQ,YAeWN,MAAA,QAAA,GAAA;;OAfO,MAAM,IAAI;OAAQ,MAAM,IAAI;;OAC5C,SAAAK,cAaE,EAbFP,UAAA,GAAAQ,YAaEN,MAAA,OAAA,GAAA;QAZC,KAAK,IAAI;QACV,OAAM;QACN,SAAQ;QACR,gBAAa;QACb,kBAAe;QACd,MAAM,IAAI;QACV,cAAY,IAAI;QAChB,QAAQ,MAAM;QACd,gBAAc,IAAI,SAAS,MAAM,SAAS,KAAA;QAC1C,UAAQ,CAAG,MAAM;QACjB,aAAS,OAAA,OAAA,OAAA,KAAAQ,oBAAV,CAAA,GAAkB,CAAA,SAAA,CAAA;QACjB,UAAK,WAAE,IAAI,GAAG"}

package/dist/vue/components/EditorToolbar.vue.d.ts

@@ -1,14 +1,12 @@
-import { EditorPreset } from "../../core/feature.js";
 import { Editor } from "@tiptap/core";
 //#region src/vue/components/EditorToolbar.vue.d.ts
 /**
  * The toolbar of an editor, placed anywhere on the page. `editor` is the instance it works on (from the surface's
- * `ready` event); the preset registered for that instance supplies the groups, `preset` renders them (disabled) while
- * there is no editor yet. Never reads a global active editor.
+ * `ready` event); the preset registered for that instance (`editorEntryOf`) supplies the groups. Without an editor
+ * (not mounted yet, or read-only by the host's choice) it renders no groups. Never reads a global active editor.
  */
 type __VLS_Props = {
   editor?: Editor;
-  preset?: EditorPreset;
 };
 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;

package/dist/vue/compose.d.ts

@@ -0,0 +1,17 @@
+import { ComposeOptions, ComposedEditor } from "../presets/compose.js";
+import { Component } from "vue";
+//#region src/vue/compose.d.ts
+/**
+ * `composeEditor` of `presets/compose` over the Vue bindings: the editor of the three dimensions (`content`,
+ * `interaction`, `ai`), pruned by the capabilities of `options.backend`. Call during component setup (`themesFeature()`
+ * reads the current Vue app to stop the theme runtime when it unmounts).
+ */
+export declare const composeEditor: (options: ComposeOptions<Component>) => ComposedEditor<Component>;
+/**
+ * The advanced editor on the Vue surface: `{ content: 'rich', interaction: 'full', ai: true }`, every dimension option
+ * overridable (`compositeKinds`, `backend`, `add`, `remove`, ...). Collaboration is active only when a session is passed
+ * to the surface.
+ */
+export declare const advancedEditor: (options?: Partial<ComposeOptions<Component>>) => ComposedEditor<Component>;
+//#endregion
+//# sourceMappingURL=compose.d.ts.map

package/dist/vue/compose.js

@@ -0,0 +1,51 @@
+import { coreUiFeature } from "../core/core-feature.js";
+import { compositeAiFeature } from "../integrations/composite-ai/index.js";
+import { transcriptAiFeature } from "../integrations/transcript-ai/index.js";
+import { composeEditor as composeEditor$1 } from "../presets/compose.js";
+import { mediaFeature } from "../features/media/vue.js";
+import _sfc_main from "./components/EditorCommandPalette.js";
+import { aiFeature } from "../features/ai/vue.js";
+import { authorsFeature } from "../features/authors/vue.js";
+import { blockUiFeature } from "../features/block-ui/vue.js";
+import { collabFeature } from "../features/collab/vue.js";
+import { commentsFeature } from "../features/comments/vue.js";
+import { compositeFeature } from "../features/composites/vue.js";
+import { themesFeature } from "../features/themes/vue.js";
+import { transcriptFeature } from "../features/transcript/vue.js";
+//#region src/vue/compose.ts
+/** The Vue bindings of every UI-bound catalog feature. */
+const VUE_BINDINGS = {
+	"core-ui": () => coreUiFeature({ palette: _sfc_main }),
+	"media": mediaFeature,
+	"transcript": transcriptFeature,
+	"composites": compositeFeature,
+	"authors": authorsFeature,
+	"comments": commentsFeature,
+	"ai": aiFeature,
+	"composite-ai": compositeAiFeature,
+	"transcript-ai": transcriptAiFeature,
+	"collab": collabFeature,
+	"block-ui": blockUiFeature,
+	"themes": themesFeature
+};
+/**
+* `composeEditor` of `presets/compose` over the Vue bindings: the editor of the three dimensions (`content`,
+* `interaction`, `ai`), pruned by the capabilities of `options.backend`. Call during component setup (`themesFeature()`
+* reads the current Vue app to stop the theme runtime when it unmounts).
+*/
+const composeEditor = (options) => composeEditor$1(VUE_BINDINGS, options);
+/**
+* The advanced editor on the Vue surface: `{ content: 'rich', interaction: 'full', ai: true }`, every dimension option
+* overridable (`compositeKinds`, `backend`, `add`, `remove`, ...). Collaboration is active only when a session is passed
+* to the surface.
+*/
+const advancedEditor = (options = {}) => composeEditor({
+	content: "rich",
+	interaction: "full",
+	ai: true,
+	...options
+});
+//#endregion
+export { advancedEditor, composeEditor };
+
+//# sourceMappingURL=compose.js.map

package/dist/vue/compose.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compose.js","names":["EditorCommandPalette","compose"],"sources":["../../src/vue/compose.ts"],"sourcesContent":["import type { Component } from 'vue'\nimport { coreUiFeature } from '../core/core-feature'\nimport EditorCommandPalette from './components/EditorCommandPalette.vue'\nimport { aiFeature } from '../features/ai/vue'\nimport { authorsFeature } from '../features/authors/vue'\nimport { blockUiFeature } from '../features/block-ui/vue'\nimport { collabFeature } from '../features/collab/vue'\nimport { commentsFeature } from '../features/comments/vue'\nimport { compositeFeature } from '../features/composites/vue'\nimport { mediaFeature } from '../features/media/vue'\nimport { themesFeature } from '../features/themes/vue'\nimport { transcriptFeature } from '../features/transcript/vue'\nimport { compositeAiFeature } from '../integrations/composite-ai'\nimport { transcriptAiFeature } from '../integrations/transcript-ai'\nimport { type ComposedEditor, type ComposeOptions, composeEditor as compose, type UiBindings } from '../presets/compose'\n\n/** The Vue bindings of every UI-bound catalog feature. */\nconst VUE_BINDINGS = {\n  'core-ui': () => coreUiFeature<Component>({ palette: EditorCommandPalette }),\n  'media': mediaFeature,\n  'transcript': transcriptFeature,\n  'composites': compositeFeature,\n  'authors': authorsFeature,\n  'comments': commentsFeature,\n  'ai': aiFeature,\n  'composite-ai': compositeAiFeature,\n  'transcript-ai': transcriptAiFeature,\n  'collab': collabFeature,\n  'block-ui': blockUiFeature,\n  'themes': themesFeature,\n} satisfies UiBindings<Component>\n\n/**\n * `composeEditor` of `presets/compose` over the Vue bindings: the editor of the three dimensions (`content`,\n * `interaction`, `ai`), pruned by the capabilities of `options.backend`. Call during component setup (`themesFeature()`\n * reads the current Vue app to stop the theme runtime when it unmounts).\n */\nexport const composeEditor = (options: ComposeOptions<Component>): ComposedEditor<Component> => compose(VUE_BINDINGS, options)\n\n/**\n * The advanced editor on the Vue surface: `{ content: 'rich', interaction: 'full', ai: true }`, every dimension option\n * overridable (`compositeKinds`, `backend`, `add`, `remove`, ...). Collaboration is active only when a session is passed\n * to the surface.\n */\nexport const advancedEditor = (options: Partial<ComposeOptions<Component>> = {}): ComposedEditor<Component> => composeEditor({ content: 'rich', interaction: 'full', ai: true, ...options })\n"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,eAAe;CACnB,iBAAiB,cAAyB,EAAE,SAASA,UAAqB,CAAC;CAC3E,SAAS;CACT,cAAc;CACd,cAAc;CACd,WAAW;CACX,YAAY;CACZ,MAAM;CACN,gBAAgB;CAChB,iBAAiB;CACjB,UAAU;CACV,YAAY;CACZ,UAAU;AACZ;;;;;;AAOA,MAAa,iBAAiB,YAAkEC,gBAAQ,cAAc,OAAO;;;;;;AAO7H,MAAa,kBAAkB,UAA8C,CAAC,MAAiC,cAAc;CAAE,SAAS;CAAQ,aAAa;CAAQ,IAAI;CAAM,GAAG;AAAQ,CAAC"}

package/dist/vue/context-key.d.ts

@@ -0,0 +1,6 @@
+import { EditorContext } from "../core/context.js";
+import { InjectionKey } from "vue";
+//#region src/vue/context-key.d.ts
+export declare const EDITOR_CONTEXT: InjectionKey<EditorContext>;
+//#endregion
+//# sourceMappingURL=context-key.d.ts.map

package/dist/vue/context-key.js

@@ -0,0 +1,6 @@
+//#region src/vue/context-key.ts
+const EDITOR_CONTEXT = Symbol("tiptap-editor:context");
+//#endregion
+export { EDITOR_CONTEXT };
+
+//# sourceMappingURL=context-key.js.map

package/dist/vue/context-key.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-key.js","names":[],"sources":["../../src/vue/context-key.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\nimport type { EditorContext } from '../core/context'\n\n// The injection key alone, so modules that only read the context (`adapters/vue`) do not reach the Nuxt UI kit that `./context` installs.\nexport const EDITOR_CONTEXT: InjectionKey<EditorContext> = Symbol('tiptap-editor:context')\n"],"mappings":";AAIA,MAAa,iBAA8C,OAAO,uBAAuB"}

package/dist/vue/context.d.ts

@@ -1,19 +1,20 @@
 import { EditorContext, EditorContextOptions } from "../core/context.js";
+import { EDITOR_CONTEXT } from "./context-key.js";
 import { VueUiKit } from "./kit/types.js";
-import { InjectionKey, Plugin } from "vue";
+import { Plugin } from "vue";
 //#region src/vue/context.d.ts
-export declare const EDITOR_CONTEXT: InjectionKey<EditorContext>;
 /** What `createEditor` takes: the framework-free context options plus the UI kit that renders the chrome. */
 export interface VueEditorOptions extends EditorContextOptions {
   /** The widgets the chrome components render. Default: `nuxtUiKit()` (`/vue/kit/nuxt-ui`), which needs `@nuxt/ui` set up in the host; pass your own `VueUiKit` to render the chrome with another library. */
   kit?: VueUiKit;
 }
 /**
- * The editor context of a Vue app: the settings shared by all editors of the app, the HTTP client and the UI kit
+ * The editor context of a Vue app: the settings shared by all editors of the app, the backend and the UI kit
  * (`useUiKit()`). Install with `app.use(createEditor())`. The settings are read from localStorage right away (client only) and every change is
- * written back. With `settings.remote`, `GET /api/editor/settings` (on the first `useEditorSettings()`) answers: `200`
- * replaces them with the user's account settings (`synced`), `204` (the host's adapter keeps no settings), `401` or a
- * network error keep the local ones; once synced every change is also sent to the server (`PUT`, debounced). Watcher
+ * written back. With a backend that offers `settings` (the default HTTP backend does), `backend.settings.load()` (on the first
+ * `useEditorSettings()`) answers: the user's account settings replace them (`synced`), `null` (the host keeps none), a
+ * refusal (`401`, `501`) or a network error keep the local ones; once synced every change is also sent to the backend
+ * (`save`, debounced). Watcher
  * and timer stop with the app. App-level notices (`options.notify`, default: queued until the first `EditorSurface`
  * mounts and hands over the kit's `notifier()`) show as the kit's toasts.
  */
@@ -21,4 +22,5 @@ export declare function createEditor({ kit, ...options }?: VueEditorOptions): Pl
 /** The app's editor context; throws a descriptive error when `createEditor()` was not installed. */
 export declare function useEditorContext(): EditorContext;
 //#endregion
+export { EDITOR_CONTEXT };
 //# sourceMappingURL=context.d.ts.map

package/dist/vue/context.js

@@ -1,17 +1,18 @@
 import { createEditorContext } from "../core/context.js";
+import { EDITOR_CONTEXT } from "./context-key.js";
 import { VUE_UI_KIT } from "./kit/use-ui-kit.js";
 import { createQueuedNotifier } from "./notify.js";
 import { createSettingsBridge } from "./settings.js";
 import { nuxtUiKit } from "./kit/nuxt-ui.js";
 import { inject } from "vue";
 //#region src/vue/context.ts
-const EDITOR_CONTEXT = Symbol("tiptap-editor:context");
 /**
-* The editor context of a Vue app: the settings shared by all editors of the app, the HTTP client and the UI kit
+* The editor context of a Vue app: the settings shared by all editors of the app, the backend and the UI kit
 * (`useUiKit()`). Install with `app.use(createEditor())`. The settings are read from localStorage right away (client only) and every change is
-* written back. With `settings.remote`, `GET /api/editor/settings` (on the first `useEditorSettings()`) answers: `200`
-* replaces them with the user's account settings (`synced`), `204` (the host's adapter keeps no settings), `401` or a
-* network error keep the local ones; once synced every change is also sent to the server (`PUT`, debounced). Watcher
+* written back. With a backend that offers `settings` (the default HTTP backend does), `backend.settings.load()` (on the first
+* `useEditorSettings()`) answers: the user's account settings replace them (`synced`), `null` (the host keeps none), a
+* refusal (`401`, `501`) or a network error keep the local ones; once synced every change is also sent to the backend
+* (`save`, debounced). Watcher
 * and timer stop with the app. App-level notices (`options.notify`, default: queued until the first `EditorSurface`
 * mounts and hands over the kit's `notifier()`) show as the kit's toasts.
 */

package/dist/vue/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../src/vue/context.ts"],"sourcesContent":["import { type InjectionKey, inject, type Plugin } from 'vue'\nimport { createEditorContext, type EditorContext, type EditorContextOptions } from '../core/context'\nimport { createQueuedNotifier } from './notify'\nimport { createSettingsBridge } from './settings'\nimport { nuxtUiKit } from './kit/nuxt-ui'\nimport { VUE_UI_KIT } from './kit/use-ui-kit'\nimport type { VueUiKit } from './kit/types'\n\nexport const EDITOR_CONTEXT: InjectionKey<EditorContext> = Symbol('tiptap-editor:context')\n\n/** What `createEditor` takes: the framework-free context options plus the UI kit that renders the chrome. */\nexport interface VueEditorOptions extends EditorContextOptions {\n  /** The widgets the chrome components render. Default: `nuxtUiKit()` (`/vue/kit/nuxt-ui`), which needs `@nuxt/ui` set up in the host; pass your own `VueUiKit` to render the chrome with another library. */\n  kit?: VueUiKit\n}\n\n/**\n * The editor context of a Vue app: the settings shared by all editors of the app, the HTTP client and the UI kit\n * (`useUiKit()`). Install with `app.use(createEditor())`. The settings are read from localStorage right away (client only) and every change is\n * written back. With `settings.remote`, `GET /api/editor/settings` (on the first `useEditorSettings()`) answers: `200`\n * replaces them with the user's account settings (`synced`), `204` (the host's adapter keeps no settings), `401` or a\n * network error keep the local ones; once synced every change is also sent to the server (`PUT`, debounced). Watcher\n * and timer stop with the app. App-level notices (`options.notify`, default: queued until the first `EditorSurface`\n * mounts and hands over the kit's `notifier()`) show as the kit's toasts.\n */\nexport function createEditor({ kit = nuxtUiKit(), ...options }: VueEditorOptions = {}): Plugin {\n  return {\n    install(app) {\n      const ctx = createEditorContext({ notify: createQueuedNotifier(), ...options })\n      app.provide(VUE_UI_KIT, kit)\n      app.provide(EDITOR_CONTEXT, ctx)\n      const bridge = createSettingsBridge(ctx)\n      app.onUnmount(() => {\n        bridge.dispose()\n        ctx.dispose()\n      })\n    },\n  }\n}\n\n/** The app's editor context; throws a descriptive error when `createEditor()` was not installed. */\nexport function useEditorContext(): EditorContext {\n  const context = inject(EDITOR_CONTEXT, null)\n  if (!context) throw new Error('@ecsplico/editor: no editor context; install it with app.use(createEditor())')\n  return context\n}\n"],"mappings":";;;;;;;AAQA,MAAa,iBAA8C,OAAO,uBAAuB;;;;;;;;;;AAiBzF,SAAgB,aAAa,EAAE,MAAM,UAAU,GAAG,GAAG,YAA8B,CAAC,GAAW;CAC7F,OAAO,EACL,QAAQ,KAAK;EACX,MAAM,MAAM,oBAAoB;GAAE,QAAQ,qBAAqB;GAAG,GAAG;EAAQ,CAAC;EAC9E,IAAI,QAAQ,YAAY,GAAG;EAC3B,IAAI,QAAQ,gBAAgB,GAAG;EAC/B,MAAM,SAAS,qBAAqB,GAAG;EACvC,IAAI,gBAAgB;GAClB,OAAO,QAAQ;GACf,IAAI,QAAQ;EACd,CAAC;CACH,EACF;AACF;;AAGA,SAAgB,mBAAkC;CAChD,MAAM,UAAU,OAAO,gBAAgB,IAAI;CAC3C,IAAI,CAAC,SAAS,MAAM,IAAI,MAAM,8EAA8E;CAC5G,OAAO;AACT"}
+{"version":3,"file":"context.js","names":[],"sources":["../../src/vue/context.ts"],"sourcesContent":["import { inject, type Plugin } from 'vue'\nimport { createEditorContext, type EditorContext, type EditorContextOptions } from '../core/context'\nimport { EDITOR_CONTEXT } from './context-key'\nimport { createQueuedNotifier } from './notify'\nimport { createSettingsBridge } from './settings'\nimport { nuxtUiKit } from './kit/nuxt-ui'\nimport { VUE_UI_KIT } from './kit/use-ui-kit'\nimport type { VueUiKit } from './kit/types'\n\nexport { EDITOR_CONTEXT }\n\n/** What `createEditor` takes: the framework-free context options plus the UI kit that renders the chrome. */\nexport interface VueEditorOptions extends EditorContextOptions {\n  /** The widgets the chrome components render. Default: `nuxtUiKit()` (`/vue/kit/nuxt-ui`), which needs `@nuxt/ui` set up in the host; pass your own `VueUiKit` to render the chrome with another library. */\n  kit?: VueUiKit\n}\n\n/**\n * The editor context of a Vue app: the settings shared by all editors of the app, the backend and the UI kit\n * (`useUiKit()`). Install with `app.use(createEditor())`. The settings are read from localStorage right away (client only) and every change is\n * written back. With a backend that offers `settings` (the default HTTP backend does), `backend.settings.load()` (on the first\n * `useEditorSettings()`) answers: the user's account settings replace them (`synced`), `null` (the host keeps none), a\n * refusal (`401`, `501`) or a network error keep the local ones; once synced every change is also sent to the backend\n * (`save`, debounced). Watcher\n * and timer stop with the app. App-level notices (`options.notify`, default: queued until the first `EditorSurface`\n * mounts and hands over the kit's `notifier()`) show as the kit's toasts.\n */\nexport function createEditor({ kit = nuxtUiKit(), ...options }: VueEditorOptions = {}): Plugin {\n  return {\n    install(app) {\n      const ctx = createEditorContext({ notify: createQueuedNotifier(), ...options })\n      app.provide(VUE_UI_KIT, kit)\n      app.provide(EDITOR_CONTEXT, ctx)\n      const bridge = createSettingsBridge(ctx)\n      app.onUnmount(() => {\n        bridge.dispose()\n        ctx.dispose()\n      })\n    },\n  }\n}\n\n/** The app's editor context; throws a descriptive error when `createEditor()` was not installed. */\nexport function useEditorContext(): EditorContext {\n  const context = inject(EDITOR_CONTEXT, null)\n  if (!context) throw new Error('@ecsplico/editor: no editor context; install it with app.use(createEditor())')\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA2BA,SAAgB,aAAa,EAAE,MAAM,UAAU,GAAG,GAAG,YAA8B,CAAC,GAAW;CAC7F,OAAO,EACL,QAAQ,KAAK;EACX,MAAM,MAAM,oBAAoB;GAAE,QAAQ,qBAAqB;GAAG,GAAG;EAAQ,CAAC;EAC9E,IAAI,QAAQ,YAAY,GAAG;EAC3B,IAAI,QAAQ,gBAAgB,GAAG;EAC/B,MAAM,SAAS,qBAAqB,GAAG;EACvC,IAAI,gBAAgB;GAClB,OAAO,QAAQ;GACf,IAAI,QAAQ;EACd,CAAC;CACH,EACF;AACF;;AAGA,SAAgB,mBAAkC;CAChD,MAAM,UAAU,OAAO,gBAAgB,IAAI;CAC3C,IAAI,CAAC,SAAS,MAAM,IAAI,MAAM,8EAA8E;CAC5G,OAAO;AACT"}

package/dist/vue/index.d.ts

@@ -1,12 +1,14 @@
 import { EditorFeature, EditorPreset } from "../core/feature.js";
-import _default from "./components/EditorSettingsModal.vue.js";
-import _default$1 from "./components/EditorSettingsPanel.vue.js";
-import _default$2 from "./components/EditorSurface.vue.js";
-import _default$3 from "./components/EditorToolbar.vue.js";
-import _default$4 from "./components/SettingsSection.vue.js";
-import _default$5 from "./components/SuggestionList.vue.js";
+import _default from "./components/EditorCommandPalette.vue.js";
+import _default$1 from "./components/EditorSettingsModal.vue.js";
+import _default$2 from "./components/EditorSettingsPanel.vue.js";
+import _default$3 from "./components/EditorSurface.vue.js";
+import _default$4 from "./components/EditorToolbar.vue.js";
+import _default$5 from "./components/SettingsSection.vue.js";
+import _default$6 from "./components/SuggestionList.vue.js";
+import { EDITOR_CONTEXT } from "./context-key.js";
 import { VueUiKit } from "./kit/types.js";
-import { EDITOR_CONTEXT, VueEditorOptions, createEditor, useEditorContext } from "./context.js";
+import { VueEditorOptions, createEditor, useEditorContext } from "./context.js";
 import { VUE_UI_KIT, useUiKit } from "./kit/use-ui-kit.js";
 import { QueuedNotifier, attachNotifier, createQueuedNotifier } from "./notify.js";
 import { useEditorI18n } from "./use-editor-i18n.js";
@@ -22,5 +24,5 @@ export type VueFeature = EditorFeature<Component>;
 /** A preset of Vue features: what `EditorSurface` mounts. */
 export type VuePreset = EditorPreset<Component>;
 //#endregion
-export { EDITOR_CONTEXT, EDITOR_UI, _default as EditorSettingsModal, _default$1 as EditorSettingsPanel, _default$2 as EditorSurface, _default$3 as EditorToolbar, type QueuedNotifier, _default$4 as SettingsSection, _default$5 as SuggestionList, VUE_UI_KIT, type VueEditorOptions, type VueUiKit, attachNotifier, createEditor, createQueuedNotifier, storeFromRef, trackedStore, useEditorContext, useEditorI18n, useEditorSettings, useEditorUi, useNotifier, useStoreRef, useUiKit, useWritableStoreRef, vueSuggestionRenderer };
+export { EDITOR_CONTEXT, EDITOR_UI, _default as EditorCommandPalette, _default$1 as EditorSettingsModal, _default$2 as EditorSettingsPanel, _default$3 as EditorSurface, _default$4 as EditorToolbar, type QueuedNotifier, _default$5 as SettingsSection, _default$6 as SuggestionList, VUE_UI_KIT, type VueEditorOptions, type VueUiKit, attachNotifier, createEditor, createQueuedNotifier, storeFromRef, trackedStore, useEditorContext, useEditorI18n, useEditorSettings, useEditorUi, useNotifier, useStoreRef, useUiKit, useWritableStoreRef, vueSuggestionRenderer };
 //# sourceMappingURL=index.d.ts.map

package/dist/vue/index.js

@@ -1,16 +1,18 @@
+import { EDITOR_CONTEXT } from "./context-key.js";
 import { VUE_UI_KIT, useUiKit } from "./kit/use-ui-kit.js";
 import { attachNotifier, createQueuedNotifier } from "./notify.js";
 import { useEditorSettings } from "./settings.js";
-import { EDITOR_CONTEXT, createEditor, useEditorContext } from "./context.js";
+import { createEditor, useEditorContext } from "./context.js";
 import { useEditorI18n } from "./use-editor-i18n.js";
 import { EDITOR_UI, useEditorUi } from "./use-editor-ui.js";
-import _sfc_main$5 from "./components/SuggestionList.js";
+import _sfc_main$6 from "./components/SuggestionList.js";
 import { vueSuggestionRenderer } from "./suggestion-renderer.js";
-import _sfc_main$1 from "./components/EditorSettingsPanel.js";
-import _sfc_main from "./components/EditorSettingsModal.js";
-import _sfc_main$2 from "./components/EditorSurface.js";
+import _sfc_main$2 from "./components/EditorSettingsPanel.js";
+import _sfc_main$1 from "./components/EditorSettingsModal.js";
+import _sfc_main$3 from "./components/EditorSurface.js";
 import { useNotifier } from "./use-notifier.js";
 import { storeFromRef, trackedStore, useStoreRef, useWritableStoreRef } from "./store-ref.js";
-import _sfc_main$4 from "./components/SettingsSection.js";
-import _sfc_main$3 from "./components/EditorToolbar.js";
-export { EDITOR_CONTEXT, EDITOR_UI, _sfc_main as EditorSettingsModal, _sfc_main$1 as EditorSettingsPanel, _sfc_main$2 as EditorSurface, _sfc_main$3 as EditorToolbar, _sfc_main$4 as SettingsSection, _sfc_main$5 as SuggestionList, VUE_UI_KIT, attachNotifier, createEditor, createQueuedNotifier, storeFromRef, trackedStore, useEditorContext, useEditorI18n, useEditorSettings, useEditorUi, useNotifier, useStoreRef, useUiKit, useWritableStoreRef, vueSuggestionRenderer };
+import _sfc_main from "./components/EditorCommandPalette.js";
+import _sfc_main$5 from "./components/SettingsSection.js";
+import _sfc_main$4 from "./components/EditorToolbar.js";
+export { EDITOR_CONTEXT, EDITOR_UI, _sfc_main as EditorCommandPalette, _sfc_main$1 as EditorSettingsModal, _sfc_main$2 as EditorSettingsPanel, _sfc_main$3 as EditorSurface, _sfc_main$4 as EditorToolbar, _sfc_main$5 as SettingsSection, _sfc_main$6 as SuggestionList, VUE_UI_KIT, attachNotifier, createEditor, createQueuedNotifier, storeFromRef, trackedStore, useEditorContext, useEditorI18n, useEditorSettings, useEditorUi, useNotifier, useStoreRef, useUiKit, useWritableStoreRef, vueSuggestionRenderer };

package/dist/vue/kit/index.d.ts

@@ -1,3 +1,3 @@
-import { AlertProps, AvatarProps, BadgeProps, ButtonProps, ChipProps, DropdownItem, DropdownItems, DropdownMenuProps, FieldGroupProps, FormFieldProps, IconProps, InputExposed, InputMenuItem, InputMenuProps, InputProps, KitAnchor, KitColor, KitOverlayContent, KitOverlayUi, KitSize, KitVariant, ModalProps, PopoverProps, RadioGroupProps, SelectItem, SelectMenuProps, SelectProps, SeparatorProps, SwitchProps, TabItem, TableColumn, TableProps, TableSort, TabsProps, TextareaProps, TooltipProps, TreeNode, TreeProps, VueUiKit } from "./types.js";
+import { AlertProps, AvatarProps, BadgeProps, ButtonProps, ChipProps, CommandPaletteGroup, CommandPaletteItem, CommandPaletteProps, DropdownItem, DropdownItems, DropdownMenuProps, FieldGroupProps, FormFieldProps, IconProps, InputExposed, InputMenuItem, InputMenuProps, InputProps, KitAnchor, KitColor, KitOverlayContent, KitOverlayUi, KitSize, KitVariant, ModalProps, PopoverProps, RadioGroupProps, SelectItem, SelectMenuProps, SelectProps, SeparatorProps, SwitchProps, TabItem, TableColumn, TableProps, TableSort, TabsProps, TextareaProps, TooltipProps, TreeNode, TreeProps, VueUiKit } from "./types.js";
 import { VUE_UI_KIT, useUiKit } from "./use-ui-kit.js";
-export { type AlertProps, type AvatarProps, type BadgeProps, type ButtonProps, type ChipProps, type DropdownItem, type DropdownItems, type DropdownMenuProps, type FieldGroupProps, type FormFieldProps, type IconProps, type InputExposed, type InputMenuItem, type InputMenuProps, type InputProps, type KitAnchor, type KitColor, type KitOverlayContent, type KitOverlayUi, type KitSize, type KitVariant, type ModalProps, type PopoverProps, type RadioGroupProps, type SelectItem, type SelectMenuProps, type SelectProps, type SeparatorProps, type SwitchProps, type TabItem, type TableColumn, type TableProps, type TableSort, type TabsProps, type TextareaProps, type TooltipProps, type TreeNode, type TreeProps, VUE_UI_KIT, type VueUiKit, useUiKit };
+export { type AlertProps, type AvatarProps, type BadgeProps, type ButtonProps, type ChipProps, type CommandPaletteGroup, type CommandPaletteItem, type CommandPaletteProps, type DropdownItem, type DropdownItems, type DropdownMenuProps, type FieldGroupProps, type FormFieldProps, type IconProps, type InputExposed, type InputMenuItem, type InputMenuProps, type InputProps, type KitAnchor, type KitColor, type KitOverlayContent, type KitOverlayUi, type KitSize, type KitVariant, type ModalProps, type PopoverProps, type RadioGroupProps, type SelectItem, type SelectMenuProps, type SelectProps, type SeparatorProps, type SwitchProps, type TabItem, type TableColumn, type TableProps, type TableSort, type TabsProps, type TextareaProps, type TooltipProps, type TreeNode, type TreeProps, VUE_UI_KIT, type VueUiKit, useUiKit };

package/dist/vue/kit/nuxt-ui.js

@@ -4,6 +4,7 @@ import Avatar from "@nuxt/ui/components/Avatar.vue";
 import Badge from "@nuxt/ui/components/Badge.vue";
 import Button from "@nuxt/ui/components/Button.vue";
 import Chip from "@nuxt/ui/components/Chip.vue";
+import NuxtCommandPalette from "@nuxt/ui/components/CommandPalette.vue";
 import DropdownMenu from "@nuxt/ui/components/DropdownMenu.vue";
 import FieldGroup from "@nuxt/ui/components/FieldGroup.vue";
 import FormField from "@nuxt/ui/components/FormField.vue";
@@ -63,6 +64,27 @@ const Table = defineComponent({
 	}, slots)
 });
 /**
+* Nuxt UI's `UCommandPalette` matching by the kit contract (typed text = case-insensitive substring of a row's `label`,
+* `description` or `id`) instead of its fuzzy default (threshold 0.1, 12 results). The default fuse keys (label,
+* description, suffix) stay searched next to `id`; the same filter applies to a second level. Groups with `ignoreFilter`
+* (the host matched them) are passed through to the widget, which lists them as given.
+*/
+const CommandPalette = defineComponent({
+	name: "KitCommandPalette",
+	inheritAttrs: false,
+	setup: (_, { attrs, slots }) => () => h(NuxtCommandPalette, {
+		...attrs,
+		fuse: {
+			fuseOptions: {
+				keys: ["id"],
+				threshold: 0,
+				ignoreLocation: true
+			},
+			resultLimit: Number.MAX_SAFE_INTEGER
+		}
+	}, slots)
+});
+/**
 * The Nuxt UI kit: the widgets are Nuxt UI's own components, the notifier its `useToast()`. The host needs `@nuxt/ui`
 * set up (`<UApp>` around the editor, the Vite/Nuxt plugin) and its stylesheet next to the editor's
 * (`@ecsplico/editor/vue/kit/nuxt-ui.css` maps the `--sk-*` tokens onto `--ui-*`).
@@ -74,6 +96,7 @@ function nuxtUiKit() {
 		Badge,
 		Button,
 		Chip,
+		CommandPalette,
 		DropdownMenu,
 		FieldGroup,
 		FormField,

package/dist/vue/kit/nuxt-ui.js.map

@@ -1 +1 @@
-{"version":3,"file":"nuxt-ui.js","names":[],"sources":["../../../src/vue/kit/nuxt-ui.ts"],"sourcesContent":["import Alert from '@nuxt/ui/components/Alert.vue'\nimport Avatar from '@nuxt/ui/components/Avatar.vue'\nimport Badge from '@nuxt/ui/components/Badge.vue'\nimport Button from '@nuxt/ui/components/Button.vue'\nimport Chip from '@nuxt/ui/components/Chip.vue'\nimport DropdownMenu from '@nuxt/ui/components/DropdownMenu.vue'\nimport FieldGroup from '@nuxt/ui/components/FieldGroup.vue'\nimport FormField from '@nuxt/ui/components/FormField.vue'\nimport Icon from '@nuxt/ui/components/Icon.vue'\nimport Input from '@nuxt/ui/components/Input.vue'\nimport InputMenu from '@nuxt/ui/components/InputMenu.vue'\nimport Modal from '@nuxt/ui/components/Modal.vue'\nimport Popover from '@nuxt/ui/components/Popover.vue'\nimport RadioGroup from '@nuxt/ui/components/RadioGroup.vue'\nimport Select from '@nuxt/ui/components/Select.vue'\nimport SelectMenu from '@nuxt/ui/components/SelectMenu.vue'\nimport Separator from '@nuxt/ui/components/Separator.vue'\nimport Switch from '@nuxt/ui/components/Switch.vue'\nimport NuxtTable from '@nuxt/ui/components/Table.vue'\nimport Tabs from '@nuxt/ui/components/Tabs.vue'\nimport Textarea from '@nuxt/ui/components/Textarea.vue'\nimport Tooltip from '@nuxt/ui/components/Tooltip.vue'\nimport Tree from '@nuxt/ui/components/Tree.vue'\nimport { useToast } from '@nuxt/ui/composables'\nimport { type Component, defineComponent, h } from 'vue'\nimport type { Notice, Notifier } from '../../core/notify'\nimport type { VueUiKit } from './types'\n\n/** The part of Nuxt UI's `useToast()` that notices need. */\nexport interface NoticeToaster {\n  add(toast: {\n    id?: string\n    title: string\n    description?: string\n    icon?: string\n    duration?: number\n    color: 'neutral' | 'success' | 'warning' | 'error'\n    actions?: { label: string, color: 'neutral', variant: 'outline', onClick: () => void }[]\n  }): unknown\n  remove?(id: string): unknown\n}\n\n// i18n-ignore: toast colour names, not text\nconst COLORS = { info: 'neutral', success: 'success', warning: 'warning', error: 'error' } as const\n\n/** Shows notices as Nuxt UI toasts (`kind` is the toast `color`; `id` replaces a visible toast of the same id). */\nexport function nuxtUiNotifier(toast: NoticeToaster): Notifier {\n  const notify: Notifier = ({ id, title, description, kind, icon, duration, action }: Notice) => {\n    toast.add({\n      ...(id !== undefined && { id }),\n      title,\n      ...(description !== undefined && { description }),\n      ...(icon !== undefined && { icon }),\n      ...(duration !== undefined && { duration }),\n      ...(action && { actions: [{ label: action.label, color: 'neutral' as const, variant: 'outline' as const, onClick: action.onClick }] }),\n      color: COLORS[kind ?? 'info'],\n    })\n  }\n  notify.dismiss = (id) => { toast.remove?.(id) }\n  return notify\n}\n\n/** Nuxt UI's `UTable` with TanStack's own sorting switched off: the contract is that the host orders `data` itself. */\nconst Table = defineComponent({\n  name: 'KitTable',\n  inheritAttrs: false,\n  setup: (_, { attrs, slots }) => () => h(NuxtTable as unknown as Component, { ...attrs, sortingOptions: { manualSorting: true } }, slots),\n})\n\n/**\n * The Nuxt UI kit: the widgets are Nuxt UI's own components, the notifier its `useToast()`. The host needs `@nuxt/ui`\n * set up (`<UApp>` around the editor, the Vite/Nuxt plugin) and its stylesheet next to the editor's\n * (`@ecsplico/editor/vue/kit/nuxt-ui.css` maps the `--sk-*` tokens onto `--ui-*`).\n */\nexport function nuxtUiKit(): VueUiKit {\n  return {\n    Alert,\n    Avatar,\n    Badge,\n    Button,\n    Chip,\n    DropdownMenu,\n    FieldGroup,\n    FormField,\n    Icon,\n    Input,\n    InputMenu,\n    Modal,\n    Popover,\n    RadioGroup,\n    Select,\n    SelectMenu,\n    Separator,\n    Switch,\n    Table,\n    Tabs,\n    Textarea,\n    Tooltip,\n    Tree,\n    notifier: () => nuxtUiNotifier(useToast()),\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,SAAS;CAAE,MAAM;CAAW,SAAS;CAAW,SAAS;CAAW,OAAO;AAAQ;;AAGzF,SAAgB,eAAe,OAAgC;CAC7D,MAAM,UAAoB,EAAE,IAAI,OAAO,aAAa,MAAM,MAAM,UAAU,aAAqB;EAC7F,MAAM,IAAI;GACR,GAAI,OAAO,KAAA,KAAa,EAAE,GAAG;GAC7B;GACA,GAAI,gBAAgB,KAAA,KAAa,EAAE,YAAY;GAC/C,GAAI,SAAS,KAAA,KAAa,EAAE,KAAK;GACjC,GAAI,aAAa,KAAA,KAAa,EAAE,SAAS;GACzC,GAAI,UAAU,EAAE,SAAS,CAAC;IAAE,OAAO,OAAO;IAAO,OAAO;IAAoB,SAAS;IAAoB,SAAS,OAAO;GAAQ,CAAC,EAAE;GACpI,OAAO,OAAO,QAAQ;EACxB,CAAC;CACH;CACA,OAAO,WAAW,OAAO;EAAE,MAAM,SAAS,EAAE;CAAE;CAC9C,OAAO;AACT;;AAGA,MAAM,QAAQ,gBAAgB;CAC5B,MAAM;CACN,cAAc;CACd,QAAQ,GAAG,EAAE,OAAO,kBAAkB,EAAE,WAAmC;EAAE,GAAG;EAAO,gBAAgB,EAAE,eAAe,KAAK;CAAE,GAAG,KAAK;AACzI,CAAC;;;;;;AAOD,SAAgB,YAAsB;CACpC,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,gBAAgB,eAAe,SAAS,CAAC;CAC3C;AACF"}
+{"version":3,"file":"nuxt-ui.js","names":[],"sources":["../../../src/vue/kit/nuxt-ui.ts"],"sourcesContent":["import Alert from '@nuxt/ui/components/Alert.vue'\nimport Avatar from '@nuxt/ui/components/Avatar.vue'\nimport Badge from '@nuxt/ui/components/Badge.vue'\nimport Button from '@nuxt/ui/components/Button.vue'\nimport Chip from '@nuxt/ui/components/Chip.vue'\nimport NuxtCommandPalette from '@nuxt/ui/components/CommandPalette.vue'\nimport DropdownMenu from '@nuxt/ui/components/DropdownMenu.vue'\nimport FieldGroup from '@nuxt/ui/components/FieldGroup.vue'\nimport FormField from '@nuxt/ui/components/FormField.vue'\nimport Icon from '@nuxt/ui/components/Icon.vue'\nimport Input from '@nuxt/ui/components/Input.vue'\nimport InputMenu from '@nuxt/ui/components/InputMenu.vue'\nimport Modal from '@nuxt/ui/components/Modal.vue'\nimport Popover from '@nuxt/ui/components/Popover.vue'\nimport RadioGroup from '@nuxt/ui/components/RadioGroup.vue'\nimport Select from '@nuxt/ui/components/Select.vue'\nimport SelectMenu from '@nuxt/ui/components/SelectMenu.vue'\nimport Separator from '@nuxt/ui/components/Separator.vue'\nimport Switch from '@nuxt/ui/components/Switch.vue'\nimport NuxtTable from '@nuxt/ui/components/Table.vue'\nimport Tabs from '@nuxt/ui/components/Tabs.vue'\nimport Textarea from '@nuxt/ui/components/Textarea.vue'\nimport Tooltip from '@nuxt/ui/components/Tooltip.vue'\nimport Tree from '@nuxt/ui/components/Tree.vue'\nimport { useToast } from '@nuxt/ui/composables'\nimport { type Component, defineComponent, h } from 'vue'\nimport type { Notice, Notifier } from '../../core/notify'\nimport type { VueUiKit } from './types'\n\n/** The part of Nuxt UI's `useToast()` that notices need. */\nexport interface NoticeToaster {\n  add(toast: {\n    id?: string\n    title: string\n    description?: string\n    icon?: string\n    duration?: number\n    color: 'neutral' | 'success' | 'warning' | 'error'\n    actions?: { label: string, color: 'neutral', variant: 'outline', onClick: () => void }[]\n  }): unknown\n  remove?(id: string): unknown\n}\n\n// i18n-ignore: toast colour names, not text\nconst COLORS = { info: 'neutral', success: 'success', warning: 'warning', error: 'error' } as const\n\n/** Shows notices as Nuxt UI toasts (`kind` is the toast `color`; `id` replaces a visible toast of the same id). */\nexport function nuxtUiNotifier(toast: NoticeToaster): Notifier {\n  const notify: Notifier = ({ id, title, description, kind, icon, duration, action }: Notice) => {\n    toast.add({\n      ...(id !== undefined && { id }),\n      title,\n      ...(description !== undefined && { description }),\n      ...(icon !== undefined && { icon }),\n      ...(duration !== undefined && { duration }),\n      ...(action && { actions: [{ label: action.label, color: 'neutral' as const, variant: 'outline' as const, onClick: action.onClick }] }),\n      color: COLORS[kind ?? 'info'],\n    })\n  }\n  notify.dismiss = (id) => { toast.remove?.(id) }\n  return notify\n}\n\n/** Nuxt UI's `UTable` with TanStack's own sorting switched off: the contract is that the host orders `data` itself. */\nconst Table = defineComponent({\n  name: 'KitTable',\n  inheritAttrs: false,\n  setup: (_, { attrs, slots }) => () => h(NuxtTable as unknown as Component, { ...attrs, sortingOptions: { manualSorting: true } }, slots),\n})\n\n/**\n * Nuxt UI's `UCommandPalette` matching by the kit contract (typed text = case-insensitive substring of a row's `label`,\n * `description` or `id`) instead of its fuzzy default (threshold 0.1, 12 results). The default fuse keys (label,\n * description, suffix) stay searched next to `id`; the same filter applies to a second level. Groups with `ignoreFilter`\n * (the host matched them) are passed through to the widget, which lists them as given.\n */\nconst CommandPalette = defineComponent({\n  name: 'KitCommandPalette',\n  inheritAttrs: false,\n  setup: (_, { attrs, slots }) => () => h(NuxtCommandPalette as unknown as Component, {\n    ...attrs,\n    fuse: { fuseOptions: { keys: ['id'], threshold: 0, ignoreLocation: true }, resultLimit: Number.MAX_SAFE_INTEGER },\n  }, slots),\n})\n\n/**\n * The Nuxt UI kit: the widgets are Nuxt UI's own components, the notifier its `useToast()`. The host needs `@nuxt/ui`\n * set up (`<UApp>` around the editor, the Vite/Nuxt plugin) and its stylesheet next to the editor's\n * (`@ecsplico/editor/vue/kit/nuxt-ui.css` maps the `--sk-*` tokens onto `--ui-*`).\n */\nexport function nuxtUiKit(): VueUiKit {\n  return {\n    Alert,\n    Avatar,\n    Badge,\n    Button,\n    Chip,\n    CommandPalette,\n    DropdownMenu,\n    FieldGroup,\n    FormField,\n    Icon,\n    Input,\n    InputMenu,\n    Modal,\n    Popover,\n    RadioGroup,\n    Select,\n    SelectMenu,\n    Separator,\n    Switch,\n    Table,\n    Tabs,\n    Textarea,\n    Tooltip,\n    Tree,\n    notifier: () => nuxtUiNotifier(useToast()),\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,MAAM,SAAS;CAAE,MAAM;CAAW,SAAS;CAAW,SAAS;CAAW,OAAO;AAAQ;;AAGzF,SAAgB,eAAe,OAAgC;CAC7D,MAAM,UAAoB,EAAE,IAAI,OAAO,aAAa,MAAM,MAAM,UAAU,aAAqB;EAC7F,MAAM,IAAI;GACR,GAAI,OAAO,KAAA,KAAa,EAAE,GAAG;GAC7B;GACA,GAAI,gBAAgB,KAAA,KAAa,EAAE,YAAY;GAC/C,GAAI,SAAS,KAAA,KAAa,EAAE,KAAK;GACjC,GAAI,aAAa,KAAA,KAAa,EAAE,SAAS;GACzC,GAAI,UAAU,EAAE,SAAS,CAAC;IAAE,OAAO,OAAO;IAAO,OAAO;IAAoB,SAAS;IAAoB,SAAS,OAAO;GAAQ,CAAC,EAAE;GACpI,OAAO,OAAO,QAAQ;EACxB,CAAC;CACH;CACA,OAAO,WAAW,OAAO;EAAE,MAAM,SAAS,EAAE;CAAE;CAC9C,OAAO;AACT;;AAGA,MAAM,QAAQ,gBAAgB;CAC5B,MAAM;CACN,cAAc;CACd,QAAQ,GAAG,EAAE,OAAO,kBAAkB,EAAE,WAAmC;EAAE,GAAG;EAAO,gBAAgB,EAAE,eAAe,KAAK;CAAE,GAAG,KAAK;AACzI,CAAC;;;;;;;AAQD,MAAM,iBAAiB,gBAAgB;CACrC,MAAM;CACN,cAAc;CACd,QAAQ,GAAG,EAAE,OAAO,kBAAkB,EAAE,oBAA4C;EAClF,GAAG;EACH,MAAM;GAAE,aAAa;IAAE,MAAM,CAAC,IAAI;IAAG,WAAW;IAAG,gBAAgB;GAAK;GAAG,aAAa,OAAO;EAAiB;CAClH,GAAG,KAAK;AACV,CAAC;;;;;;AAOD,SAAgB,YAAsB;CACpC,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,gBAAgB,eAAe,SAAS,CAAC;CAC3C;AACF"}

package/dist/vue/kit/types.d.ts

@@ -223,8 +223,46 @@ export interface InputMenuProps {
   disabled?: boolean;
   open?: boolean;
 }
+/** One row of `CommandPalette`; `children` make it open a second level (the rows replace the list, the back button returns). */
+export interface CommandPaletteItem {
+  /** Searched together with `label`. */
+  id?: string;
+  label: string;
+  /** Iconify name. */
+  icon?: string;
+  /** Shortcut keys shown at the row's end (`['meta', 'b']`). */
+  kbds?: string[];
+  description?: string;
+  disabled?: boolean;
+  /** Runs when the row is picked (never on a row with `children`). */
+  onSelect?: () => void;
+  children?: CommandPaletteItem[];
+}
+/** A headed set of `CommandPalette` rows. */
+export interface CommandPaletteGroup {
+  id: string;
+  label: string;
+  /** The host already matched the rows against `searchTerm`: they are listed as given, in this order, without the widget's own matching. */
+  ignoreFilter?: boolean;
+  items: CommandPaletteItem[];
+}
+/**
+ * CommandPalette: a search box over grouped rows, filtered while typing (the typed text is a case-insensitive substring
+ * of a row's `label`, `description` or `id`; groups with `ignoreFilter` are listed as given), Enter/click picks the highlighted
+ * enabled row. `searchTerm` (`v-model:search-term`) is the typed text; it resets when a second level opens or closes. Slot: `empty` (no row matches).
+ * Renders inside a `Modal` content (no frame of its own).
+ */
+export interface CommandPaletteProps {
+  groups?: CommandPaletteGroup[];
+  /** The typed text. */
+  searchTerm?: string;
+  placeholder?: string;
+  /** Shows the dialog's close button (emits `update:open(false)`). */
+  close?: boolean;
+}
 /**
- * Modal slots: default (an optional trigger), `body`, `footer` (the title and description come from the props). Emits
+ * Modal slots: default (an optional trigger), `body`, `footer` (the title and description come from the props), and
+ * `content` (the whole panel, replacing header, body and footer; `CommandPalette` fills it). Emits
  * `update:open`; `close` and `after:leave` after the dialog closed.
  */
 export interface ModalProps {
@@ -346,6 +384,7 @@ export interface VueUiKit {
   Badge: Component;
   Button: Component;
   Chip: Component;
+  CommandPalette: Component;
   DropdownMenu: Component;
   FieldGroup: Component;
   FormField: Component;