@wizzard-packages/react 0.1.0 → 0.3.0

package/dist/index.js

@@ -11,11 +11,87 @@ import {
 } from "react";
 import {
   WizardStore,
+  getByPath as getByPath2,
+  setByPath as setByPath2
+} from "@wizzard-packages/core";
+import { MemoryAdapter } from "@wizzard-packages/persistence";
+
+// src/internal/dependencies.ts
+import {
   getByPath,
   setByPath
 } from "@wizzard-packages/core";
-import { MemoryAdapter } from "@wizzard-packages/persistence";
+var applyStepDependencies = (config, store, baseData, changedPaths) => {
+  let currentData = { ...baseData };
+  const allClearedPaths = /* @__PURE__ */ new Set();
+  const snapshot = store.getSnapshot();
+  const nextCompletedSteps = new Set(snapshot.completedSteps);
+  const nextVisitedSteps = new Set(snapshot.visitedSteps);
+  let statusChanged = false;
+  const processDependencies = (paths) => {
+    const newlyClearedPaths = [];
+    config.steps.forEach((step) => {
+      const isDependent = step.dependsOn?.some(
+        (p) => paths.some((path) => path === p || p.startsWith(path + ".") || path.startsWith(p + "."))
+      );
+      if (!isDependent) return;
+      if (nextCompletedSteps.delete(step.id)) {
+        statusChanged = true;
+      }
+      if (nextVisitedSteps.delete(step.id)) {
+        statusChanged = true;
+      }
+      if (!step.clearData) return;
+      if (typeof step.clearData === "function") {
+        const patch = step.clearData(currentData, paths);
+        Object.keys(patch).forEach((key) => {
+          if (currentData[key] !== patch[key]) {
+            currentData[key] = patch[key];
+            newlyClearedPaths.push(key);
+            allClearedPaths.add(key);
+          }
+        });
+      } else {
+        const pathsToClear = Array.isArray(step.clearData) ? step.clearData : [step.clearData];
+        pathsToClear.forEach((p) => {
+          const val = getByPath(currentData, p);
+          if (val !== void 0) {
+            currentData = setByPath(currentData, p, void 0);
+            newlyClearedPaths.push(p);
+            allClearedPaths.add(p);
+          }
+        });
+      }
+    });
+    if (newlyClearedPaths.length > 0) {
+      processDependencies(newlyClearedPaths);
+    }
+  };
+  processDependencies(changedPaths);
+  return {
+    newData: currentData,
+    hasClearing: allClearedPaths.size > 0,
+    clearedPaths: Array.from(allClearedPaths),
+    statusChanged,
+    nextCompletedSteps,
+    nextVisitedSteps
+  };
+};
+
+// src/context/WizardContext.tsx
 import { jsx } from "react/jsx-runtime";
+var UNSET = /* @__PURE__ */ Symbol("wizard_unset");
+var shallowEqual = (a, b) => {
+  if (a === b) return true;
+  if (!a || !b) return false;
+  const aKeys = Object.keys(a);
+  const bKeys = Object.keys(b);
+  if (aKeys.length !== bKeys.length) return false;
+  for (const key of aKeys) {
+    if (!Object.is(a[key], b[key])) return false;
+  }
+  return true;
+};
 var WizardStateContext = createContext(void 0);
 var WizardActionsContext = createContext(void 0);
 var WizardStoreContext = createContext(void 0);
@@ -35,9 +111,10 @@ function WizardProvider({
     return localConfig.persistence?.adapter || new MemoryAdapter();
   }, [localConfig.persistence?.adapter]);
   const persistenceMode = localConfig.persistence?.mode || "onStepChange";
