@abraca/nuxt 0.1.0

package/dist/runtime/composables/useEditorDragHandle.js

@@ -0,0 +1,219 @@
+import { ref } from "vue";
+function upperFirst(s) {
+  return s.charAt(0).toUpperCase() + s.slice(1);
+}
+const CONVERTIBLE_TYPES = [
+  "paragraph",
+  "heading",
+  "bulletList",
+  "orderedList",
+  "taskList",
+  "blockquote",
+  "codeBlock",
+  "listItem",
+  "taskItem"
+];
+export function useEditorDragHandle(pageConfig) {
+  const selectedNode = ref();
+  function getTypeSpecificItems(editor, nodeType) {
+    const pos = selectedNode.value?.pos;
+    if (CONVERTIBLE_TYPES.includes(nodeType)) {
+      return [
+        {
+          label: "Turn into",
+          icon: "i-lucide-repeat-2",
+          children: [
+            { label: "Paragraph", icon: "i-lucide-type", onSelect: () => editor.chain().focus().setParagraph().run() },
+            { label: "Heading 1", icon: "i-lucide-heading-1", onSelect: () => editor.chain().focus().toggleHeading({ level: 1 }).run() },
+            { label: "Heading 2", icon: "i-lucide-heading-2", onSelect: () => editor.chain().focus().toggleHeading({ level: 2 }).run() },
+            { label: "Heading 3", icon: "i-lucide-heading-3", onSelect: () => editor.chain().focus().toggleHeading({ level: 3 }).run() },
+            { label: "Bullet List", icon: "i-lucide-list", onSelect: () => editor.chain().focus().toggleBulletList().run() },
+            { label: "Ordered List", icon: "i-lucide-list-ordered", onSelect: () => editor.chain().focus().toggleOrderedList().run() },
+            { label: "Task List", icon: "i-lucide-list-check", onSelect: () => editor.chain().focus().toggleTaskList().run() },
+            { label: "Blockquote", icon: "i-lucide-text-quote", onSelect: () => editor.chain().focus().toggleBlockquote().run() },
+            { label: "Code Block", icon: "i-lucide-square-code", onSelect: () => editor.chain().focus().toggleCodeBlock().run() }
+          ]
+        }
+      ];
+    }
+    if (nodeType === "fileBlock") {
+      const node = pos !== void 0 ? editor.state.doc.nodeAt(pos) : null;
+      const filename = node?.attrs?.filename || "file";
+      const uploadId = node?.attrs?.uploadId;
+      const docId = node?.attrs?.docId;
+      return [
+        {
+          label: "Download",
+          icon: "i-lucide-download",
+          onSelect: async () => {
+            if (!uploadId || !docId) return;
+            const { getBlobUrl } = useFileBlobStore();
+            try {
+              const url = await getBlobUrl(docId, uploadId);
+              if (!url) return;
+              const a = document.createElement("a");
+              a.href = url;
+              a.download = filename;
+              a.click();
+            } catch {
+            }
+          }
+        }
+      ];
+    }
+    if (nodeType === "image") {
+      const node = pos !== void 0 ? editor.state.doc.nodeAt(pos) : null;
+      return [
+        { label: "Download image", icon: "i-lucide-download", to: node?.attrs?.src, download: true }
+      ];
+    }
+    if (nodeType === "table") {
+      return [
+        {
+          label: "Clear all contents",
+          icon: "i-lucide-square-x",
+          onSelect: () => {
+            if (pos === void 0) return;
+            const tableNode = editor.state.doc.nodeAt(pos);
+            if (!tableNode) return;
+            const cellRanges = [];
+            tableNode.descendants((node, nodePos) => {
+              if (node.type.name === "tableCell" || node.type.name === "tableHeader") {
+                const cellStart = pos + 1 + nodePos + 1;
+                const cellEnd = cellStart + node.content.size;
+                if (node.content.size > 0) cellRanges.push({ from: cellStart, to: cellEnd });
+              }
+              return true;
+            });
+            const { tr } = editor.state;
+            cellRanges.reverse().forEach(({ from, to }) => tr.delete(from, to));
+            editor.view.dispatch(tr);
+          }
+        }
+      ];
+    }
+    return [];
+  }
+  function getItems(editor) {
+    if (!selectedNode.value?.node?.type) return [];
+    const nodeType = selectedNode.value.node.type;
+    const typeSpecificItems = getTypeSpecificItems(editor, nodeType);
+    const pos = selectedNode.value.pos;
+    const result = [
+      [
+        { type: "label", label: upperFirst(nodeType) },
+        ...typeSpecificItems
+      ],
+      [
+        {
+          label: "Duplicate",
+          icon: "i-lucide-copy",
+          onSelect: () => {
+            if (pos === void 0) return;
+            const node = editor.state.doc.nodeAt(pos);
+            if (!node) return;
+            editor.chain().focus().insertContentAt(pos + node.nodeSize, node.toJSON()).run();
+          }
+        },
+        {
+          label: "Copy to clipboard",
+          icon: "i-lucide-clipboard",
+          onSelect: async () => {
+            if (!selectedNode.value) return;
+            const node = editor.state.doc.nodeAt(selectedNode.value.pos);
+            if (node) await navigator.clipboard.writeText(node.textContent);
+          }
+        },
+        ...pageConfig?.onInsertDocLink ? [{
+          label: "Insert doc link",
+          icon: "i-lucide-file-symlink",
+          onSelect: () => pageConfig.onInsertDocLink()
+        }] : []
+      ],
+      [
+        {
+          label: "Move up",
+          icon: "i-lucide-arrow-up",
+          onSelect: () => {
+            if (pos === void 0) return;
+            const node = editor.state.doc.nodeAt(pos);
+            if (!node || pos === 0) return;
+            const $pos = editor.state.doc.resolve(pos);
+            const parent = $pos.parent;
+            const index = $pos.index();
+            if (index === 0) return;
+            const before = parent.child(index - 1);
+            const tr = editor.state.tr;
+            tr.delete(pos - before.nodeSize, pos);
+            tr.insert(pos + node.nodeSize - before.nodeSize, before);
+            editor.view.dispatch(tr);
+          }
+        },
+        {
+          label: "Move down",
+          icon: "i-lucide-arrow-down",
+          onSelect: () => {
+            if (pos === void 0) return;
+            const node = editor.state.doc.nodeAt(pos);
+            if (!node) return;
+            const $pos = editor.state.doc.resolve(pos);
+            const parent = $pos.parent;
+            const index = $pos.index();
+            if (index >= parent.childCount - 1) return;
+            const after = parent.child(index + 1);
+            const tr = editor.state.tr;
+            tr.delete(pos + node.nodeSize, pos + node.nodeSize + after.nodeSize);
+            tr.insert(pos, after);
+            editor.view.dispatch(tr);
+          }
+        }
+      ],
+      [
+        {
+          label: "Delete",
+          icon: "i-lucide-trash",
+          color: "error",
+          onSelect: () => {
+            if (pos === void 0) return;
+            const node = editor.state.doc.nodeAt(pos);
+            if (!node) return;
+            editor.chain().focus().deleteRange({ from: pos, to: pos + node.nodeSize }).run();
+          }
+        }
+      ]
+    ];
+    if (pageConfig?.pageTypes?.length && pageConfig?.onChangePageType) {
+      result.push([
+        {
+          label: "Convert Page to",
+          icon: "i-lucide-repeat-2",
+          children: pageConfig.pageTypes.map((t) => ({
+            label: t.label,
+            icon: t.icon,
+            onSelect: () => pageConfig.onChangePageType(t.key)
+          }))
+        }
+      ]);
+    }
+    return result;
+  }
+  function getMergedItems(editor, ctx) {
+    const { registry } = useAbracadabra();
+    const base = getItems(editor);
+    const pluginItems = registry.getAllDragHandleItems(ctx).map(
+      (items) => items.map((item) => ({
+        label: item.label,
+        icon: item.icon,
+        onSelect: () => item.action(ctx)
+      }))
+    );
+    if (pluginItems.length) {
+      return [...base, ...pluginItems];
+    }
+    return base;
+  }
+  function onNodeChange(event) {
+    selectedNode.value = event;
+  }
+  return { selectedNode, getItems, getMergedItems, onNodeChange };
+}

