@sladg/apex-state 3.1.0 → 3.2.1

package/dist/index.js

@@ -718,7 +718,7 @@ var init_apex_state_wasm = __esm({
 });
 
 // src/store/create-store.ts
-import { useCallback, useLayoutEffect } from "react";
+import { useCallback, useLayoutEffect as useLayoutEffect2 } from "react";
 import { snapshot as snapshot3, useSnapshot } from "valtio";
 
 // src/concerns/registration.ts
@@ -2305,157 +2305,8 @@ var registerSideEffects2 = (store, id, effects) => {
   return cleanup;
 };
 
-// src/utils/json.ts
-var createFastJson = (placeholders = []) => {
-  const encodeMap = /* @__PURE__ */ new Map();
-  const decodeMap = /* @__PURE__ */ new Map();
-  for (const p of placeholders) {
-    encodeMap.set(p.value, p.encoded);
-    decodeMap.set(p.encoded, p.value);
-  }
-  const stringify = (value) => {
-    if (encodeMap.has(value)) return encodeMap.get(value);
-    if (typeof value === "number" || typeof value === "boolean")
-      return String(value);
-    if (value === null) return "null";
-    return JSON.stringify(value);
-  };
-  const parse = (json) => {
-    if (decodeMap.has(json)) return decodeMap.get(json);
-    const c = json.charCodeAt(0);
-    if (c >= 48 && c <= 57 || c === 45) return Number(json);
-    if (json === "true") return true;
-    if (json === "false") return false;
-    if (json === "null") return null;
-    return JSON.parse(json);
-  };
-  return { stringify, parse };
-};
-
-// src/wasm/bridge.ts
-var UNDEFINED_SENTINEL_JSON = '"__APEX_UNDEFINED__"';
-var { stringify: fastStringify, parse: fastParse } = createFastJson([
-  { value: void 0, encoded: UNDEFINED_SENTINEL_JSON }
-]);
-var changesToWasm = (changes) => changes.map(({ path, value }) => ({ path, value_json: fastStringify(value) }));
-var wasmChangesToJs = (wasmChanges) => wasmChanges.map(({ path, value_json }) => ({
-  path,
-  value: fastParse(value_json)
-}));
-var createWasmPipeline = () => {
-  const wasm2 = getWasmInstance();
-  const id = wasm2.pipeline_create();
-  const schemas = /* @__PURE__ */ new Map();
-  return {
-    id,
-    shadowInit: (state) => {
-      wasm2.shadow_init(id, state);
-    },
-    shadowDump: () => JSON.parse(wasm2.shadow_dump(id)),
-    processChanges: (changes) => {
-      const result = wasm2.process_changes(
-        id,
-        changesToWasm(changes)
-      );
-      const stateChanges = wasmChangesToJs(result.state_changes);
-      return {
-        state_changes: stateChanges,
-        changes: stateChanges,
-        validators_to_run: result.validators_to_run ?? [],
-        execution_plan: result.execution_plan ?? null,
-        has_work: result.has_work ?? false
-      };
-    },
-    pipelineFinalize: (jsChanges) => {
-      const result = wasm2.pipeline_finalize(
-        id,
-        changesToWasm(jsChanges)
-      );
-      return {
-        state_changes: wasmChangesToJs(result.state_changes)
-      };
-    },
-    registerSideEffects: (reg) => {
-      const resultJson = wasm2.register_side_effects(
-        id,
-        JSON.stringify(reg)
-      );
-      return {
-        sync_changes: wasmChangesToJs(resultJson.sync_changes),
-        aggregation_changes: wasmChangesToJs(resultJson.aggregation_changes),
-        registered_listener_ids: resultJson.registered_listener_ids
-      };
-    },
-    unregisterSideEffects: (registrationId) => {
-      wasm2.unregister_side_effects(id, registrationId);
-    },
-    registerConcerns: (reg) => {
-      const resultJson = wasm2.register_concerns(
-        id,
-        JSON.stringify(reg)
-      );
-      return {
-        bool_logic_changes: wasmChangesToJs(resultJson.bool_logic_changes),
-        registered_logic_ids: resultJson.registered_logic_ids,
-        registered_validator_ids: resultJson.registered_validator_ids,
-        value_logic_changes: wasmChangesToJs(
-          resultJson.value_logic_changes ?? []
-        ),
-        registered_value_logic_ids: resultJson.registered_value_logic_ids ?? []
-      };
-    },
-    unregisterConcerns: (registrationId) => {
-      wasm2.unregister_concerns(id, registrationId);
-    },
-    registerBoolLogic: (outputPath, tree) => wasm2.register_boollogic(id, outputPath, JSON.stringify(tree)),
-    unregisterBoolLogic: (logicId) => {
-      wasm2.unregister_boollogic(id, logicId);
-    },
-    pipelineReset: () => {
-      wasm2.pipeline_reset(id);
-    },
-    destroy: () => {
-      wasm2.pipeline_destroy(id);
-      schemas.clear();
-    },
-    validatorSchemas: schemas
-  };
-};
-
-// src/wasm/lifecycle.ts
-var wasmInstance = null;
-var loadingPromise = null;
-var loadWasm2 = async () => {
-  if (wasmInstance) return wasmInstance;
-  if (loadingPromise) {
-    await loadingPromise;
-    return wasmInstance;
-  }
-  loadingPromise = (async () => {
-    const wasmModule = await init_apex_state_wasm().then(() => apex_state_wasm_exports);
-    if (typeof wasmModule.default === "function") {
-      await wasmModule.default();
-    }
-    wasmInstance = wasmModule;
-  })();
-  await loadingPromise;
-  return wasmInstance;
-};
-var isWasmLoaded = () => wasmInstance !== null;
-var initPipeline = (internal, initialState) => {
-  const pipeline = createWasmPipeline();
-  pipeline.shadowInit(initialState);
-  internal.pipeline = pipeline;
-};
-var getWasmInstance = () => {
-  if (!wasmInstance) {
-    throw new Error("WASM not loaded. Call loadWasm() first.");
-  }
-  return wasmInstance;
-};
-
 // src/store/provider.tsx
