@livestore/livestore 0.0.12 → 0.0.14

package/dist/QueryCache.d.ts

@@ -0,0 +1,20 @@
+import type { Bindable } from './util.js';
+type Opaque<BaseType, BrandType = unknown> = BaseType & {
+    readonly [Symbols.base]: BaseType;
+    readonly [Symbols.brand]: BrandType;
+};
+declare namespace Symbols {
+    const base: unique symbol;
+    const brand: unique symbol;
+}
+export type CacheKey = Opaque<string, string>;
+export default class QueryCache {
+    #private;
+    getKey: (sql: string, bindValues?: Bindable) => CacheKey;
+    get: (key: CacheKey) => any;
+    set: (queriedTables: ReadonlyArray<string>, key: CacheKey, results: any) => void;
+    ignoreQuery: (query: string) => boolean;
+    invalidate: (queriedTables: string[]) => void;
+}
+export {};
+//# sourceMappingURL=QueryCache.d.ts.map

package/dist/QueryCache.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryCache.d.ts","sourceRoot":"","sources":["../src/QueryCache.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AAEzC,KAAK,MAAM,CAAC,QAAQ,EAAE,SAAS,GAAG,OAAO,IAAI,QAAQ,GAAG;IACtD,QAAQ,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACjC,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CACpC,CAAA;AAED,kBAAU,OAAO,CAAC;IACD,MAAM,IAAI,EAAE,OAAO,MAAM,CAAA;IACzB,MAAM,KAAK,EAAE,OAAO,MAAM,CAAA;CAC1C;AAED,MAAM,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAO7C,MAAM,CAAC,OAAO,OAAO,UAAU;;IAI7B,MAAM,QAAS,MAAM,eAAe,QAAQ,KAAG,QAAQ,CAUtD;IAED,GAAG,QAAS,QAAQ,SAEnB;IAED,GAAG,kBAAmB,cAAc,MAAM,CAAC,OAAO,QAAQ,WAAW,GAAG,UAWvE;IAMD,WAAW,UAAW,MAAM,aAE3B;IAUD,UAAU,kBAAmB,MAAM,EAAE,UAUpC;CACF"}

package/dist/QueryCache.js

@@ -0,0 +1,71 @@
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _QueryCache_entries, _QueryCache_dependencies, _QueryCache_dependencyTrackerEvicted;
+import BoundMap, { BoundSet } from './bounded-collections.js';
+var Symbols;
+(function (Symbols) {
+})(Symbols || (Symbols = {}));
+const ignore = ['begin', 'rollback', 'commit', 'savepoint', 'release'];
+// TODO: profile to see how big we need this cache to be.
+const cacheSize = 200;
+class QueryCache {
+    constructor() {
+        _QueryCache_entries.set(this, new BoundMap(cacheSize));
+        _QueryCache_dependencies.set(this, new Map());
+        this.getKey = (sql, bindValues) => {
+            if (bindValues == null) {
+                return sql;
+            }
+            if (Array.isArray(bindValues)) {
+                return (sql + '\n' + bindValues.join('\n'));
+            }
+            return (sql + '\n' + Object.values(bindValues).join('\n'));
+        };
+        this.get = (key) => {
+            return __classPrivateFieldGet(this, _QueryCache_entries, "f").get(key);
+        };
+        this.set = (queriedTables, key, results) => {
+            __classPrivateFieldGet(this, _QueryCache_entries, "f").set(key, results);
+            for (const table of queriedTables) {
+                let keys = __classPrivateFieldGet(this, _QueryCache_dependencies, "f").get(table);
+                if (keys == null) {
+                    keys = new BoundSet(cacheSize);
+                    keys.onEvict = __classPrivateFieldGet(this, _QueryCache_dependencyTrackerEvicted, "f");
+                    __classPrivateFieldGet(this, _QueryCache_dependencies, "f").set(table, keys);
+                }
+                keys.add(key);
+            }
+        };
+        _QueryCache_dependencyTrackerEvicted.set(this, (key) => {
+            __classPrivateFieldGet(this, _QueryCache_entries, "f").delete(key);
+        });
+        this.ignoreQuery = (query) => {
+            return ignore.some((prefix) => query.startsWith(prefix));
+        };
+        // The next simplest step is to create a specific implementation for invalidating
+        // the expensive track list queries only when constraints data in a write overlaps with read constraints.
+        //
+        // As well as either:
+        // a. removeing the big view (since we'll have our cache)
+        // b. incrementally updating the view on insert by the EventImporter
+        //
+        // We'll not try to tackle any generalized approach until we have a proof of concept working.
+        this.invalidate = (queriedTables) => {
+            for (const table of queriedTables) {
+                const keys = __classPrivateFieldGet(this, _QueryCache_dependencies, "f").get(table);
+                if (keys == null) {
+                    continue;
+                }
+                for (const k of keys) {
+                    __classPrivateFieldGet(this, _QueryCache_entries, "f").delete(k);
+                }
+            }
+        };
+    }
+}
+_QueryCache_entries = new WeakMap(), _QueryCache_dependencies = new WeakMap(), _QueryCache_dependencyTrackerEvicted = new WeakMap();
+export default QueryCache;
+//# sourceMappingURL=QueryCache.js.map

