@abraca/nuxt 2.0.11 → 2.3.0

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

@@ -0,0 +1,79 @@
+/**
+ * useQuery — query + live-subscribe to documents in the doc-tree.
+ *
+ * Two modes:
+ *
+ *   1. **Imperative (`subscribe: false`, default)** — thin Vue-reactive
+ *      shell around `client.queryDocs`. Call `refresh()` to re-fetch.
+ *      Use for "give me the matching docs right now" reads.
+ *
+ *   2. **Reactive (`subscribe: true`)** — opens a `provider.subscribeQuery`
+ *      under the hood. The first frame fills `entries`; subsequent
+ *      `delta` frames merge in via add/remove. Resubscribes when the
+ *      options ref changes; cancels on unmount.
+ *
+ * Reactive mode requires an active provider — `entries` stays empty
+ * until the provider connects and the initial snapshot arrives.
+ *
+ * Usage:
+ *
+ *     // Imperative
+ *     const { entries, loading, refresh } = useQuery({ type: 'kanban' })
+ *     await refresh()
+ *
+ *     // Reactive (mount → snapshot → live deltas → unmount cancels)
+ *     const { entries } = useQuery(
+ *       computed(() => ({ type: 'kanban', where: { priority: { gte: 3 } } })),
+ *       { immediate: true, subscribe: true },
+ *     )
+ */
+import { type Ref } from 'vue';
+import type { DocumentMeta } from '@abraca/dabra';
+export interface QueryOptions {
+    /** Match `documents.kind` exactly. */
+    type?: string;
+    /** Narrow to children of this doc. */
+    parentId?: string;
+    /** Case-insensitive substring match on `documents.label`. */
+    labelContains?: string;
+    /** Maximum number of results (default 50, hard cap 500 server-side). */
+    limit?: number;
+    /**
+     * Predicate AST. Shape mirrors `@abraca/schema`'s `WhereClause`:
+     *   `{ priority: { gte: 3 }, tags: { contains: "urgent" } }`
+     * Empty / missing falls through to the v1 filter set.
+     */
+    where?: unknown;
+}
+export interface UseQueryReturn {
+    /** Latest result set. Empty until `refresh()` runs at least once. */
+    readonly entries: Ref<readonly DocumentMeta[]>;
+    /** True while a fetch is in flight. */
+    readonly loading: Ref<boolean>;
+    /** Last error message, or null. Cleared on the next refresh. */
+    readonly error: Ref<string | null>;
+    /** Trigger a fresh fetch with the current options. */
+    refresh: () => Promise<DocumentMeta[]>;
+}
+export interface UseQueryHookOptions {
+    /**
+     * Run `refresh()` immediately when the composable mounts, and whenever
+     * the options ref changes. Default false — the caller invokes `refresh`
+     * explicitly. Note that when the options arg is a plain object (not a
+     * ref / computed), the watcher fires once at mount and then never
+     * again — change-tracking requires a reactive source.
+     */
+    immediate?: boolean;
+    /**
+     * Open a live `query:v1:` subscription on the provider's WebSocket
+     * instead of polling REST. The first `ack` frame fills `entries`;
+     * subsequent `delta` frames merge in. Cancels on unmount, and on
+     * options change (a fresh sub is opened with the new predicate).
+     *
+     * Implies `immediate: true` — subscriptions are useless without an
+     * initial snapshot. Falls back to imperative mode when no provider
+     * is bound or the WS is closed.
+     */
+    subscribe?: boolean;
+}
+export declare function useQuery(options: QueryOptions | Ref<QueryOptions>, hookOpts?: UseQueryHookOptions): UseQueryReturn;

package/dist/runtime/composables/useQuery.js

