@picked/react 0.0.1-dev.1784688526191 → 0.0.1-dev.1785287094311

package/dist/form/index.d.ts

@@ -2,6 +2,8 @@ import { FormEvent } from 'react';
 import { Store } from 'effector';
 import { ErrorCallback, FormInstance as CoreFormInstance, SubmitCallback, SuccessCallback } from '@picked/client/form';
 import { ReactFormField } from '../utils/map-field-to-react';
+import { FormCallbackOptions, FormCallbackRegistrars } from './use-form-callbacks';
+export type { FormCallbackOptions, FormCallbackRegistrars, FormCallbackChannel, } from './use-form-callbacks';
 export interface FormInstance {
     form: {
         props: {
@@ -9,11 +11,17 @@ export interface FormInstance {
         };
         errors: CoreFormInstance['form']['errors'];
         submitting: CoreFormInstance['form']['submitting'];
-        onBeforeSubmit: (callback: SubmitCallback) => () => void;
-        onSuccess: (callback: SuccessCallback) => () => void;
-        onError: (callback: ErrorCallback) => () => void;
+        onBeforeSubmit: (callback: SubmitCallback) => void;
+        onSuccess: (callback: SuccessCallback) => void;
+        onError: (callback: ErrorCallback) => void;
     };
     fields: Store<ReactFormField[]>;
+    /**
+     * Raw core registrars, so a hook that owns its own callback channel (`useStep`)
+     * can register its dispatcher directly against the core rather than nesting
+     * inside this hook's channel. Internal: not part of the supported surface.
+     */
+    formRegistrars: FormCallbackRegistrars;
 }
 /**
  * React hook mirroring Svelte's `createForm`: accepts reactive stores for
@@ -23,15 +31,18 @@ export interface FormInstance {
  * lifetime is the hook instance, not the render — so `title` and `fieldKeys`
  * are stores (reactive access over time) rather than values (snapshots).
  *
- * `onBeforeSubmit` / `onSuccess` / `onError` return the core unsubscribe so
- * callers can register inside `useEffect` with standard React cleanup:
- * `useEffect(() => form.onBeforeSubmit(handler), [form, handler])`.
+ * Callback lifetime is the hook instance, not the render: `onBeforeSubmit` /
+ * `onSuccess` / `onError` are safe to call from a render body and return `void`,
+ * because cleanup happens automatically when the hook unmounts. Prefer the
+ * `options` argument — it is latest-wins and has no registration side effect at
+ * all. See `use-form-callbacks.ts` for how this is achieved.
  *
  * @param {string} formId - Stable identifier for the form.
  * @param {Store<string>} title - Store holding the form/step title.
  * @param {Store<string[]>} fieldKeys - Store of field keys belonging to this form.
+ * @param {FormCallbackOptions} [options] - Latest-wins submit callback slots.
  * @returns {FormInstance} React form with submit handler, mapped fields, and subscribable callbacks.
- * @example const { form, fields } = useForm(stepKey, nameStore, fieldKeysStore)
+ * @example const { form, fields } = useForm(stepKey, nameStore, fieldKeysStore, { onSuccess })
  */
-export declare function useForm(formId: string, title: Store<string>, fieldKeys: Store<string[]>): FormInstance;
+export declare function useForm(formId: string, title: Store<string>, fieldKeys: Store<string[]>, options?: FormCallbackOptions): FormInstance;
 //# sourceMappingURL=index.d.ts.map

package/dist/form/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/form/index.ts"],"names":[],"mappings":"AAAA,4FAA4F;AAC5F,OAAO,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AACrC,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,YAAY,IAAI,gBAAgB,EACrC,KAAK,cAAc,EACnB,KAAK,eAAe,EACrB,MAAM,qBAAqB,CAAA;AAE5B,OAAO,EAAmB,KAAK,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAGlF,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,QAAQ,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAA;SAClD,CAAA;QACD,MAAM,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAA;QAC1C,UAAU,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAA;QAClD,cAAc,EAAE,CAAC,QAAQ,EAAE,cAAc,KAAK,MAAM,IAAI,CAAA;QACxD,SAAS,EAAE,CAAC,QAAQ,EAAE,eAAe,KAAK,MAAM,IAAI,CAAA;QACpD,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,MAAM,IAAI,CAAA;KACjD,CAAA;IACD,MAAM,EAAE,KAAK,CAAC,cAAc,EAAE,CAAC,CAAA;CAChC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,OAAO,CACrB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,EACpB,SAAS,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,GACzB,YAAY,CAgCd"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/form/index.ts"],"names":[],"mappings":"AAAA,4FAA4F;AAC5F,OAAO,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AACrC,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,YAAY,IAAI,gBAAgB,EACrC,KAAK,cAAc,EACnB,KAAK,eAAe,EACrB,MAAM,qBAAqB,CAAA;AAE5B,OAAO,EAAmB,KAAK,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAElF,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,sBAAsB,EAC5B,MAAM,sBAAsB,CAAA;AAE7B,YAAY,EACV,mBAAmB,EACnB,sBAAsB,EACtB,mBAAmB,GACpB,MAAM,sBAAsB,CAAA;AAE7B,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,QAAQ,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAA;SAClD,CAAA;QACD,MAAM,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAA;QAC1C,UAAU,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAA;QAClD,cAAc,EAAE,CAAC,QAAQ,EAAE,cAAc,KAAK,IAAI,CAAA;QAClD,SAAS,EAAE,CAAC,QAAQ,EAAE,eAAe,KAAK,IAAI,CAAA;QAC9C,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAA;KAC3C,CAAA;IACD,MAAM,EAAE,KAAK,CAAC,cAAc,EAAE,CAAC,CAAA;IAC/B;;;;OAIG;IACH,cAAc,EAAE,sBAAsB,CAAA;CACvC;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,OAAO,CACrB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,EACpB,SAAS,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,EAC1B,OAAO,CAAC,EAAE,mBAAmB,GAC5B,YAAY,CA2Cd"}