package/dist/QueryCache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryCache.js","sourceRoot":"","sources":["../src/QueryCache.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAQ,EAAE,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAQ7D,IAAU,OAAO,CAGhB;AAHD,WAAU,OAAO;AAGjB,CAAC,EAHS,OAAO,KAAP,OAAO,QAGhB;AAKD,MAAM,MAAM,GAAG,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,CAAC,CAAA;AAEtE,yDAAyD;AACzD,MAAM,SAAS,GAAG,GAAG,CAAA;AACrB,MAAqB,UAAU;IAA/B;QACE,8BAAW,IAAI,QAAQ,CAAgB,SAAS,CAAC,EAAA;QACjD,mCAAgB,IAAI,GAAG,EAAiC,EAAA;QAExD,WAAM,GAAG,CAAC,GAAW,EAAE,UAAqB,EAAY,EAAE;YACxD,IAAI,UAAU,IAAI,IAAI,EAAE;gBACtB,OAAO,GAAe,CAAA;aACvB;YAED,IAAI,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;gBAC7B,OAAO,CAAC,GAAG,GAAG,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAa,CAAA;aACxD;YAED,OAAO,CAAC,GAAG,GAAG,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAa,CAAA;QACxE,CAAC,CAAA;QAED,QAAG,GAAG,CAAC,GAAa,EAAE,EAAE;YACtB,OAAO,uBAAA,IAAI,2BAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QAC/B,CAAC,CAAA;QAED,QAAG,GAAG,CAAC,aAAoC,EAAE,GAAa,EAAE,OAAY,EAAE,EAAE;YAC1E,uBAAA,IAAI,2BAAS,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;YAC/B,KAAK,MAAM,KAAK,IAAI,aAAa,EAAE;gBACjC,IAAI,IAAI,GAAG,uBAAA,IAAI,gCAAc,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;gBACxC,IAAI,IAAI,IAAI,IAAI,EAAE;oBAChB,IAAI,GAAG,IAAI,QAAQ,CAAC,SAAS,CAAC,CAAA;oBAC9B,IAAI,CAAC,OAAO,GAAG,uBAAA,IAAI,4CAA0B,CAAA;oBAC7C,uBAAA,IAAI,gCAAc,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,CAAA;iBACpC;gBACD,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;aACd;QACH,CAAC,CAAA;QAED,+CAA4B,CAAC,GAAa,EAAE,EAAE;YAC5C,uBAAA,IAAI,2BAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAA;QAC3B,CAAC,EAAA;QAED,gBAAW,GAAG,CAAC,KAAa,EAAE,EAAE;YAC9B,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,CAAA;QAC1D,CAAC,CAAA;QAED,iFAAiF;QACjF,yGAAyG;QACzG,EAAE;QACF,qBAAqB;QACrB,yDAAyD;QACzD,oEAAoE;QACpE,EAAE;QACF,6FAA6F;QAC7F,eAAU,GAAG,CAAC,aAAuB,EAAE,EAAE;YACvC,KAAK,MAAM,KAAK,IAAI,aAAa,EAAE;gBACjC,MAAM,IAAI,GAAG,uBAAA,IAAI,gCAAc,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;gBAC1C,IAAI,IAAI,IAAI,IAAI,EAAE;oBAChB,SAAQ;iBACT;gBACD,KAAK,MAAM,CAAC,IAAI,IAAI,EAAE;oBACpB,uBAAA,IAAI,2BAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;iBACxB;aACF;QACH,CAAC,CAAA;IACH,CAAC;CAAA;;eA5DoB,UAAU"}