-  const META_KEY = "__wizzard_meta__";
+  const META_KEY2 = "__wizzard_meta__";
   const snapshot = useSyncExternalStore(
     storeRef.current.subscribe,
+    storeRef.current.getSnapshot,
     storeRef.current.getSnapshot
   );
   const {
@@ -151,83 +228,23 @@ function WizardProvider({
     const idx = activeStepsIndexMap2.get(currentStepId2) ?? -1;
     if (idx > 0) await goToStep(activeSteps2[idx - 1].id);
   }, [goToStep]);
-  const handleStepDependencies = useCallback(
-    (paths, initialData2) => {
-      let currentData = { ...initialData2 };
-      const allClearedPaths = /* @__PURE__ */ new Set();
-      const { completedSteps: completedSteps2, visitedSteps: visitedSteps2 } = storeRef.current.getSnapshot();
-      const nextComp = new Set(completedSteps2);
-      const nextVis = new Set(visitedSteps2);
-      let statusChanged = false;
-      const processDependencies = (changedPaths) => {
-        const newlyClearedPaths = [];
-        localConfig.steps.forEach((step) => {
-          const isDependent = step.dependsOn?.some(
-            (p) => changedPaths.some(
-              (path) => path === p || p.startsWith(path + ".") || path.startsWith(p + ".")
-            )
-          );
-          if (isDependent) {
-            if (nextComp.delete(step.id)) {
-              statusChanged = true;
-            }
-            if (nextVis.delete(step.id)) {
-              statusChanged = true;
-            }
-            if (step.clearData) {
-              if (typeof step.clearData === "function") {
-                const patch = step.clearData(currentData, changedPaths);
-                Object.keys(patch).forEach((key) => {
-                  if (currentData[key] !== patch[key]) {
-                    currentData[key] = patch[key];
-                    newlyClearedPaths.push(key);
-                    allClearedPaths.add(key);
-                  }
-                });
-              } else {
-                const pathsToClear = Array.isArray(step.clearData) ? step.clearData : [step.clearData];
-                pathsToClear.forEach((p) => {
-                  const val = getByPath(currentData, p);
-                  if (val !== void 0) {
-                    currentData = setByPath(currentData, p, void 0);
-                    newlyClearedPaths.push(p);
-                    allClearedPaths.add(p);
-                  }
-                });
-              }
-            }
-          }
-        });
-        if (newlyClearedPaths.length > 0) {
-          processDependencies(newlyClearedPaths);
-        }
-      };
-      processDependencies(paths);
+  const setData = useCallback(
+    (path, value, options) => {
+      const { stepsMap: stepsMap2, currentStepId: currentStepId2 } = stateRef.current;
+      const prevData = storeRef.current.getSnapshot().data;
+      if (getByPath2(prevData, path) === value) return;
+      const baseData = setByPath2(prevData, path, value);
+      const { newData, hasClearing, statusChanged, nextCompletedSteps, nextVisitedSteps } = applyStepDependencies(localConfig, storeRef.current, baseData, [path]);
       if (statusChanged) {
         storeRef.current.dispatch({
           type: "SET_COMPLETED_STEPS",
-          payload: { steps: nextComp }
+          payload: { steps: nextCompletedSteps }
         });
         storeRef.current.dispatch({
           type: "SET_VISITED_STEPS",
-          payload: { steps: nextVis }
+          payload: { steps: nextVisitedSteps }
         });
       }
-      return {
-        newData: currentData,
-        hasClearing: allClearedPaths.size > 0,
-        clearedPaths: Array.from(allClearedPaths)
-      };
-    },
-    [localConfig.steps]
-  );
-  const setData = useCallback(
-    (path, value, options) => {
-      const { stepsMap: stepsMap2, currentStepId: currentStepId2 } = stateRef.current;
-      const prevData = storeRef.current.getSnapshot().data;
-      if (getByPath(prevData, path) === value) return;
-      const baseData = setByPath(prevData, path, value);
-      const { newData, hasClearing } = handleStepDependencies([path], baseData);
       if (!hasClearing) {
         storeRef.current.dispatch({
           type: "SET_DATA",
@@ -261,13 +278,23 @@ function WizardProvider({
         }
       }
     },
-    [localConfig, validateStep, handleStepDependencies]
+    [localConfig, validateStep]
   );
   const updateData = useCallback(
     (data2, options) => {
       const prev = storeRef.current.getSnapshot().data;
       const baseData = options?.replace ? data2 : { ...prev, ...data2 };
-      const { newData } = handleStepDependencies(Object.keys(data2), baseData);
+      const { newData, statusChanged, nextCompletedSteps, nextVisitedSteps } = applyStepDependencies(localConfig, storeRef.current, baseData, Object.keys(data2));
+      if (statusChanged) {
+        storeRef.current.dispatch({
+          type: "SET_COMPLETED_STEPS",
+          payload: { steps: nextCompletedSteps }
+        });
+        storeRef.current.dispatch({
+          type: "SET_VISITED_STEPS",
+          payload: { steps: nextVisitedSteps }
+        });
+      }
       storeRef.current.update(newData, Object.keys(data2));
       if (options?.persist) {
         if (storeRef.current.save) {
@@ -275,7 +302,7 @@ function WizardProvider({
         }
       }
     },
-    [handleStepDependencies]
+    [localConfig]
   );
   const reset = useCallback(() => {
     storeRef.current.setInitialData(initialData || {});
@@ -370,7 +397,7 @@ function WizardProvider({
       reset,
       setData,
       updateData,
-      getData: (p, d) => getByPath(storeRef.current.getSnapshot().data, p, d),
+      getData: (p, d) => getByPath2(storeRef.current.getSnapshot().data, p, d),
       updateConfig: (nc) => {
         setLocalConfig((prev) => ({ ...prev, ...nc }));
       }
@@ -421,7 +448,7 @@ function WizardProvider({
   useEffect(() => {
     if (hasHydratedRef.current) return;
     hasHydratedRef.current = true;
-    const meta = persistenceAdapter.getStep(META_KEY);
+    const meta = persistenceAdapter.getStep(META_KEY2);
     if (meta) {
       if (meta.currentStepId) {
         storeRef.current.dispatch({
@@ -484,12 +511,14 @@ function useWizardValue(path, options) {
   const store = useContext(WizardStoreContext);
   if (!store) throw new Error("useWizardValue must be used within a WizardProvider");
   const lastStateRef = useRef(null);
-  const lastValueRef = useRef(null);
+  const lastValueRef = useRef(UNSET);
   const getSnapshot = useCallback(() => {
     const data = store.getSnapshot().data;
-    if (data === lastStateRef.current) return lastValueRef.current;
-    const value = getByPath(data, path);
-    if (lastValueRef.current !== void 0 && (options?.isEqual || Object.is)(lastValueRef.current, value)) {
+    if (data === lastStateRef.current && lastValueRef.current !== UNSET) {
+      return lastValueRef.current;
+    }
+    const value = getByPath2(data, path);
+    if (lastValueRef.current !== UNSET && (options?.isEqual || Object.is)(lastValueRef.current, value)) {
       lastStateRef.current = data;
       return lastValueRef.current;
     }
@@ -497,7 +526,18 @@ function useWizardValue(path, options) {
     lastValueRef.current = value;
     return value;
   }, [store, path, options?.isEqual]);
-  return useSyncExternalStore(store.subscribe, getSnapshot);
+  return useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
+}
+function useWizardField(path, options) {
+  const value = useWizardValue(path, options);
+  const { setData } = useWizardActions();
+  const setValue = useCallback(
+    (next) => {
+      setData(path, next);
+    },
+    [setData, path]
+  );
+  return [value, setValue];
 }
 function useWizardError(path) {
   const store = useContext(WizardStoreContext);
@@ -510,22 +550,22 @@ function useWizardError(path) {
     }
     return void 0;
   }, [store, path]);
-  return useSyncExternalStore(store.subscribe, getSnapshot);
+  return useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
 }
 function useWizardSelector(selector, options) {
   const store = useContext(WizardStoreContext);
   if (!store) throw new Error("useWizardSelector must be used within a WizardProvider");
-  const lastResultRef = useRef(null);
+  const lastResultRef = useRef(UNSET);
   const getSnapshot = useCallback(() => {
     const full = store.getSnapshot();
     const res = selector(full);
-    if (lastResultRef.current !== null && (options?.isEqual || Object.is)(lastResultRef.current, res)) {
+    if (lastResultRef.current !== UNSET && (options?.isEqual || Object.is)(lastResultRef.current, res)) {
       return lastResultRef.current;
     }
     lastResultRef.current = res;
     return res;
   }, [store, selector, options?.isEqual]);
-  return useSyncExternalStore(store.subscribe, getSnapshot);
+  return useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
 }
 function useWizardActions() {
   const context = useContext(WizardActionsContext);
@@ -558,6 +598,44 @@ function useWizardContext() {
     [stateProps, actions, data, allErrors, errors, store]
   );
 }
+function useWizardCurrentStep() {
+  return useWizardSelector((s) => s.currentStep);
+}
+function useWizardSteps() {
+  return useWizardSelector((s) => s.activeSteps);
+}
+function useWizardMeta() {
+  return useWizardSelector(
+    (s) => ({
+      currentStepId: s.currentStepId,
+      currentStepIndex: s.currentStepIndex,
+      isFirstStep: s.isFirstStep,
+      isLastStep: s.isLastStep,
+      isLoading: s.isLoading,
+      isBusy: s.isBusy,
+      isDirty: s.isDirty,
+      progress: s.progress,
+      activeStepsCount: s.activeStepsCount,
+      goToStepResult: s.goToStepResult
+    }),
+    { isEqual: shallowEqual }
+  );
+}
+function useWizardAllErrors() {
+  return useWizardSelector((s) => s.errors, {
+    isEqual: shallowEqual
+  });
+}
+function useWizardFlatErrors() {
+  const allErrors = useWizardAllErrors();
+  return useMemo(() => {
+    const flat = {};
+    Object.values(allErrors).forEach((stepErrors) => {
+      Object.assign(flat, stepErrors);
+    });
+    return flat;
+  }, [allErrors]);
+}
 
 // src/hooks/useWizard.ts
 var useWizard = () => {
@@ -570,9 +648,18 @@ function createWizardFactory() {
   const WizardProvider2 = ({
     config,
     initialData,
+    initialStepId,
     children
   }) => {
-    return /* @__PURE__ */ jsx2(WizardProvider, { config, initialData, children });
+    return /* @__PURE__ */ jsx2(
+      WizardProvider,
+      {
+        config,
+        initialData,
+        initialStepId,
+        children
+      }
+    );
   };
   const useWizard2 = () => {
     return useWizard();
@@ -583,6 +670,11 @@ function createWizardFactory() {
   const useWizardValue2 = (path, options) => {
     return useWizardValue(path, options);
   };
+  const useWizardField2 = (path, options) => {
+    const value = useWizardValue2(path, options);
+    const { setData } = useWizardActions2();
+    return [value, (next) => setData(path, next)];
+  };
   const useWizardSelector2 = (selector, options) => {
     return useWizardSelector(selector, options);
   };
@@ -604,6 +696,7 @@ function createWizardFactory() {
     useWizard: useWizard2,
     useWizardContext: useWizardContext2,
     useWizardValue: useWizardValue2,
+    useWizardField: useWizardField2,
     useWizardSelector: useWizardSelector2,
     useWizardError: useWizardError2,
     useWizardActions: useWizardActions2,
@@ -635,21 +728,406 @@ var WizardStepRenderer = ({
   return content;
 };
 
+// src/store.ts
+import { useCallback as useCallback2, useRef as useRef2, useSyncExternalStore as useSyncExternalStore2 } from "react";
+import {
+  WizardStore as WizardStore2,
+  getByPath as getByPath3,
+  setByPath as setByPath3
+} from "@wizzard-packages/core";
+import { MemoryAdapter as MemoryAdapter2 } from "@wizzard-packages/persistence";
+var UNSET2 = /* @__PURE__ */ Symbol("wizard_store_unset");
+var META_KEY = "__wizzard_meta__";
+var applyStoredMeta = (store, adapter) => {
+  const meta = adapter.getStep(META_KEY);
+  if (!meta) return;
+  if (meta.currentStepId) {
+    store.dispatch({
+      type: "SET_CURRENT_STEP_ID",
+      payload: { stepId: meta.currentStepId }
+    });
+  }
+  if (meta.visited) {
+    store.dispatch({
+      type: "SET_VISITED_STEPS",
+      payload: { steps: new Set(meta.visited) }
+    });
+  }
+  if (meta.completed) {
+    store.dispatch({
+      type: "SET_COMPLETED_STEPS",
+      payload: { steps: new Set(meta.completed) }
+    });
+  }
+  if (meta.history) {
+    store.dispatch({
+      type: "SET_HISTORY",
+      payload: { history: meta.history }
+    });
+  }
+};
+var ensureInitialStep = (store, activeSteps, initialStepId) => {
+  const snapshot = store.getSnapshot();
+  if (snapshot.currentStepId || activeSteps.length === 0) return;
+  const startId = initialStepId && activeSteps.some((s) => s.id === initialStepId) ? initialStepId : activeSteps[0].id;
+  store.dispatch({
+    type: "SET_CURRENT_STEP_ID",
+    payload: { stepId: startId }
+  });
+  if (snapshot.history.length === 0) {
+    store.dispatch({
+      type: "SET_HISTORY",
+      payload: { history: [startId] }
+    });
+  }
+  const currentVisited = new Set(snapshot.visitedSteps);
+  if (!currentVisited.has(startId)) {
+    currentVisited.add(startId);
+    store.dispatch({
+      type: "SET_VISITED_STEPS",
+      payload: { steps: currentVisited }
+    });
+  }
+};
+var resolveAndSetActiveSteps = async (store, data, initialStepId) => {
+  const resolved = await store.resolveActiveSteps(data);
+  store.dispatch({
+    type: "SET_ACTIVE_STEPS",
+    payload: { steps: resolved }
+  });
+  ensureInitialStep(store, resolved, initialStepId);
+  const snapshot = store.getSnapshot();
+  if (resolved.length > 0 && snapshot.isLoading) {
+    store.updateMeta({ isLoading: false });
+  }
+};
+var createWizardActions = (store, config, persistenceAdapter, initialData) => {
+  let currentConfig = config;
+  const validationDebounceRef = { current: null };
+  const stepsMap = /* @__PURE__ */ new Map();
+  currentConfig.steps.forEach((step) => stepsMap.set(step.id, step));
+  const resolveActiveStepsHelper = (data) => store.resolveActiveSteps(data);
+  const validateStep = (stepId) => store.validateStep(stepId);
+  const setData = (path, value, options) => {
+    const prevData = store.getSnapshot().data;
+    if (getByPath3(prevData, path) === value) return;
+    const baseData = setByPath3(prevData, path, value);
+    const { newData, hasClearing, statusChanged, nextCompletedSteps, nextVisitedSteps } = applyStepDependencies(currentConfig, store, baseData, [path]);
+    if (statusChanged) {
+      store.dispatch({
+        type: "SET_COMPLETED_STEPS",
+        payload: { steps: nextCompletedSteps }
+      });
+      store.dispatch({
+        type: "SET_VISITED_STEPS",
+        payload: { steps: nextVisitedSteps }
+      });
+    }
+    if (!hasClearing) {
+      store.dispatch({
+        type: "SET_DATA",
+        payload: {
+          path,
+          value,
+          options: { ...options, __from_set_data__: true }
+        }
+      });
+    } else {
+      store.dispatch({
+        type: "UPDATE_DATA",
+        payload: {
+          data: newData,
+          options: { replace: true, __from_set_data__: true, path }
+        }
+      });
+    }
+    const snapshot = store.getSnapshot();
+    const currentStepId = snapshot.currentStepId;
+    if (currentStepId) {
+      store.deleteError(currentStepId, path);
+      const step = stepsMap.get(currentStepId);
+      const mode = step?.validationMode || currentConfig.validationMode || "onStepChange";
+      if (mode === "onChange") {
+        const debounceMs = options?.debounceValidation ?? currentConfig.validationDebounceTime ?? 300;
+        if (validationDebounceRef.current) {
+          clearTimeout(validationDebounceRef.current);
+        }
+        validationDebounceRef.current = setTimeout(() => {
+          void validateStep(currentStepId);
+        }, debounceMs);
+      }
+    }
+  };
+  const updateData = (data, options) => {
+    const prev = store.getSnapshot().data;
+    const baseData = options?.replace ? data : { ...prev, ...data };
+    const { newData, statusChanged, nextCompletedSteps, nextVisitedSteps } = applyStepDependencies(
+      currentConfig,
+      store,
+      baseData,
+      Object.keys(data)
+    );
+    if (statusChanged) {
+      store.dispatch({
+        type: "SET_COMPLETED_STEPS",
+        payload: { steps: nextCompletedSteps }
+      });
+      store.dispatch({
+        type: "SET_VISITED_STEPS",
+        payload: { steps: nextVisitedSteps }
+      });
+    }
+    store.update(newData, Object.keys(data));
+    if (options?.persist) {
+      store.save(store.getSnapshot().currentStepId);
+    }
+  };
+  const reset = () => {
+    store.setInitialData(initialData || {});
+    store.update(initialData || {});
+    store.updateErrors({});
+    store.dispatch({
+      type: "SET_VISITED_STEPS",
+      payload: { steps: /* @__PURE__ */ new Set() }
+    });
+    store.dispatch({
+      type: "SET_COMPLETED_STEPS",
+      payload: { steps: /* @__PURE__ */ new Set() }
+    });
+    store.dispatch({
+      type: "SET_ERROR_STEPS",
+      payload: { steps: /* @__PURE__ */ new Set() }
+    });
+    const snapshot = store.getSnapshot();
+    if (snapshot.activeSteps.length > 0) {
+      const startId = snapshot.activeSteps[0].id;
+      store.dispatch({
+        type: "SET_CURRENT_STEP_ID",
+        payload: { stepId: startId }
+      });
+      store.dispatch({
+        type: "SET_HISTORY",
+        payload: { history: [startId] }
+      });
+    } else {
+      store.dispatch({
+        type: "SET_CURRENT_STEP_ID",
+        payload: { stepId: "" }
+      });
+      store.dispatch({
+        type: "SET_HISTORY",
+        payload: { history: [] }
+      });
+    }
+    persistenceAdapter.clear();
+    currentConfig.analytics?.onEvent("wizard_reset", { data: initialData });
+  };
+  const goToStep = (stepId, providedActiveSteps, options) => {
+    return store.goToStep(stepId, {
+      validate: options?.validate ?? true,
+      providedActiveSteps
+    });
+  };
+  const goToNextStep = async () => {
+    const snapshot = store.getSnapshot();
+    const currentStepId = snapshot.currentStepId;
+    if (!currentStepId) return;
+    const step = stepsMap.get(currentStepId);
+    const shouldVal = step?.autoValidate ?? currentConfig.autoValidate ?? !!step?.validationAdapter;
+    if (shouldVal) {
+      const ok = await validateStep(currentStepId);
+      if (!ok) return;
+    }
+    const resolvedSteps = await resolveActiveStepsHelper(snapshot.data);
+    const idx = resolvedSteps.findIndex((s) => s.id === currentStepId);
+    if (idx !== -1 && idx < resolvedSteps.length - 1) {
+      const nextStepId = resolvedSteps[idx + 1].id;
+      const success = await goToStep(nextStepId, resolvedSteps, {
+        validate: false
+      });
+      if (success) {
+        const currentSnapshot = store.getSnapshot();
+        if (!currentSnapshot.errorSteps.has(currentStepId)) {
+          const nextComp = new Set(currentSnapshot.completedSteps);
+          nextComp.add(currentStepId);
+          store.dispatch({
+            type: "SET_COMPLETED_STEPS",
+            payload: { steps: nextComp }
+          });
+        }
+      }
+    }
+  };
+  const goToPrevStep = async () => {
+    const snapshot = store.getSnapshot();
+    const idx = snapshot.activeSteps.findIndex((s) => s.id === snapshot.currentStepId);
+    if (idx > 0) {
+      await goToStep(snapshot.activeSteps[idx - 1].id);
+    }
+  };
+  const setStepData = (_stepId, data) => {
+    const next = { ...store.getSnapshot().data, ...data };
+    store.update(next, Object.keys(data));
+  };
+  const handleStepChange = (field, value) => {
+    if (store.getSnapshot().currentStepId) {
+      setData(field, value);
+    }
+  };
+  const validateAll = async () => {
+    const result = await store.validateAll();
+    return result;
+  };
+  const save = (ids) => {
+    if (ids === true) {
+      currentConfig.steps.forEach((s) => store.save(s.id));
+    } else if (!ids) {
+      store.save();
+    } else {
+      (Array.isArray(ids) ? ids : [ids]).forEach((id) => store.save(id));
+    }
+  };
+  const clearStorage = () => persistenceAdapter.clear();
+  const getData = (path, defaultValue) => {
+    return getByPath3(store.getSnapshot().data, path, defaultValue);
+  };
+  const updateConfig = (nextConfig) => {
+    currentConfig = { ...currentConfig, ...nextConfig };
+    stepsMap.clear();
+    currentConfig.steps.forEach((step) => stepsMap.set(step.id, step));
+    store.updateMeta({ config: currentConfig });
+  };
+  return {
+    goToNextStep,
+    goToPrevStep,
+    goToStep,
+    setStepData,
+    handleStepChange,
+    validateStep,
+    validateAll,
+    save,
+    clearStorage,
+    reset,
+    setData,
+    updateData,
+    getData,
+    updateConfig
+  };
+};
+var createWizardStore = (options) => {
+  const initialData = options.initialData || {};
+  const store = new WizardStore2(initialData, options.config.middlewares);
+  const persistenceAdapter = options.config.persistence?.adapter || new MemoryAdapter2();
+  store.injectPersistence(persistenceAdapter);
+  store.dispatch({
+    type: "INIT",
+    payload: { data: initialData, config: options.config }
+  });
+  store.hydrate();
+  applyStoredMeta(store, persistenceAdapter);
+  void resolveAndSetActiveSteps(store, store.getSnapshot().data, options.initialStepId);
+  return {
+    store,
+    actions: createWizardActions(store, options.config, persistenceAdapter, initialData)
+  };
+};
+var useWizardStoreState = (store) => {
+  return useSyncExternalStore2(store.subscribe, store.getSnapshot, store.getSnapshot);
+};
+var useWizardStoreValue = (store, path, options) => {
+  const lastStateRef = useRef2(UNSET2);
+  const lastValueRef = useRef2(UNSET2);
+  const getSnapshot = useCallback2(() => {
+    const data = store.getSnapshot().data;
+    if (data === lastStateRef.current && lastValueRef.current !== UNSET2) {
+      return lastValueRef.current;
+    }
+    const value = getByPath3(data, path);
+    if (lastValueRef.current !== UNSET2 && (options?.isEqual || Object.is)(lastValueRef.current, value)) {
+      lastStateRef.current = data;
+      return lastValueRef.current;
+    }
+    lastStateRef.current = data;
+    lastValueRef.current = value;
+    return value;
+  }, [store, path, options?.isEqual]);
+  return useSyncExternalStore2(store.subscribe, getSnapshot, getSnapshot);
+};
+var useWizardStoreField = (store, setData, path, options) => {
+  const value = useWizardStoreValue(store, path, options);
+  const setValue = useCallback2(
+    (next) => {
+      setData(path, next);
+    },
+    [setData, path]
+  );
+  return [value, setValue];
+};
+var useWizardStoreError = (store, path) => {
+  const getSnapshot = useCallback2(() => {
+    const errors = store.getSnapshot().errors;
+    for (const [_, stepErrors] of Object.entries(errors)) {
+      const typed = stepErrors;
+      if (typed[path]) return typed[path];
+    }
+    return void 0;
+  }, [store, path]);
+  return useSyncExternalStore2(store.subscribe, getSnapshot, getSnapshot);
+};
+var useWizardStoreSelector = (store, selector, options) => {
+  const lastResultRef = useRef2(UNSET2);
+  const getSnapshot = useCallback2(() => {
+    const full = store.getSnapshot();
+    const res = selector(full);
+    if (lastResultRef.current !== UNSET2 && (options?.isEqual || Object.is)(lastResultRef.current, res)) {
+      return lastResultRef.current;
+    }
+    lastResultRef.current = res;
+    return res;
+  }, [store, selector, options?.isEqual]);
+  return useSyncExternalStore2(store.subscribe, getSnapshot, getSnapshot);
+};
+var createWizardHooks = (store, actions) => ({
+  useWizardState: () => useWizardStoreState(store),
+  useWizardValue: (path, options) => useWizardStoreValue(store, path, options),
+  useWizardField: (path, options) => {
+    if (!actions) {
+      throw new Error("useWizardField requires actions. Pass actions to createWizardHooks.");
+    }
+    return useWizardStoreField(store, actions.setData, path, options);
+  },
+  useWizardError: (path) => useWizardStoreError(store, path),
+  useWizardSelector: (selector, options) => useWizardStoreSelector(store, selector, options)
+});
+
 // src/index.ts
-import { WizardStore as WizardStore2 } from "@wizzard-packages/core";
+import { WizardStore as WizardStore3 } from "@wizzard-packages/core";
 import { loggerMiddleware } from "@wizzard-packages/middleware";
 export {
   WizardProvider,
   WizardStepRenderer,
-  WizardStore2 as WizardStore,
+  WizardStore3 as WizardStore,
   createWizardFactory,
+  createWizardHooks,
+  createWizardStore,
   loggerMiddleware,
   useWizard,
   useWizardActions,
+  useWizardAllErrors,
   useWizardContext,
+  useWizardCurrentStep,
   useWizardError,
+  useWizardField,
+  useWizardFlatErrors,
+  useWizardMeta,
   useWizardSelector,
   useWizardState,
+  useWizardSteps,
+  useWizardStoreError,
+  useWizardStoreField,
+  useWizardStoreSelector,
+  useWizardStoreState,
+  useWizardStoreValue,
   useWizardValue
 };
 //# sourceMappingURL=index.js.map