@abraca/nuxt 0.3.0 → 1.5.0

package/dist/runtime/composables/useCrossWindowSync.js

@@ -0,0 +1,38 @@
+import { watch, onUnmounted } from "vue";
+import * as Y from "yjs";
+const CHANNEL_PREFIX = "abra:doc-sync:";
+export function useCrossWindowSync(doc, docId) {
+  if (typeof window === "undefined") return;
+  let cleanup = null;
+  watch([doc, docId], ([currentDoc, currentDocId]) => {
+    cleanup?.();
+    cleanup = null;
+    if (!currentDoc || !currentDocId) return;
+    cleanup = setupBroadcastSync(currentDoc, currentDocId);
+  }, { immediate: true });
+  onUnmounted(() => {
+    cleanup?.();
+    cleanup = null;
+  });
+}
+function setupBroadcastSync(doc, docId) {
+  const channel = new BroadcastChannel(`${CHANNEL_PREFIX}${docId}`);
+  let applying = false;
+  const onUpdate = (update, origin) => {
+    if (origin === "cross-window" || applying) return;
+    channel.postMessage(update);
+  };
+  channel.onmessage = (event) => {
+    applying = true;
+    try {
+      Y.applyUpdate(doc, new Uint8Array(event.data), "cross-window");
+    } finally {
+      applying = false;
+    }
+  };
+  doc.on("update", onUpdate);
+  return () => {
+    doc.off("update", onUpdate);
+    channel.close();
+  };
+}

package/dist/runtime/composables/useDashboard.js

@@ -1,19 +1,27 @@
 import { ref, watch } from "vue";
 import { createSharedComposable } from "@vueuse/core";