package/dist/__tests__/react/fixture.d.ts

@@ -0,0 +1,26 @@
+import type * as otel from '@opentelemetry/api';
+import React from 'react';
+import * as LiveStore from '../../index.js';
+export type Todo = {
+    id: string;
+    text: string | null;
+    completed: boolean;
+};
+export type Filter = 'all' | 'active' | 'completed';
+export type AppState = {
+    newTodoText: string;
+    filter: Filter;
+};
+export declare const schema: LiveStore.Schema;
+export declare const makeTodoMvc: ({ otelTracer, otelContext, }?: {
+    otelTracer?: otel.Tracer | undefined;
+    otelContext?: otel.Context | undefined;
+}) => Promise<{
+    wrapper: ({ children }: any) => React.JSX.Element;
+    AppSchema: LiveStore.SqliteDsl.TableDefinition<"components__UserInfo", {
+        username: LiveStore.SqliteDsl.ColumnDefinition<LiveStore.SqliteDsl.FieldType.FieldTypeText<string, string>, false>;
+        id: LiveStore.SqliteDsl.ColumnDefinition<LiveStore.SqliteDsl.FieldType.FieldTypeText<string, string>, false>;
+    }>;
+    store: LiveStore.Store<LiveStore.BaseGraphQLContext>;
+}>;
+//# sourceMappingURL=fixture.d.ts.map

package/dist/__tests__/react/fixture.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixture.d.ts","sourceRoot":"","sources":["../../../src/__tests__/react/fixture.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,IAAI,MAAM,oBAAoB,CAAA;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAA;AAK3C,MAAM,MAAM,IAAI,GAAG;IACjB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,GAAG,IAAI,CAAA;IACnB,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,WAAW,CAAA;AAEnD,MAAM,MAAM,QAAQ,GAAG;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;CACf,CAAA;AAKD,eAAO,MAAM,MAAM,kBA8BjB,CAAA;AAEF,eAAO,MAAM,WAAW;;;;4BA2BS,GAAG;;;;;;EAKnC,CAAA"}

