@chromahq/store 0.1.1 → 0.1.2

package/dist/index.cjs.js

@@ -196,6 +196,79 @@ function createBridgeStore(bridge, initialState, storeName = "default") {
   return new BridgeStore(bridge, initialState, storeName);
 }
 
+function createActionHookForStore(store, actionsFactory) {
+  return function useCustomActions() {
+    const baseActions = useStoreActions(store);
+    return React.useMemo(() => actionsFactory(baseActions), [baseActions]);
+  };
+}
+function useStoreActions(store) {
+  return React.useMemo(
+    () => ({
+      update: (partial) => {
+        store.setState((state) => ({ ...state, ...partial }));
+      },
+      updateWith: (updater) => {
+        store.setState((state) => ({ ...state, ...updater(state) }));
+      },
+      replace: (newState) => {
+        store.setState(newState, true);
+      },
+      setState: store.setState.bind(store)
+    }),
+    [store]
+  );
+}
+function createStoreHooks() {
+  const StoreContext = React.createContext(null);
+  function StoreProvider({ store, children }) {
+    const storeRef = React.useRef(store);
+    return React__namespace.createElement(StoreContext.Provider, { value: storeRef.current }, children);
+  }
+  function useStore(selector) {
+    const store = React.useContext(StoreContext);
+    if (!store) throw new Error("useStore must be used within a StoreProvider");
+    return useCentralStore(store, selector);
+  }
+  function useStoreInstance() {
+    const store = React.useContext(StoreContext);
+    if (!store) throw new Error("useStoreInstance must be used within a StoreProvider");
+    return store;
+  }
+  function useActions() {
+    const store = useStoreInstance();
+    return useStoreActions(store);
+  }
+  function useAction(actionKey) {
+    const store = useStoreInstance();
+    return React__namespace.useCallback(
+      (...args) => {
+        const fn = store.getState()[actionKey];
+        if (typeof fn !== "function") {
+          throw new Error("useAction only supports function actions");
+        }
+        return fn(...args);
+      },
+      [store, actionKey]
+    );
+  }
+  function createActionHook(actionsFactory) {
+    return function useCustomActions() {
+      const store = useStoreInstance();
+      const baseActions = useStoreActions(store);
+      return React.useMemo(() => actionsFactory(baseActions), [baseActions]);
+    };
+  }
+  return {
+    createActionHook,
+    StoreProvider,
+    useStore,
+    useStoreInstance,
+    useActions,
+    useAction
+  };
+}
+
 class StoreBuilder {
   constructor(name = "default") {
     this.config = {
@@ -253,57 +326,6 @@ function createStore(name) {
   return new StoreBuilder(name);
 }
 
-function useStoreActions(store) {
-  return React.useMemo(
-    () => ({
-      update: (partial) => {
-        store.setState((state) => ({ ...state, ...partial }));
-      },
-      updateWith: (updater) => {
-        store.setState((state) => ({ ...state, ...updater(state) }));
-      },
-      replace: (newState) => {
-        store.setState(newState, true);
-      },
-      setState: store.setState.bind(store)
-    }),
-    [store]
-  );
-}
-function createStoreHooks() {
-  const StoreContext = React.createContext(null);
-  function StoreProvider({ store, children }) {
-    const storeRef = React.useRef(store);
-    return React__namespace.createElement(StoreContext.Provider, { value: storeRef.current }, children);
-  }
-  function useStore(selector) {
-    const store = React.useContext(StoreContext);
-    if (!store) throw new Error("useStore must be used within a StoreProvider");
-    return useCentralStore(store, selector);
-  }
-  function useStoreInstance() {
-    const store = React.useContext(StoreContext);
-    if (!store) throw new Error("useStoreInstance must be used within a StoreProvider");
-    return store;
-  }
-  function useActions() {
-    const store = useStoreInstance();
-    return useStoreActions(store);
-  }
-  function useAction(actionKey) {
-    const store = useStoreInstance();
-    const action = useCentralStore(store, (state) => state[actionKey]);
-    return action;
-  }
-  return {
-    StoreProvider,
-    useStore,
-    useStoreInstance,
-    useActions,
-    useAction
-  };
-}
-
 function autoRegisterStoreHandlers(store) {
   if (!store) {
     throw new Error("autoRegisterStoreHandlers: store parameter is required");
@@ -392,6 +414,7 @@ if (typeof globalThis !== "undefined") {
 exports.BridgeStore = BridgeStore;
 exports.StoreBuilder = StoreBuilder;
 exports.chromeStoragePersist = chromeStoragePersist;
+exports.createActionHookForStore = createActionHookForStore;
 exports.createBridgeStore = createBridgeStore;
 exports.createStore = createStore;
 exports.createStoreHooks = createStoreHooks;

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { StoreApi, StateCreator } from 'zustand';
-import { StateCreator as StateCreator$1 } from 'zustand/vanilla';
 import * as React from 'react';
 import { ReactNode } from 'react';
+import { StateCreator as StateCreator$1 } from 'zustand/vanilla';
 
 type PersistOptions = {
     name: string;
@@ -64,6 +64,50 @@ declare class BridgeStore<T> implements CentralStore<T> {
 }
 declare function createBridgeStore<T>(bridge: BridgeWithEvents, initialState?: T, storeName?: string): CentralStore<T>;
 
+/**
+ * Generic action hook factory for any store instance.
+ * Usage:
+ *   const store = createStore(mergeSlices(sliceA, sliceB));
+ *   <StoreProvider store={store}> ... </StoreProvider>
+ *   export const useWalletActions = createActionHookForStore(store, walletActions);
+ *   export const useCounterActions = createActionHookForStore(store, counterActions);
+ * All hooks and actions share the same StoreProvider/context.
+ */
+declare function createActionHookForStore<S extends Record<string, any>, ActionMap extends Record<string, (...args: any[]) => void>>(store: CentralStore<S>, actionsFactory: (actions: ReturnType<typeof useStoreActions<S>>) => ActionMap): () => ActionMap;
+
+/**
+ * Store actions helper: exposes update, updateWith, replace, setState
+ * Actions should be defined in your slice and accessed via useActions.
+ */
+declare function useStoreActions<T extends Record<string, any>>(store: CentralStore<T>): {
+    update: (partial: Partial<T>) => void;
+    updateWith: (updater: (state: T) => Partial<T>) => void;
+    replace: (newState: T) => void;
+    setState: {
+        (partial: T | Partial<T> | ((state: T) => T | Partial<T>), replace?: false): void;
+        (state: T | ((state: T) => T), replace: true): void;
+    };
+};
+declare function createStoreHooks<T extends Record<string, any>>(): {
+    createActionHook: <ActionMap extends Record<string, (...args: any[]) => void>>(actionsFactory: (actions: ReturnType<typeof useStoreActions<T>>) => ActionMap) => () => ActionMap;
+    StoreProvider: ({ store, children }: {
+        store: CentralStore<T>;
+        children: ReactNode;
+    }) => React.FunctionComponentElement<React.ProviderProps<CentralStore<T> | null>>;
+    useStore: <U>(selector: (state: T) => U) => U;
+    useStoreInstance: () => CentralStore<T>;
+    useActions: () => {
+        update: (partial: Partial<T>) => void;
+        updateWith: (updater: (state: T) => Partial<T>) => void;
+        replace: (newState: T) => void;
+        setState: {
+            (partial: T | Partial<T> | ((state: T) => T | Partial<T>), replace?: false): void;
+            (state: T | ((state: T) => T), replace: true): void;
+        };
+    };
+    useAction: <K extends { [K_1 in keyof T]: T[K_1] extends (...args: any[]) => any ? K_1 : never; }[keyof T]>(actionKey: K) => T[K];
+};
+
 /**
  * Core store builder with fluent API
  */
@@ -90,28 +134,5 @@ declare class StoreBuilder<T = any> {
  */
 declare function createStore<T = any>(name?: string): StoreBuilder<T>;
 
-/**
- * Create store hooks for context-based state and actions.
- * Use useStore for state selection and useActions for auto-wired actions.
- */
-declare function createStoreHooks<T extends Record<string, any>>(): {
-    StoreProvider: ({ store, children }: {
-        store: CentralStore<T>;
-        children: ReactNode;
-    }) => React.FunctionComponentElement<React.ProviderProps<CentralStore<T> | null>>;
-    useStore: <U>(selector: (state: T) => U) => U;
-    useStoreInstance: () => CentralStore<T>;
-    useActions: () => {
-        update: (partial: Partial<T>) => void;
-        updateWith: (updater: (state: T) => Partial<T>) => void;
-        replace: (newState: T) => void;
-        setState: {
-            (partial: T | Partial<T> | ((state: T) => T | Partial<T>), replace?: false): void;
-            (state: T | ((state: T) => T), replace: true): void;
-        };
-    };
-    useAction: <K extends keyof T>(actionKey: K) => T[K];
-};
-
-export { BridgeStore, StoreBuilder, chromeStoragePersist, createBridgeStore, createStore, createStoreHooks, useCentralDispatch, useCentralStore };
+export { BridgeStore, StoreBuilder, chromeStoragePersist, createActionHookForStore, createBridgeStore, createStore, createStoreHooks, useCentralDispatch, useCentralStore };
 export type { Bridge, BridgeWithEvents, BridgeWithHandlers, CentralStore, ExtractSliceState, MergeSlices, PersistOptions, SliceCreator, StoreConfig, StoreDefinition };

package/dist/index.es.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useSyncExternalStore, createContext, useContext, useRef, useMemo } from 'react';
+import { useSyncExternalStore, createContext, useMemo, useContext, useRef } from 'react';
 import { createStore as createStore$1 } from 'zustand/vanilla';
 
 function chromeStoragePersist(options) {
@@ -176,6 +176,79 @@ function createBridgeStore(bridge, initialState, storeName = "default") {
   return new BridgeStore(bridge, initialState, storeName);
 }
 
+function createActionHookForStore(store, actionsFactory) {
+  return function useCustomActions() {
+    const baseActions = useStoreActions(store);
+    return useMemo(() => actionsFactory(baseActions), [baseActions]);
+  };
+}
+function useStoreActions(store) {
+  return useMemo(
+    () => ({
+      update: (partial) => {
+        store.setState((state) => ({ ...state, ...partial }));
+      },
+      updateWith: (updater) => {
+        store.setState((state) => ({ ...state, ...updater(state) }));
+      },
+      replace: (newState) => {
+        store.setState(newState, true);
+      },
+      setState: store.setState.bind(store)
+    }),
+    [store]
+  );
+}
+function createStoreHooks() {
+  const StoreContext = createContext(null);
+  function StoreProvider({ store, children }) {
+    const storeRef = useRef(store);
+    return React.createElement(StoreContext.Provider, { value: storeRef.current }, children);
+  }
+  function useStore(selector) {
+    const store = useContext(StoreContext);
+    if (!store) throw new Error("useStore must be used within a StoreProvider");
+    return useCentralStore(store, selector);
+  }
+  function useStoreInstance() {
+    const store = useContext(StoreContext);
+    if (!store) throw new Error("useStoreInstance must be used within a StoreProvider");
+    return store;
+  }
+  function useActions() {
+    const store = useStoreInstance();
+    return useStoreActions(store);
+  }
+  function useAction(actionKey) {
+    const store = useStoreInstance();
+    return React.useCallback(
+      (...args) => {
+        const fn = store.getState()[actionKey];
+        if (typeof fn !== "function") {
+          throw new Error("useAction only supports function actions");
+        }
+        return fn(...args);
+      },
+      [store, actionKey]
+    );
+  }
+  function createActionHook(actionsFactory) {
+    return function useCustomActions() {
+      const store = useStoreInstance();
+      const baseActions = useStoreActions(store);
+      return useMemo(() => actionsFactory(baseActions), [baseActions]);
+    };
+  }
+  return {
+    createActionHook,
+    StoreProvider,
+    useStore,
+    useStoreInstance,
+    useActions,
+    useAction
+  };
+}
+
 class StoreBuilder {
   constructor(name = "default") {
     this.config = {
@@ -233,57 +306,6 @@ function createStore(name) {
   return new StoreBuilder(name);
 }
 
-function useStoreActions(store) {
-  return useMemo(
-    () => ({
-      update: (partial) => {
-        store.setState((state) => ({ ...state, ...partial }));
-      },
-      updateWith: (updater) => {
-        store.setState((state) => ({ ...state, ...updater(state) }));
-      },
-      replace: (newState) => {
-        store.setState(newState, true);
-      },
-      setState: store.setState.bind(store)
-    }),
-    [store]
-  );
-}
-function createStoreHooks() {
-  const StoreContext = createContext(null);
-  function StoreProvider({ store, children }) {
-    const storeRef = useRef(store);
-    return React.createElement(StoreContext.Provider, { value: storeRef.current }, children);
-  }
-  function useStore(selector) {
-    const store = useContext(StoreContext);
-    if (!store) throw new Error("useStore must be used within a StoreProvider");
-    return useCentralStore(store, selector);
-  }
-  function useStoreInstance() {
-    const store = useContext(StoreContext);
-    if (!store) throw new Error("useStoreInstance must be used within a StoreProvider");
-    return store;
-  }
-  function useActions() {
-    const store = useStoreInstance();
-    return useStoreActions(store);
-  }
-  function useAction(actionKey) {
-    const store = useStoreInstance();
-    const action = useCentralStore(store, (state) => state[actionKey]);
-    return action;
-  }
-  return {
-    StoreProvider,
-    useStore,
-    useStoreInstance,
-    useActions,
-    useAction
-  };
-}
-
 function autoRegisterStoreHandlers(store) {
   if (!store) {
     throw new Error("autoRegisterStoreHandlers: store parameter is required");
@@ -369,4 +391,4 @@ if (typeof globalThis !== "undefined") {
   globalThis.initStores = init;
 }
 
-export { BridgeStore, StoreBuilder, chromeStoragePersist, createBridgeStore, createStore, createStoreHooks, useCentralDispatch, useCentralStore };
+export { BridgeStore, StoreBuilder, chromeStoragePersist, createActionHookForStore, createBridgeStore, createStore, createStoreHooks, useCentralDispatch, useCentralStore };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chromahq/store",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Centralized, persistent store for Chrome extensions using zustand, accessible from service workers and React, with chrome.storage.local persistence.",
   "type": "module",
   "main": "dist/index.cjs.js",