dexie-reactive 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Konstantin Kroner
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,463 @@
+# dexie-reactive
+
+Shared, SSR-safe Dexie live query state for Vue 3 and Nuxt 3.
+
+`dexie-reactive` wraps Dexie `liveQuery` with small Vue composables. One
+component owns the real Dexie subscription as a producer. Other components can
+subscribe to the same reactive state by key without creating another Dexie
+subscription.
+
+## Why dexie-reactive?
+
+Use `dexie-reactive` when multiple Vue components need to react to the same
+Dexie query result without each component creating its own IndexedDB
+subscription.
+
+It provides:
+
+- one producer-owned Dexie `liveQuery` per key
+- shared Vue reactive state for all consumers
+- duplicate producer protection
+- SSR-safe client-only subscription behavior
+- same-origin tab-to-tab updates through Dexie live query propagation
+- persistent IndexedDB-backed state for query results without keeping the whole
+  database in memory
+- stale result protection during restarts and component cleanup
+- explicit loading and error state
+- focused unit and browser integration test coverage
+
+This keeps IndexedDB reactivity predictable in Vue and Nuxt apps while leaving
+Dexie query construction fully under application control.
+
+## Decision Guide
+
+| Use this package when                                                         | Avoid it when                                                 |
+| ----------------------------------------------------------------------------- | ------------------------------------------------------------- |
+| multiple components share the same IndexedDB query result                     | each component owns completely independent queries            |
+| you want explicit producer and consumer ownership                             | you want implicit global query caching                        |
+| you need Nuxt-safe client-only IndexedDB behavior                             | you need server-side IndexedDB execution                      |
+| you want Dexie queries to stay application-owned                              | you want a query builder or ORM abstraction                   |
+| duplicate shared subscription ownership should fail immediately               | duplicate subscriptions are acceptable in your design         |
+| you want IndexedDB-backed state that behaves like persistent shared app state | you need a general-purpose Pinia replacement for all UI state |
+| you need same-origin tab-to-tab updates from Dexie writes                     | you need cross-device or backend synchronization              |
+
+## What It Does Not Do
+
+- It does not replace Dexie.
+- It does not replace Pinia for transient UI state.
+- It does not build or parse queries.
+- It does not sync data to a backend.
+- It does not sync data across devices, users, or origins.
+- It does not provide persistence beyond IndexedDB.
+- It does not create server-side data fetching.
+- It does not hide duplicate ownership mistakes.
+
+## When To Use It
+
+Use this package when a Vue or Nuxt app needs IndexedDB data that updates
+reactively after Dexie writes.
+
+- Use `useLiveQuery` in the component or composable that owns the query.
+- Use `useLiveQuerySubscription` in components that only need to display the
+  already shared state.
+- Use an explicit `key` when multiple components should share one subscription.
+- Omit the key for local, non-shared live queries.
+
+## Installation
+
+```sh
+npm install dexie-reactive dexie vue
+```
+
+`dexie` and `vue` are peer dependencies. Nuxt users can install the package in a
+Nuxt 3 project and import the composables directly from `dexie-reactive`.
+
+## Quick Start
+
+Define your Dexie database once:
+
+```ts
+// db.ts
+import Dexie, { type EntityTable } from 'dexie'
+
+export interface Friend {
+    id?: number
+    name: string
+    age: number
+}
+
+export interface AppDatabase extends Dexie {
+    friends: EntityTable<Friend, 'id'>
+}
+
+export const db = new Dexie('app-db') as AppDatabase
+
+db.version(1).stores({
+    friends: '++id,name,age',
+})
+```
+
+Create a producer composable:
+
+```ts
+// useOlderFriends.ts
+import { useLiveQuery } from 'dexie-reactive'
+import { db } from './db'
+
+export function useOlderFriends() {
+    return useLiveQuery(() => db.friends.where('age').above(75).toArray(), {
+        key: 'older-friends',
+    })
+}
+```
+
+Use it in a producer component:
+
+```vue
+<script setup lang="ts">
+import { useOlderFriends } from './useOlderFriends'
+
+const { data, loading, hasError } = useOlderFriends()
+</script>
+
+<template>
+    <p v-if="loading">Loading...</p>
+    <p v-else-if="hasError">Could not load friends.</p>
+    <ul v-else>
+        <li v-for="friend in data" :key="friend.id">
+            {{ friend.name }}
+        </li>
+    </ul>
+</template>
+```
+
+Use the same state from a consumer component:
+
+```vue
+<script setup lang="ts">
+import { useLiveQuerySubscription } from 'dexie-reactive'
+import type { Friend } from './db'
+
+const { data, loading, hasError } =
+    useLiveQuerySubscription<Friend>('older-friends')
+</script>
+
+<template>
+    <p v-if="loading">Loading...</p>
+    <p v-else-if="hasError">Could not load friends.</p>
+    <ul v-else>
+        <li v-for="friend in data" :key="friend.id">
+            {{ friend.name }}
+        </li>
+    </ul>
+</template>
+```
+
+## Core Model
+
+`useLiveQuery` is the producer. It owns the real Dexie live query subscription.
+
+`useLiveQuerySubscription` is the consumer. It attaches to shared state by key
+and never creates a Dexie subscription.
+
+The consumer receives shared reactive state by key. It does not get a cloned
+snapshot and it does not create a second Dexie subscription.
+
+## Public API
+
+The package exports only the stable composables and public types:
+
+```ts
+import {
+    useLiveQuery,
+    useLiveQuerySubscription,
+    type LiveQueryState,
+    type UseLiveQueryOptions,
+} from 'dexie-reactive'
+```
+
+### `useLiveQuery(queryFn, options?)`
+
+Creates and owns a Dexie live query subscription.
+
+```ts
+function useLiveQuery<T>(
+    queryFn?:
+        | (() => T[] | Promise<T[]>)
+        | Ref<(() => T[] | Promise<T[]>) | null | undefined>
+        | null,
+    options?: {
+        key?: string
+    },
+): LiveQueryState<T>
+```
+
+- `queryFn` is a function that returns an array or a promise of an array.
+- `queryFn` may be passed directly or as a reactive function reference.
+- `options.key` is optional. If omitted, a UUID key is generated and returned.
+- Only one producer may exist for a key.
+- The live query is created only in the browser.
+
+### `useLiveQuerySubscription(key)`
+
+Consumes existing shared state by key.
+
+```ts
+function useLiveQuerySubscription<T>(key: string): LiveQueryState<T>
+```
+
+- Receives only a key.
+- Never receives a query function.
+- Never creates a Dexie live query subscription.
+- Returns the same reactive refs as the producer once the producer exists.
+
+### Returned State
+
+Both composables return:
+
+```ts
+interface LiveQueryState<T> {
+    key: string
+    data: Ref<T[]>
+    loading: Ref<boolean>
+    hasError: Ref<boolean>
+    error?: Ref<unknown | undefined>
+    stop: () => void
+    restart: () => void
+}
+```
+
+`error` is available only in development mode. Production consumers should rely
+on `hasError`.
+
+## Generated Key Usage
+
+If no key is provided, `useLiveQuery` generates a UUID key and returns it.
+
+```ts
+const friends = useLiveQuery(() => db.friends.toArray())
+
+console.log(friends.key)
+```
+
+Generated keys are useful for local, non-shared subscriptions. Use an explicit
+key when another component needs to subscribe to the same state.
+
+## Error Handling
+
+Errors are caught internally and do not throw to components.
+
+```ts
+const friends = useLiveQuery(() => db.friends.toArray(), {
+    key: 'friends',
+})
+
+if (friends.hasError.value) {
+    // Render fallback UI or trigger app-level reporting.
+}
+```
+
+On failure:
+
+- `hasError.value` becomes `true`
+- `loading.value` becomes `false`
+- `data.value` remains an array
+- the original error is exposed only through `error` in development mode
+
+## Query Function Behavior
+
+The package passes your function to Dexie `liveQuery`; it does not parse, build,
+transform, or interpret Dexie queries.
+
+```ts
+const query = () => db.friends.where('age').above(75).toArray()
+
+const friends = useLiveQuery(query, { key: 'older-friends' })
+```
+
+Reactive values used inside the query function are not tracked by
+`dexie-reactive`. If external dependencies change, recreate the query function
+reference.
+
+```ts
+import { computed } from 'vue'
+
+const minimumAge = ref(75)
+const query = computed(
+    () => () => db.friends.where('age').above(minimumAge.value).toArray(),
+)
+
+const friends = useLiveQuery(query, { key: 'filtered-friends' })
+```
+
+When the query function reference changes, the composable stops the current
+subscription, resets state to `data = []`, `loading = true`, `hasError = false`,
+and starts a new subscription.
+
+## SSR And Nuxt
+
+The same package build works in plain Vue and Nuxt.
+
+During SSR:
+
+- no Dexie live query subscription is created
+- shared state is scoped per runtime environment
+- browser state is not shared with SSR
+- SSR request state is isolated and cannot leak across requests
+
+Use the composables in Nuxt components or composables, but expect live Dexie
+updates only on the client because IndexedDB is a browser API.
+
+```vue
+<script setup lang="ts">
+import { useLiveQuery } from 'dexie-reactive'
+
+const friends = useLiveQuery(() => db.friends.toArray(), {
+    key: 'friends',
+})
+</script>
+```
+
+## Lifecycle Controls
+
+`stop()` unsubscribes from Dexie, sets `loading` to `false`, and keeps current
+data.
+
+`restart()` performs a full reset and starts a new subscription using the latest
+query function.
+
+For shared keys, these controls affect all consumers because they point to the
+producer-owned state.
+
+## Flow Diagrams
+
+### Producer Flow
+
+```mermaid
+flowchart TD
+    A["useLiveQuery(queryFn, options)"] --> B["Resolve or generate key"]
+    B --> C{"Key already exists?"}
+    C -->|Yes| D["Throw duplicate producer error"]
+    C -->|No| E["Create shared reactive state"]
+    E --> F["Store state in subscription map"]
+    F --> G["Emit registration message"]
+    G --> H{"Browser runtime?"}
+    H -->|No| I["Do not create Dexie subscription"]
+    H -->|Yes| J["Start Dexie liveQuery"]
+    J --> K["Apply latest result to shared refs"]
+```
+
+### Consumer Flow
+
+```mermaid
+flowchart TD
+    A["useLiveQuerySubscription(key)"] --> B{"Key exists in subscription map?"}
+    B -->|Yes| C["Return existing shared reactive state"]
+    B -->|No| D["Create waiting reactive state"]
+    D --> E["Register waiting consumer by key"]
+    E --> F["Return waiting state"]
+```
+
+### Waiting Consumer Flow
+
+```mermaid
+flowchart TD
+    A["Consumer subscribes before producer"] --> B["Waiting consumer is stored by key"]
+    B --> C["Producer later registers same key"]
+    C --> D["Registration message is emitted synchronously"]
+    D --> E["Waiting consumer attaches to producer refs"]
+    E --> F["Waiting entry is removed"]
+```
+
+### Duplicate Producer Error Flow
+
+```mermaid
+flowchart TD
+    A["First useLiveQuery registers key"] --> B["subscriptionMap has key"]
+    B --> C["Second useLiveQuery uses same key"]
+    C --> D["No second Dexie subscription is created"]
+    D --> E["Error is thrown immediately"]
+```
+
+## Limitations
+
+- Dexie queries must return arrays.
+- Consumers cannot create subscriptions.
+- Keys are identifiers for shared state, not a security boundary.
+- Live queries run only in the browser.
+- The package uses vanilla Dexie `liveQuery` semantics through the composables.
+- It does not use framework-specific Dexie bindings such as React hooks.
+
+## Anti-Patterns
+
+Do not create duplicate producers for the same key:
+
+```ts
+useLiveQuery(() => db.friends.toArray(), { key: 'friends' })
+useLiveQuery(() => db.friends.toArray(), { key: 'friends' }) // throws
+```
+
+Do not pass query functions to consumers:
+
+```ts
+useLiveQuerySubscription('friends') // correct
+useLiveQuerySubscription(() => db.friends.toArray()) // incorrect
+```
+
+Do not rely on reactive values inside a stable query function reference:
+
+```ts
+const minimumAge = ref(75)
+
+useLiveQuery(() => db.friends.where('age').above(minimumAge.value).toArray(), {
+    key: 'friends',
+})
+```
+
+Recreate the query function when dependencies change instead.
+
+## Demo And Browser Integration Test
+
+The browser test app doubles as a small local demo:
+
+```sh
+npm run test:browser:server
+```
+
+Open the printed local URL and inspect IndexedDB under that same origin. The demo
+database is named `dexie-reactive-browser` and uses a `friends` object store.
+
+## Testing Strategy
+
+The unit test suite focuses on the shared live query contract:
+
+- public API exports and returned reactive state shape
+- browser singleton and SSR-isolated subscription scopes
+- producer lifecycle for start, stop, restart, unsubscribe, and cleanup
+- duplicate producer rejection without creating a second Dexie subscription
+- consumer coordination for producer-first and waiting-consumer flows
+- shared reactive state references instead of cloned consumer state
+- stale result protection across stop, restart, scope disposal, and rapid query changes
+- missing, invalid, and changing query function handling
+- error, loading, and development-only error exposure behavior
+- generated UUID key uniqueness
+- Dexie `liveQuery` usage through the provided query callback
+
+The browser integration suite mounts a minimal Vue app in Chromium with a real
+Dexie IndexedDB database. It verifies producer and consumer components sharing
+one key, database updates propagating to all mounted components, consumer
+unmount/remount behavior, and duplicate producer errors in the browser runtime.
+
+## Scripts
+
+- `npm run lint` checks the code with ESLint.
+- `npm run format:check` verifies Prettier formatting.
+- `npm run typecheck` runs TypeScript without emitting files.
+- `npm run test` runs Vitest tests from `tests/*`.
+- `npm run test:browser` runs Playwright browser integration tests.
+- `npm run build` builds the package with unbuild.
+- `npm run check` runs linting, formatting, type checking, tests, and build.
+
+## Git Hooks
+
+Husky runs staged linting before commits and commitlint for commit messages.

