@livestore/react 0.4.0-dev.21 → 0.4.0-dev.22

package/src/{experimental/multi-store/useStore.test.tsx → useStore.test.tsx}

@@ -1,25 +1,27 @@
 import { makeInMemoryAdapter } from '@livestore/adapter-web'
-import type { Store } from '@livestore/livestore'
-import { StoreInternalsSymbol } from '@livestore/livestore'
+import {
+  type RegistryStoreOptions,
+  type Store,
+  StoreInternalsSymbol,
+  StoreRegistry,
+  storeOptions,
+} from '@livestore/livestore'
 import { shouldNeverHappen } from '@livestore/utils'
 import { act, type RenderHookResult, type RenderResult, render, renderHook, waitFor } from '@testing-library/react'
 import * as React from 'react'
 import { describe, expect, it } from 'vitest'
-import { schema } from '../../__tests__/fixture.tsx'
-import { StoreRegistry } from './StoreRegistry.ts'
+import { schema } from './__tests__/fixture.tsx'
 import { StoreRegistryProvider } from './StoreRegistryContext.tsx'
-import { storeOptions } from './storeOptions.ts'
-import type { CachedStoreOptions } from './types.ts'
 import { useStore } from './useStore.ts'
 
 describe('experimental useStore', () => {
   it('should return the same promise instance for concurrent getOrLoadStore calls', async () => {
-    const registry = new StoreRegistry()
+    const storeRegistry = new StoreRegistry()
     const options = testStoreOptions()
 
     // Make two concurrent calls during loading
-    const firstStore = registry.getOrLoadPromise(options)
-    const secondStore = registry.getOrLoadPromise(options)
+    const firstStore = storeRegistry.getOrLoadPromise(options)
+    const secondStore = storeRegistry.getOrLoadPromise(options)
 
     // Both should be promises (store is loading)
     expect(firstStore).toBeInstanceOf(Promise)
@@ -35,13 +37,13 @@ describe('experimental useStore', () => {
   })
 
   it('works with Suspense boundary', async () => {
-    const registry = new StoreRegistry()
+    const storeRegistry = new StoreRegistry()
     const options = testStoreOptions()
 
     let view: RenderResult | undefined
     await act(async () => {
       view = render(
-        <StoreRegistryProvider storeRegistry={registry}>
+        <StoreRegistryProvider storeRegistry={storeRegistry}>
           <React.Suspense fallback={<div data-testid="fallback" />}>
             <StoreConsumer options={options} />
           </React.Suspense>
@@ -58,11 +60,11 @@ describe('experimental useStore', () => {
   })
 
   it('does not re-suspend on subsequent renders when store is already loaded', async () => {
-    const registry = new StoreRegistry()
+    const storeRegistry = new StoreRegistry()
     const options = testStoreOptions()
 
-    const Wrapper = ({ opts }: { opts: CachedStoreOptions<typeof schema> }) => (
-      <StoreRegistryProvider storeRegistry={registry}>
+    const Wrapper = ({ opts }: { opts: RegistryStoreOptions<typeof schema> }) => (
+      <StoreRegistryProvider storeRegistry={storeRegistry}>
         <React.Suspense fallback={<div data-testid="fallback" />}>
           <StoreConsumer options={opts} />
         </React.Suspense>
@@ -92,19 +94,19 @@ describe('experimental useStore', () => {
   })
 
   it('throws when store loading fails', async () => {
-    const registry = new StoreRegistry()
+    const storeRegistry = new StoreRegistry()
     const badOptions = testStoreOptions({
       // @ts-expect-error - intentionally passing invalid adapter to trigger error
       adapter: null,
     })
 
     // Pre-load the store to cache the error (error happens synchronously)
-    expect(() => registry.getOrLoadPromise(badOptions)).toThrow()
+    expect(() => storeRegistry.getOrLoadPromise(badOptions)).toThrow()
 
     // Now when useStore tries to get it, it should throw synchronously
     expect(() =>
       renderHook(() => useStore(badOptions), {
-        wrapper: makeProvider(registry),
+        wrapper: makeProvider(storeRegistry),
       }),
     ).toThrow()
   })
@@ -113,13 +115,13 @@ describe('experimental useStore', () => {
     { label: 'non-strict mode', strictMode: false },
     { label: 'strict mode', strictMode: true },
   ])('works in $label', async ({ strictMode }) => {
-    const registry = new StoreRegistry()
+    const storeRegistry = new StoreRegistry()
     const options = testStoreOptions()
 
-    let hook: RenderHookResult<Store<typeof schema>, CachedStoreOptions<typeof schema>> | undefined
+    let hook: RenderHookResult<Store<typeof schema>, RegistryStoreOptions<typeof schema>> | undefined
     await act(async () => {
       hook = renderHook(() => useStore(options), {
-        wrapper: makeProvider(registry, { suspense: true }),
+        wrapper: makeProvider(storeRegistry, { suspense: true }),
         reactStrictMode: strictMode,
       })
     })
@@ -133,16 +135,16 @@ describe('experimental useStore', () => {
   })
 
   it('handles switching between different storeId values', async () => {
-    const registry = new StoreRegistry()
+    const storeRegistry = new StoreRegistry()
 
     const optionsA = testStoreOptions({ storeId: 'store-a' })
     const optionsB = testStoreOptions({ storeId: 'store-b' })
 
-    let hook: RenderHookResult<Store<typeof schema>, CachedStoreOptions<typeof schema>> | undefined
+    let hook: RenderHookResult<Store<typeof schema>, RegistryStoreOptions<typeof schema>> | undefined
     await act(async () => {
       hook = renderHook((opts) => useStore(opts), {
         initialProps: optionsA,
-        wrapper: makeProvider(registry, { suspense: true }),
+        wrapper: makeProvider(storeRegistry, { suspense: true }),
       })
     })
     const { result, rerender, unmount } = hook ?? shouldNeverHappen('renderHook failed')
@@ -173,10 +175,10 @@ describe('experimental useStore', () => {
   // useStore doesn't handle unusedCacheTime=0 correctly because retain is called in useEffect (after render)
   // See https://github.com/livestorejs/livestore/issues/916
   it.skip('should load store with unusedCacheTime set to 0', async () => {
-    const registry = new StoreRegistry({ defaultOptions: { unusedCacheTime: 0 } })
+    const storeRegistry = new StoreRegistry({ defaultOptions: { unusedCacheTime: 0 } })
     const options = testStoreOptions({ unusedCacheTime: 0 })
 
-    const StoreConsumerWithVerification = ({ opts }: { opts: CachedStoreOptions<typeof schema> }) => {
+    const StoreConsumerWithVerification = ({ opts }: { opts: RegistryStoreOptions<typeof schema> }) => {
       const store = useStore(opts)
       // Verify store is usable - access internals to confirm it's not disposed
       const clientSession = store[StoreInternalsSymbol].clientSession
@@ -186,7 +188,7 @@ describe('experimental useStore', () => {
     let view: RenderResult | undefined
     await act(async () => {
       view = render(
-        <StoreRegistryProvider storeRegistry={registry}>
+        <StoreRegistryProvider storeRegistry={storeRegistry}>
           <React.Suspense fallback={<div data-testid="fallback" />}>
             <StoreConsumerWithVerification opts={options} />
           </React.Suspense>
@@ -211,15 +213,15 @@ describe('experimental useStore', () => {
   })
 })
 
-const StoreConsumer = ({ options }: { options: CachedStoreOptions<any> }) => {
+const StoreConsumer = ({ options }: { options: RegistryStoreOptions<any> }) => {
   useStore(options)
   return <div data-testid="ready" />
 }
 
 const makeProvider =
-  (registry: StoreRegistry, { suspense = false }: { suspense?: boolean } = {}) =>
+  (storeRegistry: StoreRegistry, { suspense = false }: { suspense?: boolean } = {}) =>
   ({ children }: { children: React.ReactNode }) => {
-    let content = <StoreRegistryProvider storeRegistry={registry}>{children}</StoreRegistryProvider>
+    let content = <StoreRegistryProvider storeRegistry={storeRegistry}>{children}</StoreRegistryProvider>
 
     if (suspense) {
       content = <React.Suspense fallback={null}>{content}</React.Suspense>
@@ -230,7 +232,7 @@ const makeProvider =
 
 let testStoreCounter = 0
 
-const testStoreOptions = (overrides: Partial<CachedStoreOptions<typeof schema>> = {}) =>
+const testStoreOptions = (overrides: Partial<RegistryStoreOptions<typeof schema>> = {}) =>
   storeOptions({
     storeId: overrides.storeId ?? `test-store-${testStoreCounter++}`,
     schema,

package/src/useStore.ts

@@ -1,88 +1,116 @@
 import type { LiveStoreSchema } from '@livestore/common/schema'
-import type { Store } from '@livestore/livestore'
+import type { RegistryStoreOptions, Store } from '@livestore/livestore'
+import type { Schema } from '@livestore/utils/effect'
 import React from 'react'
-
-import type { ReactApi } from './LiveStoreContext.ts'
-import { LiveStoreContext } from './LiveStoreContext.ts'
+import { useStoreRegistry } from './StoreRegistryContext.tsx'
 import { useClientDocument } from './useClientDocument.ts'
 import { useQuery } from './useQuery.ts'
 
 /**
- * Augments a Store instance with React-specific methods (`useQuery`, `useClientDocument`).
- *
- * This is called automatically by `useStore()` and `LiveStoreProvider`. You typically
- * don't need to call it directly unless you're building custom integrations.
+ * Returns a store instance augmented with hooks (`store.useQuery()` and `store.useClientDocument()`) for reactive queries.
  *
  * @example
- * ```ts
- * // Usually not needed—useStore() does this automatically
- * const store = withReactApi(myStore)
- * const todos = store.useQuery(tables.todos.all())
- * ```
- */
-export const withReactApi = <TSchema extends LiveStoreSchema>(store: Store<TSchema>): Store<TSchema> & ReactApi => {
-  // @ts-expect-error TODO properly implement this
-
-  store.useQuery = (queryable) => useQuery(queryable, { store })
-  // @ts-expect-error TODO properly implement this
-
-  store.useClientDocument = (table, idOrOptions, options) => useClientDocument(table, idOrOptions, options, { store })
-  return store as Store<TSchema> & ReactApi
-}
-
-/**
- * Returns the current Store instance from React context, augmented with React-specific methods.
- *
- * Use this hook when you need direct access to the Store for operations like
- * `store.commit()`, `store.subscribe()`, or accessing `store.sessionId`.
- *
- * For reactive queries, prefer `useQuery()` or `useClientDocument()` which handle
- * subscriptions and re-renders automatically.
+ * ```tsx
+ * function Issue() {
+ *   // Suspends until loaded or returns immediately if already loaded
+ *   const issueStore = useStore(issueStoreOptions('abc123'))
+ *   const [issue] = issueStore.useQuery(queryDb(tables.issue.select()))
  *
- * @example
- * ```ts
- * const MyComponent = () => {
- *   const { store } = useStore()
+ *   const toggleStatus = () =>
+ *     issueStore.commit(
+ *       issueEvents.issueStatusChanged({
+ *         id: issue.id,
+ *         status: issue.status === 'done' ? 'todo' : 'done',
+ *       }),
+ *     )
  *
- *   const handleClick = () => {
- *     store.commit(events.todoCreated({ id: nanoid(), text: 'New todo' }))
- *   }
+ *   const preloadParentIssue = (issueId: string) =>
+ *     storeRegistry.preload({
+ *       ...issueStoreOptions(issueId),
+ *       unusedCacheTime: 10_000,
+ *     })
  *
- *   return <button onClick={handleClick}>Add Todo</button>
+ *   return (
+ *     <>
+ *       <h2>{issue.title}</h2>
+ *       <button onClick={() => toggleStatus()}>Toggle Status</button>
+ *       <button onMouseEnter={() => preloadParentIssue(issue.parentIssueId)}>Open Parent Issue</button>
+ *     </>
+ *   )
  * }
  * ```
  *
- * @example
- * ```ts
- * // Access store metadata
- * const { store } = useStore()
- * console.log('Session ID:', store.sessionId)
- * console.log('Client ID:', store.clientId)
- * ```
- *
- * @example
- * ```ts
- * // Use with an explicit store instance (bypasses context)
- * const { store } = useStore({ store: myExternalStore })
- * ```
+ * @remarks
+ * - Suspends until the store is loaded.
+ * - Store is cached by its `storeId` in the `StoreRegistry`. Multiple calls with the same `storeId` return the same store instance.
+ * - Store is cached as long as it's being used, and after `unusedCacheTime` expires (default `60_000` ms in browser, `Infinity` in non-browser)
+ * - Default store options can be configured in `StoreRegistry` constructor.
+ * - Store options are only applied when the store is loaded. Subsequent calls with different options will not affect the store if it's already loaded and cached in the registry.
  *
- * @throws Error if called outside of `<LiveStoreProvider>` or before the store is running
+ * @typeParam TSchema - The schema type for the store
+ * @returns The loaded store instance augmented with React hooks
+ * @throws unknown - store loading error or if called outside `<StoreRegistryProvider>`
  */
-export const useStore = (options?: { store?: Store }): { store: Store & ReactApi } => {
-  if (options?.store !== undefined) {
-    return { store: withReactApi(options.store) }
-  }
+export const useStore = <
+  TSchema extends LiveStoreSchema,
+  TContext = {},
+  TSyncPayloadSchema extends Schema.Schema<any> = typeof Schema.JsonValue,
+>(
+  options: RegistryStoreOptions<TSchema, TContext, TSyncPayloadSchema>,
+): Store<TSchema, TContext> & ReactApi => {
+  const storeRegistry = useStoreRegistry()
 
-  // biome-ignore lint/correctness/useHookAtTopLevel: store is stable
-  const storeContext = React.useContext(LiveStoreContext)
+  // NOTE: retain() is called in useEffect (after render), while getOrLoadPromise() is called
+  // in useMemo (during render). This creates a timing gap where with very short unusedCacheTime
+  // values (e.g., 0), the store could theoretically be disposed before the effect fires.
+  // In practice, this is not an issue with the default 60s cache time, but it becomes an issue when
+  // `unusedCacheTime` is configured to values less than ~100ms.
+  // See https://github.com/livestorejs/livestore/issues/916
+  React.useEffect(() => storeRegistry.retain(options), [storeRegistry, options])
 
-  if (storeContext === undefined) {
-    throw new Error(`useStore can only be used inside StoreContext.Provider`)
-  }
+  const storeOrPromise = React.useMemo(() => storeRegistry.getOrLoadPromise(options), [storeRegistry, options])
 
-  if (storeContext.stage !== 'running') {
-    throw new Error(`useStore can only be used after the store is running`)
+  const store = storeOrPromise instanceof Promise ? React.use(storeOrPromise) : storeOrPromise
+
+  // Expose store on the global object for browser console debugging.
+  globalThis.__debugLiveStore ??= {}
+  if (Object.keys(globalThis.__debugLiveStore).length === 0) {
+    globalThis.__debugLiveStore._ = store
   }
+  globalThis.__debugLiveStore[options.debug?.instanceId ?? options.storeId] = store
+
+  return withReactApi(store)
+}
+
+/**
+ * React-specific methods added to the Store when used via React hooks.
+ *
+ * These methods are attached by `withReactApi()` and `useStore()`, allowing you
+ * to call `store.useQuery()` and `store.useClientDocument()` directly on the
+ * Store instance.
+ */
+export type ReactApi = {
+  /** Hook version of query subscription—re-renders component when query result changes */
+  useQuery: typeof useQuery
+  /** Hook for reading and writing client-document tables with React state semantics */
+  useClientDocument: typeof useClientDocument
+}
 
-  return { store: withReactApi(storeContext.store) }
+/**
+ * Augments a Store instance with React-specific methods (`useQuery`, `useClientDocument`).
+ *
+ * This is called automatically by `useStore()`. You typically don't need to call it
+ * directly unless you're building custom integrations.
+ *
+ * @internal
+ */
+export const withReactApi = <TSchema extends LiveStoreSchema, TContext = {}>(
+  store: Store<TSchema, TContext>,
+): Store<TSchema, TContext> & ReactApi => {
+  // @ts-expect-error TODO properly implement this
+  store.useQuery = (queryable) => useQuery(queryable, { store })
+
+  // @ts-expect-error TODO properly implement this
+  store.useClientDocument = (table, idOrOptions, options) => useClientDocument(table, idOrOptions, options, { store })
+  return store as Store<TSchema, TContext> & ReactApi
 }

package/dist/LiveStoreContext.d.ts

@@ -1,40 +0,0 @@
-import type { LiveStoreContextRunning } from '@livestore/livestore';
-import React from 'react';
-import type { useClientDocument } from './useClientDocument.ts';
-import type { useQuery } from './useQuery.ts';
-/**
- * React-specific methods added to the Store when used via React hooks.
- *
- * These methods are attached by `withReactApi()` and `useStore()`, allowing you
- * to call `store.useQuery()` and `store.useClientDocument()` directly on the
- * Store instance.
- */
-export type ReactApi = {
-    /** Hook version of query subscription—re-renders component when query result changes */
-    useQuery: typeof useQuery;
-    /** Hook for reading and writing client-document tables with React state semantics */
-    useClientDocument: typeof useClientDocument;
-};
-/**
- * React context for accessing the LiveStore instance.
- *
- * This context is provided by `<LiveStoreProvider>` and consumed by hooks like
- * `useStore()`, `useQuery()`, and `useClientDocument()`.
- *
- * The context value is `undefined` until the Store has finished booting,
- * then transitions to `{ stage: 'running', store: ... }`.
- *
- * @example
- * ```tsx
- * // Typically you don't use this directly—use useStore() instead
- * const context = React.useContext(LiveStoreContext)
- * if (context?.stage === 'running') {
- *   console.log('Store ready:', context.store.storeId)
- * }
- * ```
- */
-export declare const LiveStoreContext: React.Context<{
-    stage: "running";
-    store: LiveStoreContextRunning["store"] & ReactApi;
-} | undefined>;
-//# sourceMappingURL=LiveStoreContext.d.ts.map

package/dist/LiveStoreContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LiveStoreContext.d.ts","sourceRoot":"","sources":["../src/LiveStoreContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC/D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAE7C;;;;;;GAMG;AACH,MAAM,MAAM,QAAQ,GAAG;IACrB,wFAAwF;IACxF,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,qFAAqF;IACrF,iBAAiB,EAAE,OAAO,iBAAiB,CAAA;CAC5C,CAAA;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,gBAAgB;WAClB,SAAS;WAAS,uBAAuB,CAAC,OAAO,CAAC,GAAG,QAAQ;cAC5D,CAAA"}

package/dist/LiveStoreContext.js

@@ -1,21 +0,0 @@
-import React from 'react';
-/**
- * React context for accessing the LiveStore instance.
- *
- * This context is provided by `<LiveStoreProvider>` and consumed by hooks like
- * `useStore()`, `useQuery()`, and `useClientDocument()`.
- *
- * The context value is `undefined` until the Store has finished booting,
- * then transitions to `{ stage: 'running', store: ... }`.
- *
- * @example
- * ```tsx
- * // Typically you don't use this directly—use useStore() instead
- * const context = React.useContext(LiveStoreContext)
- * if (context?.stage === 'running') {
- *   console.log('Store ready:', context.store.storeId)
- * }
- * ```
- */
-export const LiveStoreContext = React.createContext(undefined);
-//# sourceMappingURL=LiveStoreContext.js.map

package/dist/LiveStoreContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LiveStoreContext.js","sourceRoot":"","sources":["../src/LiveStoreContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAmBzB;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAEjD,SAAS,CAAC,CAAA"}

package/dist/LiveStoreProvider.d.ts

@@ -1,73 +0,0 @@
-import type { Adapter, BootStatus, IntentionalShutdownCause, MigrationsReport, SyncError } from '@livestore/common';
-import { LogConfig, UnknownError } from '@livestore/common';
-import type { LiveStoreSchema } from '@livestore/common/schema';
-import type { CreateStoreOptions, OtelOptions, Store } from '@livestore/livestore';
-import { StoreInterrupted } from '@livestore/livestore';
-import type { OtelTracer } from '@livestore/utils/effect';
-import { Effect, Schema } from '@livestore/utils/effect';
-import type * as otel from '@opentelemetry/api';
-import React from 'react';
-export interface LiveStoreProviderProps<TSyncPayloadSchema extends Schema.Schema<any> = typeof Schema.JsonValue> extends LogConfig.WithLoggerOptions {
-    schema: LiveStoreSchema;
-    /**
-     * The `storeId` can be used to isolate multiple stores from each other.
-     * So it can be useful for multi-tenancy scenarios.
-     *
-     * The `storeId` is also used for persistence.
-     *
-     * Make sure to also configure `storeId` in LiveStore Devtools (e.g. in Vite plugin).
-     *
-     * @default 'default'
-     */
-    storeId?: string;
-    boot?: (store: Store<LiveStoreSchema>, ctx: {
-        migrationsReport: MigrationsReport;
-        parentSpan: otel.Span;
-    }) => void | Promise<void> | Effect.Effect<void, unknown, OtelTracer.OtelTracer>;
-    otelOptions?: Partial<OtelOptions>;
-    renderLoading?: (status: BootStatus) => React.ReactNode;
-    renderError?: (error: UnknownError | unknown) => React.ReactNode;
-    renderShutdown?: (cause: IntentionalShutdownCause | StoreInterrupted | SyncError) => React.ReactNode;
-    adapter: Adapter;
-    /**
-     * In order for LiveStore to apply multiple events in a single render,
-     * you need to pass the `batchUpdates` function from either `react-dom` or `react-native`.
-     *
-     * ```ts
-     * // With React DOM
-     * import { unstable_batchedUpdates as batchUpdates } from 'react-dom'
-     *
-     * // With React Native
-     * import { unstable_batchedUpdates as batchUpdates } from 'react-native'
-     * ```
-     */
-    batchUpdates: (run: () => void) => void;
-    disableDevtools?: boolean;
-    signal?: AbortSignal;
-    /**
-     * Currently only used in the web adapter:
-     * If true, registers a beforeunload event listener to confirm unsaved changes.
-     *
-     * @default true
-     */
-    confirmUnsavedChanges?: boolean;
-    /**
-     * Advanced store parameters forwarded to `createStore`.
-     * Currently supports:
-     * - `leaderPushBatchSize`: max events pushed to the leader per write batch.
-     * - `eventQueryBatchSize`: chunk size used when the stream replays confirmed events.
-     */
-    params?: CreateStoreOptions<LiveStoreSchema>['params'];
-    /**
-     * Payload that will be passed to the sync backend when connecting
-     *
-     * @default undefined
-     */
-    syncPayloadSchema?: TSyncPayloadSchema;
-    syncPayload?: Schema.Schema.Type<TSyncPayloadSchema>;
-    debug?: {
-        instanceId?: string;
-    };
-}
-export declare const LiveStoreProvider: <TSyncPayloadSchema extends Schema.Schema<any> = typeof Schema.JsonValue>({ renderLoading, renderError, renderShutdown, otelOptions, children, schema, storeId, boot, adapter, batchUpdates, disableDevtools, signal, confirmUnsavedChanges, params, syncPayload, syncPayloadSchema, debug, logger, logLevel, }: LiveStoreProviderProps<TSyncPayloadSchema> & React.PropsWithChildren) => React.ReactNode;
-//# sourceMappingURL=LiveStoreProvider.d.ts.map

package/dist/LiveStoreProvider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LiveStoreProvider.d.ts","sourceRoot":"","sources":["../src/LiveStoreProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AACnH,OAAO,EAAE,SAAS,EAAe,YAAY,EAAE,MAAM,mBAAmB,CAAA;AACxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,OAAO,KAAK,EACV,kBAAkB,EAClB,WAAW,EAEX,KAAK,EAEN,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAqC,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAE1F,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EAAmB,MAAM,EAAkB,MAAM,EAAsB,MAAM,yBAAyB,CAAA;AAC7G,OAAO,KAAK,KAAK,IAAI,MAAM,oBAAoB,CAAA;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,sBAAsB,CAAC,kBAAkB,SAAS,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,OAAO,MAAM,CAAC,SAAS,CAC7G,SAAQ,SAAS,CAAC,iBAAiB;IACnC,MAAM,EAAE,eAAe,CAAA;IACvB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,CACL,KAAK,EAAE,KAAK,CAAC,eAAe,CAAC,EAC7B,GAAG,EAAE;QAAE,gBAAgB,EAAE,gBAAgB,CAAC;QAAC,UAAU,EAAE,IAAI,CAAC,IAAI,CAAA;KAAE,KAC/D,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,CAAA;IAC/E,WAAW,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;IAClC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,KAAK,CAAC,SAAS,CAAA;IACvD,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,KAAK,KAAK,CAAC,SAAS,CAAA;IAChE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,GAAG,gBAAgB,GAAG,SAAS,KAAK,KAAK,CAAC,SAAS,CAAA;IACpG,OAAO,EAAE,OAAO,CAAA;IAChB;;;;;;;;;;;OAWG;IACH,YAAY,EAAE,CAAC,GAAG,EAAE,MAAM,IAAI,KAAK,IAAI,CAAA;IACvC,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC,QAAQ,CAAC,CAAA;IACtD;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,kBAAkB,CAAA;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA;IACpD,KAAK,CAAC,EAAE;QACN,UAAU,CAAC,EAAE,MAAM,CAAA;KACpB,CAAA;CACF;AA2BD,eAAO,MAAM,iBAAiB,GAAI,kBAAkB,SAAS,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,OAAO,MAAM,CAAC,SAAS,EAAE,uOAoBxG,sBAAsB,CAAC,kBAAkB,CAAC,GAAG,KAAK,CAAC,iBAAiB,KAAG,KAAK,CAAC,SAwC/E,CAAA"}