@@ -0,0 +1,97 @@
+import { onScopeDispose, ref, shallowRef, watch } from "vue";
+import { useAbracadabra } from "#imports";
+function asOptions(input) {
+  if (input.value !== void 0 && typeof input.effect !== "undefined") {
+    return input;
+  }
+  if (input.value !== void 0) {
+    return input;
+  }
+  return ref(input);
+}
+export function useQuery(options, hookOpts = {}) {
+  const opts = asOptions(options);
+  const entries = shallowRef([]);
+  const loading = ref(false);
+  const error = ref(null);
+  async function refresh() {
+    const abra = useAbracadabra();
+    const client = abra.client?.value;
+    if (!client) {
+      entries.value = [];
+      return [];
+    }
+    loading.value = true;
+    error.value = null;
+    try {
+      const result = await client.queryDocs(opts.value);
+      entries.value = Object.freeze(result.slice());
+      return result;
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : String(err);
+      entries.value = [];
+      return [];
+    } finally {
+      loading.value = false;
+    }
+  }
+  let activeHandle = null;
+  function closeSubscription() {
+    if (activeHandle) {
+      activeHandle.cancel();
+      activeHandle = null;
+    }
+  }
+  function specFromOpts(o) {
+    return {
+      type: o.type,
+      parentId: o.parentId,
+      labelContains: o.labelContains,
+      limit: o.limit,
+      where: o.where
+    };
+  }
+  async function openSubscription() {
+    closeSubscription();
+    const abra = useAbracadabra();
+    const provider = abra.provider?.value;
+    if (!provider?.subscribeQuery) {
+      await refresh();
+      return;
+    }
+    loading.value = true;
+    error.value = null;
+    activeHandle = provider.subscribeQuery(specFromOpts(opts.value), {
+      onSnapshot: (rows) => {
+        entries.value = Object.freeze(rows.slice());
+        loading.value = false;
+      },
+      onDelta: ({ added, removed }) => {
+        const removedSet = new Set(removed);
+        const kept = entries.value.filter(
+          (e) => !removedSet.has(e.id)
+        );
+        const next = [...added, ...kept];
+        entries.value = Object.freeze(next);
+      },
+      onError: (err) => {
+        error.value = err.message;
+      }
+    });
+  }
+  if (hookOpts.subscribe) {
+    watch(
+      opts,
+      () => {
+        void openSubscription();
+      },
+      { immediate: true, deep: true }
+    );
+    onScopeDispose(() => closeSubscription());
+  } else if (hookOpts.immediate) {
+    watch(opts, () => {
+      void refresh();
+    }, { immediate: true, deep: true });
+  }
+  return { entries, loading, error, refresh };
+}

package/dist/runtime/composables/useSpaces.js

@@ -1,5 +1,4 @@
 import { ref, computed } from "vue";
-import { useRoute } from "#imports";
 import { useAbracadabra } from "./useAbracadabra.js";
 const loading = ref(false);
 const error = ref(null);
