@buoy-gg/zustand 3.0.1 → 3.0.2

package/lib/commonjs/zustand/utils/buoyZustandMiddleware.js

@@ -1 +1,220 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.buoyDevTools=buoyDevTools,exports.isStoreInstrumented=isStoreInstrumented,exports.watchStores=watchStores;var _zustandStateStore=require("./zustandStateStore");const WATCHED_SYMBOL=Symbol.for("@@buoy-zustand/watched");function detectPersist(t){const e=t.persist;if(e&&"function"==typeof e.getOptions){const t=e.getOptions();return{isPersisted:!0,persistName:t?.name}}return{isPersisted:!1}}function watchStores(t){const e=[];for(const[s,r]of Object.entries(t)){const t=r;if(t[WATCHED_SYMBOL])continue;t[WATCHED_SYMBOL]=!0;const{isPersisted:n,persistName:a}=detectPersist(r);_zustandStateStore.zustandStateStore.registerStore(s,{getState:r.getState,getInitialState:r.getInitialState,setState:r.setState,subscribe:r.subscribe},{isPersisted:n,persistName:a});const o=r.subscribe((t,e)=>{try{_zustandStateStore.zustandStateStore.addStateChange({storeName:s,partial:void 0,replace:!1,prevState:e,nextState:t,duration:void 0,isPersisted:n})}catch{}});e.push(()=>{o(),delete r[WATCHED_SYMBOL],_zustandStateStore.zustandStateStore.unregisterStore(s)})}return()=>{e.forEach(t=>t())}}let unnamedCounter=0;function buoyDevTools(t,e){return(s,r,n)=>{const a=e?.name??"store-"+ ++unnamedCounter,o=!1!==e?.enabled,i=t((t,e)=>{if(!o)return s(t,e);const n=performance.now(),i=r();s(t,e);const S=r(),u=performance.now()-n,d="function"==typeof t?"(updater fn)":t;_zustandStateStore.zustandStateStore.addStateChange({storeName:a,partial:d,replace:e??!1,prevState:i,nextState:S,duration:u,isPersisted:!1})},r,n);return setTimeout(()=>{if(n[WATCHED_SYMBOL])return;n[WATCHED_SYMBOL]=!0;const{isPersisted:t,persistName:e}=detectPersist(n);_zustandStateStore.zustandStateStore.registerStore(a,{getState:r,getInitialState:n.getInitialState,setState:s,subscribe:n.subscribe},{isPersisted:t,persistName:e})},0),i}}function isStoreInstrumented(t){return!0===t[WATCHED_SYMBOL]}
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buoyDevTools = buoyDevTools;
+exports.isStoreInstrumented = isStoreInstrumented;
+exports.watchStores = watchStores;
+var _zustandStateStore = require("./zustandStateStore");
+/**
+ * Buoy Zustand DevTools — Store instrumentation
+ *
+ * Two approaches, from easiest to most detailed:
+ *
+ * 1. watchStores() — RECOMMENDED. One line, zero store modifications.
+ *    Uses store.subscribe() externally. Never touches setState.
+ *    Safe to add/remove — cannot break your stores even if our code has bugs.
+ *
+ * 2. buoyDevTools() — Opt-in middleware for advanced use.
+ *    Wraps setState to capture the partial argument and timing.
+ *    Requires modifying each store's create() call.
+ */
+
+/** Symbol to mark stores that have been watched/instrumented */
+const WATCHED_SYMBOL = Symbol.for("@@buoy-zustand/watched");
+
+/**
+ * Detect if a store is using the persist middleware by checking for persist API
+ */
+function detectPersist(store) {
+  const persist = store.persist;
+  if (persist && typeof persist.getOptions === "function") {
+    const options = persist.getOptions();
+    return {
+      isPersisted: true,
+      persistName: options?.name
+    };
+  }
+  return {
+    isPersisted: false
+  };
+}
+
+// =============================================================================
+// watchStores — Primary, non-intrusive approach
+// =============================================================================
+
+/** Minimal store shape — what Zustand's create() returns */
+
+/**
+ * Watch multiple Zustand stores for state changes.
+ *
+ * This is the recommended, non-intrusive approach. It uses each store's
+ * `.subscribe()` method to observe changes from the outside — it never
+ * modifies `setState` or any store internals.
+ *
+ * **Safe by design:** Even if our listener code has a bug, it cannot break
+ * your stores. All listener code is wrapped in try/catch.
+ *
+ * @example
+ * ```tsx
+ * // In your _layout.tsx or App.tsx — ONE line:
+ * import { watchStores } from '@buoy-gg/zustand';
+ * import { useCounterStore } from './stores/counter';
+ * import { useAuthStore } from './stores/auth';
+ * import { useCartStore } from './stores/cart';
+ *
+ * watchStores({
+ *   counterStore: useCounterStore,
+ *   authStore: useAuthStore,
+ *   cartStore: useCartStore,
+ * });
+ * ```
+ *
+ * @param stores - Object mapping store names to Zustand store hooks
+ * @returns Cleanup function that removes all subscriptions
+ */
+function watchStores(stores) {
+  const cleanups = [];
+  for (const [name, store] of Object.entries(stores)) {
+    // Skip if already watched
+    const storeAny = store;
+    if (storeAny[WATCHED_SYMBOL]) continue;
+    storeAny[WATCHED_SYMBOL] = true;
+    const {
+      isPersisted,
+      persistName
+    } = detectPersist(store);
+
+    // Register the store for overview
+    _zustandStateStore.zustandStateStore.registerStore(name, {
+      getState: store.getState,
+      getInitialState: store.getInitialState,
+      setState: store.setState,
+      subscribe: store.subscribe
+    }, {
+      isPersisted,
+      persistName
+    });
+
+    // Subscribe to state changes — completely external, never touches setState
+    const unsubscribe = store.subscribe((state, prevState) => {
+      try {
+        _zustandStateStore.zustandStateStore.addStateChange({
+          storeName: name,
+          partial: undefined,
+          // Not available in subscribe-only mode
+          replace: false,
+          prevState,
+          nextState: state,
+          duration: undefined,
+          // Not available in subscribe-only mode
+          isPersisted
+        });
+      } catch {
+        // Silently catch — our bug must never propagate into the store
+      }
+    });
+    cleanups.push(() => {
+      unsubscribe();
+      delete store[WATCHED_SYMBOL];
+      _zustandStateStore.zustandStateStore.unregisterStore(name);
+    });
+  }
+  return () => {
+    cleanups.forEach(fn => fn());
+  };
+}
+
+// =============================================================================
+// buoyDevTools — Opt-in middleware (advanced, more detail)
+// =============================================================================
+
+/** Auto-incrementing store name counter for unnamed stores */
+let unnamedCounter = 0;
+
+/**
+ * Zustand middleware that instruments a store for Buoy DevTools.
+ *
+ * This is the advanced approach — it wraps setState to capture:
+ * - The partial argument passed to setState
+ * - Precise timing of each setState call
+ *
+ * Use this when you want maximum detail. For most cases, `watchStores()`
+ * is simpler and safer.
+ *
+ * @example
+ * ```tsx
+ * import { create } from 'zustand';
+ * import { buoyDevTools } from '@buoy-gg/zustand';
+ *
+ * const useCounterStore = create(
+ *   buoyDevTools(
+ *     (set) => ({
+ *       count: 0,
+ *       increment: () => set((s) => ({ count: s.count + 1 })),
+ *     }),
+ *     { name: 'counterStore' }
+ *   )
+ * );
+ * ```
+ */
+function buoyDevTools(config, options) {
+  return (set, get, api) => {
+    const storeName = options?.name ?? `store-${++unnamedCounter}`;
+    const enabled = options?.enabled !== false;
+    const instrumentedSet = (partial, replace) => {
+      if (!enabled) {
+        return set(partial, replace);
+      }
+      const startTime = performance.now();
+      const prevState = get();
+      set(partial, replace);
+      const nextState = get();
+      const duration = performance.now() - startTime;
+      const resolvedPartial = typeof partial === "function" ? "(updater fn)" : partial;
+      _zustandStateStore.zustandStateStore.addStateChange({
+        storeName,
+        partial: resolvedPartial,
+        replace: replace ?? false,
+        prevState,
+        nextState,
+        duration,
+        isPersisted: false
+      });
+    };
+    const result = config(instrumentedSet, get, api);
+
+    // Register the store after creation
+    setTimeout(() => {
+      if (api[WATCHED_SYMBOL]) return;
+      api[WATCHED_SYMBOL] = true;
+      const {
+        isPersisted,
+        persistName
+      } = detectPersist(api);
+      _zustandStateStore.zustandStateStore.registerStore(storeName, {
+        getState: get,
+        getInitialState: api.getInitialState,
+        setState: set,
+        subscribe: api.subscribe
+      }, {
+        isPersisted,
+        persistName
+      });
+    }, 0);
+    return result;
+  };
+}
+
+// =============================================================================
+// Utility
+// =============================================================================
+
+/**
+ * Check if a store is being watched/instrumented
+ */
+function isStoreInstrumented(store) {
+  return store[WATCHED_SYMBOL] === true;
+}