package/dist/runtime/composables/useEditorMentions.d.ts

@@ -0,0 +1,28 @@
+/**
+ * useEditorMentions
+ *
+ * Returns mention items for UEditorMentionMenu.
+ * Combines awareness users (currently online) with plugin mention providers.
+ *
+ * Usage:
+ *   const { items } = useEditorMentions()
+ *   <UEditorMentionMenu :editor="editor" :items="items" />
+ */
+export interface MentionItem {
+    label: string;
+    value: string;
+    icon?: string;
+    avatar?: {
+        alt: string;
+        style?: Record<string, string>;
+    };
+}
+export interface UseEditorMentionsOptions {
+    /** Additional static items */
+    extraItems?: MentionItem[];
+    /** Doc ID for provider context */
+    docId?: string;
+}
+export declare function useEditorMentions(options?: UseEditorMentionsOptions): {
+    items: any;
+};

package/dist/runtime/composables/useEditorMentions.js

@@ -0,0 +1,40 @@
+export function useEditorMentions(options = {}) {
+  const { provider } = useAbracadabra();
+  const registry = usePluginRegistry();
+  const items = computed(() => {
+    const result = [];
+    if (provider.value) {
+      try {
+        const states = provider.value.awareness?.states ? [...provider.value.awareness.states.values()] : [];
+        for (const state of states) {
+          const user = state.user;
+          if (user?.name) {
+            result.push({
+              label: user.name,
+              value: user.name,
+              avatar: {
+                alt: user.name,
+                style: user.color ? { borderColor: user.color, borderWidth: "2px", borderStyle: "solid" } : void 0
+              }
+            });
+          }
+        }
+      } catch {
+      }
+    }
+    try {
+      const providers = registry.getAllMentionProviders();
+      for (const p of providers) {
+        if (p.staticItems) {
+          result.push(...p.staticItems);
+        }
+      }
+    } catch {
+    }
+    if (options.extraItems?.length) {
+      result.push(...options.extraItems);
+    }
+    return result;
+  });
+  return { items };
+}