package/dist/form/index.js

@@ -1 +1 @@
-import{useExperience as e,usePicked as t}from"../hooks/client.js";import{mapFieldToReact as n}from"../utils/map-field-to-react.js";import{prepareNativeEvent as r}from"../utils/prepare-native-event.js";import{useMemo as i}from"react";import{createForm as a}from"@picked/client/form";function o(o,s,c){let l=t(),u=e(),d=i(()=>a({client:l,experienceInstance:u},o,s,c),[l,u,o,s,c]),f=i(()=>d.fields.map(e=>e.map(n)),[d]);return{form:i(()=>({errors:d.form.errors,submitting:d.form.submitting,props:{onSubmit:e=>{e.preventDefault(),r(e.nativeEvent,e.currentTarget),d.form.props.onsubmit(e.nativeEvent)}},onBeforeSubmit:e=>d.form.onBeforeSubmit(e),onSuccess:e=>d.form.onSuccess(e),onError:e=>d.form.onError(e)}),[d]),fields:f}}export{o as useForm};
+import{useExperience as e,usePicked as t}from"../hooks/client.js";import{mapFieldToReact as n}from"../utils/map-field-to-react.js";import{prepareNativeEvent as r}from"../utils/prepare-native-event.js";import{useFormCallbacks as i}from"./use-form-callbacks.js";import{useMemo as a}from"react";import{createForm as o}from"@picked/client/form";function s(s,c,l,u){let d=t(),f=e(),p=a(()=>o({client:d,experienceInstance:f},s,c,l),[d,f,s,c,l]),m=a(()=>p.fields.map(e=>e.map(n)),[p]),h=a(()=>({onBeforeSubmit:e=>p.form.onBeforeSubmit(e),onSuccess:e=>p.form.onSuccess(e),onError:e=>p.form.onError(e)}),[p]),g=i(h,u);return{form:a(()=>({errors:p.form.errors,submitting:p.form.submitting,props:{onSubmit:e=>{e.preventDefault(),r(e.nativeEvent,e.currentTarget),p.form.props.onsubmit(e.nativeEvent)}},onBeforeSubmit:g.onBeforeSubmit,onSuccess:g.onSuccess,onError:g.onError}),[p,g]),fields:m,formRegistrars:h}}export{s as useForm};