-import { useEffect, useMemo, useState } from "react";
+import { useLayoutEffect, useRef } from "react";
 import { proxy, ref } from "valtio";
 
 // src/core/defaults.ts
@@ -2635,8 +2486,179 @@ var createTiming = (options) => {
   };
 };
 
+// src/wasm/lifecycle.tsx
+import { useEffect, useState } from "react";
+
+// src/utils/json.ts
+var createFastJson = (placeholders = []) => {
+  const encodeMap = /* @__PURE__ */ new Map();
+  const decodeMap = /* @__PURE__ */ new Map();
+  for (const p of placeholders) {
+    encodeMap.set(p.value, p.encoded);
+    decodeMap.set(p.encoded, p.value);
+  }
+  const stringify = (value) => {
+    if (encodeMap.has(value)) return encodeMap.get(value);
+    if (typeof value === "number" || typeof value === "boolean")
+      return String(value);
+    if (value === null) return "null";
+    return JSON.stringify(value);
+  };
+  const parse = (json) => {
+    if (decodeMap.has(json)) return decodeMap.get(json);
+    const c = json.charCodeAt(0);
+    if (c >= 48 && c <= 57 || c === 45) return Number(json);
+    if (json === "true") return true;
+    if (json === "false") return false;
+    if (json === "null") return null;
+    return JSON.parse(json);
+  };
+  return { stringify, parse };
+};
+
+// src/wasm/bridge.ts
+var UNDEFINED_SENTINEL_JSON = '"__APEX_UNDEFINED__"';
+var { stringify: fastStringify, parse: fastParse } = createFastJson([
+  { value: void 0, encoded: UNDEFINED_SENTINEL_JSON }
+]);
+var changesToWasm = (changes) => changes.map(({ path, value }) => ({ path, value_json: fastStringify(value) }));
+var wasmChangesToJs = (wasmChanges) => wasmChanges.map(({ path, value_json }) => ({
+  path,
+  value: fastParse(value_json)
+}));
+var createWasmPipeline = () => {
+  const wasm2 = getWasmInstance();
+  const id = wasm2.pipeline_create();
+  const schemas = /* @__PURE__ */ new Map();
+  return {
+    id,
+    shadowInit: (state) => {
+      wasm2.shadow_init(id, state);
+    },
+    shadowDump: () => JSON.parse(wasm2.shadow_dump(id)),
+    processChanges: (changes) => {
+      const result = wasm2.process_changes(
+        id,
+        changesToWasm(changes)
+      );
+      const stateChanges = wasmChangesToJs(result.state_changes);
+      return {
+        state_changes: stateChanges,
+        changes: stateChanges,
+        validators_to_run: result.validators_to_run ?? [],
+        execution_plan: result.execution_plan ?? null,
+        has_work: result.has_work ?? false
+      };
+    },
+    pipelineFinalize: (jsChanges) => {
+      const result = wasm2.pipeline_finalize(
+        id,
+        changesToWasm(jsChanges)
+      );
+      return {
+        state_changes: wasmChangesToJs(result.state_changes)
+      };
+    },
+    registerSideEffects: (reg) => {
+      const resultJson = wasm2.register_side_effects(
+        id,
+        JSON.stringify(reg)
+      );
+      return {
+        sync_changes: wasmChangesToJs(resultJson.sync_changes),
+        aggregation_changes: wasmChangesToJs(resultJson.aggregation_changes),
+        registered_listener_ids: resultJson.registered_listener_ids
+      };
+    },
+    unregisterSideEffects: (registrationId) => {
+      wasm2.unregister_side_effects(id, registrationId);
+    },
+    registerConcerns: (reg) => {
+      const resultJson = wasm2.register_concerns(
+        id,
+        JSON.stringify(reg)
+      );
+      return {
+        bool_logic_changes: wasmChangesToJs(resultJson.bool_logic_changes),
+        registered_logic_ids: resultJson.registered_logic_ids,
+        registered_validator_ids: resultJson.registered_validator_ids,
+        value_logic_changes: wasmChangesToJs(
+          resultJson.value_logic_changes ?? []
+        ),
+        registered_value_logic_ids: resultJson.registered_value_logic_ids ?? []
+      };
+    },
+    unregisterConcerns: (registrationId) => {
+      wasm2.unregister_concerns(id, registrationId);
+    },
+    registerBoolLogic: (outputPath, tree) => wasm2.register_boollogic(id, outputPath, JSON.stringify(tree)),
+    unregisterBoolLogic: (logicId) => {
+      wasm2.unregister_boollogic(id, logicId);
+    },
+    pipelineReset: () => {
+      wasm2.pipeline_reset(id);
+    },
+    destroy: () => {
+      wasm2.pipeline_destroy(id);
+      schemas.clear();
+    },
+    validatorSchemas: schemas
+  };
+};
+
+// src/wasm/lifecycle.tsx
+import { Fragment, jsx } from "react/jsx-runtime";
+var wasmInstance = null;
+var loadingPromise = null;
+var loadWasm2 = async () => {
+  if (wasmInstance) return wasmInstance;
+  if (loadingPromise) {
+    await loadingPromise;
+    return wasmInstance;
+  }
+  loadingPromise = (async () => {
+    const wasmModule = await init_apex_state_wasm().then(() => apex_state_wasm_exports);
+    if (typeof wasmModule.default === "function") {
+      await wasmModule.default();
+    }
+    wasmInstance = wasmModule;
+  })();
+  await loadingPromise;
+  return wasmInstance;
+};
+var isWasmLoaded = () => wasmInstance !== null;
+var initPipeline = (internal, initialState) => {
+  const pipeline = createWasmPipeline();
+  pipeline.shadowInit(initialState);
+  internal.pipeline = pipeline;
+};
+var WasmGate = ({ children }) => {
+  const [loaded, setLoaded] = useState(isWasmLoaded);
+  useEffect(() => {
+    if (loaded) return;
+    let cancelled = false;
+    loadWasm2().then(() => {
+      if (!cancelled) setLoaded(true);
+    }).catch((error) => {
+      console.error("[apex-state] Failed to load WASM:", error);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [loaded]);
+  if (!loaded) return null;
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+WasmGate.displayName = "WasmGate";
+var getWasmInstance = () => {
+  if (!wasmInstance) {
+    throw new Error("WASM not loaded. Call loadWasm() first.");
+  }
+  return wasmInstance;
+};
+
 // src/store/provider.tsx
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var createInternalState = (config) => ({
   graphs: {
     sync: createPathGroups("sync"),
@@ -2660,84 +2682,58 @@ var createInternalState = (config) => ({
 });
 var createProvider = (storeConfig) => {
   const resolvedConfig = deepMerge(DEFAULT_STORE_CONFIG, storeConfig);
-  const isLegacy = resolvedConfig.useLegacyImplementation;
-  const Provider = ({
-    initialState: rawInitialState,
-    children
-  }) => {
-    const prepared = useMemo(
-      () => prepareInitialState(rawInitialState),
-      // Only initialize once - ignore changes to initialState after mount
-      []
-    );
-    const store = useMemo(() => {
-      const internal = createInternalState(resolvedConfig);
-      if (!isLegacy && isWasmLoaded()) {
-        initPipeline(internal, prepared.initialState);
+  const buildStore = (rawInitialState) => {
+    const prepared = prepareInitialState(rawInitialState);
+    const internal = createInternalState(resolvedConfig);
+    initPipeline(internal, prepared.initialState);
+    const debugTrack = resolvedConfig.debug.track ? {
+      calls: [],
+      clear: () => {
+        debugTrack.calls.length = 0;
       }
-      const debugTrack = resolvedConfig.debug.track ? {
-        calls: [],
-        clear: () => {
-          debugTrack.calls.length = 0;
-        }
-      } : null;
-      const stateProxy = proxy(prepared.initialState);
-      attachComputedGetters(stateProxy, prepared.getterMap);
-      return {
-        // state: Application data (tracked by valtio)
-        // User actions WRITE to this, effects READ from this
-        state: stateProxy,
-        // _concerns: Computed concern values (tracked by valtio)
-        // Effects WRITE to this, UI components READ from this
-        _concerns: proxy({}),
-        // _internal: Graphs, registrations, processing (NOT tracked)
-        // Wrapped in ref() to prevent tracking even if store is later wrapped in a proxy
-        _internal: ref(internal),
-        // _debug: Tracking data for testing/debugging (only when debug.track enabled)
-        _debug: debugTrack ? ref(debugTrack) : null
-      };
-    }, []);
-    const [ready, setReady] = useState(
-      () => isLegacy || store._internal.pipeline !== null
-    );
-    useEffect(() => {
-      if (isLegacy) return;
-      let cancelled = false;
-      const ensurePipeline = () => {
-        if (cancelled) return;
-        if (!store._internal.pipeline) {
-          initPipeline(
-            store._internal,
-            prepared.initialState
-          );
-        }
-        setReady(true);
-      };
-      if (isWasmLoaded()) {
-        ensurePipeline();
-      } else {
-        loadWasm2().then(ensurePipeline).catch((error) => {
-          console.error("[apex-state] Failed to load WASM:", error);
-        });
+    } : null;
+    const stateProxy = proxy(prepared.initialState);
+    attachComputedGetters(stateProxy, prepared.getterMap);
+    return {
+      // state: Application data (tracked by valtio)
+      // User actions WRITE to this, effects READ from this
+      state: stateProxy,
+      // _concerns: Computed concern values (tracked by valtio)
+      // Effects WRITE to this, UI components READ from this
+      _concerns: proxy({}),
+      // _internal: Graphs, registrations, processing (NOT tracked)
+      // Wrapped in ref() to prevent tracking even if store is later wrapped in a proxy
+      _internal: ref(internal),
+      // _debug: Tracking data for testing/debugging (only when debug.track enabled)
+      _debug: debugTrack ? ref(debugTrack) : null
+    };
+  };
+  const StoreProvider = ({ initialState, children }) => {
+    const storeRef = useRef(buildStore(initialState));
+    const internal = storeRef.current._internal;
+    useLayoutEffect(() => {
+      if (internal._destroyTimer) {
+        clearTimeout(internal._destroyTimer);
+        internal._destroyTimer = void 0;
       }
       return () => {
-        cancelled = true;
-        store._internal.pipeline?.destroy();
-        store._internal.pipeline = null;
-        setReady(false);
+        internal._destroyTimer = setTimeout(() => {
+          internal.pipeline?.destroy();
+          internal.pipeline = null;
+          internal._destroyTimer = void 0;
+        }, 1e4);
       };
-    }, []);
-    if (!ready) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx(
+    }, [internal]);
+    return /* @__PURE__ */ jsx2(
       StoreContext.Provider,
       {
-        value: store,
+        value: storeRef.current,
         children
       }
     );
   };
+  StoreProvider.displayName = "StoreProvider";
+  const Provider = (props) => /* @__PURE__ */ jsx2(WasmGate, { children: /* @__PURE__ */ jsx2(StoreProvider, { ...props }) });
   Provider.displayName = "StoreProvider";
   return Provider;
 };
@@ -2745,9 +2741,6 @@ var createProvider = (storeConfig) => {
 // src/store/create-store.ts
 var createGenericStore = (config) => {
   const Provider = createProvider(config);
-  if (!config?.useLegacyImplementation) {
-    void loadWasm2();
-  }
   const _useFieldValue = (path) => {
     const store = useStoreContext();
     const snap = useSnapshot(store.state);
@@ -2791,7 +2784,7 @@ var createGenericStore = (config) => {
   };
   const useSideEffects = (id, effects) => {
     const store = useStoreContext();
-    useLayoutEffect(() => {
+    useLayoutEffect2(() => {
       const registerSideEffects3 = store._internal.config.useLegacyImplementation ? registerSideEffects : registerSideEffects2;
       return registerSideEffects3(store, id, effects);
     }, [store, id, effects]);
@@ -2799,7 +2792,7 @@ var createGenericStore = (config) => {
   const useConcerns = (id, registration, customConcerns) => {
     const store = useStoreContext();
     const concerns = customConcerns || defaultConcerns;
-    useLayoutEffect(() => {
+    useLayoutEffect2(() => {
       const registerConcernEffects3 = store._internal.config.useLegacyImplementation ? registerConcernEffects : registerConcernEffects2;
       return registerConcernEffects3(store, registration, concerns);
     }, [store, id, registration, customConcerns]);
@@ -2858,12 +2851,12 @@ var useBufferedField = (field) => {
 };
 
 // src/hooks/use-keyboard-select.ts
-import { useCallback as useCallback3, useRef } from "react";
+import { useCallback as useCallback3, useRef as useRef2 } from "react";
 var useKeyboardSelect = (field, config) => {
   const { setValue } = field;
   const { options, debounceMs = 500, matchFromStart = true } = config;
-  const searchRef = useRef("");
-  const timeoutRef = useRef(null);
+  const searchRef = useRef2("");
+  const timeoutRef = useRef2(null);
   const onKeyDown = useCallback3(
     (e) => {
       if (e.key.length !== 1) return;
@@ -2891,11 +2884,11 @@ var useKeyboardSelect = (field, config) => {
 };
 
 // src/hooks/use-throttled-field.ts
-import { useCallback as useCallback4, useEffect as useEffect2, useRef as useRef2 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect2, useRef as useRef3 } from "react";
 var useThrottledField = (field, config) => {
   const { setValue: originalSetValue, ...rest } = field;
   const { ms } = config;
-  const throttleRef = useRef2({
+  const throttleRef = useRef3({
     timeoutId: null,
     lastFlushTime: 0,
     pendingValue: void 0,
@@ -2945,11 +2938,11 @@ var useThrottledField = (field, config) => {
 };
 
 // src/hooks/use-transformed-field.ts
-import { useCallback as useCallback5, useMemo as useMemo2 } from "react";
+import { useCallback as useCallback5, useMemo } from "react";
 var useTransformedField = (field, config) => {
   const { value: storedValue, setValue: setStoredValue, ...rest } = field;
   const { to, from } = config;
-  const value = useMemo2(() => to(storedValue), [storedValue, to]);
+  const value = useMemo(() => to(storedValue), [storedValue, to]);
   const setValue = useCallback5(
     (displayValue) => {
       const storedVal = from(displayValue);