package/dist/runtime/composables/useEditorSuggestions.d.ts

@@ -0,0 +1,18 @@
+/**
+ * useEditorSuggestions
+ *
+ * Returns pre-built slash command suggestion item groups for UEditorSuggestionMenu,
+ * merging standard blocks with plugin registry contributions.
+ *
+ * Usage:
+ *   const { items } = useEditorSuggestions()
+ *   <UEditorSuggestionMenu :editor="editor" :items="items" />
+ */
+export interface UseEditorSuggestionsOptions {
+    docId?: string;
+    /** Skip default items and return only plugin contributions */
+    onlyPlugins?: boolean;
+}
+export declare function useEditorSuggestions(options?: UseEditorSuggestionsOptions): {
+    items: any;
+};

package/dist/runtime/composables/useEditorSuggestions.js

@@ -0,0 +1,45 @@
+export function useEditorSuggestions(options = {}) {
+  const registry = usePluginRegistry();
+  const items = computed(() => {
+    const ctx = { docId: options.docId ?? "" };
+    const base = options.onlyPlugins ? [] : [
+      [
+        { type: "label", label: "Style" },
+        { kind: "paragraph", label: "Paragraph", icon: "i-lucide-type" },
+        { kind: "heading", level: 1, label: "Heading 1", icon: "i-lucide-heading-1" },
+        { kind: "heading", level: 2, label: "Heading 2", icon: "i-lucide-heading-2" },
+        { kind: "heading", level: 3, label: "Heading 3", icon: "i-lucide-heading-3" },
+        { kind: "bulletList", label: "Bullet List", icon: "i-lucide-list" },
+        { kind: "orderedList", label: "Numbered List", icon: "i-lucide-list-ordered" },
+        { kind: "taskList", label: "Task List", icon: "i-lucide-list-check" },
+        { kind: "blockquote", label: "Blockquote", icon: "i-lucide-text-quote" },
+        { kind: "codeBlock", label: "Code Block", icon: "i-lucide-square-code" }
+      ],
+      [
+        { type: "label", label: "Insert" },
+        { kind: "mention", label: "Mention", icon: "i-lucide-at-sign" },
+        { kind: "table", label: "Table", icon: "i-lucide-table" },
+        { kind: "horizontalRule", label: "Divider", icon: "i-lucide-minus" }
+      ],
+      [
+        { type: "label", label: "Components" },
+        { kind: "callout", label: "Callout", icon: "i-lucide-info" },
+        { kind: "collapsible", label: "Collapsible", icon: "i-lucide-chevron-down" },
+        { kind: "accordion", label: "Accordion", icon: "i-lucide-chevrons-down-up" },
+        { kind: "tabs", label: "Tabs", icon: "i-lucide-panel-top" },
+        { kind: "card", label: "Card", icon: "i-lucide-square" },
+        { kind: "steps", label: "Steps", icon: "i-lucide-list-ordered" },
+        { kind: "codeGroup", label: "Code Group", icon: "i-lucide-folder-code" }
+      ]
+    ];
+    try {
+      const pluginGroups = registry.getAllSuggestionItems(ctx);
+      for (const group of pluginGroups) {
+        if (group.items?.length) base.push(group.items);
+      }
+    } catch {
+    }
+    return base;
+  });
+  return { items };
+}