package/dist/form/use-form-callbacks.d.ts

@@ -0,0 +1,45 @@
+import { ErrorCallback, FormCallbackOptions, SubmitCallback, SuccessCallback } from '@picked/client/form';
+export type { FormCallbackOptions } from '@picked/client/form';
+/**
+ * The core's append-only registration functions, each returning an unsubscribe.
+ *
+ * Passed down from `useForm` so a hook that owns its own channel — `useStep` —
+ * can register its single dispatcher directly against the core rather than
+ * nesting inside another channel.
+ *
+ * @example useFormCallbacks(stepContext.formRegistrars)
+ */
+export interface FormCallbackRegistrars {
+    onBeforeSubmit: (callback: SubmitCallback) => () => void;
+    onSuccess: (callback: SuccessCallback) => () => void;
+    onError: (callback: ErrorCallback) => () => void;
+}
+/**
+ * Lifecycle-safe registration surface handed to consumers.
+ *
+ * Nothing is returned because cleanup is automatic — the channel is torn down
+ * with the hook instance that owns it. This mirrors the Svelte adapter, whose
+ * registrations also return `void`.
+ *
+ * @example channel.onSuccess(({ data }) => track(data))
+ */
+export interface FormCallbackChannel {
+    onBeforeSubmit: (callback: SubmitCallback) => void;
+    onSuccess: (callback: SuccessCallback) => void;
+    onError: (callback: ErrorCallback) => void;
+}
+/**
+ * Owns a form-callback channel for one hook instance.
+ *
+ * Registers a single dispatcher per event against the core registrars and routes
+ * both the options slot and any imperative registrations through it, so consumer
+ * callbacks can never accumulate in the core registry across renders.
+ *
+ * @param {FormCallbackRegistrars | undefined} registrars - Core registration functions; when undefined the channel no-ops, so callers can invoke this hook unconditionally.
+ * @param {FormCallbackOptions} [options] - Latest-wins callback slots.
+ * @returns {FormCallbackChannel} A registration surface whose cleanup is automatic.
+ * @example const channel = useFormCallbacks(form.formRegistrars, { onSuccess })
+ * @design-parity Mirrors the Svelte adapter's `$effect`-wrapped registration.
+ */
+export declare function useFormCallbacks(registrars: FormCallbackRegistrars | undefined, options?: FormCallbackOptions): FormCallbackChannel;
+//# sourceMappingURL=use-form-callbacks.d.ts.map

package/dist/form/use-form-callbacks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-form-callbacks.d.ts","sourceRoot":"","sources":["../../src/form/use-form-callbacks.ts"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EACV,aAAa,EACb,mBAAmB,EACnB,cAAc,EACd,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAK5B,YAAY,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAK9D;;;;;;;;GAQG;AACH,MAAM,WAAW,sBAAsB;IACrC,cAAc,EAAE,CAAC,QAAQ,EAAE,cAAc,KAAK,MAAM,IAAI,CAAA;IACxD,SAAS,EAAE,CAAC,QAAQ,EAAE,eAAe,KAAK,MAAM,IAAI,CAAA;IACpD,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,MAAM,IAAI,CAAA;CACjD;AAED;;;;;;;;GAQG;AACH,MAAM,WAAW,mBAAmB;IAClC,cAAc,EAAE,CAAC,QAAQ,EAAE,cAAc,KAAK,IAAI,CAAA;IAClD,SAAS,EAAE,CAAC,QAAQ,EAAE,eAAe,KAAK,IAAI,CAAA;IAC9C,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAA;CAC3C;AAuFD;;;;;;;;;;;;GAYG;AACH,wBAAgB,gBAAgB,CAC9B,UAAU,EAAE,sBAAsB,GAAG,SAAS,EAC9C,OAAO,CAAC,EAAE,mBAAmB,GAC5B,mBAAmB,CAgGrB"}