package/dist/index.d.mts

@@ -0,0 +1,24 @@
+import { Ref } from 'vue';
+
+type MaybePromise<T> = T | Promise<T>;
+type LiveQueryQueryFunction<T> = () => MaybePromise<T[]>;
+interface UseLiveQueryOptions {
+    key?: string;
+}
+interface LiveQueryState<T> {
+    key: string;
+    data: Ref<T[]>;
+    loading: Ref<boolean>;
+    hasError: Ref<boolean>;
+    error?: Ref<unknown | undefined>;
+    stop: () => void;
+    restart: () => void;
+}
+type LiveQueryQuerySource<T> = LiveQueryQueryFunction<T> | Ref<LiveQueryQueryFunction<T> | null | undefined> | null | undefined;
+
+declare function useLiveQuery<T>(queryFn?: LiveQueryQuerySource<T>, options?: UseLiveQueryOptions): LiveQueryState<T>;
+
+declare function useLiveQuerySubscription<T>(key: string): LiveQueryState<T>;
+
+export { useLiveQuery, useLiveQuerySubscription };
+export type { LiveQueryQueryFunction, LiveQueryQuerySource, LiveQueryState, MaybePromise, UseLiveQueryOptions };

package/dist/index.d.ts

@@ -0,0 +1,24 @@
+import { Ref } from 'vue';
+
+type MaybePromise<T> = T | Promise<T>;
+type LiveQueryQueryFunction<T> = () => MaybePromise<T[]>;
+interface UseLiveQueryOptions {
+    key?: string;
+}
+interface LiveQueryState<T> {
+    key: string;
+    data: Ref<T[]>;
+    loading: Ref<boolean>;
+    hasError: Ref<boolean>;
+    error?: Ref<unknown | undefined>;
+    stop: () => void;
+    restart: () => void;
+}
+type LiveQueryQuerySource<T> = LiveQueryQueryFunction<T> | Ref<LiveQueryQueryFunction<T> | null | undefined> | null | undefined;
+
+declare function useLiveQuery<T>(queryFn?: LiveQueryQuerySource<T>, options?: UseLiveQueryOptions): LiveQueryState<T>;
+
+declare function useLiveQuerySubscription<T>(key: string): LiveQueryState<T>;
+
+export { useLiveQuery, useLiveQuerySubscription };
+export type { LiveQueryQueryFunction, LiveQueryQuerySource, LiveQueryState, MaybePromise, UseLiveQueryOptions };