package/dist/runtime/composables/useEditorToolbar.d.ts

@@ -0,0 +1,22 @@
+/**
+ * useEditorToolbar
+ *
+ * Returns pre-built toolbar item groups for UEditorToolbar,
+ * merging the plugin registry's contributions with standard formatting items.
+ *
+ * Usage:
+ *   const { items } = useEditorToolbar()
+ *   <UEditorToolbar :editor="editor" :items="items" />
+ */
+import type { Editor } from '@tiptap/vue-3';
+export interface UseEditorToolbarOptions {
+    /** Current editor instance (used to build plugin context) */
+    editor?: Editor | null;
+    /** Doc ID for plugin context */
+    docId?: string;
+    /** Additional custom items appended after plugin items */
+    extraItems?: any[][];
+}
+export declare function useEditorToolbar(options?: UseEditorToolbarOptions): {
+    items: any;
+};

package/dist/runtime/composables/useEditorToolbar.js

@@ -0,0 +1,60 @@
+export function useEditorToolbar(options = {}) {
+  const registry = usePluginRegistry();
+  const abra = useAbracadabra();
+  const items = computed(() => {
+    const editor = options.editor ?? null;
+    const ctx = {
+      editor,
+      docId: options.docId,
+      abracadabra: abra
+    };
+    const base = [[
+      { kind: "undo", icon: "i-lucide-undo", tooltip: { text: "Undo" } },
+      { kind: "redo", icon: "i-lucide-redo", tooltip: { text: "Redo" } }
+    ], [
+      {
+        label: "Turn into",
+        trailingIcon: "i-lucide-chevron-down",
+        activeColor: "neutral",
+        activeVariant: "ghost",
+        tooltip: { text: "Turn into" },
+        content: { align: "start" },
+        ui: { label: "text-xs" },
+        items: [
+          { type: "label", label: "Turn into" },
+          { kind: "paragraph", label: "Paragraph", icon: "i-lucide-type" },
+          { kind: "heading", level: 1, label: "Heading 1", icon: "i-lucide-heading-1" },
+          { kind: "heading", level: 2, label: "Heading 2", icon: "i-lucide-heading-2" },
+          { kind: "heading", level: 3, label: "Heading 3", icon: "i-lucide-heading-3" },
+          { kind: "bulletList", label: "Bullet List", icon: "i-lucide-list" },
+          { kind: "orderedList", label: "Ordered List", icon: "i-lucide-list-ordered" },
+          { kind: "taskList", label: "Task List", icon: "i-lucide-list-check" },
+          { kind: "blockquote", label: "Blockquote", icon: "i-lucide-text-quote" },
+          { kind: "codeBlock", label: "Code Block", icon: "i-lucide-square-code" }
+        ]
+      }
+    ], [
+      { kind: "mark", mark: "bold", icon: "i-lucide-bold", tooltip: { text: "Bold" } },
+      { kind: "mark", mark: "italic", icon: "i-lucide-italic", tooltip: { text: "Italic" } },
+      { kind: "mark", mark: "underline", icon: "i-lucide-underline", tooltip: { text: "Underline" } },
+      { kind: "mark", mark: "strike", icon: "i-lucide-strikethrough", tooltip: { text: "Strikethrough" } },
+      { kind: "mark", mark: "code", icon: "i-lucide-code", tooltip: { text: "Inline code" } }
+    ], [
+      { kind: "mark", mark: "link", icon: "i-lucide-link", tooltip: { text: "Link" } }
+    ]];
+    try {
+      const pluginGroups = registry.getAllToolbarItems(ctx);
+      for (const group of pluginGroups) {
+        if (group.items?.length) {
+          base.push(group.items);
+        }
+      }
+    } catch {
+    }
+    if (options.extraItems?.length) {
+      base.push(...options.extraItems);
+    }
+    return base;
+  });
+  return { items };
+}