package/dist/form/use-form-callbacks.js

@@ -0,0 +1 @@
+import{useCallback as e,useEffect as t,useMemo as n,useRef as r}from"react";function i(){return{pass:[],sealedAt:null,persistent:[]}}function a(e){e.sealedAt!==null&&(e.persistent=[...e.persistent,...e.pass.slice(e.sealedAt)]),e.pass=[],e.sealedAt=null}function o(e,t){let n={callback:t};return e.pass=[...e.pass,n],()=>{e.pass=e.pass.filter(e=>e!==n),e.persistent=e.persistent.filter(e=>e!==n)}}function s(e,t){let n=[...e.pass,...e.persistent].map(e=>e.callback);return t===void 0?n:[t,...n]}function c(c,l){let u=r(null);u.current??={beforeSubmit:i(),success:i(),error:i(),options:{}};let d=u.current;a(d.beforeSubmit),a(d.success),a(d.error),t(()=>{d.options=l??{},d.beforeSubmit.sealedAt=d.beforeSubmit.pass.length,d.success.sealedAt=d.success.pass.length,d.error.sealedAt=d.error.pass.length});let f=e(async e=>{let t=e;for(let e of s(d.beforeSubmit,d.options.onBeforeSubmit)){let n=await e(t);n!==void 0&&(t=n)}return t},[d]),p=e(async e=>{await Promise.all(s(d.success,d.options.onSuccess).map(t=>t(e)))},[d]),m=e(async e=>{await Promise.all(s(d.error,d.options.onError).map(t=>t(e)))},[d]);return t(()=>{if(!c)return;let e=[c.onBeforeSubmit(f),c.onSuccess(p),c.onError(m)];return()=>{e.forEach(e=>e())}},[c,f,p,m]),n(()=>({onBeforeSubmit:e=>o(d.beforeSubmit,e),onSuccess:e=>o(d.success,e),onError:e=>o(d.error,e)}),[d])}export{c as useFormCallbacks};

package/dist/hooks/step.d.ts

@@ -1,6 +1,7 @@
 import { Store } from 'effector';
 import { Content, ExperienceStep } from '@picked/client';
 import { FormInstance } from '../form';
