@abraca/nuxt 2.15.0 → 2.16.0

package/dist/runtime/components/settings/APluginsTabPending.vue.d.ts

@@ -0,0 +1,24 @@
+import type { PluginManifest } from '@abraca/plugin';
+export interface PendingSpacePluginEntry {
+    /** Plugin id from the manifest. */
+    id: string;
+    /** Resolved bundle URL. */
+    url: string;
+    /** Version, when the space-plugins map records one. */
+    version?: string;
+    /** Resolved manifest, when the URL exposed a sibling JSON. */
+    manifest?: PluginManifest;
+}
+type __VLS_Props = {
+    /**
+     * Space-declared plugins that did NOT auto-load (not in registry).
+     * Pre-filtered by the host's space-plugins watcher. When omitted, the
+     * tab shows the empty-state explainer.
+     */
+    declared?: readonly PendingSpacePluginEntry[];
+    /** Active space id. Required for decline persistence to be per-space. */
+    spaceId?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/settings/ASettingsPluginsPanel.d.vue.ts

@@ -1,3 +1,16 @@
-declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export interface BuiltinPluginEntry {
+    name: string;
+    label?: string;
+    version?: string;
+    description?: string;
+    icon?: string;
+}
+type __VLS_Props = {
+    /** Host-registered first-party plugins; toggle state lives in localStorage. */
+    builtins?: readonly BuiltinPluginEntry[];
+    /** Initial tab. */
+    initialTab?: 'browse' | 'installed' | 'pending';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/settings/ASettingsPluginsPanel.vue

@@ -1,96 +1,50 @@
 <script setup>
-import { computed } from "vue";
-import { usePluginRegistry } from "../../composables/usePluginRegistry";
-const registry = usePluginRegistry();
-const pluginList = computed(
-  () => registry.getPlugins().map((p) => ({
-    name: p.name,
-    description: p.description ?? "",
-    icon: p.icon ?? "i-lucide-plug",
-    hasExtensions: !!p.extensions?.length,
-    hasPageTypes: !!p.pageTypes?.length,
-    hasToolbar: !!p.toolbarItems?.length,
-    hasSuggestions: !!p.suggestionItems?.length
-  }))
+import { computed, ref } from "vue";
+import { useAbracadabra } from "../../composables/useAbracadabra";
+const props = defineProps({
+  builtins: { type: Array, required: false },
+  initialTab: { type: String, required: false }
+});
+const tab = ref(props.initialTab ?? "installed");
+const builtins = computed(() => props.builtins ?? []);
+const abra = useAbracadabra();
+const serverUrl = computed(
+  () => abra.currentServerUrl?.value || void 0
 );
+const tabItems = computed(() => [
+  { label: "Browse", value: "browse", icon: "i-lucide-store" },
+  { label: "Installed", value: "installed", icon: "i-lucide-package" },
+  { label: "Pending", value: "pending", icon: "i-lucide-hourglass" }
+]);
 </script>
 
 <template>
-  <div>
-    <div class="mb-4">
+  <div class="flex flex-col gap-4 max-w-3xl">
+    <div>
       <h3 class="text-base font-semibold">
         Plugins
       </h3>
       <p class="text-sm text-(--ui-text-muted) mt-1">
-        Installed plugins extending the editor and platform.
+        Browse the registry, manage installed plugins, and review what the active space is asking to load.
       </p>
     </div>
 
-    <div class="flex flex-col gap-2">
-      <div
-        v-for="plugin in pluginList"
-        :key="plugin.name"
-        class="flex items-center gap-3 p-3 rounded-lg border border-(--ui-border)"
-      >
-        <UIcon
-          :name="plugin.icon"
-          class="size-5 text-(--ui-text-muted) shrink-0"
-        />
-        <div class="flex-1 min-w-0">
-          <p class="text-sm font-medium">
-            {{ plugin.name }}
-          </p>
-          <p
-            v-if="plugin.description"
-            class="text-xs text-(--ui-text-muted) mt-0.5"
-          >
-            {{ plugin.description }}
-          </p>
-          <div class="flex flex-wrap gap-1 mt-1">
-            <UBadge
-              v-if="plugin.hasExtensions"
-              color="info"
-              variant="subtle"
-              label="Extensions"
-              size="xs"
-            />
-            <UBadge
-              v-if="plugin.hasPageTypes"
-              color="success"
-              variant="subtle"
-              label="Page Types"
-              size="xs"
-            />
-            <UBadge
-              v-if="plugin.hasToolbar"
-              color="warning"
-              variant="subtle"
-              label="Toolbar"
-              size="xs"
-            />
-            <UBadge
-              v-if="plugin.hasSuggestions"
-              color="neutral"
-              variant="subtle"
-              label="Suggestions"
-              size="xs"
-            />
-          </div>
-        </div>
-      </div>
+    <UTabs
+      v-model="tab"
+      :items="tabItems"
+      :ui="{ list: 'w-fit' }"
+    />
 
-      <div
-        v-if="pluginList.length === 0"
-        class="flex flex-col items-center justify-center py-12"
-      >
-        <UIcon
-          name="i-lucide-plug"
-          class="size-10 text-(--ui-text-dimmed) mb-3"
-        />
-        <p class="text-sm text-(--ui-text-muted)">
-          No plugins installed.
-        </p>
-      </div>
+    <div v-if="tab === 'browse'" class="min-h-[24rem]">
+      <APluginBrowser :server-url="serverUrl" />
+    </div>
+
+    <div v-else-if="tab === 'installed'">
+      <APluginsTabInstalled :builtins="builtins" />
+    </div>
+
+    <div v-else-if="tab === 'pending'">
+      <APluginsTabPending />
     </div>
   </div>
 </template>

package/dist/runtime/components/settings/ASettingsPluginsPanel.vue.d.ts

@@ -1,3 +1,16 @@
-declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export interface BuiltinPluginEntry {
+    name: string;
+    label?: string;
+    version?: string;
+    description?: string;
+    icon?: string;
+}
+type __VLS_Props = {
+    /** Host-registered first-party plugins; toggle state lives in localStorage. */
+    builtins?: readonly BuiltinPluginEntry[];
+    /** Initial tab. */
+    initialTab?: 'browse' | 'installed' | 'pending';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -0,0 +1,7 @@
+export declare function useDeclinedSpacePlugins(): {
+    declined: import("@vueuse/shared").RemovableRef<Record<string, string[]>>;
+    isDeclined: (spaceId: string, pluginId: string) => boolean;
+    decline: (spaceId: string, pluginId: string) => void;
+    reset: (spaceId: string, pluginId: string) => void;
+    clearSpace: (spaceId: string) => void;
+};

package/dist/runtime/composables/useDeclinedSpacePlugins.js

@@ -0,0 +1,24 @@
+import { useLocalStorage } from "@vueuse/core";
+const STORAGE_KEY = "abracadabra_declined_space_plugins";
+export function useDeclinedSpacePlugins() {
+  const declined = useLocalStorage(STORAGE_KEY, {});
+  function isDeclined(spaceId, pluginId) {
+    return (declined.value[spaceId] ?? []).includes(pluginId);
+  }
+  function decline(spaceId, pluginId) {
+    const cur = declined.value[spaceId] ?? [];
+    if (cur.includes(pluginId)) return;
+    declined.value = { ...declined.value, [spaceId]: [...cur, pluginId] };
+  }
+  function reset(spaceId, pluginId) {
+    const cur = declined.value[spaceId] ?? [];
+    if (!cur.includes(pluginId)) return;
+    declined.value = { ...declined.value, [spaceId]: cur.filter((id) => id !== pluginId) };
+  }
+  function clearSpace(spaceId) {
+    if (!declined.value[spaceId]) return;
+    const { [spaceId]: _, ...rest } = declined.value;
+    declined.value = rest;
+  }
+  return { declined, isDeclined, decline, reset, clearSpace };
+}

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

@@ -0,0 +1,29 @@
+import type { PluginCapability } from '@abraca/plugin';
+export interface LoadTimePendingEntry {
+    /** Installed-entry URL (also the join key against `useInstalledPlugins`). */
+    url: string;
+    /** Plugin id from the freshly-fetched manifest. */
+    id: string;
+    /** Version we just observed upstream — DIFFERS from `acknowledgedVersion`. */
+    observedVersion: string;
+    /** Required capabilities currently declared upstream. */
+    observedRequired: PluginCapability[];
+    /**
+     * Why we queued — `"version-changed"`, `"capabilities-grew"`, or
+     * `"never-acknowledged"`. Drives the dialog header copy on review.
+     */
+    reason: 'version-changed' | 'capabilities-grew' | 'never-acknowledged';
+    /** Wall-clock when the loader queued this entry. */
+    queuedAt: number;
+}
+/** Loader-side: enqueue or replace an entry. Idempotent on `url`. */
+export declare function _enqueueLoadTimePending(entry: LoadTimePendingEntry): void;
+/** Loader / tab-side: drop an entry once the user re-acks or removes it. */
+export declare function _clearLoadTimePending(url: string): void;
+/** Loader-side: read once at boot to know what was previously queued. */
+export declare function _readLoadTimePending(): LoadTimePendingEntry[];
+export declare function useLoadTimePending(): {
+    entries: import("@vueuse/shared").RemovableRef<LoadTimePendingEntry[]>;
+    clear: (url: string) => void;
+    clearAll: () => void;
+};

package/dist/runtime/composables/useLoadTimePending.js

@@ -0,0 +1,37 @@
+import { useLocalStorage } from "@vueuse/core";
+const STORAGE_KEY = "abracadabra_load_time_pending";
+function read() {
+  try {
+    return JSON.parse(localStorage.getItem(STORAGE_KEY) ?? "[]");
+  } catch {
+    return [];
+  }
+}
+function write(list) {
+  try {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(list));
+  } catch {
+  }
+}
+export function _enqueueLoadTimePending(entry) {
+  const list = read().filter((e) => e.url !== entry.url);
+  list.push(entry);
+  write(list);
+}
+export function _clearLoadTimePending(url) {
+  const list = read().filter((e) => e.url !== url);
+  write(list);
+}
+export function _readLoadTimePending() {
+  return read();
+}
+export function useLoadTimePending() {
+  const entries = useLocalStorage(STORAGE_KEY, []);
+  function clear(url) {
+    entries.value = entries.value.filter((e) => e.url !== url);
+  }
+  function clearAll() {
+    entries.value = [];
+  }
+  return { entries, clear, clearAll };
+}

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

@@ -1,4 +1,4 @@
-import type { PluginManifest, PluginCapability } from '@abraca/plugin';
+import type { PluginManifest, PluginCapability, ExternalPluginEntry } from '@abraca/plugin';
 export interface CatalogPlugin {
     id: string;
     name: string | null;
@@ -138,6 +138,10 @@ export declare function usePluginCatalog(): {
         required: PluginCapability[];
         optional: PluginCapability[];
     };
+    capabilitiesGrew: (prevAcked: readonly PluginCapability[] | undefined, currentRequired: readonly PluginCapability[]) => PluginCapability[];
+    needsTrustReprompt: (entry: Pick<ExternalPluginEntry, "trustAcknowledgedAt" | "acknowledgedVersion" | "acknowledgedCapabilities">, manifest: Pick<PluginManifest, "version" | "capabilities">) => boolean;
+    resolveExternalManifest: (bundleUrl: string) => Promise<PluginManifest | null>;
+    synthesizeUnknownManifest: (idOrUrl: string, version?: string) => PluginManifest;
     /** Current server policy. `null` until `loadPolicy()` resolves. */
     policy: import("vue").Ref<{
         registry_url: string;

package/dist/runtime/composables/usePluginCatalog.js

@@ -163,6 +163,36 @@ export function usePluginCatalog() {
       optional: [...m.capabilities.optional ?? []]
     };
   }
+  function capabilitiesGrew(prevAcked, currentRequired) {
+    const acked = new Set(prevAcked ?? []);
+    return currentRequired.filter((c) => !acked.has(c));
+  }
+  async function resolveExternalManifest(bundleUrl) {
+    try {
+      const manifestUrl = bundleUrl.replace(/\/[^/]+$/, (m2) => `${m2.replace(/\.[^.]+$/, "")}.manifest.json`);
+      const m = await $fetch(manifestUrl);
+      if (m && typeof m === "object" && typeof m.id === "string") return m;
+      return null;
+    } catch {
+      return null;
+    }
+  }
+  function synthesizeUnknownManifest(idOrUrl, version = "0.0.0") {
+    const m = {
+      manifestVersion: 1,
+      id: idOrUrl,
+      version,
+      capabilities: { required: [], optional: [] },
+      contributes: {}
+    };
+    return m;
+  }
+  function needsTrustReprompt(entry, manifest) {
+    if (!entry.trustAcknowledgedAt) return true;
+    if (entry.acknowledgedVersion !== manifest.version) return true;
+    const required = manifest.capabilities.required ?? [];
+    return capabilitiesGrew(entry.acknowledgedCapabilities, required).length > 0;
+  }
   async function loadPolicy(serverUrl) {
     const url = `${serverUrl.replace(/\/$/, "")}/plugins/policy`;
     const fetched = await $fetch(url);
@@ -200,6 +230,10 @@ export function usePluginCatalog() {
     installFromUrl,
     isInstalled,
     capabilitiesFor,
+    capabilitiesGrew,
+    needsTrustReprompt,
+    resolveExternalManifest,
+    synthesizeUnknownManifest,
     /** Current server policy. `null` until `loadPolicy()` resolves. */
     policy,
     loadPolicy,

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

@@ -0,0 +1,43 @@
+/**
+ * `useUploadedPluginStore()` — IndexedDB-backed storage for plugin bundles
+ * the user uploaded directly (Upload button on the Installed tab). Keys
+ * are the SHA-256 of the bundle bytes; values are the bytes + MIME.
+ *
+ * The plugin loader (`plugin-abracadabra.client.ts`) recognises URLs of
+ * the form `idb-plugin:<sha256>` and resolves them by reading bytes from
+ * here, wrapping in a fresh `Blob`, and creating a `blob:` URL for
+ * `import()`. Blob URLs are session-scoped, so the bytes have to live in
+ * IDB to survive reload.
+ *
+ * Internal helpers (`_*`) are used by the loader. Public API is the
+ * composable for components.
+ */
+interface StoredBundle {
+    sha256: string;
+    bytes: Uint8Array;
+    mime: string;
+    uploadedAt: number;
+}
+/** Store an uploaded bundle by its SHA-256 hex. Idempotent. */
+export declare function _putUploadedPluginBlob(sha256: string, bytes: Uint8Array, mime?: string): Promise<void>;
+/** Read an uploaded bundle. Returns `null` when the key is unknown. */
+export declare function _getUploadedPluginBlob(sha256: string): Promise<StoredBundle | null>;
+/** Delete an uploaded bundle. Used by `uninstall()` for upload-origin entries. */
+export declare function _deleteUploadedPluginBlob(sha256: string): Promise<void>;
+/**
+ * Resolve an `idb-plugin:<sha256>` URL to a session-scoped `blob:` URL
+ * suitable for dynamic `import()`. Returns `null` when the sha256 isn't
+ * found — the loader treats that as a missing-bundle error.
+ */
+export declare function _resolveIdbPluginUrl(idbUrl: string): Promise<string | null>;
+/**
+ * Composable surface — read-only for components. Components write via
+ * `<APluginsTabInstalled>`'s upload handler which calls
+ * `_putUploadedPluginBlob` directly.
+ */
+export declare function useUploadedPluginStore(): {
+    get: typeof _getUploadedPluginBlob;
+    delete: typeof _deleteUploadedPluginBlob;
+    resolveUrl: typeof _resolveIdbPluginUrl;
+};
+export {};

package/dist/runtime/composables/useUploadedPluginStore.js

@@ -0,0 +1,66 @@
+const DB_NAME = "abracadabra_uploaded_plugins";
+const STORE_NAME = "bundles";
+const DB_VERSION = 1;
+let _dbPromise = null;
+function getDb() {
+  if (_dbPromise) return _dbPromise;
+  _dbPromise = new Promise((resolve, reject) => {
+    const req = indexedDB.open(DB_NAME, DB_VERSION);
+    req.onupgradeneeded = () => {
+      const db = req.result;
+      if (!db.objectStoreNames.contains(STORE_NAME)) {
+        db.createObjectStore(STORE_NAME, { keyPath: "sha256" });
+      }
+    };
+    req.onsuccess = () => resolve(req.result);
+    req.onerror = () => reject(req.error);
+  });
+  return _dbPromise;
+}
+export async function _putUploadedPluginBlob(sha256, bytes, mime = "text/javascript") {
+  const db = await getDb();
+  await new Promise((resolve, reject) => {
+    const tx = db.transaction(STORE_NAME, "readwrite");
+    const store = tx.objectStore(STORE_NAME);
+    const record = { sha256, bytes, mime, uploadedAt: Date.now() };
+    const req = store.put(record);
+    req.onsuccess = () => resolve();
+    req.onerror = () => reject(req.error);
+  });
+}
+export async function _getUploadedPluginBlob(sha256) {
+  const db = await getDb();
+  return new Promise((resolve, reject) => {
+    const tx = db.transaction(STORE_NAME, "readonly");
+    const store = tx.objectStore(STORE_NAME);
+    const req = store.get(sha256);
+    req.onsuccess = () => resolve(req.result ?? null);
+    req.onerror = () => reject(req.error);
+  });
+}
+export async function _deleteUploadedPluginBlob(sha256) {
+  const db = await getDb();
+  await new Promise((resolve, reject) => {
+    const tx = db.transaction(STORE_NAME, "readwrite");
+    const store = tx.objectStore(STORE_NAME);
+    const req = store.delete(sha256);
+    req.onsuccess = () => resolve();
+    req.onerror = () => reject(req.error);
+  });
+}
+export async function _resolveIdbPluginUrl(idbUrl) {
+  const prefix = "idb-plugin:";
+  if (!idbUrl.startsWith(prefix)) return null;
+  const sha = idbUrl.slice(prefix.length);
+  const record = await _getUploadedPluginBlob(sha);
+  if (!record) return null;
+  const blob = new Blob([new Uint8Array(record.bytes)], { type: record.mime });
+  return URL.createObjectURL(blob);
+}
+export function useUploadedPluginStore() {
+  return {
+    get: _getUploadedPluginBlob,
+    delete: _deleteUploadedPluginBlob,
+    resolveUrl: _resolveIdbPluginUrl
+  };
+}

package/dist/runtime/plugin-abracadabra.client.js

@@ -220,11 +220,58 @@ export default defineNuxtPlugin({
     const storedExternal = JSON.parse(
       localStorage.getItem(STORAGE_KEY_EXTERNAL_PLUGINS) ?? "[]"
     );
+    const [
+      { _resolveIdbPluginUrl },
+      { _enqueueLoadTimePending, _clearLoadTimePending }
+    ] = await Promise.all([
+      import("./composables/useUploadedPluginStore.js"),
+      import("./composables/useLoadTimePending.js")
+    ]);
+    async function refetchManifest(url) {
+      try {
+        const manifestUrl = url.replace(/\/[^/]+$/, (m2) => `${m2.replace(/\.[^.]+$/, "")}.manifest.json`);
+        const res = await fetch(manifestUrl, { cache: "no-store" });
+        if (!res.ok) return null;
+        const m = await res.json();
+        if (typeof m.version !== "string") return null;
+        return { version: m.version, required: m.capabilities?.required ?? [] };
+      } catch {
+        return null;
+      }
+    }
     for (const entry of storedExternal.filter((p) => p.enabled)) {
       try {
+        const origin = entry.origin ?? "url";
+        if (origin !== "registry" && origin !== "upload" && !entry.url.startsWith("idb-plugin:")) {
+          const observed = await refetchManifest(entry.url);
+          if (observed) {
+            const acked = new Set(entry.acknowledgedCapabilities ?? []);
+            const grew = observed.required.filter((c) => !acked.has(c));
+            const versionChanged = entry.acknowledgedVersion !== observed.version;
+            const neverAcked = !entry.trustAcknowledgedAt;
+            if (neverAcked || versionChanged || grew.length > 0) {
+              _enqueueLoadTimePending({
+                url: entry.url,
+                id: entry.id ?? entry.name ?? entry.url,
+                observedVersion: observed.version,
+                observedRequired: observed.required,
+                reason: neverAcked ? "never-acknowledged" : grew.length > 0 ? "capabilities-grew" : "version-changed",
+                queuedAt: Date.now()
+              });
+              continue;
+            }
+            _clearLoadTimePending(entry.url);
+          }
+        }
+        let importUrl = entry.url;
+        if (importUrl.startsWith("idb-plugin:")) {
+          const resolved = await _resolveIdbPluginUrl(importUrl);
+          if (!resolved) throw new Error("Uploaded plugin bundle missing from storage \u2014 was it cleared?");
+          importUrl = resolved;
+        }
         const mod = await import(
           /* @vite-ignore */
-          entry.url
+          importUrl
         );
         const plugin = mod.default ?? mod;
         if (plugin?.name) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abraca/nuxt",
-  "version": "2.15.0",
+  "version": "2.16.0",
   "description": "First-class Nuxt module for the Abracadabra CRDT collaboration platform",
   "repository": "abracadabra/abracadabra-nuxt",
   "license": "MIT",