@electric-sql/react 0.6.1 → 0.6.2

package/dist/cjs/index.cjs

@@ -1,3 +1,4 @@
+"use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -139,6 +140,7 @@ function parseShapeData(shape) {
     lastSyncedAt: shape.lastSyncedAt(),
     isError: shape.error !== false,
     shape,
+    stream: shape.stream,
     error: shape.error
   };
 }

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts","../../src/react-hooks.tsx"],"sourcesContent":["export * from './react-hooks'\n","import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":"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","names":["React"]}
+{"version":3,"sources":["../../src/index.ts","../../src/react-hooks.tsx"],"sourcesContent":["export * from './react-hooks'\n","import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /**\n   * The ShapeStream instance used by this Shape\n   * @type {ShapeStream<T>}\n   */\n  stream: ShapeStream<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    stream: shape.stream as ShapeStream<T>,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":"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","names":["React"]}

package/dist/cjs/index.d.cts

@@ -0,0 +1,35 @@
+import { Row, ShapeStreamOptions, GetExtensions, Shape, ShapeStream } from '@electric-sql/client';
+
+declare function preloadShape<T extends Row<unknown> = Row>(options: ShapeStreamOptions<GetExtensions<T>>): Promise<Shape<T>>;
+declare function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string;
+declare function getShapeStream<T extends Row<unknown>>(options: ShapeStreamOptions<GetExtensions<T>>): ShapeStream<T>;
+declare function getShape<T extends Row<unknown>>(shapeStream: ShapeStream<T>): Shape<T>;
+interface UseShapeResult<T extends Row<unknown> = Row> {
+    /**
+     * The array of rows that make up the Shape.
+     * @type {T[]}
+     */
+    data: T[];
+    /**
+     * The Shape instance used by this useShape
+     * @type {Shape<T>}
+     */
+    shape: Shape<T>;
+    /**
+     * The ShapeStream instance used by this Shape
+     * @type {ShapeStream<T>}
+     */
+    stream: ShapeStream<T>;
+    /** True during initial fetch. False afterwise. */
+    isLoading: boolean;
+    /** Unix time at which we last synced. Undefined when `isLoading` is true. */
+    lastSyncedAt?: number;
+    error: Shape<T>[`error`];
+    isError: boolean;
+}
+interface UseShapeOptions<SourceData extends Row<unknown>, Selection> extends ShapeStreamOptions<GetExtensions<SourceData>> {
+    selector?: (value: UseShapeResult<SourceData>) => Selection;
+}
+declare function useShape<SourceData extends Row<unknown> = Row, Selection = UseShapeResult<SourceData>>({ selector, ...options }: UseShapeOptions<SourceData, Selection>): Selection;
+
+export { type UseShapeResult, getShape, getShapeStream, preloadShape, sortedOptionsHash, useShape };

package/dist/index.browser.mjs

@@ -1,2 +1,2 @@
-var w=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable;var l=(e,n)=>{var t={};for(var a in e)y.call(e,a)&&n.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&w)for(var a of w(e))n.indexOf(a)<0&&g.call(e,a)&&(t[a]=e[a]);return t};var d=(e,n,t)=>new Promise((a,r)=>{var s=o=>{try{S(t.next(o))}catch(i){r(i)}},h=o=>{try{S(t.throw(o))}catch(i){r(i)}},S=o=>o.done?a(o.value):Promise.resolve(o.value).then(s,h);S((t=t.apply(e,n)).next())});import{Shape as k,ShapeStream as D}from"@electric-sql/client";import O from"react";import{useSyncExternalStoreWithSelector as U}from"use-sync-external-store/with-selector.js";var p=new Map,u=new Map;function J(e){return d(this,null,function*(){let n=f(e),t=x(n);return yield t.rows,t})}function c(e){return typeof e!="object"||e===null?e:Array.isArray(e)?e.map(c):Object.keys(e).sort().reduce((n,t)=>(n[t]=c(e[t]),n),{})}function m(e){return JSON.stringify(c(e))}function f(e){var a;let n=m(e);if(p.has(n)){let r=p.get(n);if(!((a=r.options.signal)!=null&&a.aborted))return r;p.delete(n),u.delete(r)}let t=new D(e);return p.set(n,t),t}function x(e){var t;if(u.has(e)){if(!((t=e.options.signal)!=null&&t.aborted))return u.get(e);p.delete(m(e.options)),u.delete(e)}let n=new k(e);return u.set(e,n),n}function b(e,n){let t=e.subscribe(n);return()=>{t()}}function T(e){return{data:e.currentRows,isLoading:e.isLoading(),lastSyncedAt:e.lastSyncedAt(),isError:e.error!==!1,shape:e,error:e.error}}function E(e){return e}function K(t){var a=t,{selector:e=E}=a,n=l(a,["selector"]);let r=f(n),s=x(r);return O.useMemo(()=>{let S=T(s),o=()=>S,i=R=>b(s,()=>{S=T(s),R()});return()=>U(i,o,o,e)},[s,e])()}export{x as getShape,f as getShapeStream,J as preloadShape,m as sortedOptionsHash,K as useShape};
+var w=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable;var l=(e,n)=>{var t={};for(var a in e)y.call(e,a)&&n.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&w)for(var a of w(e))n.indexOf(a)<0&&g.call(e,a)&&(t[a]=e[a]);return t};var T=(e,n,t)=>new Promise((a,o)=>{var s=r=>{try{S(t.next(r))}catch(p){o(p)}},h=r=>{try{S(t.throw(r))}catch(p){o(p)}},S=r=>r.done?a(r.value):Promise.resolve(r.value).then(s,h);S((t=t.apply(e,n)).next())});import{Shape as k,ShapeStream as D}from"@electric-sql/client";import O from"react";import{useSyncExternalStoreWithSelector as U}from"use-sync-external-store/with-selector.js";var i=new Map,u=new Map;function J(e){return T(this,null,function*(){let n=f(e),t=x(n);return yield t.rows,t})}function c(e){return typeof e!="object"||e===null?e:Array.isArray(e)?e.map(c):Object.keys(e).sort().reduce((n,t)=>(n[t]=c(e[t]),n),{})}function d(e){return JSON.stringify(c(e))}function f(e){var a;let n=d(e);if(i.has(n)){let o=i.get(n);if(!((a=o.options.signal)!=null&&a.aborted))return o;i.delete(n),u.delete(o)}let t=new D(e);return i.set(n,t),t}function x(e){var t;if(u.has(e)){if(!((t=e.options.signal)!=null&&t.aborted))return u.get(e);i.delete(d(e.options)),u.delete(e)}let n=new k(e);return u.set(e,n),n}function b(e,n){let t=e.subscribe(n);return()=>{t()}}function m(e){return{data:e.currentRows,isLoading:e.isLoading(),lastSyncedAt:e.lastSyncedAt(),isError:e.error!==!1,shape:e,stream:e.stream,error:e.error}}function E(e){return e}function K(t){var a=t,{selector:e=E}=a,n=l(a,["selector"]);let o=f(n),s=x(o);return O.useMemo(()=>{let S=m(s),r=()=>S,p=R=>b(s,()=>{S=m(s),R()});return()=>U(p,r,r,e)},[s,e])()}export{x as getShape,f as getShapeStream,J as preloadShape,d as sortedOptionsHash,K as useShape};
 //# sourceMappingURL=index.browser.mjs.map