package/dist/__tests__/react/fixture.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import initSqlite3Wasm from 'sqlite-esm';
+import * as LiveStore from '../../index.js';
+import { sql } from '../../index.js';
+import * as LiveStoreReact from '../../react/index.js';
+import { InMemoryStorage } from '../../storage/in-memory/index.js';
+// const appState: LiveStore.QueryDefinition = (store) =>
+//   store.querySQL<AppState>(() => `select newTodoText, filter from app;`, { queriedTables: ['app'] }).getFirstRow()
+export const schema = LiveStore.makeSchema({
+    tables: {
+        todos: LiveStore.DbSchema.table('todos', {
+            id: LiveStore.DbSchema.text({ primaryKey: true }),
+            text: LiveStore.DbSchema.text({ default: '', nullable: false }),
+            completed: LiveStore.DbSchema.boolean({ default: false, nullable: false }),
+        }),
+        app: LiveStore.DbSchema.table('app', {
+            id: LiveStore.DbSchema.text({ primaryKey: true }),
+            newTodoText: LiveStore.DbSchema.text({ default: '', nullable: true }),
+            filter: LiveStore.DbSchema.text({ default: 'all', nullable: false }),
+        }),
+    },
+    actions: {
+        // TODO: fix these actions to make them have write annotatinos
+        addTodo: {
+            statement: {
+                sql: sql `INSERT INTO todos (id, text, completed) VALUES ($id, $text, false);`,
+                writeTables: ['app'],
+            },
+        },
+        completeTodo: { statement: { sql: sql `UPDATE todos SET completed = true WHERE id = $id;`, writeTables: ['app'] } },
+        uncompleteTodo: {
+            statement: { sql: sql `UPDATE todos SET completed = false WHERE id = $id;`, writeTables: ['app'] },
+        },
+        deleteTodo: { statement: { sql: sql `DELETE FROM todos WHERE id = $id;`, writeTables: ['app'] } },
+        clearCompleted: { statement: { sql: sql `DELETE FROM todos WHERE completed = true;`, writeTables: ['app'] } },
+        updateNewTodoText: { statement: { sql: sql `UPDATE app SET newTodoText = $text;`, writeTables: ['app'] } },
+        setFilter: { statement: { sql: sql `UPDATE app SET filter = $filter;`, writeTables: ['app'] } },
+    },
+});
+export const makeTodoMvc = async ({ otelTracer, otelContext, } = {}) => {
+    const AppSchema = LiveStore.defineComponentStateSchema('UserInfo', {
+        username: LiveStore.DbSchema.text({ default: '' }),
+    });
+    const sqlite3 = await initSqlite3Wasm({
+        print: (message) => console.log(`[livestore sqlite] ${message}`),
+        printErr: (message) => console.error(`[livestore sqlite] ${message}`),
+    });
+    const store = await LiveStore.createStore({
+        schema,
+        loadStorage: () => InMemoryStorage.load(),
+        boot: (db) => db.execute(sql `INSERT OR IGNORE INTO app (id, newTodoText, filter) VALUES ('static', '', 'all');`),
+        sqlite3,
+        otelTracer,
+        otelRootSpanContext: otelContext,
+    });
+    const storeContext = { store };
+    const wrapper = ({ children }) => (React.createElement(LiveStoreReact.LiveStoreContext.Provider, { value: storeContext }, children));
+    return { wrapper, AppSchema, store };
+};
+//# sourceMappingURL=fixture.js.map

package/dist/__tests__/react/fixture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixture.js","sourceRoot":"","sources":["../../../src/__tests__/react/fixture.tsx"],"names":[],"mappings":"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"}

package/dist/__tests__/react/useComponentState.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=useComponentState.test.d.ts.map

package/dist/__tests__/react/useComponentState.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useComponentState.test.d.ts","sourceRoot":"","sources":["../../../src/__tests__/react/useComponentState.test.tsx"],"names":[],"mappings":""}

package/dist/__tests__/react/useComponentState.test.js