+import { useRoute } from "#imports";
+import { useCommandPalette } from "./useCommandPalette.js";
 const _useDashboard = () => {
   const route = useRoute();
   const { toggle } = useCommandPalette();
   const isNotificationsOpen = ref(false);
-  defineShortcuts({
-    meta_f: () => {
-      toggle();
-    },
-    meta_n: () => {
-      toggle();
-    },
-    n: () => {
-      isNotificationsOpen.value = !isNotificationsOpen.value;
+  import("#imports").then((mod) => {
+    const ds = mod.defineShortcuts;
+    if (ds) {
+      ds({
+        meta_f: () => {
+          toggle();
+        },
+        meta_n: () => {
+          toggle();
+        },
+        n: () => {
+          isNotificationsOpen.value = !isNotificationsOpen.value;
+        }
+      });
     }
+  }).catch(() => {
   });
   watch(() => route.fullPath, () => {
     isNotificationsOpen.value = false;

package/dist/runtime/composables/useDevicePairing.js

@@ -1,5 +1,7 @@
 import { ref, shallowRef } from "vue";
 import { getSdkModule } from "../utils/sdkRef.js";
+import { useRuntimeConfig } from "#imports";
+import { useAbracadabra } from "./useAbracadabra.js";
 const pairingRole = ref("idle");
 const pairingStatus = ref("idle");
 const offerBlob = shallowRef(null);

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

@@ -0,0 +1,28 @@
+export interface DocDragState {
+    /** The doc IDs being dragged (supports multi-select) */
+    docIds: string[];
+    /** Labels for ghost rendering */
+    labels: string[];
+    /** Lucide icon class names for ghost rendering (parallel to labels) */
+    icons?: string[];
+    /** Which system originated this drag */
+    source: 'tree' | 'subpagelist' | 'renderer';
+    /** The docId of the renderer/parent that started the drag */
+    sourceDocId?: string;
+    /** Current pointer position for ghost rendering and hit-testing */
+    pointer: {
+        x: number;
+        y: number;
+    };
+}
+declare function startDrag(state: DocDragState): void;
+declare function updatePointer(x: number, y: number): void;
+declare function endDrag(): void;
+export declare function useDocDragBus(): {
+    dragState: import("vue").ShallowRef<DocDragState | null, DocDragState | null>;
+    isDragging: import("vue").ComputedRef<boolean>;
+    startDrag: typeof startDrag;
+    updatePointer: typeof updatePointer;
+    endDrag: typeof endDrag;
+};
+export {};

package/dist/runtime/composables/useDocDragBus.js

@@ -0,0 +1,22 @@
+import { shallowRef, computed } from "vue";
+const dragState = shallowRef(null);
+const isDragging = computed(() => dragState.value !== null);
+function startDrag(state) {
+  dragState.value = state;
+}
+function updatePointer(x, y) {
+  if (!dragState.value) return;
+  dragState.value = { ...dragState.value, pointer: { x, y } };
+}
+function endDrag() {
+  dragState.value = null;
+}
+export function useDocDragBus() {
+  return {
+    dragState,
+    isDragging,
+    startDrag,
+    updatePointer,
+    endDrag
+  };
+}

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

@@ -0,0 +1,51 @@
+import type { Ref } from 'vue';
+import type { TreeEntry } from './useChildTree.js';
+export interface DropZone {
+    /** The doc ID that will become the new parent */
+    parentDocId: string;
+    /** Target item ID for ordering relative to (null = append) */
+    targetItemId?: string | null;
+    /** Position relative to target */
+    position?: 'before' | 'inside' | 'after';
+    /** Computed fractional order for the drop */
+    order: number;
+    /** Renderer-specific metadata to apply after reparenting */
+    dropMeta?: Record<string, unknown>;
+}
+export declare function useDocDropZone(opts: {
+    parentDocId: string | Ref<string>;
+    tree: {
+        moveEntry: (id: string, newParentId: string | null, newOrder: number) => void;
+        updateMeta: (id: string, patch: Record<string, unknown>) => void;
+        childrenOf: (parentId: string | null) => TreeEntry[];
+    };
+    resolveDropPosition?: (pointer: {
+        x: number;
+        y: number;
+    }, el: HTMLElement) => DropZone | null;
+    onDocDropped?: (docIds: string[], zone: DropZone) => void;
+}): {
+    containerRef: Ref<HTMLElement | null, HTMLElement | null>;
+    isDropTarget: import("vue").ComputedRef<boolean>;
+    dropIndicator: Ref<{
+        parentDocId: string;
+        targetItemId?: string | null
+        /** Position relative to target */
+         | undefined;
+        position?: "before" | "inside" | "after"
+        /** Computed fractional order for the drop */
+         | undefined;
+        order: number;
+        dropMeta?: Record<string, unknown> | undefined;
+    } | null, DropZone | {
+        parentDocId: string;
+        targetItemId?: string | null
+        /** Position relative to target */
+         | undefined;
+        position?: "before" | "inside" | "after"
+        /** Computed fractional order for the drop */
+         | undefined;
+        order: number;
+        dropMeta?: Record<string, unknown> | undefined;
+    } | null>;
+};

package/dist/runtime/composables/useDocDropZone.js

@@ -0,0 +1,84 @@
+import { ref, computed, watch, onUnmounted } from "vue";
+import { useDocDragBus } from "./useDocDragBus.js";
+export function useDocDropZone(opts) {
+  const containerRef = ref(null);
+  const bus = useDocDragBus();
+  const dropIndicator = ref(null);
+  const isDropTarget = computed(() => bus.isDragging.value);
+  const parentDocId = computed(
+    () => typeof opts.parentDocId === "string" ? opts.parentDocId : opts.parentDocId.value
+  );
+  let rafId = null;
+  function onPointerMoveOverZone() {
+    if (!bus.dragState.value || !containerRef.value) {
+      dropIndicator.value = null;
+      return;
+    }
+    const { pointer } = bus.dragState.value;
+    const rect = containerRef.value.getBoundingClientRect();
+    if (pointer.x < rect.left || pointer.x > rect.right || pointer.y < rect.top || pointer.y > rect.bottom) {
+      dropIndicator.value = null;
+      return;
+    }
+    if (opts.resolveDropPosition) {
+      dropIndicator.value = opts.resolveDropPosition(pointer, containerRef.value);
+    } else {
+      dropIndicator.value = {
+        parentDocId: parentDocId.value,
+        order: Date.now()
+      };
+    }
+  }
+  const stopWatch = watch(
+    () => bus.dragState.value?.pointer,
+    () => {
+      if (rafId !== null) cancelAnimationFrame(rafId);
+      rafId = requestAnimationFrame(onPointerMoveOverZone);
+    },
+    { flush: "sync" }
+  );
+  function onPointerUp() {
+    if (!bus.dragState.value || !dropIndicator.value) return;
+    const { docIds } = bus.dragState.value;
+    const zone = dropIndicator.value;
+    for (let i = 0; i < docIds.length; i++) {
+      const docId = docIds[i];
+      opts.tree.moveEntry(docId, zone.parentDocId, zone.order + i);
+      if (zone.dropMeta) {
+        opts.tree.updateMeta(docId, zone.dropMeta);
+      }
+    }
+    opts.onDocDropped?.(docIds, zone);
+    dropIndicator.value = null;
+    bus.endDrag();
+  }
+  function onDocumentPointerUp(e) {
+    if (!bus.isDragging.value || !containerRef.value) return;
+    const rect = containerRef.value.getBoundingClientRect();
+    if (e.clientX >= rect.left && e.clientX <= rect.right && e.clientY >= rect.top && e.clientY <= rect.bottom) {
+      onPointerUp();
+    }
+  }
+  const stopDragWatch = watch(
+    () => bus.isDragging.value,
+    (dragging) => {
+      if (dragging) {
+        document.addEventListener("pointerup", onDocumentPointerUp);
+      } else {
+        document.removeEventListener("pointerup", onDocumentPointerUp);
+        dropIndicator.value = null;
+      }
+    }
+  );
+  onUnmounted(() => {
+    stopWatch();
+    stopDragWatch();
+    if (rafId !== null) cancelAnimationFrame(rafId);
+    document.removeEventListener("pointerup", onDocumentPointerUp);
+  });
+  return {
+    containerRef,
+    isDropTarget,
+    dropIndicator
+  };
+}

package/dist/runtime/composables/useDocExport.js

@@ -1,5 +1,7 @@
 import * as Y from "yjs";
 import { yjsToMarkdown, yjsToHtml } from "../utils/yjsConvert.js";
+import { useToast } from "#imports";
+import { useAbracadabra } from "./useAbracadabra.js";
 export function labelToFilename(label) {
   return label.toLowerCase().replace(/[^a-z0-9\s-]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "") || "untitled";
 }

package/dist/runtime/composables/useDocImport.js

@@ -1,5 +1,6 @@
 import { ref } from "vue";
 import * as Y from "yjs";
+import { useToast, useAbracadabra, useOfflineUploadQueue, useDocSlugs, navigateTo } from "#imports";
 import { populateYDocFromMarkdown, filenameToLabel, parseFrontmatter } from "../utils/markdownToYjs.js";
 const TEXT_EXTENSIONS = ["md", "mdx", "txt", "html", "htm"];
 export function useDocImport() {

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

@@ -0,0 +1,22 @@
+/**
+ * Reactive document label lookups from the root Y.Doc's "doc-tree" Y.Map.
+ *
+ * Provides getLabel(docId) and getEntry(docId) without needing a full
+ * useChildTree instance. Useful for components that only need label display
+ * (e.g. drag ghosts, chat doc links, backlink lists).
+ *
+ * Ported from cou-sh/app/composables/useDocLabels.ts.
+ */
+import type { ShallowRef } from 'vue';
+import type * as Y from 'yjs';
+interface TreeEntryData {
+    label: string;
+    type?: string;
+    meta?: Record<string, any>;
+}
+export declare function useDocLabels(rootDoc: ShallowRef<Y.Doc | null>): {
+    getLabel: (docId: string) => string;
+    getEntry: (docId: string) => TreeEntryData | null;
+    treeData: Record<string, TreeEntryData>;
+};
+export {};

package/dist/runtime/composables/useDocLabels.js

@@ -0,0 +1,11 @@
+import { useSyncedMap } from "./useYDoc.js";
+export function useDocLabels(rootDoc) {
+  const treeMap = useSyncedMap(rootDoc, "doc-tree");
+  function getLabel(docId) {
+    return treeMap.data[docId]?.label ?? `${docId.slice(0, 8)}\u2026`;
+  }
+  function getEntry(docId) {
+    return treeMap.data[docId] ?? null;
+  }
+  return { getLabel, getEntry, treeData: treeMap.data };
+}

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

@@ -0,0 +1,18 @@
+export interface DocLinkPickResult {
+    id: string;
+    label: string;
+}
+/**
+ * Manages the state for the document picker dialog.
+ * Used by doc-embed extension and inline link insertion.
+ *
+ * The module does not ship a modal component — the consuming app provides
+ * one and wires it up to the `pending` state. When the app calls `resolve()`
+ * or `cancel()`, the promise returned by `pickDoc()` settles.
+ */
+export declare function useDocLinkPick(): {
+    isOpen: import("vue").Ref<boolean, boolean>;
+    pickDoc: () => Promise<DocLinkPickResult | null>;
+    resolve: (result: DocLinkPickResult) => void;
+    cancel: () => void;
+};

package/dist/runtime/composables/useDocLinkPick.js

@@ -0,0 +1,22 @@
+import { ref } from "vue";
+export function useDocLinkPick() {
+  const isOpen = ref(false);
+  let _resolve = null;
+  function pickDoc() {
+    return new Promise((resolve2) => {
+      _resolve = resolve2;
+      isOpen.value = true;
+    });
+  }
+  function resolve(result) {
+    isOpen.value = false;
+    _resolve?.(result);
+    _resolve = null;
+  }
+  function cancel() {
+    isOpen.value = false;
+    _resolve?.(null);
+    _resolve = null;
+  }
+  return { isOpen, pickDoc, resolve, cancel };
+}

package/dist/runtime/composables/useDocSeo.js

@@ -1,4 +1,5 @@
 import { computed, unref } from "vue";
+import { useAbracadabra, useSyncedMap, useFetch, useHead, useSeoMeta } from "#imports";
 function extractFirstParagraph(html) {
   if (!html) return void 0;
   const pMatch = html.match(/<p[^>]*>(.*?)<\/p>/is);
@@ -18,8 +19,8 @@ export function useDocSeo(docId, options) {
   const resolvedId = computed(() => unref(docId) ?? "");
   const entry = computed(() => resolvedId.value ? treeMap.data[resolvedId.value] : void 0);
   const { data: renderData } = useFetch(
-    () => resolvedId.value ? `/api/_abracadabra/render/${resolvedId.value}` : null,
-    { key: `seo-${resolvedId.value}`, server: true, lazy: true }
+    () => resolvedId.value ? `/api/_abracadabra/render/${resolvedId.value}` : "/api/_abracadabra/render/_none",
+    { key: `seo-${resolvedId.value}`, server: true, lazy: true, immediate: !!resolvedId.value }
   );
   const title = computed(() => entry.value?.label ?? "Untitled");
   const description = computed(

package/dist/runtime/composables/useDocSlugs.js

@@ -1,5 +1,8 @@
 import { computed } from "vue";
 import { buildSlugMap } from "../utils/slugify.js";
+import { useRuntimeConfig } from "#imports";
+import { useAbracadabra } from "./useAbracadabra.js";
+import { useSyncedMap } from "./useYDoc.js";
 export function useDocSlugs() {
   const abra = useAbracadabra();
   const config = useRuntimeConfig();

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

@@ -7,6 +7,7 @@
  */
 import { type ComputedRef } from 'vue';
 import type { TreeEntry } from '../types.js';
+import { useSyncedMap } from './useYDoc.js';
 export interface DocTreeReturn {
     /** All tree entries with `id` populated from map keys */
     entries: ComputedRef<(TreeEntry & {

package/dist/runtime/composables/useDocTree.js

@@ -1,16 +1,20 @@
 import { computed } from "vue";
 import { resolveDocType } from "../utils/docTypes.js";
 import { buildSlugMap } from "../utils/slugify.js";
+import { useRuntimeConfig } from "#imports";
+import { useAbracadabra } from "./useAbracadabra.js";
+import { useSyncedMap } from "./useYDoc.js";
 export function useDocTree() {
   const abra = useAbracadabra();
   const config = useRuntimeConfig();
   const docBasePath = config.public?.abracadabra?.docBasePath ?? "/doc";
   const treeMap = useSyncedMap(abra.doc, "doc-tree");
+  const spaceDocId = abra.spaceDocId;
   const entries = computed(
-    () => Object.entries(treeMap.data).map(([id, entry]) => ({ id, ...entry }))
+    () => Object.entries(treeMap.data).filter(([id]) => id !== spaceDocId.value).map(([id, entry]) => ({ id, ...entry }))
   );
   const topLevelDocs = computed(
-    () => entries.value.filter((e) => !e.parentId && !e.trashed).sort((a, b) => (a.order ?? 0) - (b.order ?? 0))
+    () => entries.value.filter((e) => (!e.parentId || e.parentId === spaceDocId.value) && !e.trashed).sort((a, b) => (a.order ?? 0) - (b.order ?? 0))
   );
   const firstDocId = computed(() => topLevelDocs.value[0]?.id ?? null);
   const getEntry = (id) => {

package/dist/runtime/composables/useEditor.js

@@ -1,5 +1,6 @@
 import { ref, shallowRef, watch, onUnmounted } from "vue";
 import { XmlElement } from "yjs";
+import { useNuxtApp } from "#imports";
 export function useEditor(options) {
   const { childProvider, extraExtensions = [] } = options;
   const { userName, userColor, publicKeyB64, registry } = useNuxtApp().$abracadabra;

package/dist/runtime/composables/useEditorDragHandle.js

@@ -1,4 +1,6 @@
 import { ref } from "vue";
+import { useAbracadabra } from "./useAbracadabra.js";
+import { useFileBlobStore } from "./useFileBlobStore.js";
 function upperFirst(s) {
   return s.charAt(0).toUpperCase() + s.slice(1);
 }

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

@@ -0,0 +1,22 @@
+/**
+ * Editor emoji composable — provides a filtered list of GitHub emoji items
+ * for use in suggestion menus or emoji pickers.
+ *
+ * Requires `@tiptap/extension-emoji` as a peer dependency. If the extension
+ * is not installed, returns an empty items array.
+ *
+ * Ported from cou-sh/app/composables/useEditorEmojis.ts.
+ */
+export interface EmojiItem {
+    name: string;
+    shortcodes: string[];
+    tags: string[];
+    emoji?: string;
+    fallbackImage?: string;
+}
+export declare function useEditorEmojis(): {
+    items: EmojiItem[];
+    search: (query: string, limit?: number) => EmojiItem[];
+    recentItems: () => EmojiItem[];
+    markUsed: (name: string) => void;
+};

package/dist/runtime/composables/useEditorEmojis.js

@@ -0,0 +1,57 @@
+let cachedItems = null;
+function loadEmojis() {
+  if (cachedItems) return cachedItems;
+  try {
+    const { gitHubEmojis } = require("@tiptap/extension-emoji");
+    cachedItems = gitHubEmojis.filter(
+      (emoji) => !emoji.name.startsWith("regional_indicator_")
+    );
+  } catch {
+    cachedItems = [];
+  }
+  return cachedItems;
+}
+const RECENT_KEY = "abracadabra_recent_emojis";
+const MAX_RECENT = 16;
+function getRecentNames() {
+  if (typeof localStorage === "undefined") return [];
+  try {
+    return JSON.parse(localStorage.getItem(RECENT_KEY) || "[]");
+  } catch {
+    return [];
+  }
+}
+function addRecent(name) {
+  if (typeof localStorage === "undefined") return;
+  const recent = getRecentNames().filter((n) => n !== name);
+  recent.unshift(name);
+  if (recent.length > MAX_RECENT) recent.length = MAX_RECENT;
+  localStorage.setItem(RECENT_KEY, JSON.stringify(recent));
+}
+export function useEditorEmojis() {
+  const items = loadEmojis();
+  const itemsByName = new Map(items.map((e) => [e.name, e]));
+  function recentItems() {
+    return getRecentNames().map((name) => itemsByName.get(name)).filter((e) => !!e);
+  }
+  function search(query, limit = 20) {
+    if (!query) {
+      const recent = recentItems();
+      if (recent.length) return recent.slice(0, limit);
+      return items.slice(0, limit);
+    }
+    const q = query.toLowerCase();
+    return items.filter(
+      (e) => e.name.includes(q) || e.shortcodes?.some((s) => s.includes(q)) || e.tags?.some((t) => t.includes(q))
+    ).slice(0, limit);
+  }
+  function markUsed(name) {
+    addRecent(name);
+  }
+  return {
+    items,
+    search,
+    recentItems,
+    markUsed
+  };
+}

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

@@ -2,27 +2,34 @@
  * useEditorMentions
  *
  * Returns mention items for UEditorMentionMenu.
- * Combines awareness users (currently online) with plugin mention providers.
+ * Combines awareness users (currently online), document names from the tree,
+ * and plugin mention providers.
  *
  * Usage:
- *   const { items } = useEditorMentions()
+ *   const { items, filteredItems } = useEditorMentions()
  *   <UEditorMentionMenu :editor="editor" :items="items" />
  */
 export interface MentionItem {
     label: string;
     value: string;
+    type?: 'user' | 'doc';
+    docId?: string;
     icon?: string;
     avatar?: {
         alt: string;
         style?: Record<string, string>;
     };
+    group?: string;
 }
 export interface UseEditorMentionsOptions {
     /** Additional static items */
     extraItems?: MentionItem[];
     /** Doc ID for provider context */
     docId?: string;
+    /** Include document mentions from tree (default: true) */
+    includeDocuments?: boolean;
 }
 export declare function useEditorMentions(options?: UseEditorMentionsOptions): {
-    items: any;
+    items: import("vue").ComputedRef<MentionItem[]>;
+    filteredItems: (query: string) => MentionItem[];
 };

package/dist/runtime/composables/useEditorMentions.js

@@ -1,17 +1,27 @@
+import { computed } from "vue";
+import { useAbracadabra } from "./useAbracadabra.js";
+import { usePluginRegistry } from "./usePluginRegistry.js";
+import { useSyncedMap } from "./useYDoc.js";
 export function useEditorMentions(options = {}) {
-  const { provider } = useAbracadabra();
+  const { provider, doc } = useAbracadabra();
   const registry = usePluginRegistry();
+  const includeDocuments = options.includeDocuments !== false;
+  const treeMap = includeDocuments ? useSyncedMap(doc, "doc-tree") : null;
   const items = computed(() => {
     const result = [];
     if (provider.value) {
       try {
         const states = provider.value.awareness?.states ? [...provider.value.awareness.states.values()] : [];
+        const seen = /* @__PURE__ */ new Set();
         for (const state of states) {
           const user = state.user;
-          if (user?.name) {
+          if (user?.name && !seen.has(user.name)) {
+            seen.add(user.name);
             result.push({
               label: user.name,
               value: user.name,
+              type: "user",
+              group: "People",
               avatar: {
                 alt: user.name,
                 style: user.color ? { borderColor: user.color, borderWidth: "2px", borderStyle: "solid" } : void 0
@@ -23,6 +33,19 @@ export function useEditorMentions(options = {}) {
         if (import.meta.dev) console.warn("[abracadabra] mentions: failed to read awareness states:", e);
       }
     }
+    if (treeMap) {
+      for (const [id, entry] of Object.entries(treeMap.data)) {
+        if (!entry.label) continue;
+        result.push({
+          label: entry.label,
+          value: id,
+          type: "doc",
+          docId: id,
+          group: "Documents",
+          icon: entry.meta?.icon ? `i-lucide-${entry.meta.icon}` : "i-lucide-file-text"
+        });
+      }
+    }
     try {
       const providers = registry.getAllMentionProviders();
       for (const p of providers) {
@@ -38,5 +61,10 @@ export function useEditorMentions(options = {}) {
     }
     return result;
   });
-  return { items };
+  function filteredItems(query) {
+    if (!query) return items.value;
+    const q = query.toLowerCase();
+    return items.value.filter((item) => item.label.toLowerCase().includes(q));
+  }
+  return { items, filteredItems };
 }

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

@@ -14,6 +14,6 @@ export interface UseEditorSuggestionsOptions {
     onlyPlugins?: boolean;
 }
 export declare function useEditorSuggestions(options?: UseEditorSuggestionsOptions): {
-    items: any;
-    propertiesOnlyItems: any;
+    items: import("vue").ComputedRef<any[][]>;
+    propertiesOnlyItems: import("vue").ComputedRef<any[][]>;
 };