package/dist/index.mjs

@@ -0,0 +1,252 @@
+import { liveQuery } from 'dexie';
+import { shallowReactive, ref, shallowRef, onScopeDispose, isRef, watch } from 'vue';
+
+function createLiveQueryState(key) {
+  const state = shallowReactive({
+    key,
+    data: shallowRef([]),
+    loading: ref(false),
+    hasError: ref(false),
+    stop: () => {
+    },
+    restart: () => {
+    }
+  });
+  if (isDevelopmentEnvironment()) {
+    state.error = ref(void 0);
+  }
+  return state;
+}
+function isDevelopmentEnvironment() {
+  const runtime = globalThis;
+  if (!runtime.process) {
+    return false;
+  }
+  return runtime.process.env?.NODE_ENV === "development";
+}
+
+let browserSubscriptionScope;
+function createSubscriptionScope() {
+  return {
+    subscriptionMap: /* @__PURE__ */ new Map(),
+    waitingConsumers: /* @__PURE__ */ new Map()
+  };
+}
+function resolveSubscriptionScope() {
+  if (typeof window === "undefined") {
+    return createSubscriptionScope();
+  }
+  browserSubscriptionScope ??= createSubscriptionScope();
+  return browserSubscriptionScope;
+}
+function registerLiveQueryProducer(scope, state, configureEntry) {
+  if (scope.subscriptionMap.has(state.key)) {
+    throw new Error(
+      `Duplicate live query producer for key "${state.key}". Only one useLiveQuery producer may own a key; useLiveQuerySubscription(key) to consume existing shared state.`
+    );
+  }
+  const entry = Object.assign(state, {
+    producer: {
+      active: true,
+      generation: 0
+    }
+  });
+  configureEntry?.(entry);
+  scope.subscriptionMap.set(
+    entry.key,
+    entry
+  );
+  emitSubscriptionRegistered(scope, entry);
+  return entry;
+}
+function unregisterLiveQueryProducer(scope, entry) {
+  const currentEntry = scope.subscriptionMap.get(entry.key);
+  if (currentEntry !== entry) {
+    return;
+  }
+  entry.producer.active = false;
+  scope.subscriptionMap.delete(entry.key);
+}
+function resolveLiveQuerySubscription(scope, key) {
+  const entry = scope.subscriptionMap.get(key);
+  if (entry) {
+    return entry;
+  }
+  const state = createLiveQueryState(key);
+  state.loading.value = true;
+  const waitingConsumer = {
+    attach: (registeredEntry) => {
+      attachToSharedState(state, registeredEntry);
+    }
+  };
+  addWaitingConsumer(scope, key, waitingConsumer);
+  onScopeDispose(() => {
+    removeWaitingConsumer(scope, key, waitingConsumer);
+  }, true);
+  return state;
+}
+function addWaitingConsumer(scope, key, waitingConsumer) {
+  const consumers = scope.waitingConsumers.get(key) ?? /* @__PURE__ */ new Set();
+  consumers.add(waitingConsumer);
+  scope.waitingConsumers.set(key, consumers);
+}
+function removeWaitingConsumer(scope, key, waitingConsumer) {
+  const consumers = scope.waitingConsumers.get(key);
+  if (!consumers) {
+    return;
+  }
+  consumers.delete(waitingConsumer);
+  if (consumers.size === 0) {
+    scope.waitingConsumers.delete(key);
+  }
+}
+function emitSubscriptionRegistered(scope, entry) {
+  const waitingConsumers = scope.waitingConsumers.get(entry.key);
+  if (!waitingConsumers) {
+    return;
+  }
+  for (const waitingConsumer of waitingConsumers) {
+    waitingConsumer.attach(entry);
+  }
+  scope.waitingConsumers.delete(entry.key);
+}
+function attachToSharedState(state, entry) {
+  state.data = entry.data;
+  state.loading = entry.loading;
+  state.hasError = entry.hasError;
+  state.error = entry.error;
+  state.stop = entry.stop;
+  state.restart = entry.restart;
+}
+
+function useLiveQuery(queryFn, options = {}) {
+  const scope = resolveSubscriptionScope();
+  const state = createLiveQueryState(options.key ?? crypto.randomUUID());
+  let subscription;
+  let latestQueryFn = resolveQueryFunction(queryFn);
+  const resetState = () => {
+    entry.data.value = [];
+    entry.loading.value = true;
+    entry.hasError.value = false;
+    clearError(entry);
+  };
+  const stopSubscription = () => {
+    subscription?.unsubscribe();
+    subscription = void 0;
+    incrementGeneration(entry);
+    entry.loading.value = false;
+  };
+  const startSubscription = () => {
+    stopSubscription();
+    const query = latestQueryFn;
+    if (!query) {
+      applyInactiveDefaults(entry);
+      return;
+    }
+    if (typeof query !== "function") {
+      applyInactiveErrorDefaults(entry);
+      return;
+    }
+    resetState();
+    const generation = incrementGeneration(entry);
+    if (typeof window === "undefined") {
+      entry.loading.value = false;
+      return;
+    }
+    try {
+      const observable = liveQuery(
+        () => query()
+      );
+      subscription = observable.subscribe({
+        next: (result) => {
+          if (!isLatestGeneration(entry, generation)) {
+            return;
+          }
+          applyResultDefaults(entry, result);
+        },
+        error: (error) => {
+          if (!isLatestGeneration(entry, generation)) {
+            return;
+          }
+          applyErrorDefaults(entry, error);
+        }
+      });
+    } catch (error) {
+      if (!isLatestGeneration(entry, generation)) {
+        return;
+      }
+      applyErrorDefaults(entry, error);
+    }
+  };
+  const restartSubscription = () => {
+    latestQueryFn = resolveQueryFunction(queryFn);
+    startSubscription();
+  };
+  const entry = registerLiveQueryProducer(scope, state, (registeredEntry) => {
+    registeredEntry.stop = stopSubscription;
+    registeredEntry.restart = restartSubscription;
+  });
+  if (isRef(queryFn)) {
+    watch(
+      queryFn,
+      (nextQueryFn) => {
+        latestQueryFn = nextQueryFn;
+        startSubscription();
+      },
+      { flush: "sync" }
+    );
+  }
+  startSubscription();
+  onScopeDispose(() => {
+    stopSubscription();
+    unregisterLiveQueryProducer(scope, entry);
+  }, true);
+  return entry;
+}
+function resolveQueryFunction(queryFn) {
+  return isRef(queryFn) ? queryFn.value : queryFn;
+}
+function incrementGeneration(entry) {
+  entry.producer.generation += 1;
+  return entry.producer.generation;
+}
+function isLatestGeneration(entry, generation) {
+  return entry.producer.active && entry.producer.generation === generation;
+}
+function clearError(entry) {
+  if (entry.error) {
+    entry.error.value = void 0;
+  }
+}
+function applyInactiveDefaults(entry) {
+  entry.data.value = [];
+  entry.loading.value = false;
+  entry.hasError.value = false;
+  clearError(entry);
+}
+function applyInactiveErrorDefaults(entry) {
+  applyInactiveDefaults(entry);
+  entry.hasError.value = true;
+}
+function applyErrorDefaults(entry, error) {
+  entry.loading.value = false;
+  entry.hasError.value = true;
+  setError(entry, error);
+}
+function applyResultDefaults(entry, result) {
+  entry.data.value = Array.isArray(result) ? result : [];
+  entry.loading.value = false;
+  entry.hasError.value = false;
+  clearError(entry);
+}
+function setError(entry, error) {
+  if (entry.error) {
+    entry.error.value = error ?? void 0;
+  }
+}
+
+function useLiveQuerySubscription(key) {
+  return resolveLiveQuerySubscription(resolveSubscriptionScope(), key);
+}
+
+export { useLiveQuery, useLiveQuerySubscription };