@@ -0,0 +1,68 @@
+import { act, renderHook } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+import { sql } from '../../index.js';
+import * as LiveStoreReact from '../../react/index.js';
+import { makeTodoMvc } from './fixture.js';
+describe('useComponentState', () => {
+    it('should update the data based on component key', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema, store } = await makeTodoMvc();
+        const { result, rerender } = renderHook((userId) => {
+            renderCount++;
+            return LiveStoreReact.useComponentState({
+                schema: AppSchema,
+                componentKey: { name: 'UserInfo', id: userId },
+            });
+        }, { wrapper, initialProps: 'u1' });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('');
+        expect(renderCount).toBe(1);
+        act(() => {
+            void store.execute(sql `INSERT INTO components__UserInfo (id, username) VALUES ('u2', 'username_u2');`);
+        });
+        rerender('u2');
+        expect(result.current.state.id).toBe('u2');
+        expect(result.current.state.username).toBe('username_u2');
+        expect(renderCount).toBe(2);
+    });
+    it('should update the data reactively - via setState', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema } = await makeTodoMvc();
+        const { result } = renderHook((userId) => {
+            renderCount++;
+            return LiveStoreReact.useComponentState({
+                schema: AppSchema,
+                componentKey: { name: 'UserInfo', id: userId },
+            });
+        }, { wrapper, initialProps: 'u1' });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('');
+        expect(renderCount).toBe(1);
+        act(() => result.current.setState.username('username_u1_hello'));
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('username_u1_hello');
+        expect(renderCount).toBe(2);
+    });
+    it('should update the data reactively - via raw store update', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema, store } = await makeTodoMvc();
+        const { result } = renderHook((userId) => {
+            renderCount++;
+            return LiveStoreReact.useComponentState({
+                schema: AppSchema,
+                componentKey: { name: 'UserInfo', id: userId },
+            });
+        }, { wrapper, initialProps: 'u1' });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('');
+        expect(renderCount).toBe(1);
+        act(() => result.current.setState.username('username_u1_hello'));
+        act(() => {
+            void store.execute(sql `UPDATE components__UserInfo SET username = 'username_u1_hello' WHERE id = 'u1';`);
+        });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('username_u1_hello');
+        expect(renderCount).toBe(2);
+    });
+});
+//# sourceMappingURL=useComponentState.test.js.map

package/dist/__tests__/react/useComponentState.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useComponentState.test.js","sourceRoot":"","sources":["../../../src/__tests__/react/useComponentState.test.tsx"],"names":[],"mappings":"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"}

package/dist/__tests__/react/useLQuery.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=useLQuery.test.d.ts.map

package/dist/__tests__/react/useLQuery.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLQuery.test.d.ts","sourceRoot":"","sources":["../../../src/__tests__/react/useLQuery.test.tsx"],"names":[],"mappings":""}

package/dist/__tests__/react/useLQuery.test.js

@@ -0,0 +1,38 @@
+import { makeNoopTracer } from '@livestore/utils';
+import * as otel from '@opentelemetry/api';
+import { renderHook } from '@testing-library/react';
+import { describe, it } from 'vitest';
+import * as LiveStoreReact from '../../react/index.js';
+import { LiveStoreSQLQuery } from '../../reactiveQueries/sql.js';
+import { makeTodoMvc } from './fixture.js';
+describe.only('useQuery', () => {
+    it('todo', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema, store } = await makeTodoMvc();
+        const { result, rerender } = renderHook((userId) => {
+            renderCount++;
+            const query = new LiveStoreSQLQuery({
+                label: 'todo',
+                otelContext: otel.context.active(),
+                otelTracer: makeNoopTracer(),
+                payload: {
+                    genQueryString: `select * from todos`,
+                    queriedTables: ['todos'],
+                },
+            });
+            return LiveStoreReact.useQuery(query);
+        }, { wrapper, initialProps: 'u1' });
+        console.log(result.current);
+        // expect(result.current.state.id).toBe('u1')
+        // expect(result.current.state.username).toBe('')
+        // expect(renderCount).toBe(1)
+        // act(() => {
+        //   void store.execute(sql`INSERT INTO components__UserInfo (id, username) VALUES ('u2', 'username_u2');`)
+        // })
+        // rerender('u2')
+        // expect(result.current.state.id).toBe('u2')
+        // expect(result.current.state.username).toBe('username_u2')
+        // expect(renderCount).toBe(2)
+    });
+});
+//# sourceMappingURL=useLQuery.test.js.map

