@ecsplico/editor 0.0.0-stage → 2.0.0

package/dist/vue/components/SuggestionList.js

@@ -0,0 +1,91 @@
+import { useUiKit } from "../kit/use-ui-kit.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, openBlock, ref, renderList, toDisplayString, unref, useTemplateRef, watch, withModifiers } from "vue";
+//#region src/vue/components/SuggestionList.vue
+const _hoisted_1 = { class: "max-h-64 min-w-48 overflow-y-auto rounded-md border border-[var(--sk-border)] bg-[var(--sk-bg)] p-1 text-sm shadow-lg" };
+const _hoisted_2 = [
+	"aria-selected",
+	"onMouseenter",
+	"onMousedown"
+];
+const _hoisted_3 = {
+	key: 1,
+	class: "ml-auto truncate text-xs text-[var(--sk-muted)]"
+};
+const _hoisted_4 = {
+	key: 1,
+	class: "px-2 py-1.5 text-[var(--sk-muted)]"
+};
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	__name: "SuggestionList",
+	props: {
+		items: {},
+		display: { type: Function },
+		command: { type: Function },
+		loading: { type: Boolean },
+		loadingText: {},
+		emptyText: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const { Icon: UIcon } = useUiKit();
+		const rows = computed(() => props.items.map((item) => props.display(item)));
+		const selected = ref(0);
+		const list = useTemplateRef("list");
+		watch(() => props.items, () => {
+			selected.value = 0;
+		});
+		watch(selected, async (index) => {
+			await nextTick();
+			list.value?.children[index]?.scrollIntoView({ block: "nearest" });
+		});
+		function pick(index) {
+			const item = props.items[index];
+			if (item !== void 0) props.command(item);
+		}
+		/** Called from the suggestion plugin's `onKeyDown`; `true` = handled (the editor ignores the key). */
+		function onKeyDown(event) {
+			const count = props.items.length;
+			if (!count) return false;
+			if (event.key === "ArrowDown") selected.value = (selected.value + 1) % count;
+			else if (event.key === "ArrowUp") selected.value = (selected.value - 1 + count) % count;
+			else if (event.key === "Enter" || event.key === "Tab") pick(selected.value);
+			else return false;
+			return true;
+		}
+		__expose({ onKeyDown });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [createCommentVNode(" Utilities beat the `.tiptap ul` typography (components layer) when the list is rendered inside the editor (speaker field). "), rows.value.length ? (openBlock(), createElementBlock("ul", {
+				key: 0,
+				ref_key: "list",
+				ref: list,
+				role: "listbox",
+				class: "m-0 list-none p-0"
+			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(rows.value, (row, index) => {
+				return openBlock(), createElementBlock("li", {
+					key: index,
+					role: "option",
+					"aria-selected": index === selected.value,
+					class: normalizeClass(["flex cursor-pointer items-center gap-2 rounded px-2 py-1.5 text-[var(--sk-fg)]", index === selected.value && "bg-[var(--sk-bg-elevated)] text-[var(--sk-fg-highlighted)]"]),
+					onMouseenter: ($event) => selected.value = index,
+					onMousedown: withModifiers(($event) => pick(index), ["prevent"])
+				}, [
+					row.icon ? (openBlock(), createBlock(unref(UIcon), {
+						key: 0,
+						name: row.icon,
+						class: "size-4 shrink-0",
+						style: normalizeStyle({ color: row.color })
+					}, null, 8, ["name", "style"])) : createCommentVNode("v-if", true),
+					createElementVNode("span", {
+						class: "truncate",
+						style: normalizeStyle({ color: row.color })
+					}, toDisplayString(row.label), 5),
+					row.description ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(row.description), 1)) : createCommentVNode("v-if", true)
+				], 42, _hoisted_2);
+			}), 128))], 512)) : (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(__props.loading ? __props.loadingText : __props.emptyText), 1))]);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=SuggestionList.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionList.js","names":["_openBlock","_createElementBlock","_createCommentVNode","_Fragment","_renderList","_normalizeClass","_withModifiers","_createBlock","_unref","_normalizeStyle","_createElementVNode","_toDisplayString"],"sources":["../../../src/vue/components/SuggestionList.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref, useTemplateRef, watch } from 'vue'\nimport type { SuggestionDisplay } from '../../core/suggestion-popup'\nimport { useUiKit } from '../kit/use-ui-kit'\n\n// Rendered by createSuggestionRender() (utils/suggestion-popup.ts); items stay opaque here, `display` describes them.\nconst props = defineProps<{\n  items: unknown[]\n  display: (item: unknown) => SuggestionDisplay\n  command: (item: unknown) => void\n  loading: boolean\n  loadingText: string\n  emptyText: string\n}>()\n\nconst { Icon: UIcon } = useUiKit()\n\nconst rows = computed(() => props.items.map(item => props.display(item)))\nconst selected = ref(0)\nconst list = useTemplateRef<HTMLElement>('list')\n\nwatch(() => props.items, () => { selected.value = 0 })\n\nwatch(selected, async (index) => {\n  await nextTick()\n  list.value?.children[index]?.scrollIntoView({ block: 'nearest' })\n})\n\nfunction pick(index: number) {\n  const item = props.items[index]\n  if (item !== undefined) props.command(item)\n}\n\n/** Called from the suggestion plugin's `onKeyDown`; `true` = handled (the editor ignores the key). */\nfunction onKeyDown(event: KeyboardEvent): boolean {\n  const count = props.items.length\n  if (!count) return false\n  if (event.key === 'ArrowDown') selected.value = (selected.value + 1) % count\n  else if (event.key === 'ArrowUp') selected.value = (selected.value - 1 + count) % count\n  else if (event.key === 'Enter' || event.key === 'Tab') pick(selected.value)\n  else return false\n  return true\n}\n\ndefineExpose({ onKeyDown })\n</script>\n\n<template>\n  <div class=\"max-h-64 min-w-48 overflow-y-auto rounded-md border border-[var(--sk-border)] bg-[var(--sk-bg)] p-1 text-sm shadow-lg\">\n    <!-- Utilities beat the `.tiptap ul` typography (components layer) when the list is rendered inside the editor (speaker field). -->\n    <ul v-if=\"rows.length\" ref=\"list\" role=\"listbox\" class=\"m-0 list-none p-0\">\n      <li\n        v-for=\"(row, index) in rows\"\n        :key=\"index\"\n        role=\"option\"\n        :aria-selected=\"index === selected\"\n        class=\"flex cursor-pointer items-center gap-2 rounded px-2 py-1.5 text-[var(--sk-fg)]\"\n        :class=\"index === selected && 'bg-[var(--sk-bg-elevated)] text-[var(--sk-fg-highlighted)]'\"\n        @mouseenter=\"selected = index\"\n        @mousedown.prevent=\"pick(index)\"\n      >\n        <UIcon v-if=\"row.icon\" :name=\"row.icon\" class=\"size-4 shrink-0\" :style=\"{ color: row.color }\" />\n        <span class=\"truncate\" :style=\"{ color: row.color }\">{{ row.label }}</span>\n        <span v-if=\"row.description\" class=\"ml-auto truncate text-xs text-[var(--sk-muted)]\">{{ row.description }}</span>\n      </li>\n    </ul>\n    <p v-else class=\"px-2 py-1.5 text-[var(--sk-muted)]\">\n      {{ loading ? loadingText : emptyText }}\n    </p>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EASd,MAAM,EAAE,MAAM,UAAU,SAAS;EAEjC,MAAM,OAAO,eAAe,MAAM,MAAM,KAAI,SAAQ,MAAM,QAAQ,IAAI,CAAC,CAAC;EACxE,MAAM,WAAW,IAAI,CAAC;EACtB,MAAM,OAAO,eAA4B,MAAM;EAE/C,YAAY,MAAM,aAAa;GAAE,SAAS,QAAQ;EAAE,CAAC;EAErD,MAAM,UAAU,OAAO,UAAU;GAC/B,MAAM,SAAS;GACf,KAAK,OAAO,SAAS,MAAM,EAAE,eAAe,EAAE,OAAO,UAAU,CAAC;EAClE,CAAC;EAED,SAAS,KAAK,OAAe;GAC3B,MAAM,OAAO,MAAM,MAAM;GACzB,IAAI,SAAS,KAAA,GAAW,MAAM,QAAQ,IAAI;EAC5C;;EAGA,SAAS,UAAU,OAA+B;GAChD,MAAM,QAAQ,MAAM,MAAM;GAC1B,IAAI,CAAC,OAAO,OAAO;GACnB,IAAI,MAAM,QAAQ,aAAa,SAAS,SAAS,SAAS,QAAQ,KAAK;QAClE,IAAI,MAAM,QAAQ,WAAW,SAAS,SAAS,SAAS,QAAQ,IAAI,SAAS;QAC7E,IAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,OAAO,KAAK,SAAS,KAAK;QACrE,OAAO;GACZ,OAAO;EACT;EAEA,SAAa,EAAE,UAAU,CAAC;;GAIxB,OAAAA,UAAA,GAAAC,mBAqBM,OArBN,YAqBM,CApBJC,mBAAA,8HAAA,GACU,KAAA,MAAK,UAAfF,UAAA,GAAAC,mBAeK,MAAA;;IAfsB,SAAA;IAAJ,KAAI;IAAO,MAAK;IAAU,OAAM;GACrD,GAAA,EAAAD,UAAA,IAAA,GAAAC,mBAaKE,UAAA,MAAAC,WAZoB,KAAA,QAAf,KAAK,UAAK;IADpB,OAAAJ,UAAA,GAAAC,mBAaK,MAAA;KAXF,KAAK;KACN,MAAK;KACJ,iBAAe,UAAU,SAAA;KAC1B,OAAKI,eAAA,CAAC,kFACE,UAAU,SAAA,SAAQ,4DAAA,CAAA;KACzB,eAAU,WAAE,SAAA,QAAW;KACvB,aAASC,eAAA,WAAU,KAAK,KAAK,GAAA,CAAA,SAAA,CAAA;;KAEjB,IAAI,QAAjBN,UAAA,GAAAO,YAAgGC,MAAA,KAAA,GAAA;;MAAxE,MAAM,IAAI;MAAM,OAAM;MAAmB,OAAKC,eAAA,EAAA,OAAW,IAAI,MAAK,CAAA;;KAC1FC,mBAA2E,QAAA;MAArE,OAAM;MAAY,OAAKD,eAAA,EAAA,OAAW,IAAI,MAAK,CAAA;KAAO,GAAAE,gBAAA,IAAI,KAAK,GAAA,CAAA;KACrD,IAAI,eAAhBX,UAAA,GAAAC,mBAAiH,QAAjH,YAAiHU,gBAAzB,IAAI,WAAW,GAAA,CAAA,KAAAT,mBAAA,QAAA,IAAA;;GAG3G,CAAA,GAAA,GAAA,EAAA,GAAA,GAAA,MAAAF,UAAA,GAAAC,mBAEI,KAFJ,YAEIU,gBADC,QAAA,UAAU,QAAA,cAAc,QAAA,SAAS,GAAA,CAAA,EAAA,CAAA"}

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