package/package.json

@@ -0,0 +1,99 @@
+{
+    "name": "dexie-reactive",
+    "version": "0.0.1",
+    "description": "Shared, SSR-safe Dexie live query state for Vue 3 and Nuxt 3.",
+    "publishConfig": {
+        "access": "public"
+    },
+    "keywords": [
+        "dexie",
+        "indexeddb",
+        "livequery",
+        "vue",
+        "vue3",
+        "nuxt",
+        "nuxt3",
+        "composable",
+        "reactive",
+        "shared-state",
+        "offline-first"
+    ],
+    "homepage": "https://github.com/Nessiahs/dexie-reactive#readme",
+    "bugs": {
+        "url": "https://github.com/Nessiahs/dexie-reactive/issues"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/Nessiahs/dexie-reactive.git"
+    },
+    "license": "MIT",
+    "author": "Konstantin Kroner",
+    "packageManager": "npm@11.6.2",
+    "engines": {
+        "node": "^20.0.0 || ^22.0.0 || >=24.0.0"
+    },
+    "main": "./dist/index.mjs",
+    "module": "./dist/index.mjs",
+    "types": "./dist/index.d.ts",
+    "exports": {
+        ".": {
+            "types": "./dist/index.d.ts",
+            "import": "./dist/index.mjs"
+        }
+    },
+    "sideEffects": false,
+    "files": [
+        "dist"
+    ],
+    "scripts": {
+        "build": "unbuild",
+        "check": "npm run lint && npm run format:check && npm run typecheck && npm run test:coverage && npm run build",
+        "lint": "eslint .",
+        "format": "prettier . --write",
+        "format:check": "prettier . --check",
+        "typecheck": "tsc --noEmit",
+        "commitlint": "commitlint --edit",
+        "stagedlint": "lint-staged",
+        "lint:staged": "lint-staged",
+        "test:browser": "playwright test",
+        "test:browser:server": "vite --config tests/browser/vite.config.mjs --host 127.0.0.1 --port 4173",
+        "prepare": "node .husky/install.mjs",
+        "prepublishOnly": "npm run build",
+        "test": "vitest run",
+        "test:coverage": "vitest run --coverage",
+        "test:watch": "vitest"
+    },
+    "peerDependencies": {
+        "dexie": "^4.4.2",
+        "vue": "^3.4.0 || ^3.5.0"
+    },
+    "devDependencies": {
+        "@commitlint/cli": "^20.5.3",
+        "@commitlint/config-conventional": "^20.5.3",
+        "@emnapi/core": "^1.10.0",
+        "@emnapi/runtime": "^1.10.0",
+        "@eslint/js": "^10.0.1",
+        "@playwright/test": "^1.59.1",
+        "@vitest/coverage-v8": "^4.1.5",
+        "dexie": "^4.4.2",
+        "esbuild": "^0.28.0",
+        "eslint": "^10.3.0",
+        "eslint-config-prettier": "^10.1.8",
+        "husky": "^9.1.7",
+        "lint-staged": "^16.4.0",
+        "prettier": "^3.8.3",
+        "typescript": "^5.9.3",
+        "typescript-eslint": "^8.59.1",
+        "unbuild": "^3.6.1",
+        "vite": "^8.0.10",
+        "vitest": "^4.1.5",
+        "vue": "^3.5.33"
+    },
+    "lint-staged": {
+        "*.{ts,tsx,js,mjs,cjs}": [
+            "eslint --fix",
+            "prettier --write"
+        ],
+        "*.{json,md}": "prettier --write"
+    }
+}