package/dist/__tests__/react/useLQuery.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLQuery.test.js","sourceRoot":"","sources":["../../../src/__tests__/react/useLQuery.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,KAAK,IAAI,MAAM,oBAAoB,CAAA;AAC1C,OAAO,EAAO,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAU,EAAE,EAAE,MAAM,QAAQ,CAAA;AAE7C,OAAO,KAAK,cAAc,MAAM,sBAAsB,CAAA;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE1C,QAAQ,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,EAAE;IAC7B,EAAE,CAAC,MAAM,EAAE,KAAK,IAAI,EAAE;QACpB,IAAI,WAAW,GAAG,CAAC,CAAA;QAEnB,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,MAAM,WAAW,EAAE,CAAA;QAEzD,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CACrC,CAAC,MAAc,EAAE,EAAE;YACjB,WAAW,EAAE,CAAA;YAEb,MAAM,KAAK,GAAG,IAAI,iBAAiB,CAAO;gBACxC,KAAK,EAAE,MAAM;gBACb,WAAW,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;gBAClC,UAAU,EAAE,cAAc,EAAE;gBAC5B,OAAO,EAAE;oBACP,cAAc,EAAE,qBAAqB;oBACrC,aAAa,EAAE,CAAC,OAAO,CAAC;iBACzB;aACF,CAAC,CAAA;YAEF,OAAO,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;QACvC,CAAC,EACD,EAAE,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,CAChC,CAAA;QAED,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QAE3B,6CAA6C;QAC7C,iDAAiD;QACjD,8BAA8B;QAE9B,cAAc;QACd,2GAA2G;QAC3G,KAAK;QAEL,iBAAiB;QAEjB,6CAA6C;QAC7C,4DAA4D;QAC5D,8BAA8B;IAChC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/dist/__tests__/react/useLiveStoreComponent.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=useLiveStoreComponent.test.d.ts.map

package/dist/__tests__/react/useLiveStoreComponent.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLiveStoreComponent.test.d.ts","sourceRoot":"","sources":["../../../src/__tests__/react/useLiveStoreComponent.test.tsx"],"names":[],"mappings":""}

package/dist/__tests__/react/useLiveStoreComponent.test.js

@@ -0,0 +1,73 @@
+import { act, renderHook } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+import { sql } from '../../index.js';
+import * as LiveStoreReact from '../../react/index.js';
+import { makeTodoMvc } from './fixture.js';
+describe('useLiveStoreComponent', () => {
+    it('should update the data based on component key', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema, store } = await makeTodoMvc();
+        const { result, rerender } = renderHook((userId) => {
+            renderCount++;
+            return LiveStoreReact.useLiveStoreComponent({
+                stateSchema: AppSchema,
+                componentKey: { name: 'UserInfo', id: userId },
+                queries: () => ({}),
+            });
+        }, { wrapper, initialProps: 'u1' });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('');
+        expect(renderCount).toBe(1);
+        act(() => {
+            void store.execute(sql `INSERT INTO components__UserInfo (id, username) VALUES ('u2', 'username_u2');`);
+        });
+        rerender('u2');
+        expect(result.current.state.id).toBe('u2');
+        expect(result.current.state.username).toBe('username_u2');
+        expect(renderCount).toBe(2);
+    });
+    it('should update the data reactively - via setState', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema } = await makeTodoMvc();
+        const { result } = renderHook((userId) => {
+            renderCount++;
+            return LiveStoreReact.useLiveStoreComponent({
+                stateSchema: AppSchema,
+                componentKey: { name: 'UserInfo', id: userId },
+                queries: () => ({}),
+            });
+        }, { wrapper, initialProps: 'u1' });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('');
+        expect(renderCount).toBe(1);
+        act(() => result.current.setState.username('username_u1_hello'));
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('username_u1_hello');
+        expect(renderCount).toBe(2);
+    });
+    it('should update the data reactively - via raw store update', async () => {
+        let renderCount = 0;
+        const { wrapper, AppSchema, store } = await makeTodoMvc();
+        const { result } = renderHook((userId) => {
+            renderCount++;
+            return LiveStoreReact.useLiveStoreComponent({
+                stateSchema: AppSchema,
+                componentKey: { name: 'UserInfo', id: userId },
+                queries: () => ({}),
+            });
+        }, { wrapper, initialProps: 'u1' });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('');
+        expect(renderCount).toBe(1);
+        act(() => result.current.setState.username('username_u1_hello'));
+        act(() => {
+            void store.execute(sql `UPDATE components__UserInfo SET username = 'username_u1_hello' WHERE id = 'u1';`);
+        });
+        expect(result.current.state.id).toBe('u1');
+        expect(result.current.state.username).toBe('username_u1_hello');
+        expect(renderCount).toBe(2);
+    });
+});
+// TODO add a test case that tests the `queries` callback
+// TODO add a test case that tests the `subscribe` in the `queries` callback
+//# sourceMappingURL=useLiveStoreComponent.test.js.map