@@ -0,0 +1,19 @@
+import { SuggestionDisplay } from "../../core/suggestion-popup.js";
+//#region src/vue/components/SuggestionList.vue.d.ts
+type __VLS_Props = {
+  items: unknown[];
+  display: (item: unknown) => SuggestionDisplay;
+  command: (item: unknown) => void;
+  loading: boolean;
+  loadingText: string;
+  emptyText: string;
+};
+/** Called from the suggestion plugin's `onKeyDown`; `true` = handled (the editor ignores the key). */
+declare function onKeyDown(event: KeyboardEvent): boolean;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+  onKeyDown: typeof onKeyDown;
+}, {}, {}, {}, 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;
+//#endregion
+export { _default as default };
+//# sourceMappingURL=SuggestionList.vue.d.ts.map

package/dist/vue/context.d.ts

@@ -0,0 +1,24 @@
+import { EditorContext, EditorContextOptions } from "../core/context.js";
+import { VueUiKit } from "./kit/types.js";
+import { InjectionKey, 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
+ * (`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
+ * 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.
+ */
+export declare function createEditor({ kit, ...options }: VueEditorOptions): Plugin;
+/** The app's editor context; throws a descriptive error when `createEditor()` was not installed. */
+export declare function useEditorContext(): EditorContext;
+//#endregion
+//# sourceMappingURL=context.d.ts.map

package/dist/vue/context.js

@@ -0,0 +1,42 @@
+import { createEditorContext } from "../core/context.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
+* (`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
+* 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.
+*/
+function createEditor({ kit = nuxtUiKit(), ...options }) {
+	return { install(app) {
+		const ctx = createEditorContext({
+			notify: createQueuedNotifier(),
+			...options
+		});
+		app.provide(VUE_UI_KIT, kit);
+		app.provide(EDITOR_CONTEXT, ctx);
+		const bridge = createSettingsBridge(ctx);
+		app.onUnmount(() => {
+			bridge.dispose();
+			ctx.dispose();
+		});
+	} };
+}
+/** The app's editor context; throws a descriptive error when `createEditor()` was not installed. */
+function useEditorContext() {
+	const context = inject(EDITOR_CONTEXT, null);
+	if (!context) throw new Error("@ecsplico/editor: no editor context; install it with app.use(createEditor())");
+	return context;
+}
+//#endregion
+export { EDITOR_CONTEXT, createEditor, useEditorContext };
+
+//# sourceMappingURL=context.js.map

package/dist/vue/context.js.map

@@ -0,0 +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,WAAqC;CACxF,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

@@ -0,0 +1,26 @@
+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 { VueUiKit } from "./kit/types.js";
+import { EDITOR_CONTEXT, 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";
+import { useEditorSettings } from "./settings.js";
+import { storeFromRef, trackedStore, useStoreRef, useWritableStoreRef } from "./store-ref.js";
+import { vueSuggestionRenderer } from "./suggestion-renderer.js";
+import { EDITOR_UI, useEditorUi } from "./use-editor-ui.js";
+import { useNotifier } from "./use-notifier.js";
+import { Component } from "vue";
+//#region src/vue/index.d.ts
+/** A feature whose overlays, settings tabs and toolbar components are Vue components. */
+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 };
+//# sourceMappingURL=index.d.ts.map

package/dist/vue/index.js

@@ -0,0 +1,16 @@
+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 { useEditorI18n } from "./use-editor-i18n.js";
+import { EDITOR_UI, useEditorUi } from "./use-editor-ui.js";
+import _sfc_main$5 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 { 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 };

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

@@ -0,0 +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 { 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 };

package/dist/vue/kit/index.js

@@ -0,0 +1 @@
+export { VUE_UI_KIT, useUiKit } from "./use-ui-kit.js";

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

@@ -0,0 +1,24 @@
+/* The Nuxt UI kit's token map: the shared `--sk-*` tokens (`styles/tokens.css`) resolve to Nuxt UI's `--ui-*` variables,
+   so the editor looks like the rest of a Nuxt UI app in light and dark mode (Nuxt UI flips its own variables). Import it
+   next to `@nuxt/ui` and before the editor's feature sheets; the Nuxt module does it for `kit: 'nuxt-ui'`. Plain `:root`
+   (not `:where`) so it wins over the defaults in `tokens.css`; a host or an Obsidian theme (`styles/themes.css`) that
+   sets `--sk-*` later still overrides it. */
+:root {
+  --sk-bg: var(--ui-bg);
+  --sk-fg: var(--ui-text);
+  --sk-fg-highlighted: var(--ui-text-highlighted);
+  --sk-fg-toned: var(--ui-text-toned);
+  --sk-fg-dimmed: var(--ui-text-dimmed);
+  --sk-muted: var(--ui-text-muted);
+  --sk-border: var(--ui-border);
+  --sk-border-accented: var(--ui-border-accented);
+  --sk-primary: var(--ui-primary);
+  --sk-primary-fg: var(--ui-text-inverted);
+  --sk-success: var(--ui-success);
+  --sk-warning: var(--ui-warning);
+  --sk-danger: var(--ui-error);
+  --sk-info: var(--ui-info);
+  --sk-radius: var(--ui-radius);
+  --sk-bg-elevated: var(--ui-bg-elevated);
+  --sk-bg-accented: var(--ui-bg-accented);
+}

package/dist/vue/kit/nuxt-ui.d.ts

@@ -0,0 +1,31 @@
+import { Notifier } from "../../core/notify.js";
+import { VueUiKit } from "./types.js";
+//#region src/vue/kit/nuxt-ui.d.ts
+/** The part of Nuxt UI's `useToast()` that notices need. */
+export interface NoticeToaster {
+  add(toast: {
+    id?: string;
+    title: string;
+    description?: string;
+    icon?: string;
+    duration?: number;
+    color: 'neutral' | 'success' | 'warning' | 'error';
+    actions?: {
+      label: string;
+      color: 'neutral';
+      variant: 'outline';
+      onClick: () => void;
+    }[];
+  }): unknown;
+  remove?(id: string): unknown;
+}
+/** Shows notices as Nuxt UI toasts (`kind` is the toast `color`; `id` replaces a visible toast of the same id). */
+export declare function nuxtUiNotifier(toast: NoticeToaster): Notifier;
+/**
+ * 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-*`).
+ */
+export declare function nuxtUiKit(): VueUiKit;
+//#endregion
+//# sourceMappingURL=nuxt-ui.d.ts.map

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

@@ -0,0 +1,101 @@
+import { defineComponent, h } from "vue";
+import Alert from "@nuxt/ui/components/Alert.vue";
+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 DropdownMenu from "@nuxt/ui/components/DropdownMenu.vue";
+import FieldGroup from "@nuxt/ui/components/FieldGroup.vue";
+import FormField from "@nuxt/ui/components/FormField.vue";
+import Icon from "@nuxt/ui/components/Icon.vue";
+import Input from "@nuxt/ui/components/Input.vue";
+import InputMenu from "@nuxt/ui/components/InputMenu.vue";
+import Modal from "@nuxt/ui/components/Modal.vue";
+import Popover from "@nuxt/ui/components/Popover.vue";
+import RadioGroup from "@nuxt/ui/components/RadioGroup.vue";
+import Select from "@nuxt/ui/components/Select.vue";
+import SelectMenu from "@nuxt/ui/components/SelectMenu.vue";
+import Separator from "@nuxt/ui/components/Separator.vue";
+import Switch from "@nuxt/ui/components/Switch.vue";
+import NuxtTable from "@nuxt/ui/components/Table.vue";
+import Tabs from "@nuxt/ui/components/Tabs.vue";
+import Textarea from "@nuxt/ui/components/Textarea.vue";
+import Tooltip from "@nuxt/ui/components/Tooltip.vue";
+import Tree from "@nuxt/ui/components/Tree.vue";
+import { useToast } from "@nuxt/ui/composables";
+//#region src/vue/kit/nuxt-ui.ts
+const COLORS = {
+	info: "neutral",
+	success: "success",
+	warning: "warning",
+	error: "error"
+};
+/** Shows notices as Nuxt UI toasts (`kind` is the toast `color`; `id` replaces a visible toast of the same id). */
+function nuxtUiNotifier(toast) {
+	const notify = ({ id, title, description, kind, icon, duration, action }) => {
+		toast.add({
+			...id !== void 0 && { id },
+			title,
+			...description !== void 0 && { description },
+			...icon !== void 0 && { icon },
+			...duration !== void 0 && { duration },
+			...action && { actions: [{
+				label: action.label,
+				color: "neutral",
+				variant: "outline",
+				onClick: action.onClick
+			}] },
+			color: COLORS[kind ?? "info"]
+		});
+	};
+	notify.dismiss = (id) => {
+		toast.remove?.(id);
+	};
+	return notify;
+}
+/** Nuxt UI's `UTable` with TanStack's own sorting switched off: the contract is that the host orders `data` itself. */
+const Table = defineComponent({
+	name: "KitTable",
+	inheritAttrs: false,
+	setup: (_, { attrs, slots }) => () => h(NuxtTable, {
+		...attrs,
+		sortingOptions: { manualSorting: true }
+	}, 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-*`).
+*/
+function nuxtUiKit() {
+	return {
+		Alert,
+		Avatar,
+		Badge,
+		Button,
+		Chip,
+		DropdownMenu,
+		FieldGroup,
+		FormField,
+		Icon,
+		Input,
+		InputMenu,
+		Modal,
+		Popover,
+		RadioGroup,
+		Select,
+		SelectMenu,
+		Separator,
+		Switch,
+		Table,
+		Tabs,
+		Textarea,
+		Tooltip,
+		Tree,
+		notifier: () => nuxtUiNotifier(useToast())
+	};
+}
+//#endregion
+export { nuxtUiKit, nuxtUiNotifier };
+
+//# sourceMappingURL=nuxt-ui.js.map

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

@@ -0,0 +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"}