@@ -7,10 +6,10 @@ export function useSpaces() {
   const abra = useAbracadabra();
   const spaces = computed(() => abra.currentServerSpaces.value ?? []);
   const currentSpace = computed(() => {
-    const route = useRoute();
-    const docId = route.params.docId;
-    if (!docId) return spaces.value[0] ?? null;
-    return spaces.value.find((s) => s.id === docId) ?? null;
+    const entry = abra.savedServers?.value?.find?.((s) => s.url === abra.currentServerUrl?.value);
+    const entryDocId = entry?.entryDocId;
+    if (!entryDocId) return spaces.value[0] ?? null;
+    return spaces.value.find((s) => s.doc_id === entryDocId) ?? spaces.value[0] ?? null;
   });
   async function refresh() {
     loading.value = true;

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

@@ -5,9 +5,9 @@ export declare function useTableView(tree: {
     treeMap: any;
 }, tableDocId: string): {
     tableMeta: import("vue").ComputedRef<DocPageMeta>;
-    explicitMode: import("vue").ComputedRef<"flat" | "hierarchy" | undefined>;
-    detectedMode: import("vue").ComputedRef<"flat" | "hierarchy">;
-    effectiveMode: import("vue").ComputedRef<"flat" | "hierarchy">;
+    explicitMode: import("vue").ComputedRef<"hierarchy" | "flat" | undefined>;
+    detectedMode: import("vue").ComputedRef<"hierarchy" | "flat">;
+    effectiveMode: import("vue").ComputedRef<"hierarchy" | "flat">;
     setMode: (mode: "hierarchy" | "flat" | undefined) => void;
     columnDefs: import("vue").ComputedRef<TableColumnDef[]>;
     addColumn: (def: TableColumnDef) => void;

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

@@ -0,0 +1,97 @@
+/**
+ * useTypedDoc — typed reads + validated writes against the Abracadabra
+ * doc-tree, parameterised by a `@abraca/schema` registry.
+ *
+ * Day 2 of the Phase 3 schema rollout.
+ *
+ * The Nuxt module reads / writes the doc-tree through `useSyncedMap` on
+ * the root Y.Doc — it does NOT use `DocumentManager.docs(...)` from
+ * `@abraca/dabra`, because the module instantiates `AbracadabraProvider`
+ * directly (no DM wrapper). This composable is the Nuxt-side analogue:
+ * a typed projection over `useDocTree`'s reactive entries, with optional
+ * pre-write validation against the supplied registry.
+ *
+ *     // app code
+ *     import { kanbanSchema } from '@abraca/schema'
+ *     const { get, all, update } = useTypedDoc(kanbanSchema)
+ *     const board = computed(() => get('kanban', boardId.value))
+ *     // board.value?.meta.kanbanColumnWidth is typed
+ *     update('kanban', boardId.value, { kanbanColumnWidth: 'wide' })
+ *
+ * Behaviour:
+ *  - `get(type, id)` returns null when the entry is missing OR its
+ *    stored `type` doesn't match (cross-schema reads return null —
+ *    matches the server-side smoke contract).
+ *  - `update(type, id, patch)` validates the *merged* meta before
+ *    writing. Throws `MetaValidationError`-equivalent on mismatch.
+ *  - `set(type, id, meta)` validates the replacement meta.
+ *  - `clear(type, id, keys)` is a thin wrapper over `updateMeta` —
+ *    no validation (clearing keys can never fail validation).
+ *  - Reads do NOT auto-call `runMigrations`. Pass `migrate: true` in
+ *    the per-call options or use `useDocEntryTyped` (Day 3).
+ *
+ * Type inference: when a typed `SchemaRegistry<TMap>` is passed, every
+ * read/write narrows `meta` to `TMap[N]`. Untyped registries fall back
+ * to `Record<string, unknown>`.
+ */
+import { type ComputedRef } from 'vue';
+import type { SchemaRegistryLike } from '../utils/schemaSupport.js';
+/** Extract the doc-type names from a typed registry. */
+type SchemaDocTypeName<S> = S extends {
+    __metaMap?: infer M;
+} ? keyof M & string : string;
+/** Extract the meta type for a given doc-type name from a registry. */
+type SchemaMetaOf<S, N extends string> = S extends {
+    __metaMap?: infer M;
+} ? N extends keyof M ? M[N] : Record<string, unknown> : Record<string, unknown>;
+export interface TypedTreeEntry<M> {
+    readonly id: string;
+    readonly type: string;
+    readonly label: string;
+    readonly parentId: string | null;
+    readonly order: number;
+    readonly meta: M | undefined;
+    readonly createdAt: number | undefined;
+    readonly updatedAt: number | undefined;
+}
+/**
+ * Thrown by typed write methods when validation fails.
+ *
+ * Mirrors `MetaValidationError` from `@abraca/dabra` — kept module-local
+ * because the Nuxt write path doesn't go through `MetaManager`.
+ * Consumers can `import { MetaValidationError } from '@abraca/nuxt'` to
+ * type-narrow without dragging in `@abraca/dabra`.
+ */
+export declare class MetaValidationError extends Error {
+    readonly docId: string;
+    readonly docType: string;
+    readonly errors: ReadonlyArray<{
+        path: ReadonlyArray<PropertyKey>;
+        message: string;
+        code?: string;
+    }>;
+    constructor(docId: string, docType: string, errors: ReadonlyArray<{
+        path: ReadonlyArray<PropertyKey>;
+        message: string;
+        code?: string;
+    }>);
+}
+export declare class TypedDocTypeMismatchError extends Error {
+    readonly docId: string;
+    readonly expectedType: string;
+    readonly actualType: string | undefined;
+    constructor(docId: string, expectedType: string, actualType: string | undefined);
+}
+export declare function useTypedDoc<S extends SchemaRegistryLike>(schema: S): {
+    /** Synchronous typed read. Returns null on missing entry or type mismatch. */
+    get: <N extends SchemaDocTypeName<S>>(type: N, id: string) => TypedTreeEntry<SchemaMetaOf<S, N>> | null;
+    /** Reactive list of every entry whose stored `type` matches `type`. */
+    all: <N extends SchemaDocTypeName<S>>(type: N) => ComputedRef<TypedTreeEntry<SchemaMetaOf<S, N>>[]>;
+    /** Validated meta merge. Throws on mismatch / validation failure. */
+    update: <N extends SchemaDocTypeName<S>>(type: N, id: string, patch: Partial<SchemaMetaOf<S, N>>) => void;
+    /** Validated meta replacement. Throws on mismatch / validation failure. */
+    set: <N extends SchemaDocTypeName<S>>(type: N, id: string, meta: SchemaMetaOf<S, N>) => void;
+    /** Delete specific keys. No validation (clearing can't fail validation). */
+    clear: <N extends SchemaDocTypeName<S>>(type: N, id: string, keys: ReadonlyArray<keyof SchemaMetaOf<S, N> & string>) => void;
+};
+export {};

package/dist/runtime/composables/useTypedDoc.js

@@ -0,0 +1,114 @@
+import { computed } from "vue";
+import { useAbracadabra } from "./useAbracadabra.js";
+import { useDocTree } from "./useDocTree.js";
+export class MetaValidationError extends Error {
+  docId;
+  docType;
+  errors;
+  constructor(docId, docType, errors) {
+    super(
+      `meta validation failed for doc ${docId} (type "${docType}"): ` + errors.map((e) => `${e.path.join(".") || "<root>"}: ${e.message}`).join("; ")
+    );
+    this.name = "MetaValidationError";
+    this.docId = docId;
+    this.docType = docType;
+    this.errors = errors;
+  }
+}
+export class TypedDocTypeMismatchError extends Error {
+  docId;
+  expectedType;
+  actualType;
+  constructor(docId, expectedType, actualType) {
+    super(
+      `typed write on document ${docId} expected type "${expectedType}" but stored type is ` + (actualType === void 0 ? "(none)" : `"${actualType}"`)
+    );
+    this.name = "TypedDocTypeMismatchError";
+    this.docId = docId;
+    this.expectedType = expectedType;
+    this.actualType = actualType;
+  }
+}
+function projectEntry(entry, expectedType) {
+  if (!entry) return null;
+  if (entry.type !== expectedType) return null;
+  return {
+    id: entry.id,
+    type: expectedType,
+    label: entry.label,
+    parentId: entry.parentId,
+    order: entry.order,
+    meta: entry.meta,
+    createdAt: entry.createdAt,
+    updatedAt: entry.updatedAt
+  };
+}
+export function useTypedDoc(schema) {
+  const abra = useAbracadabra();
+  const tree = useDocTree();
+  function readEntry(id) {
+    return tree.getEntry(id);
+  }
+  function ensureType(id, expectedType) {
+    const entry = readEntry(id);
+    if (!entry) {
+      throw new TypedDocTypeMismatchError(id, expectedType, void 0);
+    }
+    if (entry.type !== expectedType) {
+      throw new TypedDocTypeMismatchError(id, expectedType, entry.type);
+    }
+    return entry;
+  }
+  function validateOrThrow(id, type, meta) {
+    const result = schema.validateMeta(type, meta);
+    if (result.ok) return result.value ?? meta;
+    throw new MetaValidationError(id, type, result.errors);
+  }
+  function writeMeta(id, nextMeta) {
+    const doc = abra.doc.value;
+    if (!doc) return;
+    const treeMap = doc.getMap("doc-tree");
+    const entry = treeMap.get(id);
+    if (!entry) return;
+    treeMap.set(id, {
+      ...entry,
+      meta: nextMeta,
+      updatedAt: Date.now()
+    });
+  }
+  return {
+    get(type, id) {
+      return projectEntry(readEntry(id), type);
+    },
+    all(type) {
+      return computed(
+        () => tree.entries.value.filter((e) => e.type === type && !e.trashed).map((e) => projectEntry(e, type)).filter((e) => e !== null)
+      );
+    },
+    update(type, id, patch) {
+      const entry = ensureType(id, type);
+      const merged = {
+        ...entry.meta ?? {},
+        ...patch
+      };
+      validateOrThrow(id, type, merged);
+      writeMeta(id, merged);
+    },
+    set(type, id, meta) {
+      ensureType(id, type);
+      validateOrThrow(id, type, meta);
+      writeMeta(id, meta);
+    },
+    clear(type, id, keys) {
+      const entry = ensureType(id, type);
+      if (!entry.meta) return;
+      const src = entry.meta;
+      const dropped = new Set(keys.map((k) => k));
+      const next = {};
+      for (const [k, v] of Object.entries(src)) {
+        if (!dropped.has(k)) next[k] = v;
+      }
+      writeMeta(id, next);
+    }
+  };
+}

package/dist/runtime/composables/useWebRTC.js

@@ -18,18 +18,41 @@ function _wireEvents(rtc) {
     rtc.on(event, handler);
     _unbinds.push(() => rtc.off(event, handler));
   };
+  function normalizePeer(p) {
+    const peerId = p?.peerId ?? p?.peer_id;
+    return {
+      ...p,
+      peerId,
+      peer_id: peerId,
+      displayName: p?.displayName ?? p?.name,
+      color: p?.color
+    };
+  }
   on("connected", () => {
     isConnected.value = true;
     webrtcStatus.value = "connected";
-    localPeerId.value = rtc.localPeerId;
+    const newLocalId = rtc.localPeerId;
+    localPeerId.value = newLocalId;
+    const next = /* @__PURE__ */ new Map();
+    const sdkPeers = rtc.peers instanceof Map ? rtc.peers : null;
+    if (sdkPeers) {
+      for (const [pid, p] of sdkPeers.entries()) {
+        if (!pid || pid === newLocalId) continue;
+        next.set(pid, normalizePeer(p));
+      }
+    }
+    peers.value = next;
   });
   on("disconnected", () => {
     isConnected.value = false;
     webrtcStatus.value = "disconnected";
   });
   on("peerJoined", (peer) => {
+    const norm = normalizePeer(peer);
+    if (!norm.peerId) return;
+    if (norm.peerId === localPeerId.value) return;
     const next = new Map(peers.value);
-    next.set(peer.peerId, peer);
+    next.set(norm.peerId, norm);
     peers.value = next;
   });
   on("peerLeft", ({ peerId }) => {
@@ -40,6 +63,13 @@ function _wireEvents(rtc) {
     nextE2ee.delete(peerId);
     e2eeEstablishedPeers.value = nextE2ee;
   });
+  on("peerProfile", ({ peerId, name, color }) => {
+    const existing = peers.value.get(peerId);
+    if (!existing) return;
+    const next = new Map(peers.value);
+    next.set(peerId, { ...existing, displayName: name, name, color });
+    peers.value = next;
+  });
   on("peerConnectionState", ({ peerId, state }) => {
     const existing = peers.value.get(peerId);
     if (existing) {
@@ -100,7 +130,7 @@ function fromBase64Url(str) {
 }
 async function connect(options) {
   if (_rtc && isConnected.value) return;
-  const { provider, keystore, isClaimed } = useAbracadabra();
+  const { provider, keystore, isClaimed, userName, userColor } = useAbracadabra();
   if (!provider.value) return;
   const config = useRuntimeConfig();
   const webrtcConfig = config.public.abracadabra?.webrtc ?? {};
@@ -138,8 +168,17 @@ async function connect(options) {
   }
   const rtc = AbracadabraWebRTC.fromProvider(provider.value, {
     iceServers: resolvedIceServers,
-    enableFileTransfer: webrtcConfig.fileTransfer ?? false,
-    e2ee: e2eeIdentity
+    // Default file-transfer ON. The SDK's default (false) means
+    // `useFileTransfer().sendFile()` queues bytes onto a data channel that
+    // never gets created → silent 0 % stuck transfer. Apps that explicitly
+    // want to disable can pass `webrtc.fileTransfer: false` in nuxt.config.
+    enableFileTransfer: webrtcConfig.fileTransfer ?? true,
+    e2ee: e2eeIdentity,
+    // Pass identity through so peers can label each other in the mesh.
+    // Without these the SDK's `peerProfile` event never fires and the UI
+    // shows opaque peer IDs ("peer-jl0z7m" etc.) instead of usernames.
+    displayName: userName.value || void 0,
+    color: userColor.value || void 0
   });
   _initWebRTC(rtc);
   await rtc.connect();

package/dist/runtime/extensions/document-meta.js

@@ -1,5 +1,7 @@
 import { Node } from "@tiptap/core";
 import { Plugin, PluginKey, TextSelection } from "@tiptap/pm/state";
+import { VueNodeViewRenderer } from "@tiptap/vue-3";
+import DocumentMetaView from "./views/DocumentMetaView.vue";
 export const DocumentMeta = Node.create({
   name: "documentMeta",
   content: "inline*",
@@ -10,6 +12,9 @@ export const DocumentMeta = Node.create({
   renderHTML() {
     return ["div", { "data-type": "document-meta" }, 0];
   },
+  addNodeView() {
+    return VueNodeViewRenderer(DocumentMetaView);
+  },
   addKeyboardShortcuts() {
     return {
       Backspace: ({ editor }) => {

package/dist/runtime/extensions/timeline.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Timeline + TimelineItem TipTap nodes.
+ *
+ * Vertical event timeline with per-item icon, label, and freeform date.
+ * Optional builtin — disabled via `abracadabra.disabledBuiltins: ['timeline']`.
+ *
+ * Ported 1:1 from cou-sh/app/extensions/timeline.ts.
+ */
+import { Node } from '@tiptap/core';
+export declare const TimelineItem: Node<any, any>;
+export declare const Timeline: Node<any, any>;

package/dist/runtime/extensions/timeline.js

@@ -0,0 +1,52 @@
+import { Node, mergeAttributes } from "@tiptap/core";
+import { VueNodeViewRenderer } from "@tiptap/vue-3";
+import TimelineView from "./views/TimelineView.vue";
+import TimelineItemView from "./views/TimelineItemView.vue";
+export const TimelineItem = Node.create({
+  name: "timelineItem",
+  content: "block+",
+  addAttributes() {
+    return {
+      date: { default: "" },
+      label: { default: "Event" },
+      icon: { default: "" }
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: "div[data-timeline-item]",
+        getAttrs: (el) => ({
+          date: el.getAttribute("data-date") || "",
+          label: el.getAttribute("data-label") || "Event",
+          icon: el.getAttribute("data-icon") || ""
+        })
+      }
+    ];
+  },
+  renderHTML({ HTMLAttributes }) {
+    return ["div", mergeAttributes({
+      "data-timeline-item": "",
+      "data-date": HTMLAttributes.date,
+      "data-label": HTMLAttributes.label,
+      "data-icon": HTMLAttributes.icon
+    }), 0];
+  },
+  addNodeView() {
+    return VueNodeViewRenderer(TimelineItemView);
+  }
+});
+export const Timeline = Node.create({
+  name: "timeline",
+  group: "block",
+  content: "timelineItem+",
+  parseHTML() {
+    return [{ tag: "div[data-timeline]" }];
+  },
+  renderHTML() {
+    return ["div", { "data-timeline": "" }, 0];
+  },
+  addNodeView() {
+    return VueNodeViewRenderer(TimelineView);
+  }
+});

package/dist/runtime/extensions/views/DocumentMetaView.d.vue.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/extensions/views/DocumentMetaView.vue

@@ -0,0 +1,63 @@
+<script setup>
+import { computed } from "vue";
+import { NodeViewWrapper, NodeViewContent } from "@tiptap/vue-3";
+import { buildMetaMenuItems } from "../../composables/useMetaMenuItems";
+const props = defineProps({
+  decorations: { type: Array, required: true },
+  selected: { type: Boolean, required: true },
+  updateAttributes: { type: Function, required: true },
+  deleteNode: { type: Function, required: true },
+  node: { type: null, required: true },
+  view: { type: null, required: true },
+  getPos: { type: null, required: true },
+  innerDecorations: { type: null, required: true },
+  editor: { type: Object, required: true },
+  extension: { type: Object, required: true },
+  HTMLAttributes: { type: Object, required: true }
+});
+const items = computed(() => {
+  void props.node.content.size;
+  return buildMetaMenuItems(props.editor);
+});
+</script>
+
+<template>
+  <NodeViewWrapper
+    as="div"
+    data-type="document-meta"
+    class="group/meta"
+    :class="{ 'meta-empty': node.content.size === 0 && !props.editor.isEditable }"
+    draggable="false"
+    @dragstart.prevent.stop
+  >
+    <NodeViewContent
+      as="span"
+      style="display: contents"
+    />
+    <span
+      v-show="props.editor.isEditable"
+      contenteditable="false"
+      class="inline-flex items-center"
+    >
+      <UDropdownMenu
+        :items="items"
+        :content="{ side: 'bottom', align: 'start' }"
+        :ui="{ content: 'w-48' }"
+      >
+        <UButton
+          icon="i-lucide-plus"
+          size="2xs"
+          color="neutral"
+          variant="ghost"
+          class="opacity-0 group-hover/meta:opacity-40 hover:!opacity-100 transition-opacity"
+        />
+      </UDropdownMenu>
+    </span>
+    <span
+      v-if="node.content.size === 0 && props.editor.isEditable"
+      class="text-sm text-(--ui-text-muted) pointer-events-none opacity-60"
+    >
+      Type '/' to add a property…
+    </span>
+  </NodeViewWrapper>
+</template>

package/dist/runtime/extensions/views/DocumentMetaView.vue.d.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/extensions/views/TimelineItemView.d.vue.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;