package/dist/index.browser.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/react-hooks.tsx"],"sourcesContent":["import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":"geAAA,OACE,SAAAA,EACA,eAAAC,MAIK,uBACP,OAAOC,MAAW,QAClB,OAAS,oCAAAC,MAAwC,2CAKjD,IAAMC,EAAc,IAAI,IAClBC,EAAa,IAAI,IAEvB,SAAsBC,EACpBC,EACmB,QAAAC,EAAA,sBACnB,IAAMC,EAAcC,EAAkBH,CAAO,EACvCI,EAAQC,EAAYH,CAAW,EACrC,aAAME,EAAM,KACLA,CACT,GAGA,SAASE,EAAeC,EAAe,CACrC,OAAI,OAAOA,GAAQ,UAAYA,IAAQ,KAAaA,EAEhD,MAAM,QAAQA,CAAG,EACZA,EAAI,IAAID,CAAc,EAI7B,OAAO,KAAKC,CAAG,EACZ,KAAK,EAEL,OAA4B,CAACC,EAAQC,KACpCD,EAAOC,CAAG,EAAIH,EAAeC,EAAIE,CAAG,CAAC,EAC9BD,GACN,CAAC,CAAC,CAEX,CAEO,SAASE,EAAqBV,EAAwC,CAC3E,OAAO,KAAK,UAAUM,EAAeN,CAAO,CAAC,CAC/C,CAEO,SAASG,EACdH,EACgB,CAlDlB,IAAAW,EAmDE,IAAMC,EAAYF,EAAkBV,CAAO,EAG3C,GAAIH,EAAY,IAAIe,CAAS,EAAG,CAC9B,IAAMC,EAAShB,EAAY,IAAIe,CAAS,EACxC,GAAI,GAACD,EAAAE,EAAO,QAAQ,SAAf,MAAAF,EAAuB,SAC1B,OAAOE,EAIThB,EAAY,OAAOe,CAAS,EAC5Bd,EAAW,OAAOe,CAAM,CAC1B,CAEA,IAAMC,EAAiB,IAAIC,EAAef,CAAO,EACjD,OAAAH,EAAY,IAAIe,EAAWE,CAAc,EAGlCA,CACT,CAEO,SAAST,EACdH,EACU,CA1EZ,IAAAS,EA4EE,GAAIb,EAAW,IAAII,CAAW,EAAG,CAC/B,GAAI,GAACS,EAAAT,EAAY,QAAQ,SAApB,MAAAS,EAA4B,SAC/B,OAAOb,EAAW,IAAII,CAAW,EAInCL,EAAY,OAAOa,EAAkBR,EAAY,OAAO,CAAC,EACzDJ,EAAW,OAAOI,CAAW,CAC/B,CAEA,IAAMc,EAAW,IAAIC,EAASf,CAAW,EACzC,OAAAJ,EAAW,IAAII,EAAac,CAAQ,EAG7BA,CACT,CAqBA,SAASE,EACPd,EACAe,EACA,CACA,IAAMC,EAAchB,EAAM,UAAUe,CAAQ,EAC5C,MAAO,IAAM,CACXC,EAAY,CACd,CACF,CAEA,SAASC,EACPjB,EACmB,CACnB,MAAO,CACL,KAAMA,EAAM,YACZ,UAAWA,EAAM,UAAU,EAC3B,aAAcA,EAAM,aAAa,EACjC,QAASA,EAAM,QAAU,GACzB,MAAAA,EACA,MAAOA,EAAM,KACf,CACF,CAEA,SAASkB,EAAYC,EAAW,CAC9B,OAAOA,CACT,CAOO,SAASC,EAGdb,EAGoD,CAHpD,IAAAc,EAAAd,EACA,UAAAe,EAAWJ,CApJb,EAmJEG,EAEGzB,EAAA2B,EAFHF,EAEG,CADH,aAGA,IAAMvB,EAAcC,EAClBH,CACF,EACMI,EAAQC,EAAqBH,CAAW,EAqB9C,OAnBqB0B,EAAM,QAAQ,IAAM,CACvC,IAAIC,EAAkBR,EAAejB,CAAK,EACpC0B,EAAc,IAAMD,EACpBE,EAAaC,GACjBd,EAAed,EAAO,IAAM,CAC1ByB,EAAkBR,EAAejB,CAAK,EACtC4B,EAAc,CAChB,CAAC,EAEH,MAAO,IACEC,EACLF,EACAD,EACAA,EACAJ,CACF,CAEJ,EAAG,CAACtB,EAAOsB,CAAQ,CAAC,EAEA,CACtB","names":["Shape","ShapeStream","React","useSyncExternalStoreWithSelector","streamCache","shapeCache","preloadShape","options","__async","shapeStream","getShapeStream","shape","getShape","sortObjectKeys","obj","sorted","key","sortedOptionsHash","_a","shapeHash","stream","newShapeStream","ShapeStream","newShape","Shape","shapeSubscribe","callback","unsubscribe","parseShapeData","identity","arg","useShape","_b","selector","__objRest","React","latestShapeData","getSnapshot","subscribe","onStoreChange","useSyncExternalStoreWithSelector"]}
+{"version":3,"sources":["../src/react-hooks.tsx"],"sourcesContent":["import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /**\n   * The ShapeStream instance used by this Shape\n   * @type {ShapeStream<T>}\n   */\n  stream: ShapeStream<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    stream: shape.stream as ShapeStream<T>,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":"geAAA,OACE,SAAAA,EACA,eAAAC,MAIK,uBACP,OAAOC,MAAW,QAClB,OAAS,oCAAAC,MAAwC,2CAKjD,IAAMC,EAAc,IAAI,IAClBC,EAAa,IAAI,IAEvB,SAAsBC,EACpBC,EACmB,QAAAC,EAAA,sBACnB,IAAMC,EAAcC,EAAkBH,CAAO,EACvCI,EAAQC,EAAYH,CAAW,EACrC,aAAME,EAAM,KACLA,CACT,GAGA,SAASE,EAAeC,EAAe,CACrC,OAAI,OAAOA,GAAQ,UAAYA,IAAQ,KAAaA,EAEhD,MAAM,QAAQA,CAAG,EACZA,EAAI,IAAID,CAAc,EAI7B,OAAO,KAAKC,CAAG,EACZ,KAAK,EAEL,OAA4B,CAACC,EAAQC,KACpCD,EAAOC,CAAG,EAAIH,EAAeC,EAAIE,CAAG,CAAC,EAC9BD,GACN,CAAC,CAAC,CAEX,CAEO,SAASE,EAAqBV,EAAwC,CAC3E,OAAO,KAAK,UAAUM,EAAeN,CAAO,CAAC,CAC/C,CAEO,SAASG,EACdH,EACgB,CAlDlB,IAAAW,EAmDE,IAAMC,EAAYF,EAAkBV,CAAO,EAG3C,GAAIH,EAAY,IAAIe,CAAS,EAAG,CAC9B,IAAMC,EAAShB,EAAY,IAAIe,CAAS,EACxC,GAAI,GAACD,EAAAE,EAAO,QAAQ,SAAf,MAAAF,EAAuB,SAC1B,OAAOE,EAIThB,EAAY,OAAOe,CAAS,EAC5Bd,EAAW,OAAOe,CAAM,CAC1B,CAEA,IAAMC,EAAiB,IAAIC,EAAef,CAAO,EACjD,OAAAH,EAAY,IAAIe,EAAWE,CAAc,EAGlCA,CACT,CAEO,SAAST,EACdH,EACU,CA1EZ,IAAAS,EA4EE,GAAIb,EAAW,IAAII,CAAW,EAAG,CAC/B,GAAI,GAACS,EAAAT,EAAY,QAAQ,SAApB,MAAAS,EAA4B,SAC/B,OAAOb,EAAW,IAAII,CAAW,EAInCL,EAAY,OAAOa,EAAkBR,EAAY,OAAO,CAAC,EACzDJ,EAAW,OAAOI,CAAW,CAC/B,CAEA,IAAMc,EAAW,IAAIC,EAASf,CAAW,EACzC,OAAAJ,EAAW,IAAII,EAAac,CAAQ,EAG7BA,CACT,CA0BA,SAASE,EACPd,EACAe,EACA,CACA,IAAMC,EAAchB,EAAM,UAAUe,CAAQ,EAC5C,MAAO,IAAM,CACXC,EAAY,CACd,CACF,CAEA,SAASC,EACPjB,EACmB,CACnB,MAAO,CACL,KAAMA,EAAM,YACZ,UAAWA,EAAM,UAAU,EAC3B,aAAcA,EAAM,aAAa,EACjC,QAASA,EAAM,QAAU,GACzB,MAAAA,EACA,OAAQA,EAAM,OACd,MAAOA,EAAM,KACf,CACF,CAEA,SAASkB,EAAYC,EAAW,CAC9B,OAAOA,CACT,CAOO,SAASC,EAGdb,EAGoD,CAHpD,IAAAc,EAAAd,EACA,UAAAe,EAAWJ,CA1Jb,EAyJEG,EAEGzB,EAAA2B,EAFHF,EAEG,CADH,aAGA,IAAMvB,EAAcC,EAClBH,CACF,EACMI,EAAQC,EAAqBH,CAAW,EAqB9C,OAnBqB0B,EAAM,QAAQ,IAAM,CACvC,IAAIC,EAAkBR,EAAejB,CAAK,EACpC0B,EAAc,IAAMD,EACpBE,EAAaC,GACjBd,EAAed,EAAO,IAAM,CAC1ByB,EAAkBR,EAAejB,CAAK,EACtC4B,EAAc,CAChB,CAAC,EAEH,MAAO,IACEC,EACLF,EACAD,EACAA,EACAJ,CACF,CAEJ,EAAG,CAACtB,EAAOsB,CAAQ,CAAC,EAEA,CACtB","names":["Shape","ShapeStream","React","useSyncExternalStoreWithSelector","streamCache","shapeCache","preloadShape","options","__async","shapeStream","getShapeStream","shape","getShape","sortObjectKeys","obj","sorted","key","sortedOptionsHash","_a","shapeHash","stream","newShapeStream","ShapeStream","newShape","Shape","shapeSubscribe","callback","unsubscribe","parseShapeData","identity","arg","useShape","_b","selector","__objRest","React","latestShapeData","getSnapshot","subscribe","onStoreChange","useSyncExternalStoreWithSelector"]}

package/dist/index.d.ts

@@ -15,6 +15,11 @@ interface UseShapeResult<T extends Row<unknown> = Row> {
      * @type {Shape<T>}
      */
     shape: Shape<T>;
+    /**
+     * The ShapeStream instance used by this Shape
+     * @type {ShapeStream<T>}
+     */
+    stream: ShapeStream<T>;
     /** True during initial fetch. False afterwise. */
     isLoading: boolean;
     /** Unix time at which we last synced. Undefined when `isLoading` is true. */

package/dist/index.legacy-esm.js

@@ -83,6 +83,7 @@ function parseShapeData(shape) {
     lastSyncedAt: shape.lastSyncedAt(),
     isError: shape.error !== false,
     shape,
+    stream: shape.stream,
     error: shape.error
   };
 }

package/dist/index.legacy-esm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/react-hooks.tsx"],"sourcesContent":["import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAIK;AACP,OAAO,WAAW;AAClB,SAAS,wCAAwC;AAKjD,IAAM,cAAc,oBAAI,IAAgC;AACxD,IAAM,aAAa,oBAAI,IAAsC;AAE7D,eAAsB,aACpB,SACmB;AACnB,QAAM,cAAc,eAAkB,OAAO;AAC7C,QAAM,QAAQ,SAAY,WAAW;AACrC,QAAM,MAAM;AACZ,SAAO;AACT;AAGA,SAAS,eAAe,KAAe;AACrC,MAAI,OAAO,QAAQ,YAAY,QAAQ,KAAM,QAAO;AAEpD,MAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,WAAO,IAAI,IAAI,cAAc;AAAA,EAC/B;AAEA,SACE,OAAO,KAAK,GAAG,EACZ,KAAK,EAEL,OAA4B,CAAC,QAAQ,QAAQ;AAC5C,WAAO,GAAG,IAAI,eAAe,IAAI,GAAG,CAAC;AACrC,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AAEX;AAEO,SAAS,kBAAqB,SAAwC;AAC3E,SAAO,KAAK,UAAU,eAAe,OAAO,CAAC;AAC/C;AAEO,SAAS,eACd,SACgB;AAlDlB;AAmDE,QAAM,YAAY,kBAAkB,OAAO;AAG3C,MAAI,YAAY,IAAI,SAAS,GAAG;AAC9B,UAAM,SAAS,YAAY,IAAI,SAAS;AACxC,QAAI,GAAC,YAAO,QAAQ,WAAf,mBAAuB,UAAS;AACnC,aAAO;AAAA,IACT;AAGA,gBAAY,OAAO,SAAS;AAC5B,eAAW,OAAO,MAAM;AAAA,EAC1B;AAEA,QAAM,iBAAiB,IAAI,YAAe,OAAO;AACjD,cAAY,IAAI,WAAW,cAAc;AAGzC,SAAO;AACT;AAEO,SAAS,SACd,aACU;AA1EZ;AA4EE,MAAI,WAAW,IAAI,WAAW,GAAG;AAC/B,QAAI,GAAC,iBAAY,QAAQ,WAApB,mBAA4B,UAAS;AACxC,aAAO,WAAW,IAAI,WAAW;AAAA,IACnC;AAGA,gBAAY,OAAO,kBAAkB,YAAY,OAAO,CAAC;AACzD,eAAW,OAAO,WAAW;AAAA,EAC/B;AAEA,QAAM,WAAW,IAAI,MAAS,WAAW;AACzC,aAAW,IAAI,aAAa,QAAQ;AAGpC,SAAO;AACT;AAqBA,SAAS,eACP,OACA,UACA;AACA,QAAM,cAAc,MAAM,UAAU,QAAQ;AAC5C,SAAO,MAAM;AACX,gBAAY;AAAA,EACd;AACF;AAEA,SAAS,eACP,OACmB;AACnB,SAAO;AAAA,IACL,MAAM,MAAM;AAAA,IACZ,WAAW,MAAM,UAAU;AAAA,IAC3B,cAAc,MAAM,aAAa;AAAA,IACjC,SAAS,MAAM,UAAU;AAAA,IACzB;AAAA,IACA,OAAO,MAAM;AAAA,EACf;AACF;AAEA,SAAS,SAAY,KAAW;AAC9B,SAAO;AACT;AAOO,SAAS,SAGd,IAGoD;AAHpD,eACA;AAAA,eAAW;AAAA,EApJb,IAmJE,IAEG,oBAFH,IAEG;AAAA,IADH;AAAA;AAGA,QAAM,cAAc;AAAA,IAClB;AAAA,EACF;AACA,QAAM,QAAQ,SAAqB,WAAW;AAE9C,QAAM,eAAe,MAAM,QAAQ,MAAM;AACvC,QAAI,kBAAkB,eAAe,KAAK;AAC1C,UAAM,cAAc,MAAM;AAC1B,UAAM,YAAY,CAAC,kBACjB,eAAe,OAAO,MAAM;AAC1B,wBAAkB,eAAe,KAAK;AACtC,oBAAc;AAAA,IAChB,CAAC;AAEH,WAAO,MAAM;AACX,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,SAAO,aAAa;AACtB;","names":[]}
+{"version":3,"sources":["../src/react-hooks.tsx"],"sourcesContent":["import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /**\n   * The ShapeStream instance used by this Shape\n   * @type {ShapeStream<T>}\n   */\n  stream: ShapeStream<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    stream: shape.stream as ShapeStream<T>,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAIK;AACP,OAAO,WAAW;AAClB,SAAS,wCAAwC;AAKjD,IAAM,cAAc,oBAAI,IAAgC;AACxD,IAAM,aAAa,oBAAI,IAAsC;AAE7D,eAAsB,aACpB,SACmB;AACnB,QAAM,cAAc,eAAkB,OAAO;AAC7C,QAAM,QAAQ,SAAY,WAAW;AACrC,QAAM,MAAM;AACZ,SAAO;AACT;AAGA,SAAS,eAAe,KAAe;AACrC,MAAI,OAAO,QAAQ,YAAY,QAAQ,KAAM,QAAO;AAEpD,MAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,WAAO,IAAI,IAAI,cAAc;AAAA,EAC/B;AAEA,SACE,OAAO,KAAK,GAAG,EACZ,KAAK,EAEL,OAA4B,CAAC,QAAQ,QAAQ;AAC5C,WAAO,GAAG,IAAI,eAAe,IAAI,GAAG,CAAC;AACrC,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AAEX;AAEO,SAAS,kBAAqB,SAAwC;AAC3E,SAAO,KAAK,UAAU,eAAe,OAAO,CAAC;AAC/C;AAEO,SAAS,eACd,SACgB;AAlDlB;AAmDE,QAAM,YAAY,kBAAkB,OAAO;AAG3C,MAAI,YAAY,IAAI,SAAS,GAAG;AAC9B,UAAM,SAAS,YAAY,IAAI,SAAS;AACxC,QAAI,GAAC,YAAO,QAAQ,WAAf,mBAAuB,UAAS;AACnC,aAAO;AAAA,IACT;AAGA,gBAAY,OAAO,SAAS;AAC5B,eAAW,OAAO,MAAM;AAAA,EAC1B;AAEA,QAAM,iBAAiB,IAAI,YAAe,OAAO;AACjD,cAAY,IAAI,WAAW,cAAc;AAGzC,SAAO;AACT;AAEO,SAAS,SACd,aACU;AA1EZ;AA4EE,MAAI,WAAW,IAAI,WAAW,GAAG;AAC/B,QAAI,GAAC,iBAAY,QAAQ,WAApB,mBAA4B,UAAS;AACxC,aAAO,WAAW,IAAI,WAAW;AAAA,IACnC;AAGA,gBAAY,OAAO,kBAAkB,YAAY,OAAO,CAAC;AACzD,eAAW,OAAO,WAAW;AAAA,EAC/B;AAEA,QAAM,WAAW,IAAI,MAAS,WAAW;AACzC,aAAW,IAAI,aAAa,QAAQ;AAGpC,SAAO;AACT;AA0BA,SAAS,eACP,OACA,UACA;AACA,QAAM,cAAc,MAAM,UAAU,QAAQ;AAC5C,SAAO,MAAM;AACX,gBAAY;AAAA,EACd;AACF;AAEA,SAAS,eACP,OACmB;AACnB,SAAO;AAAA,IACL,MAAM,MAAM;AAAA,IACZ,WAAW,MAAM,UAAU;AAAA,IAC3B,cAAc,MAAM,aAAa;AAAA,IACjC,SAAS,MAAM,UAAU;AAAA,IACzB;AAAA,IACA,QAAQ,MAAM;AAAA,IACd,OAAO,MAAM;AAAA,EACf;AACF;AAEA,SAAS,SAAY,KAAW;AAC9B,SAAO;AACT;AAOO,SAAS,SAGd,IAGoD;AAHpD,eACA;AAAA,eAAW;AAAA,EA1Jb,IAyJE,IAEG,oBAFH,IAEG;AAAA,IADH;AAAA;AAGA,QAAM,cAAc;AAAA,IAClB;AAAA,EACF;AACA,QAAM,QAAQ,SAAqB,WAAW;AAE9C,QAAM,eAAe,MAAM,QAAQ,MAAM;AACvC,QAAI,kBAAkB,eAAe,KAAK;AAC1C,UAAM,cAAc,MAAM;AAC1B,UAAM,YAAY,CAAC,kBACjB,eAAe,OAAO,MAAM;AAC1B,wBAAkB,eAAe,KAAK;AACtC,oBAAc;AAAA,IAChB,CAAC;AAEH,WAAO,MAAM;AACX,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,SAAO,aAAa;AACtB;","names":[]}

package/dist/index.mjs

@@ -105,6 +105,7 @@ function parseShapeData(shape) {
     lastSyncedAt: shape.lastSyncedAt(),
     isError: shape.error !== false,
     shape,
+    stream: shape.stream,
     error: shape.error
   };
 }

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/react-hooks.tsx"],"sourcesContent":["import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAIK;AACP,OAAO,WAAW;AAClB,SAAS,wCAAwC;AAKjD,IAAM,cAAc,oBAAI,IAAgC;AACxD,IAAM,aAAa,oBAAI,IAAsC;AAE7D,SAAsB,aACpB,SACmB;AAAA;AACnB,UAAM,cAAc,eAAkB,OAAO;AAC7C,UAAM,QAAQ,SAAY,WAAW;AACrC,UAAM,MAAM;AACZ,WAAO;AAAA,EACT;AAAA;AAGA,SAAS,eAAe,KAAe;AACrC,MAAI,OAAO,QAAQ,YAAY,QAAQ,KAAM,QAAO;AAEpD,MAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,WAAO,IAAI,IAAI,cAAc;AAAA,EAC/B;AAEA,SACE,OAAO,KAAK,GAAG,EACZ,KAAK,EAEL,OAA4B,CAAC,QAAQ,QAAQ;AAC5C,WAAO,GAAG,IAAI,eAAe,IAAI,GAAG,CAAC;AACrC,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AAEX;AAEO,SAAS,kBAAqB,SAAwC;AAC3E,SAAO,KAAK,UAAU,eAAe,OAAO,CAAC;AAC/C;AAEO,SAAS,eACd,SACgB;AAlDlB;AAmDE,QAAM,YAAY,kBAAkB,OAAO;AAG3C,MAAI,YAAY,IAAI,SAAS,GAAG;AAC9B,UAAM,SAAS,YAAY,IAAI,SAAS;AACxC,QAAI,GAAC,YAAO,QAAQ,WAAf,mBAAuB,UAAS;AACnC,aAAO;AAAA,IACT;AAGA,gBAAY,OAAO,SAAS;AAC5B,eAAW,OAAO,MAAM;AAAA,EAC1B;AAEA,QAAM,iBAAiB,IAAI,YAAe,OAAO;AACjD,cAAY,IAAI,WAAW,cAAc;AAGzC,SAAO;AACT;AAEO,SAAS,SACd,aACU;AA1EZ;AA4EE,MAAI,WAAW,IAAI,WAAW,GAAG;AAC/B,QAAI,GAAC,iBAAY,QAAQ,WAApB,mBAA4B,UAAS;AACxC,aAAO,WAAW,IAAI,WAAW;AAAA,IACnC;AAGA,gBAAY,OAAO,kBAAkB,YAAY,OAAO,CAAC;AACzD,eAAW,OAAO,WAAW;AAAA,EAC/B;AAEA,QAAM,WAAW,IAAI,MAAS,WAAW;AACzC,aAAW,IAAI,aAAa,QAAQ;AAGpC,SAAO;AACT;AAqBA,SAAS,eACP,OACA,UACA;AACA,QAAM,cAAc,MAAM,UAAU,QAAQ;AAC5C,SAAO,MAAM;AACX,gBAAY;AAAA,EACd;AACF;AAEA,SAAS,eACP,OACmB;AACnB,SAAO;AAAA,IACL,MAAM,MAAM;AAAA,IACZ,WAAW,MAAM,UAAU;AAAA,IAC3B,cAAc,MAAM,aAAa;AAAA,IACjC,SAAS,MAAM,UAAU;AAAA,IACzB;AAAA,IACA,OAAO,MAAM;AAAA,EACf;AACF;AAEA,SAAS,SAAY,KAAW;AAC9B,SAAO;AACT;AAOO,SAAS,SAGd,IAGoD;AAHpD,eACA;AAAA,eAAW;AAAA,EApJb,IAmJE,IAEG,oBAFH,IAEG;AAAA,IADH;AAAA;AAGA,QAAM,cAAc;AAAA,IAClB;AAAA,EACF;AACA,QAAM,QAAQ,SAAqB,WAAW;AAE9C,QAAM,eAAe,MAAM,QAAQ,MAAM;AACvC,QAAI,kBAAkB,eAAe,KAAK;AAC1C,UAAM,cAAc,MAAM;AAC1B,UAAM,YAAY,CAAC,kBACjB,eAAe,OAAO,MAAM;AAC1B,wBAAkB,eAAe,KAAK;AACtC,oBAAc;AAAA,IAChB,CAAC;AAEH,WAAO,MAAM;AACX,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,SAAO,aAAa;AACtB;","names":[]}
+{"version":3,"sources":["../src/react-hooks.tsx"],"sourcesContent":["import {\n  Shape,\n  ShapeStream,\n  ShapeStreamOptions,\n  Row,\n  GetExtensions,\n} from '@electric-sql/client'\nimport React from 'react'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js'\n\ntype UnknownShape = Shape<Row<unknown>>\ntype UnknownShapeStream = ShapeStream<Row<unknown>>\n\nconst streamCache = new Map<string, UnknownShapeStream>()\nconst shapeCache = new Map<UnknownShapeStream, UnknownShape>()\n\nexport async function preloadShape<T extends Row<unknown> = Row>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): Promise<Shape<T>> {\n  const shapeStream = getShapeStream<T>(options)\n  const shape = getShape<T>(shapeStream)\n  await shape.rows\n  return shape\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction sortObjectKeys(obj: any): any {\n  if (typeof obj !== `object` || obj === null) return obj\n\n  if (Array.isArray(obj)) {\n    return obj.map(sortObjectKeys)\n  }\n\n  return (\n    Object.keys(obj)\n      .sort()\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .reduce<Record<string, any>>((sorted, key) => {\n        sorted[key] = sortObjectKeys(obj[key])\n        return sorted\n      }, {})\n  )\n}\n\nexport function sortedOptionsHash<T>(options: ShapeStreamOptions<T>): string {\n  return JSON.stringify(sortObjectKeys(options))\n}\n\nexport function getShapeStream<T extends Row<unknown>>(\n  options: ShapeStreamOptions<GetExtensions<T>>\n): ShapeStream<T> {\n  const shapeHash = sortedOptionsHash(options)\n\n  // If the stream is already cached, return it if valid\n  if (streamCache.has(shapeHash)) {\n    const stream = streamCache.get(shapeHash)! as ShapeStream<T>\n    if (!stream.options.signal?.aborted) {\n      return stream\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(shapeHash)\n    shapeCache.delete(stream)\n  }\n\n  const newShapeStream = new ShapeStream<T>(options)\n  streamCache.set(shapeHash, newShapeStream)\n\n  // Return the created shape\n  return newShapeStream\n}\n\nexport function getShape<T extends Row<unknown>>(\n  shapeStream: ShapeStream<T>\n): Shape<T> {\n  // If the stream is already cached, return it if valid\n  if (shapeCache.has(shapeStream)) {\n    if (!shapeStream.options.signal?.aborted) {\n      return shapeCache.get(shapeStream)! as Shape<T>\n    }\n\n    // if stream is aborted, remove it and related shapes\n    streamCache.delete(sortedOptionsHash(shapeStream.options))\n    shapeCache.delete(shapeStream)\n  }\n\n  const newShape = new Shape<T>(shapeStream)\n  shapeCache.set(shapeStream, newShape)\n\n  // Return the created shape\n  return newShape\n}\n\nexport interface UseShapeResult<T extends Row<unknown> = Row> {\n  /**\n   * The array of rows that make up the Shape.\n   * @type {T[]}\n   */\n  data: T[]\n  /**\n   * The Shape instance used by this useShape\n   * @type {Shape<T>}\n   */\n  shape: Shape<T>\n  /**\n   * The ShapeStream instance used by this Shape\n   * @type {ShapeStream<T>}\n   */\n  stream: ShapeStream<T>\n  /** True during initial fetch. False afterwise. */\n  isLoading: boolean\n  /** Unix time at which we last synced. Undefined when `isLoading` is true. */\n  lastSyncedAt?: number\n  error: Shape<T>[`error`]\n  isError: boolean\n}\n\nfunction shapeSubscribe<T extends Row<unknown>>(\n  shape: Shape<T>,\n  callback: () => void\n) {\n  const unsubscribe = shape.subscribe(callback)\n  return () => {\n    unsubscribe()\n  }\n}\n\nfunction parseShapeData<T extends Row<unknown>>(\n  shape: Shape<T>\n): UseShapeResult<T> {\n  return {\n    data: shape.currentRows,\n    isLoading: shape.isLoading(),\n    lastSyncedAt: shape.lastSyncedAt(),\n    isError: shape.error !== false,\n    shape,\n    stream: shape.stream as ShapeStream<T>,\n    error: shape.error,\n  }\n}\n\nfunction identity<T>(arg: T): T {\n  return arg\n}\n\ninterface UseShapeOptions<SourceData extends Row<unknown>, Selection>\n  extends ShapeStreamOptions<GetExtensions<SourceData>> {\n  selector?: (value: UseShapeResult<SourceData>) => Selection\n}\n\nexport function useShape<\n  SourceData extends Row<unknown> = Row,\n  Selection = UseShapeResult<SourceData>,\n>({\n  selector = identity as (arg: UseShapeResult<SourceData>) => Selection,\n  ...options\n}: UseShapeOptions<SourceData, Selection>): Selection {\n  const shapeStream = getShapeStream<SourceData>(\n    options as ShapeStreamOptions<GetExtensions<SourceData>>\n  )\n  const shape = getShape<SourceData>(shapeStream)\n\n  const useShapeData = React.useMemo(() => {\n    let latestShapeData = parseShapeData(shape)\n    const getSnapshot = () => latestShapeData\n    const subscribe = (onStoreChange: () => void) =>\n      shapeSubscribe(shape, () => {\n        latestShapeData = parseShapeData(shape)\n        onStoreChange()\n      })\n\n    return () => {\n      return useSyncExternalStoreWithSelector(\n        subscribe,\n        getSnapshot,\n        getSnapshot,\n        selector\n      )\n    }\n  }, [shape, selector])\n\n  return useShapeData()\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,37 +1,14 @@
 {
   "name": "@electric-sql/react",
-  "version": "0.6.1",
   "description": "React hooks for ElectricSQL",
-  "type": "module",
-  "main": "dist/cjs/index.cjs",
-  "module": "dist/index.legacy-esm.js",
-  "types": "dist/index.d.ts",
-  "exports": {
-    "./package.json": "./package.json",
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "default": "./dist/cjs/index.cjs"
-    }
-  },
-  "files": [
-    "dist",
-    "src"
-  ],
-  "sideEffects": false,
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/electric-sql/electric.git"
-  },
+  "version": "0.6.2",
   "author": "ElectricSQL team and contributors.",
-  "license": "Apache-2",
   "bugs": {
     "url": "https://github.com/electric-sql/electric/issues"
   },
-  "homepage": "https://electric-sql.com",
   "dependencies": {
     "use-sync-external-store": "^1.2.2",
-    "@electric-sql/client": "0.9.0"
+    "@electric-sql/client": "0.9.1"
   },
   "devDependencies": {
     "@testing-library/react": "^16.0.0",
@@ -50,12 +27,34 @@
     "pg": "^8.12.0",
     "prettier": "^3.3.2",
     "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "shx": "^0.3.4",
     "tsup": "^8.0.1",
     "typescript": "^5.5.2",
     "uuid": "^10.0.0",
     "vitest": "^2.0.2"
   },
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/cjs/index.d.cts",
+        "default": "./dist/cjs/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "homepage": "https://electric-sql.com",
+  "license": "Apache-2",
+  "main": "dist/cjs/index.cjs",
+  "module": "dist/index.legacy-esm.js",
   "peerDependencies": {
     "react": "^18.3.1"
   },
@@ -64,6 +63,13 @@
       "optional": true
     }
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/electric-sql/electric.git"
+  },
+  "sideEffects": false,
+  "type": "module",
+  "types": "dist/index.d.ts",
   "typesVersions": {
     "*": {
       "*": [
@@ -72,10 +78,10 @@
     }
   },
   "scripts": {
-    "test": "pnpm exec vitest",
-    "typecheck": "tsc -p tsconfig.json",
-    "build": "shx rm -rf dist && concurrently \"tsup\" \"tsc -p tsconfig.build.json\"",
+    "build": "shx rm -rf dist && tsup && tsc -p tsconfig.build.json",
+    "format": "eslint . --fix",
     "stylecheck": "eslint . --quiet",
-    "format": "eslint . --fix"
+    "test": "pnpm exec vitest",
+    "typecheck": "tsc -p tsconfig.json"
   }
 }

package/src/react-hooks.tsx

@@ -102,6 +102,11 @@ export interface UseShapeResult<T extends Row<unknown> = Row> {
    * @type {Shape<T>}
    */
   shape: Shape<T>
+  /**
+   * The ShapeStream instance used by this Shape
+   * @type {ShapeStream<T>}
+   */
+  stream: ShapeStream<T>
   /** True during initial fetch. False afterwise. */
   isLoading: boolean
   /** Unix time at which we last synced. Undefined when `isLoading` is true. */
@@ -129,6 +134,7 @@ function parseShapeData<T extends Row<unknown>>(
     lastSyncedAt: shape.lastSyncedAt(),
     isError: shape.error !== false,
     shape,
+    stream: shape.stream as ShapeStream<T>,
     error: shape.error,
   }
 }