@noy-db/in-nuxt 0.2.0-pre.3 → 0.2.0-pre.31

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/module.ts
-import { defineNuxtModule, addImports, addPlugin, addServerHandler, createResolver } from "@nuxt/kit";
+import { defineNuxtModule, addImports, addPlugin, addServerHandler, createResolver, extendPages } from "@nuxt/kit";
 var module_default = defineNuxtModule({
   meta: {
     name: "@noy-db/in-nuxt",
@@ -48,6 +48,24 @@ var module_default = defineNuxtModule({
         handler: resolver.resolve("./runtime/rest")
       });
     }
+    if (nuxt.options.dev && options.devtools !== false) {
+      const panelFile = resolver.resolve("./runtime/devtools/DevtoolsPanel.vue");
+      extendPages((pages) => {
+        pages.push({
+          name: "noydb-devtools",
+          path: "/_noydb-devtools",
+          file: panelFile
+        });
+      });
+      nuxt.hook("devtools:customTabs", (tabs) => {
+        tabs.push({
+          name: "noy-db",
+          title: "noy-db",
+          icon: "i-carbon-data-base",
+          view: { type: "iframe", src: "/_noydb-devtools" }
+        });
+      });
+    }
   }
 });
 

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/module.ts","../src/index.ts"],"sourcesContent":["/**\n * Nuxt 4 module for noy-db.\n *\n * Built with `@nuxt/kit`'s `defineNuxtModule`. Targets Nuxt 4+ exclusively\n * (no Nuxt 3 compatibility shim — Nuxt 3 users should consume `@noy-db/vue`\n * and `@noy-db/pinia` directly with a hand-written plugin).\n *\n * Module responsibilities:\n *\n *   1. Auto-import the @noy-db/in-vue composables (`useNoydb`, `useCollection`,\n *      `useSync`) and, when `pinia: true` (default), the @noy-db/in-pinia\n *      helpers (`defineNoydbStore`, `createNoydbPiniaPlugin`, `setActiveNoydb`).\n *\n *   2. Expose the user's `noydb:` config through `runtimeConfig.public.noydb`\n *      so the runtime plugin and downstream composables can read it\n *      without re-parsing nuxt.config.ts.\n *\n *   3. Register a CLIENT-ONLY runtime plugin (`runtime/plugin.client.ts`)\n *      that sets up the noydb context. The server bundle is never touched —\n *      this is the load-bearing SSR-safety property.\n *\n * Deferred to follow-up issues:\n *   - Devtools tab via @nuxt/devtools-kit\n *   - Optional Nitro server proxy (`/api/_noydb/...`)\n *   - Optional Nitro scheduled backup task\n *   - `nuxi noydb` CLI extension\n *   - Eager Noydb instantiation (requires the user's passphrase callback,\n *     which can't be serialized through runtime config — better to let\n *     users call setActiveNoydb from their own setup file)\n */\n\nimport { defineNuxtModule, addImports, addPlugin, addServerHandler, createResolver } from '@nuxt/kit'\n\n/**\n * Configuration shape for the `noydb:` key in `nuxt.config.ts`.\n *\n * Every field is optional. The defaults give a reasonable bootstrap for\n * a typical Vue/Nuxt app — Pinia helpers auto-imported, `to-browser-idb`\n * as the default store. Users override by passing the relevant fields.\n */\nexport interface ModuleOptions {\n  /**\n   * Which built-in store package to prefer. The runtime plugin reads this\n   * and picks the matching store. Defaults to `'to-browser-idb'` because\n   * Nuxt apps run in the browser at runtime.\n   *\n   * Note: this is just a HINT. Users can always construct their own\n   * store and pass it to `createNoydb()` directly — this option exists\n   * to keep simple cases simple.\n   */\n  store?: 'to-browser-idb' | 'to-browser-local' | 'to-memory' | 'to-file' | 'to-aws-dynamo' | 'to-aws-s3'\n\n  /**\n   * Auto-import the @noy-db/pinia helpers (`defineNoydbStore`,\n   * `createNoydbPiniaPlugin`, `setActiveNoydb`). Defaults to `true`\n   * because Pinia is the recommended state layer for.\n   *\n   * Set to `false` if you only want the bare @noy-db/vue composables\n   * (saves ~3 KB from the auto-import metadata).\n   */\n  pinia?: boolean\n\n  /**\n   * Optional sync configuration. Currently a passthrough — the runtime\n   * plugin reads it from `runtimeConfig.public.noydb.sync` and the user\n   * is responsible for wiring it into their `createNoydb()` call.\n   */\n  sync?: {\n    store?: 'to-aws-dynamo' | 'to-aws-s3'\n    table?: string\n    region?: string\n    bucket?: string\n    mode?: 'auto' | 'manual' | 'off'\n  }\n\n  /**\n   * Optional auth configuration metadata. Same passthrough pattern as\n   * `sync`. The user provides the actual passphrase / biometric callback\n   * in their own setup file.\n   */\n  auth?: {\n    mode?: 'passphrase' | 'biometric' | 'session'\n    sessionTimeout?: string\n  }\n\n  /**\n   * Whether to enable the (planned) devtools tab in `nuxi dev`. Currently\n   * a passthrough — the devtools tab itself ships in a follow-up.\n   */\n  devtools?: boolean\n\n  /**\n   * Optional REST API integration. When `enabled: true`, mounts a catch-all\n   * Nitro server handler at `basePath/**` using `@noy-db/in-rest`.\n   *\n   * The handler is scaffold-level: it reads `event.context.noydbStore` which\n   * a separate Nitro plugin must populate. spec follow-up for the store\n   * wiring. The module simply registers the route here.\n   */\n  rest?: {\n    /** Enable the REST API server handler. Default: false. */\n    enabled?: boolean\n    /** Base path for all REST routes. Default: '/api/noydb'. */\n    basePath?: string\n    /** User ID forwarded to createRestHandler. */\n    user?: string\n    /** Session TTL in seconds. Default: 900. */\n    ttlSeconds?: number\n  }\n}\n\n/**\n * The exported Nuxt module factory.\n *\n * Test-friendly: `defineNuxtModule` returns a NuxtModule object whose\n * `.meta`, `.getOptions`, and `.setup` fields can be inspected without a\n * full Nuxt build. Unit tests use those introspection points instead of\n * spinning up `@nuxt/test-utils`.\n */\nexport default defineNuxtModule<ModuleOptions>({\n  meta: {\n    name: '@noy-db/in-nuxt',\n    configKey: 'noydb',\n    compatibility: {\n      // Nuxt 4 only — see the module-level docstring for the rationale.\n      nuxt: '^4.0.0',\n    },\n  },\n\n  defaults: {\n    store: 'to-browser-idb',\n    pinia: true,\n    devtools: true,\n  },\n\n  setup(options, nuxt) {\n    const resolver = createResolver(import.meta.url)\n\n    // ─── 1. Expose the user's options to runtime via runtimeConfig ───\n    //\n    // We stash the typed options under `runtimeConfig.public.noydb` so\n    // the client plugin (and any downstream composable) can read them\n    // without re-parsing nuxt.config.ts. `public` is required so the\n    // values reach the browser bundle — but EVERY field is metadata\n    // (store name, table name, etc.), NEVER a secret. Passphrases\n    // and tokens are still provided at runtime via user callbacks.\n    nuxt.options.runtimeConfig.public.noydb = {\n      // The cast is necessary because Nuxt's runtimeConfig type is\n      // structurally `Record<string, any>` — modules are expected to\n      // own their own typing via module augmentation (which we do\n      // below).\n      ...(nuxt.options.runtimeConfig.public.noydb ?? {}),\n      ...options,\n    }\n\n    // ─── 2. Auto-imports for @noy-db/vue composables ────────────────\n    //\n    // These are the composables shipped by @noy-db/vue. Importing\n    // them automatically removes one line of boilerplate per component.\n    addImports([\n      { name: 'useNoydb', from: '@noy-db/in-vue' },\n      { name: 'useCollection', from: '@noy-db/in-vue' },\n      { name: 'useSync', from: '@noy-db/in-vue' },\n    ])\n\n    // ─── 3. Auto-imports for @noy-db/pinia (opt-out) ────────────────\n    //\n    // Most users want the Pinia helpers — `defineNoydbStore` is the\n    // headline API. We default to enabling them and let users\n    // opt out via `pinia: false` if they're not using Pinia at all.\n    if (options.pinia !== false) {\n      addImports([\n        { name: 'defineNoydbStore', from: '@noy-db/in-pinia' },\n        { name: 'createNoydbPiniaPlugin', from: '@noy-db/in-pinia' },\n        { name: 'setActiveNoydb', from: '@noy-db/in-pinia' },\n        { name: 'getActiveNoydb', from: '@noy-db/in-pinia' },\n      ])\n    }\n\n    // ─── 4. Register the client-only runtime plugin ─────────────────\n    //\n    // mode: 'client' is the LOAD-BEARING SSR-safety guarantee. Nuxt\n    // skips this plugin entirely on the server, so the server bundle\n    // never imports any code that touches `crypto.subtle`. The CI\n    // bundle assertion (planned for a follow-up) verifies this by\n    // grepping the built nitro output for forbidden symbols.\n    //\n    // The path resolves to the COMPILED runtime file in `dist/runtime/`.\n    // tsup builds this as a separate entry alongside the module index.\n    addPlugin({\n      src: resolver.resolve('./runtime/plugin.client.js'),\n      mode: 'client',\n    })\n\n    // ─── 5. REST API server handler (opt-in) ────────────────────────\n    //\n    // When `rest.enabled: true`, mount a catch-all Nitro server handler\n    // at `basePath/**`. The handler delegates to `@noy-db/in-rest` via\n    // the nitroAdapter. Store wiring (populating event.context.noydbStore)\n    // is a follow-up concern tracked in #273.\n    if (options.rest?.enabled) {\n      const basePath = options.rest.basePath ?? '/api/noydb'\n      addServerHandler({\n        route: `${basePath}/**`,\n        handler: resolver.resolve('./runtime/rest'),\n      })\n    }\n  },\n})\n\n/**\n * Module augmentation so the `noydb:` config key in `nuxt.config.ts`\n * is fully typed and autocompleted in the IDE.\n *\n * The augmentation is a side-effect of importing the module — once a\n * project adds `'@noy-db/in-nuxt'` to its `modules` array, TypeScript picks\n * up the typed `noydb` option without requiring an explicit import.\n */\ndeclare module '@nuxt/schema' {\n  interface NuxtConfig {\n    noydb?: ModuleOptions\n  }\n  interface NuxtOptions {\n    noydb?: ModuleOptions\n  }\n  interface PublicRuntimeConfig {\n    noydb?: ModuleOptions\n  }\n}\n","/**\n * @noy-db/nuxt — Nuxt 4 module for noy-db.\n *\n * Public API:\n *   - default export: the Nuxt module factory\n *   - `ModuleOptions` type: shape of the `noydb:` key in `nuxt.config.ts`\n *\n * The module auto-imports the @noy-db/vue and (optionally) @noy-db/pinia\n * composables, exposes the user's options through Nuxt's runtime config,\n * and registers a CLIENT-ONLY runtime plugin so the SSR bundle never\n * touches `crypto.subtle`. Eager Noydb instantiation is intentionally\n * left to user code — see the README \"Bootstrap\" section.\n */\n\nimport noydbModule, { type ModuleOptions } from './module.js'\n\nexport default noydbModule\nexport type { ModuleOptions }\n"],"mappings":";AA+BA,SAAS,kBAAkB,YAAY,WAAW,kBAAkB,sBAAsB;AAwF1F,IAAO,iBAAQ,iBAAgC;AAAA,EAC7C,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,WAAW;AAAA,IACX,eAAe;AAAA;AAAA,MAEb,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AAAA,EAEA,MAAM,SAAS,MAAM;AACnB,UAAM,WAAW,eAAe,YAAY,GAAG;AAU/C,SAAK,QAAQ,cAAc,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,MAKxC,GAAI,KAAK,QAAQ,cAAc,OAAO,SAAS,CAAC;AAAA,MAChD,GAAG;AAAA,IACL;AAMA,eAAW;AAAA,MACT,EAAE,MAAM,YAAY,MAAM,iBAAiB;AAAA,MAC3C,EAAE,MAAM,iBAAiB,MAAM,iBAAiB;AAAA,MAChD,EAAE,MAAM,WAAW,MAAM,iBAAiB;AAAA,IAC5C,CAAC;AAOD,QAAI,QAAQ,UAAU,OAAO;AAC3B,iBAAW;AAAA,QACT,EAAE,MAAM,oBAAoB,MAAM,mBAAmB;AAAA,QACrD,EAAE,MAAM,0BAA0B,MAAM,mBAAmB;AAAA,QAC3D,EAAE,MAAM,kBAAkB,MAAM,mBAAmB;AAAA,QACnD,EAAE,MAAM,kBAAkB,MAAM,mBAAmB;AAAA,MACrD,CAAC;AAAA,IACH;AAYA,cAAU;AAAA,MACR,KAAK,SAAS,QAAQ,4BAA4B;AAAA,MAClD,MAAM;AAAA,IACR,CAAC;AAQD,QAAI,QAAQ,MAAM,SAAS;AACzB,YAAM,WAAW,QAAQ,KAAK,YAAY;AAC1C,uBAAiB;AAAA,QACf,OAAO,GAAG,QAAQ;AAAA,QAClB,SAAS,SAAS,QAAQ,gBAAgB;AAAA,MAC5C,CAAC;AAAA,IACH;AAAA,EACF;AACF,CAAC;;;AChMD,IAAO,gBAAQ;","names":[]}
+{"version":3,"sources":["../src/module.ts","../src/index.ts"],"sourcesContent":["/**\n * Nuxt 4 module for noy-db.\n *\n * Built with `@nuxt/kit`'s `defineNuxtModule`. Targets Nuxt 4+ exclusively\n * (no Nuxt 3 compatibility shim — Nuxt 3 users should consume `@noy-db/vue`\n * and `@noy-db/pinia` directly with a hand-written plugin).\n *\n * Module responsibilities:\n *\n *   1. Auto-import the @noy-db/in-vue composables (`useNoydb`, `useCollection`,\n *      `useSync`) and, when `pinia: true` (default), the @noy-db/in-pinia\n *      helpers (`defineNoydbStore`, `createNoydbPiniaPlugin`, `setActiveNoydb`).\n *\n *   2. Expose the user's `noydb:` config through `runtimeConfig.public.noydb`\n *      so the runtime plugin and downstream composables can read it\n *      without re-parsing nuxt.config.ts.\n *\n *   3. Register a CLIENT-ONLY runtime plugin (`runtime/plugin.client.ts`)\n *      that sets up the noydb context. The server bundle is never touched —\n *      this is the load-bearing SSR-safety property.\n *\n * Deferred to follow-up issues:\n *   - Devtools tab via @nuxt/devtools-kit\n *   - Optional Nitro server proxy (`/api/_noydb/...`)\n *   - Optional Nitro scheduled backup task\n *   - `nuxi noydb` CLI extension\n *   - Eager Noydb instantiation (requires the user's passphrase callback,\n *     which can't be serialized through runtime config — better to let\n *     users call setActiveNoydb from their own setup file)\n */\n\nimport { defineNuxtModule, addImports, addPlugin, addServerHandler, createResolver, extendPages } from '@nuxt/kit'\n\n/**\n * Configuration shape for the `noydb:` key in `nuxt.config.ts`.\n *\n * Every field is optional. The defaults give a reasonable bootstrap for\n * a typical Vue/Nuxt app — Pinia helpers auto-imported, `to-browser-idb`\n * as the default store. Users override by passing the relevant fields.\n */\nexport interface ModuleOptions {\n  /**\n   * Which built-in store package to prefer. The runtime plugin reads this\n   * and picks the matching store. Defaults to `'to-browser-idb'` because\n   * Nuxt apps run in the browser at runtime.\n   *\n   * Note: this is just a HINT. Users can always construct their own\n   * store and pass it to `createNoydb()` directly — this option exists\n   * to keep simple cases simple.\n   */\n  store?: 'to-browser-idb' | 'to-browser-local' | 'to-memory' | 'to-file' | 'to-aws-dynamo' | 'to-aws-s3'\n\n  /**\n   * Auto-import the @noy-db/pinia helpers (`defineNoydbStore`,\n   * `createNoydbPiniaPlugin`, `setActiveNoydb`). Defaults to `true`\n   * because Pinia is the recommended state layer for.\n   *\n   * Set to `false` if you only want the bare @noy-db/vue composables\n   * (saves ~3 KB from the auto-import metadata).\n   */\n  pinia?: boolean\n\n  /**\n   * Optional sync configuration. Currently a passthrough — the runtime\n   * plugin reads it from `runtimeConfig.public.noydb.sync` and the user\n   * is responsible for wiring it into their `createNoydb()` call.\n   */\n  sync?: {\n    store?: 'to-aws-dynamo' | 'to-aws-s3'\n    table?: string\n    region?: string\n    bucket?: string\n    mode?: 'auto' | 'manual' | 'off'\n  }\n\n  /**\n   * Optional auth configuration metadata. Same passthrough pattern as\n   * `sync`. The user provides the actual passphrase / biometric callback\n   * in their own setup file.\n   */\n  auth?: {\n    mode?: 'passphrase' | 'biometric' | 'session'\n    sessionTimeout?: string\n  }\n\n  /**\n   * Whether to enable the (planned) devtools tab in `nuxi dev`. Currently\n   * a passthrough — the devtools tab itself ships in a follow-up.\n   */\n  devtools?: boolean\n\n  /**\n   * Optional REST API integration. When `enabled: true`, mounts a catch-all\n   * Nitro server handler at `basePath/**` using `@noy-db/in-rest`.\n   *\n   * The handler is scaffold-level: it reads `event.context.noydbStore` which\n   * a separate Nitro plugin must populate. spec follow-up for the store\n   * wiring. The module simply registers the route here.\n   */\n  rest?: {\n    /** Enable the REST API server handler. Default: false. */\n    enabled?: boolean\n    /** Base path for all REST routes. Default: '/api/noydb'. */\n    basePath?: string\n    /** User ID forwarded to createRestHandler. */\n    user?: string\n    /** Session TTL in seconds. Default: 900. */\n    ttlSeconds?: number\n  }\n}\n\n/**\n * The exported Nuxt module factory.\n *\n * Test-friendly: `defineNuxtModule` returns a NuxtModule object whose\n * `.meta`, `.getOptions`, and `.setup` fields can be inspected without a\n * full Nuxt build. Unit tests use those introspection points instead of\n * spinning up `@nuxt/test-utils`.\n */\nexport default defineNuxtModule<ModuleOptions>({\n  meta: {\n    name: '@noy-db/in-nuxt',\n    configKey: 'noydb',\n    compatibility: {\n      // Nuxt 4 only — see the module-level docstring for the rationale.\n      nuxt: '^4.0.0',\n    },\n  },\n\n  defaults: {\n    store: 'to-browser-idb',\n    pinia: true,\n    devtools: true,\n  },\n\n  setup(options, nuxt) {\n    const resolver = createResolver(import.meta.url)\n\n    // ─── 1. Expose the user's options to runtime via runtimeConfig ───\n    //\n    // We stash the typed options under `runtimeConfig.public.noydb` so\n    // the client plugin (and any downstream composable) can read them\n    // without re-parsing nuxt.config.ts. `public` is required so the\n    // values reach the browser bundle — but EVERY field is metadata\n    // (store name, table name, etc.), NEVER a secret. Passphrases\n    // and tokens are still provided at runtime via user callbacks.\n    nuxt.options.runtimeConfig.public.noydb = {\n      // The cast is necessary because Nuxt's runtimeConfig type is\n      // structurally `Record<string, any>` — modules are expected to\n      // own their own typing via module augmentation (which we do\n      // below).\n      ...(nuxt.options.runtimeConfig.public.noydb ?? {}),\n      ...options,\n    }\n\n    // ─── 2. Auto-imports for @noy-db/vue composables ────────────────\n    //\n    // These are the composables shipped by @noy-db/vue. Importing\n    // them automatically removes one line of boilerplate per component.\n    addImports([\n      { name: 'useNoydb', from: '@noy-db/in-vue' },\n      { name: 'useCollection', from: '@noy-db/in-vue' },\n      { name: 'useSync', from: '@noy-db/in-vue' },\n    ])\n\n    // ─── 3. Auto-imports for @noy-db/pinia (opt-out) ────────────────\n    //\n    // Most users want the Pinia helpers — `defineNoydbStore` is the\n    // headline API. We default to enabling them and let users\n    // opt out via `pinia: false` if they're not using Pinia at all.\n    if (options.pinia !== false) {\n      addImports([\n        { name: 'defineNoydbStore', from: '@noy-db/in-pinia' },\n        { name: 'createNoydbPiniaPlugin', from: '@noy-db/in-pinia' },\n        { name: 'setActiveNoydb', from: '@noy-db/in-pinia' },\n        { name: 'getActiveNoydb', from: '@noy-db/in-pinia' },\n      ])\n    }\n\n    // ─── 4. Register the client-only runtime plugin ─────────────────\n    //\n    // mode: 'client' is the LOAD-BEARING SSR-safety guarantee. Nuxt\n    // skips this plugin entirely on the server, so the server bundle\n    // never imports any code that touches `crypto.subtle`. The CI\n    // bundle assertion (planned for a follow-up) verifies this by\n    // grepping the built nitro output for forbidden symbols.\n    //\n    // The path resolves to the COMPILED runtime file in `dist/runtime/`.\n    // tsup builds this as a separate entry alongside the module index.\n    addPlugin({\n      src: resolver.resolve('./runtime/plugin.client.js'),\n      mode: 'client',\n    })\n\n    // ─── 5. REST API server handler (opt-in) ────────────────────────\n    //\n    // When `rest.enabled: true`, mount a catch-all Nitro server handler\n    // at `basePath/**`. The handler delegates to `@noy-db/in-rest` via\n    // the nitroAdapter. Store wiring (populating event.context.noydbStore)\n    // is a follow-up concern tracked separately.\n    if (options.rest?.enabled) {\n      const basePath = options.rest.basePath ?? '/api/noydb'\n      addServerHandler({\n        route: `${basePath}/**`,\n        handler: resolver.resolve('./runtime/rest'),\n      })\n    }\n\n    // ─── 6. DevTools tab (dev mode only) ────────────────────────\n    //\n    // Registers a virtual Nuxt page at /_noydb-devtools and exposes it\n    // as a tab in the Nuxt DevTools overlay. The page runs inside the\n    // user's full Vue app context — no iframe bridge, direct access to\n    // getActiveNoydb() and the inspector facade.\n    //\n    // Guarded on nuxt.options.dev: never ships to production builds.\n    // Users can opt out with `noydb: { devtools: false }`.\n    if (nuxt.options.dev && options.devtools !== false) {\n      const panelFile = resolver.resolve('./runtime/devtools/DevtoolsPanel.vue')\n\n      extendPages((pages) => {\n        pages.push({\n          name: 'noydb-devtools',\n          path: '/_noydb-devtools',\n          file: panelFile,\n        })\n      })\n\n      // `devtools:customTabs` is not in Nuxt's static HookKeys type but IS\n      // dispatched at runtime by @nuxt/devtools. Cast to bypass the type\n      // guard while keeping the hook strictly dev-only.\n      ;(nuxt as unknown as { hook(event: string, fn: (tabs: unknown[]) => void): void })\n        .hook('devtools:customTabs', (tabs: unknown[]) => {\n          tabs.push({\n            name: 'noy-db',\n            title: 'noy-db',\n            icon: 'i-carbon-data-base',\n            view: { type: 'iframe', src: '/_noydb-devtools' },\n          })\n        })\n    }\n  },\n})\n\n/**\n * Module augmentation so the `noydb:` config key in `nuxt.config.ts`\n * is fully typed and autocompleted in the IDE.\n *\n * The augmentation is a side-effect of importing the module — once a\n * project adds `'@noy-db/in-nuxt'` to its `modules` array, TypeScript picks\n * up the typed `noydb` option without requiring an explicit import.\n */\ndeclare module '@nuxt/schema' {\n  interface NuxtConfig {\n    noydb?: ModuleOptions\n  }\n  interface NuxtOptions {\n    noydb?: ModuleOptions\n  }\n  interface PublicRuntimeConfig {\n    noydb?: ModuleOptions\n  }\n}\n","/**\n * @noy-db/nuxt — Nuxt 4 module for noy-db.\n *\n * Public API:\n *   - default export: the Nuxt module factory\n *   - `ModuleOptions` type: shape of the `noydb:` key in `nuxt.config.ts`\n *\n * The module auto-imports the @noy-db/vue and (optionally) @noy-db/pinia\n * composables, exposes the user's options through Nuxt's runtime config,\n * and registers a CLIENT-ONLY runtime plugin so the SSR bundle never\n * touches `crypto.subtle`. Eager Noydb instantiation is intentionally\n * left to user code — see the README \"Bootstrap\" section.\n */\n\nimport noydbModule, { type ModuleOptions } from './module.js'\n\nexport default noydbModule\nexport type { ModuleOptions }\n"],"mappings":";AA+BA,SAAS,kBAAkB,YAAY,WAAW,kBAAkB,gBAAgB,mBAAmB;AAwFvG,IAAO,iBAAQ,iBAAgC;AAAA,EAC7C,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,WAAW;AAAA,IACX,eAAe;AAAA;AAAA,MAEb,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AAAA,EAEA,MAAM,SAAS,MAAM;AACnB,UAAM,WAAW,eAAe,YAAY,GAAG;AAU/C,SAAK,QAAQ,cAAc,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,MAKxC,GAAI,KAAK,QAAQ,cAAc,OAAO,SAAS,CAAC;AAAA,MAChD,GAAG;AAAA,IACL;AAMA,eAAW;AAAA,MACT,EAAE,MAAM,YAAY,MAAM,iBAAiB;AAAA,MAC3C,EAAE,MAAM,iBAAiB,MAAM,iBAAiB;AAAA,MAChD,EAAE,MAAM,WAAW,MAAM,iBAAiB;AAAA,IAC5C,CAAC;AAOD,QAAI,QAAQ,UAAU,OAAO;AAC3B,iBAAW;AAAA,QACT,EAAE,MAAM,oBAAoB,MAAM,mBAAmB;AAAA,QACrD,EAAE,MAAM,0BAA0B,MAAM,mBAAmB;AAAA,QAC3D,EAAE,MAAM,kBAAkB,MAAM,mBAAmB;AAAA,QACnD,EAAE,MAAM,kBAAkB,MAAM,mBAAmB;AAAA,MACrD,CAAC;AAAA,IACH;AAYA,cAAU;AAAA,MACR,KAAK,SAAS,QAAQ,4BAA4B;AAAA,MAClD,MAAM;AAAA,IACR,CAAC;AAQD,QAAI,QAAQ,MAAM,SAAS;AACzB,YAAM,WAAW,QAAQ,KAAK,YAAY;AAC1C,uBAAiB;AAAA,QACf,OAAO,GAAG,QAAQ;AAAA,QAClB,SAAS,SAAS,QAAQ,gBAAgB;AAAA,MAC5C,CAAC;AAAA,IACH;AAWA,QAAI,KAAK,QAAQ,OAAO,QAAQ,aAAa,OAAO;AAClD,YAAM,YAAY,SAAS,QAAQ,sCAAsC;AAEzE,kBAAY,CAAC,UAAU;AACrB,cAAM,KAAK;AAAA,UACT,MAAM;AAAA,UACN,MAAM;AAAA,UACN,MAAM;AAAA,QACR,CAAC;AAAA,MACH,CAAC;AAKA,MAAC,KACC,KAAK,uBAAuB,CAAC,SAAoB;AAChD,aAAK,KAAK;AAAA,UACR,MAAM;AAAA,UACN,OAAO;AAAA,UACP,MAAM;AAAA,UACN,MAAM,EAAE,MAAM,UAAU,KAAK,mBAAmB;AAAA,QAClD,CAAC;AAAA,MACH,CAAC;AAAA,IACL;AAAA,EACF;AACF,CAAC;;;AClOD,IAAO,gBAAQ;","names":[]}

package/dist/runtime/devtools/DevtoolsPanel.vue

@@ -0,0 +1,235 @@
+<template>
+  <div class="noydb-panel">
+    <!-- no db bound -->
+    <div v-if="!db" class="noydb-panel__empty">
+      <p>No active noy-db instance.</p>
+      <code>Call setActiveNoydb(db) in your plugin.</code>
+    </div>
+    <!-- db bound but no vault open -->
+    <div v-else-if="initialized && !vaultInfo" class="noydb-panel__empty">
+      <p>No open vaults — unlock a vault in your app first.</p>
+    </div>
+    <!-- loading -->
+    <div v-else-if="!initialized" class="noydb-panel__empty">
+      <p>Loading…</p>
+    </div>
+    <!-- main panel -->
+    <template v-else>
+      <!-- top nav -->
+      <nav class="noydb-nav">
+        <span class="noydb-nav__logo">noy-db</span>
+        <button
+          :class="['noydb-nav__tab', { 'noydb-nav__tab--active': topTab === 'structure' }]"
+          @click="topTab = 'structure'"
+        >Structure</button>
+        <button
+          :class="['noydb-nav__tab', { 'noydb-nav__tab--active': topTab === 'monitor' }]"
+          @click="activateMonitor"
+        >Monitor</button>
+        <span class="noydb-nav__spacer" />
+        <span class="noydb-nav__status">
+          <span class="noydb-nav__dot" />{{ vaultInfo!.id }}
+        </span>
+      </nav>
+
+      <!-- structure tab -->
+      <div v-if="topTab === 'structure'" class="noydb-panel__body">
+        <VaultSidebar
+          :vault-name="vaultInfo!.id"
+          :vault-meta="snapshotMeta"
+          :collections="collections"
+          :selected-name="selectedCollection?.name ?? null"
+          @select="selectCollection"
+        />
+        <div class="noydb-panel__detail">
+          <div v-if="snapshotError" class="noydb-panel__error">{{ snapshotError }}</div>
+          <template v-else-if="selectedCollection">
+            <div class="noydb-detail-tabs">
+              <button
+                :class="['noydb-detail-tab', { 'noydb-detail-tab--active': detailTab === 'schema' }]"
+                @click="detailTab = 'schema'"
+              >Schema</button>
+              <button
+                :class="['noydb-detail-tab', { 'noydb-detail-tab--active': detailTab === 'records' }]"
+                @click="detailTab = 'records'"
+              >Records</button>
+            </div>
+            <SchemaPane v-if="detailTab === 'schema'" :collection="selectedCollection" />
+            <RecordsPane
+              v-else
+              :collection="selectedCollection"
+              :page="recordsPage"
+              :error="recordsError"
+              @prev="prevPage"
+              @next="nextPage"
+            />
+          </template>
+          <div v-else class="noydb-panel__empty">Select a collection</div>
+        </div>
+      </div>
+
+      <!-- monitor tab -->
+      <WriteMonitor v-else :rows="feed" :meter="meter" />
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
+import { getActiveNoydb } from '@noy-db/in-pinia'
+import { createInspector } from '@noy-db/in-devtools'
+import type { Inspector, InspectorCollection, VaultInfo, RecordPage } from '@noy-db/in-devtools'
+import type { Vault, VaultMeta } from '@noy-db/hub'
+import type { MeterSnapshot } from '@noy-db/to-meter'
+import VaultSidebar from './panes/VaultSidebar.vue'
+import SchemaPane from './panes/SchemaPane.vue'
+import RecordsPane from './panes/RecordsPane.vue'
+import WriteMonitor from './panes/WriteMonitor.vue'
+import type { FeedRow } from './panes/WriteMonitor.vue'
+
+const PAGE = 20
+const BUFFER = 200
+
+// ── Inspector setup ─────────────────────────────────────────────
+const db = ref(getActiveNoydb())
+const inspector = computed<Inspector | null>(() =>
+  db.value ? createInspector(db.value) : null
+)
+
+// ── Vault / snapshot state ───────────────────────────────────────
+const initialized = ref(false)
+const vaults = ref<ReadonlyArray<VaultInfo>>([])
+const vaultInfo = computed(() => vaults.value[0] ?? null)
+const openVault = ref<Vault | null>(null)
+const collections = ref<ReadonlyArray<InspectorCollection>>([])
+const snapshotMeta = ref<VaultMeta | null>(null)
+const snapshotError = ref<string | undefined>(undefined)
+const selectedCollection = ref<InspectorCollection | null>(null)
+
+// ── Detail tab state ─────────────────────────────────────────────
+const topTab = ref<'structure' | 'monitor'>('structure')
+const detailTab = ref<'schema' | 'records'>('schema')
+const recordsOffset = ref(0)
+const recordsPage = ref<RecordPage | null>(null)
+const recordsError = ref<string | undefined>(undefined)
+
+// ── Monitor state ────────────────────────────────────────────────
+const feed = ref<ReadonlyArray<FeedRow>>([])
+const meter = ref<MeterSnapshot | null>(null)
+const conflictKeys = new Set<string>()
+let offWrite: (() => void) | null = null
+let offConflict: (() => void) | null = null
+let meterInterval: ReturnType<typeof setInterval> | null = null
+let monitorStarted = false
+
+// ── Lifecycle ────────────────────────────────────────────────────
+onMounted(async () => {
+  if (!inspector.value || !db.value) { initialized.value = true; return }
+  try {
+    vaults.value = await inspector.value.listVaults()
+    const info = vaults.value[0]
+    if (!info) { initialized.value = true; return }
+    openVault.value = await db.value.openVault(info.id)
+    await loadSnapshot()
+  } catch (e) {
+    snapshotError.value = e instanceof Error ? e.message : String(e)
+  } finally {
+    initialized.value = true
+  }
+})
+
+onUnmounted(() => {
+  offWrite?.()
+  offConflict?.()
+  if (meterInterval) clearInterval(meterInterval)
+})
+
+// ── Helpers ──────────────────────────────────────────────────────
+async function loadSnapshot() {
+  if (!inspector.value || !openVault.value) return
+  try {
+    const snap = await inspector.value.snapshot(openVault.value)
+    collections.value = snap.collections
+    snapshotMeta.value = snap.meta ?? null
+    selectedCollection.value = snap.collections[0] ?? null
+    snapshotError.value = undefined
+  } catch (e) {
+    snapshotError.value = e instanceof Error ? e.message : String(e)
+  }
+}
+
+function selectCollection(coll: InspectorCollection) {
+  selectedCollection.value = coll
+  detailTab.value = 'schema'
+  recordsOffset.value = 0
+  recordsPage.value = null
+  recordsError.value = undefined
+}
+
+function prevPage() { if (recordsOffset.value >= PAGE) recordsOffset.value -= PAGE }
+function nextPage() {
+  if (recordsPage.value && recordsOffset.value + PAGE < recordsPage.value.total)
+    recordsOffset.value += PAGE
+}
+
+function activateMonitor() {
+  topTab.value = 'monitor'
+  if (monitorStarted || !inspector.value) return
+  monitorStarted = true
+  offWrite = inspector.value.subscribe((e) => {
+    const op = e.op === 'delete' ? 'del' : ('put' as const)
+    const versions = e.op === 'delete' ? `${e.baseVersion}→·` : `${e.baseVersion}→${e.version}`
+    const baseKey = `${e.collection}/${e.docId}@${e.baseVersion}`
+    const row: FeedRow = {
+      time: new Date(e.timestamp).toTimeString().slice(0, 8),
+      user: e.userId,
+      op,
+      target: `${e.collection}/${e.docId}`,
+      versions,
+      baseKey,
+      conflict: conflictKeys.has(baseKey),
+    }
+    const prev = feed.value as FeedRow[]
+    if (prev.some((r) => r.baseKey === baseKey && r.user !== e.userId)) row.conflict = true
+    feed.value = [
+      row,
+      ...prev.map((r) => r.baseKey === baseKey && r.user !== e.userId ? { ...r, conflict: true } : r),
+    ].slice(0, BUFFER)
+  })
+  offConflict = inspector.value.subscribeConflicts((c) => {
+    const key = `${c.collection}/${c.docId}@${c.baseVersion}`
+    conflictKeys.add(key)
+    feed.value = (feed.value as FeedRow[]).map((r) => r.baseKey === key ? { ...r, conflict: true } : r)
+  })
+}
+
+// Latency poll — runs only while monitor tab is active
+watch(topTab, (tab) => {
+  if (tab === 'monitor') {
+    meterInterval = setInterval(() => {
+      try { meter.value = inspector.value?.meterSnapshot() ?? null }
+      catch { meter.value = null }
+    }, 1000)
+  } else {
+    if (meterInterval) { clearInterval(meterInterval); meterInterval = null }
+  }
+})
+
+// Records fetch — re-runs when collection, tab, or offset changes
+watch(
+  [selectedCollection, detailTab, recordsOffset],
+  async ([coll, tab]) => {
+    if (!inspector.value || !openVault.value || !coll || tab !== 'records') return
+    recordsPage.value = null
+    recordsError.value = undefined
+    try {
+      recordsPage.value = await inspector.value.records(
+        openVault.value, coll.name, { limit: PAGE, offset: recordsOffset.value }
+      )
+    } catch (e) {
+      recordsError.value = e instanceof Error ? e.message : String(e)
+    }
+  },
+  { immediate: false }
+)
+</script>

package/dist/runtime/devtools/panes/RecordsPane.vue

@@ -0,0 +1,103 @@
+<template>
+  <div class="noydb-records">
+    <div class="noydb-records__header">
+      <template v-if="page">
+        rows
+        <strong>{{ page.total === 0 ? 0 : page.offset + 1 }}–{{ Math.min(page.offset + page.limit, page.total) }}</strong>
+        of <strong>{{ page.total }}</strong>
+      </template>
+      <span v-else-if="error" class="noydb-records__error">{{ error }}</span>
+      <span v-else class="noydb-records__loading">loading…</span>
+      <div class="noydb-records__nav">
+        <button :disabled="!canPrev" @click="$emit('prev')">◀ prev</button>
+        <button :disabled="!canNext" @click="$emit('next')">next ▶</button>
+      </div>
+      <button
+        v-if="hasSensitiveFields"
+        class="noydb-records__reveal-all"
+        data-reveal-all
+        @click="revealAll = !revealAll"
+      >{{ revealAll ? 'hide all' : 'reveal all' }}</button>
+    </div>
+    <template v-if="page && fields.length > 0">
+      <div class="noydb-records__cols">
+        <span v-for="f in fields" :key="f">{{ f }}</span>
+      </div>
+      <div v-if="page.rows.length === 0" class="noydb-records__empty">No records</div>
+      <div v-for="(row, i) in page.rows" :key="i" class="noydb-records__row">
+        <span v-for="f in fields" :key="f">
+          <template v-if="isVisible(f)">{{ cell(row, f) }}</template>
+          <button
+            v-else
+            class="noydb-records__mask"
+            :data-reveal="f"
+            @click="reveal(f)"
+          >••••</button>
+        </span>
+      </div>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import type { InspectorCollection, RecordPage } from '@noy-db/in-devtools'
+
+const props = defineProps<{
+  collection: InspectorCollection
+  page: RecordPage | null
+  error: string | undefined
+}>()
+
+defineEmits<{ prev: []; next: [] }>()
+
+const fields = computed(() => Object.keys(props.collection.fields))
+
+const canPrev = computed(() => !!props.page && props.page.offset > 0)
+const canNext = computed(() => !!props.page && props.page.offset + props.page.limit < props.page.total)
+
+// ── PII masking ────────────────────────────────────────────────────────────
+
+/** Set of field keys that are sensitive (pii or secret) per collection.described. */
+const sensitiveFields = computed((): Set<string> => {
+  const described = props.collection.described
+  if (!described) return new Set()
+  const s = new Set<string>()
+  for (const d of described) {
+    if (d.sensitivity !== undefined && d.sensitivity !== 'public') {
+      s.add(d.key)
+    }
+  }
+  return s
+})
+
+const hasSensitiveFields = computed(() => sensitiveFields.value.size > 0)
+
+/** Tracks which individual fields the user has revealed. */
+const revealed = ref(new Set<string>())
+
+/** When true, all sensitive fields are shown. */
+const revealAll = ref(false)
+
+// Reset reveal state when the viewed collection changes (prevent PII from one
+// collection lingering when the user navigates to another).
+watch(() => props.collection, () => { revealed.value = new Set(); revealAll.value = false })
+
+function isVisible(field: string): boolean {
+  if (!sensitiveFields.value.has(field)) return true
+  if (revealAll.value) return true
+  return revealed.value.has(field)
+}
+
+function reveal(field: string): void {
+  revealed.value = new Set([...revealed.value, field])
+}
+
+function cell(row: unknown, field: string): string {
+  if (row === null || row === undefined || typeof row !== 'object') return '·'
+  const val = (row as Record<string, unknown>)[field]
+  if (val === null || val === undefined) return '·'
+  if (typeof val === 'object') return Array.isArray(val) ? `[${(val as unknown[]).length}]` : '{…}'
+  return String(val)
+}
+</script>

package/dist/runtime/devtools/panes/SchemaPane.vue

@@ -0,0 +1,124 @@
+<template>
+  <div class="noydb-schema">
+    <template v-if="collection">
+      <!-- Collection meta header -->
+      <div class="noydb-schema__meta-header">
+        <span class="noydb-schema__meta-label">{{ collectionLabel }}</span>
+        <span
+          v-if="collection.meta?.description"
+          class="noydb-schema__meta-desc"
+          :title="collection.meta.description"
+        >{{ collection.meta.description }}</span>
+      </div>
+
+      <!-- Config strip (badges for active config options) -->
+      <div v-if="configBadges.length" class="noydb-schema__config-strip">
+        <span
+          v-for="badge in configBadges"
+          :key="badge"
+          class="noydb-schema__config-badge"
+        >{{ badge }}</span>
+      </div>
+
+      <div class="noydb-schema__label noydb-schema__label--mt">Fields</div>
+
+      <!-- Rich rows from described (when present) -->
+      <template v-if="collection.described && collection.described.length">
+        <div
+          v-for="field in collection.described"
+          :key="field.key"
+          class="noydb-schema__row"
+        >
+          <span class="noydb-schema__name">{{ field.label }}</span>
+          <span class="noydb-schema__name noydb-schema__name--key" :title="field.key">{{ field.key }}</span>
+          <span class="noydb-schema__type">{{ field.type }}</span>
+          <span v-if="field.semanticType || field.widget" class="noydb-schema__badge noydb-schema__badge--semantic">
+            {{ field.semanticType ?? field.widget }}
+          </span>
+          <span v-if="field.money?.currency" class="noydb-schema__badge noydb-schema__badge--money">
+            {{ field.money.currency }}
+          </span>
+          <span v-if="field.dict" class="noydb-schema__badge noydb-schema__badge--dict">
+            dict{{ field.dict.values ? ` ×${field.dict.values.length}` : '' }}
+          </span>
+          <span v-if="field.sensitivity === 'pii'" class="noydb-schema__badge noydb-schema__badge--pii">pii</span>
+          <span v-if="field.sensitivity === 'secret'" class="noydb-schema__badge noydb-schema__badge--secret">secret</span>
+          <span v-if="field.i18n" class="noydb-schema__badge noydb-schema__badge--i18n">i18n</span>
+          <span v-if="field.ref" class="noydb-schema__badge noydb-schema__badge--ref" :title="`→ ${field.ref.target}`">
+            → {{ field.ref.target }}
+          </span>
+          <span v-if="!field.editable" class="noydb-schema__badge noydb-schema__badge--readonly">read-only</span>
+          <span class="noydb-schema__flag">{{ isIndexed(field.key) ? 'idx' : '' }}</span>
+        </div>
+      </template>
+
+      <!-- Fallback rows from fields (back-compat) -->
+      <template v-else>
+        <div
+          v-for="[name, field] in fieldEntries"
+          :key="name"
+          class="noydb-schema__row"
+        >
+          <span class="noydb-schema__name">{{ name }}</span>
+          <span class="noydb-schema__type">{{ (field as { type?: string }).type ?? '—' }}</span>
+          <span class="noydb-schema__flag">{{ isIndexed(name) ? 'idx' : '' }}</span>
+        </div>
+      </template>
+
+      <div class="noydb-schema__label noydb-schema__label--mt">Stats</div>
+      <div class="noydb-schema__stat">
+        docs <strong>{{ collection.stats?.count ?? '—' }}</strong>
+        · size <strong>{{ fmtBytes(collection.stats?.bytes) }}</strong>
+        · indexes <strong>{{ collection.indexes?.length ?? 0 }}</strong>
+      </div>
+    </template>
+    <div v-else class="noydb-schema__empty">Select a collection</div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import type { InspectorCollection } from '@noy-db/in-devtools'
+
+const props = defineProps<{ collection: InspectorCollection | null }>()
+
+const collectionLabel = computed(() =>
+  props.collection?.meta?.label ?? props.collection?.name ?? ''
+)
+
+const fieldEntries = computed(() =>
+  props.collection ? Object.entries(props.collection.fields) : []
+)
+
+/** Build small text badges for whichever config options are active. */
+const configBadges = computed((): string[] => {
+  const cfg = props.collection?.config
+  if (!cfg) return []
+  const badges: string[] = []
+  if (cfg.embeddings) badges.push('embeddings')
+  if (cfg.textIndexes && cfg.textIndexes.length) badges.push('text-index')
+  if (cfg.crdt) badges.push(`crdt:${cfg.crdt}`)
+  if (cfg.provenance) badges.push('provenance')
+  if (cfg.archive) badges.push('archive')
+  if (cfg.tiers && cfg.tiers.length) badges.push(`tiers:${cfg.tiers.length}`)
+  if (cfg.perRecordKeys) badges.push('per-record-keys')
+  if (cfg.history) badges.push('history')
+  if (cfg.schemaUpdate && cfg.schemaUpdate.length) badges.push('schema-update')
+  return badges
+})
+
+function isIndexed(name: string): boolean {
+  return props.collection?.indexes?.some((idx) => {
+    const fields = (idx as { fields?: string | string[] }).fields
+    if (!fields) return false
+    return Array.isArray(fields) ? fields.includes(name) : fields === name
+  }) ?? false
+}
+
+function fmtBytes(n?: number): string {
+  if (n === undefined) return '—'
+  if (n < 1024) return `${n} B`
+  if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)} KB`
+  return `${(n / (1024 * 1024)).toFixed(1)} MB`
+}
+</script>

package/dist/runtime/devtools/panes/VaultSidebar.vue

@@ -0,0 +1,35 @@
+<template>
+  <aside class="noydb-sidebar">
+    <div class="noydb-sidebar__header">Vault</div>
+    <template v-if="vaultName">
+      <div
+        class="noydb-sidebar__vault"
+        :title="vaultMeta?.description ?? vaultName ?? undefined"
+      >▸ {{ vaultMeta?.label ?? vaultName }}</div>
+      <button
+        v-for="coll in collections"
+        :key="coll.name"
+        :class="['noydb-sidebar__item', { 'noydb-sidebar__item--selected': coll.name === selectedName }]"
+        @click="$emit('select', coll)"
+      >
+        <span>{{ coll.meta?.label ?? coll.name }}</span>
+        <span v-if="coll.stats?.count" class="noydb-sidebar__badge">{{ coll.stats.count }}</span>
+      </button>
+    </template>
+    <div v-else class="noydb-sidebar__empty">—</div>
+  </aside>
+</template>
+
+<script setup lang="ts">
+import type { InspectorCollection } from '@noy-db/in-devtools'
+import type { VaultMeta } from '@noy-db/hub'
+
+defineProps<{
+  vaultName: string | null
+  vaultMeta?: VaultMeta | null
+  collections: ReadonlyArray<InspectorCollection>
+  selectedName: string | null
+}>()
+
+defineEmits<{ select: [collection: InspectorCollection] }>()
+</script>

package/dist/runtime/devtools/panes/WriteMonitor.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="noydb-monitor">
+    <div v-if="meter" class="noydb-monitor__latency">
+      put p50 {{ meter.byMethod?.['put']?.p50 ?? '—' }}ms
+      p99 {{ meter.byMethod?.['put']?.p99 ?? '—' }}ms
+      · del p50 {{ meter.byMethod?.['delete']?.p50 ?? '—' }}ms
+      <span v-if="meter.status === 'degraded'" class="noydb-monitor__degraded"> ⚠ degraded</span>
+    </div>
+    <div class="noydb-monitor__cols">
+      <span>time</span>
+      <span>user</span>
+      <span>op</span>
+      <span>target</span>
+      <span>ver</span>
+    </div>
+    <div v-if="rows.length === 0" class="noydb-monitor__empty">Waiting for writes…</div>
+    <div
+      v-for="(row, i) in rows"
+      :key="i"
+      :class="['noydb-monitor__row', { 'noydb-monitor__row--conflict': row.conflict }]"
+    >
+      <span>{{ row.time }}</span>
+      <span>{{ row.user }}</span>
+      <span>{{ row.op }}</span>
+      <span>{{ row.target }}</span>
+      <span>{{ row.versions }}</span>
+      <span v-if="row.conflict" class="noydb-monitor__badge">⚠ conflict</span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { MeterSnapshot } from '@noy-db/to-meter'
+
+export interface FeedRow {
+  readonly time: string
+  readonly user: string
+  readonly op: 'put' | 'del'
+  readonly target: string
+  readonly versions: string
+  readonly baseKey: string
+  conflict: boolean
+}
+
+defineProps<{
+  rows: ReadonlyArray<FeedRow>
+  meter: MeterSnapshot | null
+}>()
+</script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@noy-db/in-nuxt",
-  "version": "0.2.0-pre.3",
+  "version": "0.2.0-pre.31",
   "description": "Nuxt 4 module for noy-db — auto-imports, SSR-safe runtime plugin, and the @noy-db/in-pinia bridge",
   "license": "MIT",
   "author": "vLannaAi <vicio@lanna.ai>",
@@ -30,29 +30,36 @@
     "LICENSE"
   ],
   "engines": {
-    "node": ">=20.0.0"
+    "node": ">=22.0.0"
   },
   "peerDependencies": {
     "nuxt": "^4.0.0",
-    "@noy-db/hub": "0.2.0-pre.3",
-    "@noy-db/in-vue": "0.2.0-pre.3",
-    "@noy-db/in-rest": "0.2.0-pre.3",
-    "@noy-db/in-pinia": "0.2.0-pre.3"
+    "@noy-db/in-pinia": "0.2.0-pre.31",
+    "@noy-db/hub": "0.2.0-pre.31",
+    "@noy-db/in-vue": "0.2.0-pre.31",
+    "@noy-db/in-rest": "0.2.0-pre.31"
   },
   "peerDependenciesMeta": {
     "@noy-db/in-rest": {
       "optional": true
     }
   },
+  "dependencies": {
+    "@noy-db/in-devtools": "0.2.0-pre.31"
+  },
   "devDependencies": {
     "@nuxt/kit": "^4.4.2",
     "@nuxt/schema": "^4.4.2",
+    "@vitejs/plugin-vue": "^5.2.4",
+    "@vue/test-utils": "^2.4.6",
     "h3": "^1.13.0",
+    "happy-dom": "^17.4.4",
     "nuxt": "^4.4.2",
-    "@noy-db/in-pinia": "0.2.0-pre.3",
-    "@noy-db/in-rest": "0.2.0-pre.3",
-    "@noy-db/hub": "0.2.0-pre.3",
-    "@noy-db/in-vue": "0.2.0-pre.3"
+    "vue": "^3.5.32",
+    "@noy-db/hub": "0.2.0-pre.31",
+    "@noy-db/in-pinia": "0.2.0-pre.31",
+    "@noy-db/in-vue": "0.2.0-pre.31",
+    "@noy-db/in-rest": "0.2.0-pre.31"
   },
   "keywords": [
     "noy-db",