+import { FormCallbackOptions } from '../form/use-form-callbacks';
 import { ReactFormField } from '../utils/map-field-to-react';
 export interface StepContext {
     step: Store<ExperienceStep>;
@@ -25,15 +26,29 @@ export interface StepContext {
     /** @deprecated Use `isActive` instead. */
     isActiveStep: boolean;
     form: FormInstance['form'];
+    /**
+     * Raw core registrars, used by `useStep` to own a callback channel scoped to the
+     * consuming component rather than to `Step`. Internal: not part of the
+     * supported surface.
+     */
+    formRegistrars: FormInstance['formRegistrars'];
 }
 export declare const StepContextProvider: import('react').Context<StepContext | null>;
 /**
  * Retrieves the step context from the nearest provider.
  *
+ * The returned `form`'s callback registration is scoped to **this** hook
+ * instance, not to the enclosing `Step`. That distinction is load-bearing: a
+ * component subscribed to field state re-renders on every keystroke while `Step`
+ * does not, so a channel anchored at `Step` would still accumulate one
+ * registration per consumer render. Callbacks are torn down when the consuming
+ * component unmounts, independently of sibling consumers.
+ *
+ * @param {FormCallbackOptions} [options] - Latest-wins submit callback slots; the recommended way to attach callbacks.
  * @returns {StepContext} The current step context.
- * @example useStep()
+ * @example const { form, fields } = useStep({ onSuccess: ({ data }) => track(data) })
  */
-export declare function useStep(): StepContext;
+export declare function useStep(options?: FormCallbackOptions): StepContext;
 /**
  * Creates and provides step context for the given step key.
  *
@@ -42,10 +57,11 @@ export declare function useStep(): StepContext;
  * step is registered — matching the Svelte SDK's behaviour.
  *
  * @param {string} stepKey - The step key to look up in the experience tree.
+ * @param {FormCallbackOptions} [options] - Latest-wins submit callback slots for the step's own form.
  * @returns {StepContext} Step context with form, fields, and active state.
- * @example useSetStepContext('step-1')
+ * @example useSetStepContext('step-1', { onSuccess: ({ data }) => track(data) })
  */
-export declare function useSetStepContext(stepKey: string): StepContext;
+export declare function useSetStepContext(stepKey: string, options?: FormCallbackOptions): StepContext;
 /**
  * Returns the current step's resolved CMS content data, or `null` when no content is registered.
  *

package/dist/hooks/step.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../src/hooks/step.ts"],"names":[],"mappings":"AAEA,OAAO,EAAW,KAAK,KAAK,EAAE,MAAM,UAAU,CAAA;AAC9C,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC7D,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AAEpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAIjE,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,CAAA;IAC3B,kFAAkF;IAClF,MAAM,EAAE,KAAK,CAAC,cAAc,EAAE,CAAC,CAAA;IAC/B;;;;;OAKG;IACH,kBAAkB,EAAE,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,CAAA;IACzC;;;;;;OAMG;IACH,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC,CAAA;IAC9C,QAAQ,EAAE,OAAO,CAAA;IACjB,0CAA0C;IAC1C,YAAY,EAAE,OAAO,CAAA;IACrB,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,CAAA;CAC3B;AAED,eAAO,MAAM,mBAAmB,6CAA0C,CAAA;AAE1E;;;;;GAKG;AACH,wBAAgB,OAAO,IAAI,WAAW,CAOrC;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,MAAM,GAAG,WAAW,CAmE9D;AAgCD;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAM/D"}
+{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../src/hooks/step.ts"],"names":[],"mappings":"AAEA,OAAO,EAAW,KAAK,KAAK,EAAE,MAAM,UAAU,CAAA;AAC9C,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC7D,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AACpD,OAAO,EAAoB,KAAK,mBAAmB,EAAE,MAAM,4BAA4B,CAAA;AAEvF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAIjE,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,CAAA;IAC3B,kFAAkF;IAClF,MAAM,EAAE,KAAK,CAAC,cAAc,EAAE,CAAC,CAAA;IAC/B;;;;;OAKG;IACH,kBAAkB,EAAE,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,CAAA;IACzC;;;;;;OAMG;IACH,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC,CAAA;IAC9C,QAAQ,EAAE,OAAO,CAAA;IACjB,0CAA0C;IAC1C,YAAY,EAAE,OAAO,CAAA;IACrB,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,CAAA;IAC1B;;;;OAIG;IACH,cAAc,EAAE,YAAY,CAAC,gBAAgB,CAAC,CAAA;CAC/C;AAED,eAAO,MAAM,mBAAmB,6CAA0C,CAAA;AAE1E;;;;;;;;;;;;;GAaG;AACH,wBAAgB,OAAO,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,WAAW,CAiBlE;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,mBAAmB,GAAG,WAAW,CAoE7F;AAgCD;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAM/D"}

package/dist/hooks/step.js

@@ -1 +1 @@
-import{useExperience as e,usePicked as t}from"./client.js";import{useStoreGlobal as n}from"./use-store-global.js";import{useForm as r}from"../form/index.js";import{useStepRouter as i}from"../router/context.js";import{createContext as a,useContext as o,useMemo as s}from"react";import{combine as c}from"effector";var l=a(null);function u(){let e=o(l);if(!e)throw Error(`useStep must be used within a StepContextProvider`);return e}function d(n){let a=e(),o=t(),{activeStep:l}=i(),u=s(()=>l?.key===n,[l?.key,n]),d=s(()=>a.treeStore.map(e=>e.steps.find(e=>e.key===n)??{id:n,key:n,name:``,fieldKeys:[]},{skipVoid:!1}),[a,n]),{form:f,fields:p}=r(n,s(()=>d.map(e=>e.name,{skipVoid:!1}),[d]),s(()=>d.map(e=>e.fieldKeys,{skipVoid:!1}),[d])),m=s(()=>c(d,o.contents.indexStore,(e,t)=>e.layoutContentId?t[e.layoutContentId]??null:null,{skipVoid:!1}),[d,o]);return{step:d,fields:p,layoutContentStore:m,content:s(()=>m.map(e=>e?.data??null,{skipVoid:!1}),[m]),isActive:u,isActiveStep:u,form:f}}function f(){let n=e(),r=t();return s(()=>c(n.treeStore,r.contents.indexStore,(e,t)=>{let n=e.steps.find(e=>e.layoutContentId);return n?.layoutContentId?t[n.layoutContentId]??null:null}),[n,r])}function p(){let e=o(l),t=f();return n(e?.layoutContentStore??t)?.data??null}export{l as StepContextProvider,d as useSetStepContext,u as useStep,p as useStepContent};
+import{useExperience as e,usePicked as t}from"./client.js";import{useStoreGlobal as n}from"./use-store-global.js";import{useFormCallbacks as r}from"../form/use-form-callbacks.js";import{useForm as i}from"../form/index.js";import{useStepRouter as a}from"../router/context.js";import{createContext as o,useContext as s,useMemo as c}from"react";import{combine as l}from"effector";var u=o(null);function d(e){let t=s(u),n=r(t?.formRegistrars,e),i=c(()=>t?{...t,form:{...t.form,...n}}:null,[t,n]);if(!i)throw Error(`useStep must be used within a StepContextProvider`);return i}function f(n,r){let o=e(),s=t(),{activeStep:u}=a(),d=c(()=>u?.key===n,[u?.key,n]),f=c(()=>o.treeStore.map(e=>e.steps.find(e=>e.key===n)??{id:n,key:n,name:``,fieldKeys:[]},{skipVoid:!1}),[o,n]),{form:p,fields:m,formRegistrars:h}=i(n,c(()=>f.map(e=>e.name,{skipVoid:!1}),[f]),c(()=>f.map(e=>e.fieldKeys,{skipVoid:!1}),[f]),r),g=c(()=>l(f,s.contents.indexStore,(e,t)=>e.layoutContentId?t[e.layoutContentId]??null:null,{skipVoid:!1}),[f,s]);return{step:f,fields:m,layoutContentStore:g,content:c(()=>g.map(e=>e?.data??null,{skipVoid:!1}),[g]),isActive:d,isActiveStep:d,form:p,formRegistrars:h}}function p(){let n=e(),r=t();return c(()=>l(n.treeStore,r.contents.indexStore,(e,t)=>{let n=e.steps.find(e=>e.layoutContentId);return n?.layoutContentId?t[n.layoutContentId]??null:null}),[n,r])}function m(){let e=s(u),t=p();return n(e?.layoutContentStore??t)?.data??null}export{u as StepContextProvider,f as useSetStepContext,d as useStep,m as useStepContent};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@picked/react",
-  "version": "0.0.1-dev.1784688526191",
+  "version": "0.0.1-dev.1785287094311",
   "devDependencies": {
     "@picked/client": "workspace:*",
     "@repo/eslint-config": "workspace:*",
@@ -85,7 +85,7 @@
   },
   "module": "./dist/index.js",
   "peerDependencies": {
-    "@picked/client": "0.0.1-dev.1784688526191",
+    "@picked/client": "0.0.1-dev.1785287094311",
     "effector": "^23.3.0",
     "react": "19.2.2",
     "react-dom": "19.2.2"