package/lib/commonjs/zustand/utils/index.js

@@ -1 +1,31 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"buoyDevTools",{enumerable:!0,get:function(){return _buoyZustandMiddleware.buoyDevTools}}),Object.defineProperty(exports,"isStoreInstrumented",{enumerable:!0,get:function(){return _buoyZustandMiddleware.isStoreInstrumented}}),Object.defineProperty(exports,"watchStores",{enumerable:!0,get:function(){return _buoyZustandMiddleware.watchStores}}),Object.defineProperty(exports,"zustandStateStore",{enumerable:!0,get:function(){return _zustandStateStore.zustandStateStore}});var _zustandStateStore=require("./zustandStateStore"),_buoyZustandMiddleware=require("./buoyZustandMiddleware");
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "buoyDevTools", {
+  enumerable: true,
+  get: function () {
+    return _buoyZustandMiddleware.buoyDevTools;
+  }
+});
+Object.defineProperty(exports, "isStoreInstrumented", {
+  enumerable: true,
+  get: function () {
+    return _buoyZustandMiddleware.isStoreInstrumented;
+  }
+});
+Object.defineProperty(exports, "watchStores", {
+  enumerable: true,
+  get: function () {
+    return _buoyZustandMiddleware.watchStores;
+  }
+});
+Object.defineProperty(exports, "zustandStateStore", {
+  enumerable: true,
+  get: function () {
+    return _zustandStateStore.zustandStateStore;
+  }
+});
+var _zustandStateStore = require("./zustandStateStore");
+var _buoyZustandMiddleware = require("./buoyZustandMiddleware");