package/dist/runtime/composables/useFileBlobStore.d.ts

@@ -0,0 +1,15 @@
+/**
+ * useFileBlobStore
+ *
+ * Wraps FileBlobStore from @abraca/dabra.
+ * Provides getBlobUrl() which caches file blobs in IndexedDB for offline access.
+ * Initialized right after the client is created (before first sync) so
+ * IDB-cached blobs are served even when offline.
+ */
+export declare function _initFileBlobStore(store: any): void;
+export declare function _getFileBlobStore(): any;
+export declare function _destroyFileBlobStore(): void;
+export declare function useFileBlobStore(): {
+    getBlobUrl: (docId: string, uploadId: string) => Promise<string | null>;
+    putBlob: (docId: string, id: string, file: File, filename: string) => Promise<void>;
+};

package/dist/runtime/composables/useFileBlobStore.js

@@ -0,0 +1,22 @@
+let _store = null;
+export function _initFileBlobStore(store) {
+  _store = store;
+}
+export function _getFileBlobStore() {
+  return _store;
+}
+export function _destroyFileBlobStore() {
+  _store?.destroy();
+  _store = null;
+}
+export function useFileBlobStore() {
+  async function getBlobUrl(docId, uploadId) {
+    if (!_store) return null;
+    return _store.getBlobUrl(docId, uploadId);
+  }
+  async function putBlob(docId, id, file, filename) {
+    if (!_store) return;
+    return _store.putBlob(docId, id, file, filename);
+  }
+  return { getBlobUrl, putBlob };
+}

package/dist/runtime/composables/useFileIndex.d.ts

@@ -0,0 +1,20 @@
+/**
+ * useFileIndex
+ *
+ * Indexes fileBlock nodes from all synced documents, enabling
+ * file-centric search. Watches BackgroundSync states and re-indexes
+ * each document's file blocks when it syncs.
+ */
+export interface FileEntry {
+    uploadId: string;
+    filename: string;
+    mimeType: string;
+    docId: string;
+    docLabel: string;
+}
+export declare function _initFileIndex(): void;
+export declare function _destroyFileIndex(): void;
+export declare function useFileIndex(): {
+    searchFiles: (query: string, limit?: number) => FileEntry[];
+    getAllFiles: () => FileEntry[];
+};

package/dist/runtime/composables/useFileIndex.js