package/dist/__tests__/react/useLiveStoreComponent.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLiveStoreComponent.test.js","sourceRoot":"","sources":["../../../src/__tests__/react/useLiveStoreComponent.test.tsx"],"names":[],"mappings":"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"}

package/dist/__tests__/react/useQuery.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=useQuery.test.d.ts.map

package/dist/__tests__/react/useQuery.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useQuery.test.d.ts","sourceRoot":"","sources":["../../../src/__tests__/react/useQuery.test.tsx"],"names":[],"mappings":""}

package/dist/__tests__/react/useQuery.test.js

@@ -0,0 +1,33 @@
+import { act, renderHook } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+import * as LiveStoreReact from '../../react/index.js';
+import { LiveStoreSQLQuery } from '../../reactiveQueries/sql.js';
+import { sql } from '../../util.js';
+import { makeTodoMvc } from './fixture.js';
+const query = new LiveStoreSQLQuery({
+    label: 'todo',
+    genQueryString: `select * from todos`,
+    queriedTables: ['todos'],
+});
+describe('useQuery', () => {
+    it('simple', async () => {
+        let renderCount = 0;
+        const { wrapper, store } = await makeTodoMvc();
+        const { result } = renderHook(() => {
+            renderCount++;
+            return LiveStoreReact.useQuery(query);
+        }, { wrapper });
+        expect(result.current.length).toBe(0);
+        expect(renderCount).toBe(1);
+        act(() => store.applyEvent('RawSql', {
+            sql: sql `INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0);`,
+            bindValues: {},
+            writeTables: ['todos'],
+        }));
+        expect(result.current.length).toBe(1);
+        expect(result.current[0].text).toBe('buy milk');
+        expect(renderCount).toBe(2);
+    });
+});
+// TODO write tests that use the same query in multiple components at the same time with different bind values
+//# sourceMappingURL=useQuery.test.js.map

package/dist/__tests__/react/useQuery.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useQuery.test.js","sourceRoot":"","sources":["../../../src/__tests__/react/useQuery.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAA;AAE7C,OAAO,KAAK,cAAc,MAAM,sBAAsB,CAAA;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAChE,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AAEnC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE1C,MAAM,KAAK,GAAG,IAAI,iBAAiB,CAAO;IACxC,KAAK,EAAE,MAAM;IACb,cAAc,EAAE,qBAAqB;IACrC,aAAa,EAAE,CAAC,OAAO,CAAC;CACzB,CAAC,CAAA;AAEF,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,QAAQ,EAAE,KAAK,IAAI,EAAE;QACtB,IAAI,WAAW,GAAG,CAAC,CAAA;QAEnB,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,MAAM,WAAW,EAAE,CAAA;QAE9C,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAC3B,GAAG,EAAE;YACH,WAAW,EAAE,CAAA;YAEb,OAAO,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;QACvC,CAAC,EACD,EAAE,OAAO,EAAE,CACZ,CAAA;QAED,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;QACrC,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;QAE3B,GAAG,CAAC,GAAG,EAAE,CACP,KAAK,CAAC,UAAU,CAAC,QAAQ,EAAE;YACzB,GAAG,EAAE,GAAG,CAAA,uEAAuE;YAC/E,UAAU,EAAE,EAAE;YACd,WAAW,EAAE,CAAC,OAAO,CAAC;SACvB,CAAC,CACH,CAAA;QAED,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;QACrC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QAChD,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;IAC7B,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA;AAEF,8GAA8G"}

package/dist/__tests__/react/utils/extractStackInfoFromStackTrace.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=extractStackInfoFromStackTrace.test.d.ts.map

package/dist/__tests__/react/utils/extractStackInfoFromStackTrace.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"extractStackInfoFromStackTrace.test.d.ts","sourceRoot":"","sources":["../../../../src/__tests__/react/utils/extractStackInfoFromStackTrace.test.ts"],"names":[],"mappings":""}

package/dist/__tests__/react/utils/extractStackInfoFromStackTrace.test.js

@@ -0,0 +1,38 @@
+import { expect, it } from 'vitest';
+import { extractStackInfoFromStackTrace } from '../../../react/utils/extractStackInfoFromStackTrace.js';
+it('RouteLink stacktrace', async () => {
+    const stackTrace = `\
+Error
+	at https://localhost:8081/@fs/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/livestore/dist/react/useQuery.js?t=1699550216884:18:23
+	at mountMemo (https://localhost:8081/node_modules/.vite-web/deps/chunk-M23HUTQV.js?v=3eb66ed6:12817:27)
+	at Object.useMemo (https://localhost:8081/node_modules/.vite-web/deps/chunk-M23HUTQV.js?v=3eb66ed6:13141:24)
+	at Object.useMemo (https://localhost:8081/node_modules/.vite-web/deps/chunk-4WADDZ2G.js?v=3eb66ed6:1094:29)
+	at useQuery (https://localhost:8081/@fs/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/livestore/dist/react/useQuery.js?t=1699550216884:13:33)
+	at useAppState (https://localhost:8081/src/db/AppState.ts?t=1699550216884:17:34)
+	at useRoute (https://localhost:8081/src/db/AppState.ts?t=1699550216884:74:22)
+	at RouteLink (https://localhost:8081/src/components/Link.tsx?t=1699550216884:36:7)
+	at renderWithHooks (https://localhost:8081/node_modules/.vite-web/deps/chunk-M23HUTQV.js?v=3eb66ed6:12171:26)
+	at mountIndeterminateComponent (https://localhost:8081/node_modules/.vite-web/deps/chunk-M23HUTQV.js?v=3eb66ed6:14921:21)
+`;
+    expect(extractStackInfoFromStackTrace(stackTrace)).toMatchInlineSnapshot(`
+    [
+      {
+        "filePath": "https://localhost:8081/src/components/Link.tsx?t=1699550216884:36:7",
+        "name": "RouteLink",
+      },
+      {
+        "filePath": "https://localhost:8081/src/db/AppState.ts?t=1699550216884:74:22",
+        "name": "useRoute",
+      },
+      {
+        "filePath": "https://localhost:8081/src/db/AppState.ts?t=1699550216884:17:34",
+        "name": "useAppState",
+      },
+      {
+        "filePath": "https://localhost:8081/@fs/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/livestore/dist/react/useQuery.js?t=1699550216884:13:33",
+        "name": "useQuery",
+      },
+    ]
+  `);
+});
+//# sourceMappingURL=extractStackInfoFromStackTrace.test.js.map

package/dist/__tests__/react/utils/extractStackInfoFromStackTrace.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"extractStackInfoFromStackTrace.test.js","sourceRoot":"","sources":["../../../../src/__tests__/react/utils/extractStackInfoFromStackTrace.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAA;AAEnC,OAAO,EAAE,8BAA8B,EAAE,MAAM,wDAAwD,CAAA;AAEvG,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;IACpC,MAAM,UAAU,GAAG;;;;;;;;;;;;CAYpB,CAAA;IAEC,MAAM,CAAC,8BAA8B,CAAC,UAAU,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;;;GAmBxE,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/dist/__tests__/reactive.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=reactive.test.d.ts.map

package/dist/__tests__/reactive.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactive.test.d.ts","sourceRoot":"","sources":["../../src/__tests__/reactive.test.ts"],"names":[],"mappings":""}