@@ -0,0 +1,69 @@
+import { watch } from "vue";
+import * as Y from "yjs";
+let _fileEntries = /* @__PURE__ */ new Map();
+let _stopWatcher = null;
+function walkXmlForFiles(node, docId, docLabel, results) {
+  for (const child of node.toArray()) {
+    if (child instanceof Y.XmlElement) {
+      if (child.nodeName === "fileBlock") {
+        const uploadId = child.getAttribute("uploadId");
+        const filename = child.getAttribute("filename") ?? "";
+        const mimeType = child.getAttribute("mimeType") ?? "";
+        if (uploadId) results.push({ uploadId, filename, mimeType, docId, docLabel });
+      }
+      walkXmlForFiles(child, docId, docLabel, results);
+    }
+  }
+}
+export function _initFileIndex() {
+  _fileEntries = /* @__PURE__ */ new Map();
+  _startWatcher();
+}
+export function _destroyFileIndex() {
+  _stopWatcher?.();
+  _stopWatcher = null;
+  _fileEntries = /* @__PURE__ */ new Map();
+}
+function _startWatcher() {
+  const { syncStates } = useBackgroundSync();
+  const { provider } = useAbracadabra();
+  const stop = watch(syncStates, async (states) => {
+    const p = provider.value;
+    if (!p) return;
+    for (const [docId, state] of states.entries()) {
+      if (state.status !== "synced") continue;
+      try {
+        const childProvider = await p.loadChild(docId);
+        await childProvider.ready;
+        const treeMap = p.document.getMap("doc-tree");
+        const docLabel = treeMap.get(docId)?.label ?? "";
+        const files = [];
+        walkXmlForFiles(childProvider.document.getXmlFragment("default"), docId, docLabel, files);
+        for (const [key, val] of _fileEntries.entries()) {
+          if (val.docId === docId) _fileEntries.delete(key);
+        }
+        for (const f of files) _fileEntries.set(f.uploadId, f);
+      } catch {
+      }
+    }
+  }, { deep: false });
+  _stopWatcher = stop;
+}
+export function useFileIndex() {
+  function searchFiles(query, limit = 15) {
+    if (!query || query.length < 2) return [];
+    const q = query.toLowerCase();
+    const results = [];
+    for (const entry of _fileEntries.values()) {
+      if (entry.filename.toLowerCase().includes(q) || entry.mimeType.toLowerCase().includes(q)) {
+        results.push(entry);
+        if (results.length >= limit) break;
+      }
+    }
+    return results;
+  }
+  function getAllFiles() {
+    return [..._fileEntries.values()];
+  }
+  return { searchFiles, getAllFiles };
+}

package/dist/runtime/composables/useFollowUser.d.ts

@@ -0,0 +1,5 @@
+export declare function useFollowUser(): {
+    followingUserKey: import("vue").Ref<string | null, string | null>;
+    setFollowing: (key: string | null, provider: any, getCurrentDocId: () => string) => void;
+    stopFollowing: () => void;
+};

package/dist/runtime/composables/useFollowUser.js

@@ -0,0 +1,40 @@
+import { ref } from "vue";
+const followingUserKey = ref(null);
+let cleanup = null;
+let navLock = false;
+export function useFollowUser() {
+  function setFollowing(key, provider, getCurrentDocId) {
+    cleanup?.();
+    cleanup = null;
+    navLock = false;
+    followingUserKey.value = key;
+    if (!key || !provider?.awareness) return;
+    const awareness = provider.awareness;
+    function check() {
+      if (navLock) return;
+      const states = awareness.getStates();
+      for (const state of states.values()) {
+        if (state.user?.publicKey === key) {
+          const targetDocId = state.docId;
+          if (targetDocId && targetDocId !== getCurrentDocId()) {
+            navLock = true;
+            navigateTo(`${useRuntimeConfig().public.abracadabra?.docBasePath ?? "/doc"}/${targetDocId}`);
+            setTimeout(() => {
+              navLock = false;
+            }, 1e3);
+          }
+          break;
+        }
+      }
+    }
+    check();
+    awareness.on("change", check);
+    cleanup = () => awareness.off("change", check);
+  }
+  function stopFollowing() {
+    followingUserKey.value = null;
+    cleanup?.();
+    cleanup = null;
+  }
+  return { followingUserKey, setFollowing, stopFollowing };
+}