@picked/svelte 0.0.1-dev.1784511339717 → 0.0.1-dev.1785287094311

package/dist/form/__tests__/CreateFormHarness.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+  // Test-only harness. `createForm` registers option callbacks with `$effect`,
+  // which requires a real component instance — mounting this is how the callback
+  // lifecycle (registration on mount, teardown on unmount) gets exercised.
+  import { untrack } from 'svelte'
+  import type { Store } from 'effector'
+  import { createForm, type FormCallbackOptions } from '../create-form.svelte'
+
+  interface HarnessProps {
+    formId: string
+    title: Store<string>
+    fieldKeys: Store<string[]>
+    options?: FormCallbackOptions
+    imperativeCallback?: () => void
+  }
+
+  const { formId, title, fieldKeys, options, imperativeCallback }: HarnessProps = $props()
+
+  // Props are read once, at init, on purpose: the harness is mounted with fixed
+  // props to exercise registration and teardown, and `createForm` itself is an
+  // init-time call. `untrack` states that intent rather than suppressing the
+  // state_referenced_locally warning.
+  untrack(() => {
+    const instance = createForm(formId, title, fieldKeys, options)
+
+    if (imperativeCallback) {
+      instance.form.onSuccess(imperativeCallback)
+    }
+  })
+</script>

package/dist/form/create-form.js

@@ -1 +1 @@
-import{getExperience as e,getPicked as t}from"../hooks/client.js";import{createForm as n}from"@picked/client/form";import*as r from"svelte/internal/client";function i(i,a,o){let s=n({client:t(),experienceInstance:e()},i,a,o);return{...s,form:{...s.form,props:{...s.form.props,onsubmit:e=>s.form.props.onsubmit(e)},onBeforeSubmit:e=>{r.user_effect(()=>s.form.onBeforeSubmit(e))},onSuccess:e=>{r.user_effect(()=>s.form.onSuccess(e))},onError:e=>{r.user_effect(()=>s.form.onError(e))}}}}export{i as createForm};
+import{getExperience as e,getPicked as t}from"../hooks/client.js";import{createForm as n}from"@picked/client/form";import*as r from"svelte/internal/client";function i(i,a,o,s){let c=n({client:t(),experienceInstance:e()},i,a,o);if(s?.onBeforeSubmit){let e=s.onBeforeSubmit;r.user_effect(()=>c.form.onBeforeSubmit(e))}if(s?.onSuccess){let e=s.onSuccess;r.user_effect(()=>c.form.onSuccess(e))}if(s?.onError){let e=s.onError;r.user_effect(()=>c.form.onError(e))}return{...c,form:{...c.form,props:{...c.form.props,onsubmit:e=>c.form.props.onsubmit(e)},onBeforeSubmit:e=>{r.user_effect(()=>c.form.onBeforeSubmit(e))},onSuccess:e=>{r.user_effect(()=>c.form.onSuccess(e))},onError:e=>{r.user_effect(()=>c.form.onError(e))}}}}export{i as createForm};

package/dist/form/create-form.svelte.d.ts

@@ -1,6 +1,6 @@
 import { Store } from 'effector';
-import { FormInstance as CoreFormInstance, ErrorCallback, SubmitCallback, SubmitEventWithCurrentTarget, SuccessCallback } from '@picked/client/form';
-export type { FormField } from '@picked/client/form';
+import { FormInstance as CoreFormInstance, ErrorCallback, FormCallbackOptions, SubmitCallback, SubmitEventWithCurrentTarget, SuccessCallback } from '@picked/client/form';
+export type { FormField, FormCallbackOptions } from '@picked/client/form';
 /**
  * Svelte FormInstance — identical to core but callback registration returns void
  * (cleanup is handled automatically via $effect, not by the consumer).
@@ -28,10 +28,12 @@ export interface FormInstance<TFieldKeys extends string = string> extends Omit<C
  * @param {string} formId - Unique identifier for this form instance.
  * @param {Store<string>} title - Reactive store holding the form/step title.
  * @param {Store<string[]>} fieldKeys - Reactive store of field keys that belong to this form.
+ * @param {FormCallbackOptions} [options] - Submit callback slots, registered once for the component's lifetime.
  * @returns {FormInstance} A form instance with reactive field stores, submission handlers, and callback registration.
  * @example
  * ```ts
- * const { form, fields } = createForm('lead-capture', $title, $fieldKeys)
+ * const { form, fields } = createForm('lead-capture', $title, $fieldKeys, { onSuccess })
  * ```
+ * @design-parity Mirrors `useForm`'s options argument in `@picked/react`.
  */
-export declare function createForm(formId: string, title: Store<string>, fieldKeys: Store<string[]>): FormInstance;
+export declare function createForm(formId: string, title: Store<string>, fieldKeys: Store<string[]>, options?: FormCallbackOptions): FormInstance;

package/dist/form/index.d.ts

@@ -1,2 +1,3 @@
-export type { FormField } from '@picked/client/form';
+/** @file Public surface of `@picked/svelte/form`. */
+export type { FormField, FormCallbackOptions } from '@picked/client/form';
 export { getForm } from './get-form';

package/dist/hooks/feature.d.ts

@@ -1,5 +1,40 @@
-export declare function getFeature(featureName: string): import('effector').Store<() => Promise<boolean | string | undefined>>;
-export declare function getFeatureResult(featureName: string): import('effector').StoreWritable<{
+import { Store } from 'effector';
+interface FeatureResult {
     id: string;
     bucket: string | boolean;
-} | undefined>;
+}
+type FeatureBucketValue = boolean | string | undefined;
+/**
+ * Returns the reactive store wrapping a feature in an evokable function.
+ *
+ * @param {string} featureName - The feature id to look up.
+ * @returns {Store<() => Promise<FeatureBucketValue>>} The evokable-feature store.
+ * @example
+ * const $evokable = getFeature('winter-sale')
+ */
+export declare function getFeature(featureName: string): Store<() => Promise<FeatureBucketValue>>;
+/**
+ * Returns a store that resolves to a feature's evaluated bucket result.
+ *
+ * @param {string} featureName - The feature id to evaluate.
+ * @returns {Store<FeatureResult | undefined>} A store holding the resolved bucket result, or undefined until resolved.
+ * @example
+ * const $result = getFeatureResult('winter-sale')
+ */
+export declare function getFeatureResult(featureName: string): Store<FeatureResult | undefined>;
+/**
+ * Returns a store holding a feature's admin `enabled` flag.
+ *
+ * Unlike {@link getFeatureResult}, this reads the static config flag directly and does not
+ * trigger bucket resolution — so a disabled feature (`enabled: false`) can be told apart
+ * from an enabled feature whose session simply was not allocated. Resolves to `undefined`
+ * when the feature is unregistered or carries no `enabled` metadata (for example,
+ * manually-registered features).
+ *
+ * @param {string} featureName - The feature id to look up.
+ * @returns {Store<boolean | undefined>} A store holding the feature's `enabled` flag, or undefined when unknown.
+ * @example
+ * const $enabled = getFeatureEnabled('winter-sale')
+ */
+export declare function getFeatureEnabled(featureName: string): Store<boolean | undefined>;
+export {};

package/dist/hooks/feature.js

@@ -1 +1 @@
-import{getPicked as e}from"./client.js";import{attach as t,createEffect as n,createEvent as r,createStore as i,sample as a}from"effector";function o(t){return e().features.getEvokableFeature(t)}function s(e){let s=o(e),c=i(void 0,{skipVoid:!1}),l=r(),u=t({source:s,mapParams:(e,t)=>t,effect:n(async e=>await e())});return a({clock:l,target:u}),a({clock:u.doneData,fn:t=>{if(t!==void 0)return{id:e,bucket:t}},target:c}),l(),a({clock:s,target:l}),c}export{o as getFeature,s as getFeatureResult};
+import{getPicked as e}from"./client.js";import{attach as t,createEffect as n,createEvent as r,createStore as i,sample as a}from"effector";function o(t){return e().features.getEvokableFeature(t)}function s(e){let s=o(e),c=i(void 0,{skipVoid:!1}),l=r(),u=t({source:s,mapParams:(e,t)=>t,effect:n(async e=>await e())});return a({clock:l,target:u}),a({clock:u.doneData,fn:t=>{if(t!==void 0)return{id:e,bucket:t}},target:c}),l(),a({clock:s,target:l}),c}function c(t){return e().features.getById(t).map(e=>e?.enabled,{skipVoid:!1})}export{o as getFeature,c as getFeatureEnabled,s as getFeatureResult};

package/dist/hooks/index.d.ts

@@ -1,7 +1,7 @@
 /** @file Public re-exports for Svelte hook utilities. */
 export { getPicked, getExperience } from './client';
 export { getPredicate, getPredicateResult } from './predicate';
-export { getFeature, getFeatureResult } from './feature';
+export { getFeature, getFeatureResult, getFeatureEnabled } from './feature';
 export { getAction, getActionResult } from './action';
 export { getStep, setStepContext, getStepContent } from './step';
 export { getContent } from './content';

package/dist/hooks/index.js

@@ -1 +1 @@
-import{getExperience as e,getPicked as t}from"./client.js";import{getPredicate as n,getPredicateResult as r}from"./predicate.js";import{getFeature as i,getFeatureResult as a}from"./feature.js";import{getAction as o,getActionResult as s}from"./action.js";import{getStep as c,getStepContent as l,setStepContext as u}from"./step.js";import{getContent as d}from"./content.js";import{getContextScope as f,setContextScope as p,useUnit as m}from"./stores.js";import{createLocalStorageStore as h,createSessionStorageStore as g}from"./storage.js";import{getTrackRecommendationPresentEvent as _}from"./events.js";import{createQuery as v,queryCache as y,queryPresets as b}from"./create-query/index.js";export{h as createLocalStorageStore,v as createQuery,g as createSessionStorageStore,o as getAction,s as getActionResult,d as getContent,f as getContextScope,e as getExperience,i as getFeature,a as getFeatureResult,t as getPicked,n as getPredicate,r as getPredicateResult,c as getStep,l as getStepContent,_ as getTrackRecommendationPresentEvent,y as queryCache,b as queryPresets,p as setContextScope,u as setStepContext,m as useUnit};
+import{getExperience as e,getPicked as t}from"./client.js";import{getPredicate as n,getPredicateResult as r}from"./predicate.js";import{getFeature as i,getFeatureEnabled as a,getFeatureResult as o}from"./feature.js";import{getAction as s,getActionResult as c}from"./action.js";import{getStep as l,getStepContent as u,setStepContext as d}from"./step.js";import{getContent as f}from"./content.js";import{getContextScope as p,setContextScope as m,useUnit as h}from"./stores.js";import{createLocalStorageStore as g,createSessionStorageStore as _}from"./storage.js";import{getTrackRecommendationPresentEvent as v}from"./events.js";import{createQuery as y,queryCache as b,queryPresets as x}from"./create-query/index.js";export{g as createLocalStorageStore,y as createQuery,_ as createSessionStorageStore,s as getAction,c as getActionResult,f as getContent,p as getContextScope,e as getExperience,i as getFeature,a as getFeatureEnabled,o as getFeatureResult,t as getPicked,n as getPredicate,r as getPredicateResult,l as getStep,u as getStepContent,v as getTrackRecommendationPresentEvent,b as queryCache,x as queryPresets,m as setContextScope,d as setStepContext,h as useUnit};

package/dist/hooks/step.d.ts

@@ -1,6 +1,6 @@
 import { Store } from 'effector';
 import { Content, ExperienceStep } from '@picked/client';
-import { FormInstance, FormField } from '../form/create-form.svelte';
+import { FormCallbackOptions, FormInstance, FormField } from '../form/create-form.svelte';
 export interface StepContext extends FormInstance {
     step: Store<ExperienceStep>;
     /** Directly accessible fields with current response values — usable without a form. */
@@ -26,17 +26,29 @@ export interface StepContext extends FormInstance {
  * Creates and sets step context in the Svelte context tree.
  *
  * @param {string} stepKey - The step key.
+ * @param {FormCallbackOptions} [options] - Submit callback slots for the step's form.
  * @returns {StepContext} The created step context.
- * @example setStepContext('step-1')
+ * @example setStepContext('step-1', { onSuccess: ({ data }) => track(data) })
  */
-export declare function setStepContext(stepKey: string): StepContext;
+export declare function setStepContext(stepKey: string, options?: FormCallbackOptions): StepContext;
 /**
  * Retrieves the step context from the Svelte context tree.
  *
+ * Passing `options` registers those callbacks for the calling component's
+ * lifetime. It is sugar over `form.onSuccess(cb)` and friends, which already
+ * manage their own teardown via `$effect` — the value is symmetry with
+ * `useStep(options)` in `@picked/react`, where the options form is what makes
+ * render-body registration safe.
+ *
+ * Must be called during component initialisation, like any other rune-backed
+ * helper.
+ *
+ * @param {FormCallbackOptions} [options] - Submit callback slots for this component.
  * @returns {StepContext} The current step context.
- * @example getStep()
+ * @example const { form, fields } = getStep({ onSuccess: ({ data }) => track(data) })
+ * @design-parity Mirrors `useStep(options)` in `@picked/react`.
  */
-export declare function getStep(): StepContext;
+export declare function getStep(options?: FormCallbackOptions): StepContext;
 /**
  * Returns a Svelte/Effector store that yields the current step's resolved CMS content
  * data, or `null` when no content is registered for the step's `layoutContentId`.

package/dist/hooks/step.js

@@ -1 +1 @@
-import{STEP_CONTEXT_KEY as e}from"../context.js";import{getExperience as t,getPicked as n}from"./client.js";import{getStepRouter as r}from"../router/context.js";import{getContext as i,setContext as a}from"svelte";import{combine as o}from"effector";import{createForm as s}from"../form/create-form.svelte";function c(t){let i=n(),{activeStep:c}=r(),l=c.map(e=>e?.key===t),u=i.steps.listStore.map(e=>e.find(e=>e.key===t)??{id:t,key:t,name:``,fieldKeys:[]}),d=s(t,u.map(e=>e.name),u.map(e=>e.fieldKeys)),f=o(u,i.contents.indexStore,(e,t)=>e.layoutContentId?t[e.layoutContentId]??null:null,{skipVoid:!1});return a(e,{step:u,layoutContentStore:f,content:f.map(e=>e?.data??null,{skipVoid:!1}),isActive:l,isActiveStep:l,...d})}function l(){return i(e)}function u(){let t=i(e);return t?t.content:d().map(e=>e?.data??null,{skipVoid:!1})}function d(){let e=t(),r=n();return o(e.treeStore,r.contents.indexStore,(e,t)=>{let n=e.steps.find(e=>e.layoutContentId);return n?.layoutContentId?t[n.layoutContentId]??null:null})}export{l as getStep,u as getStepContent,c as setStepContext};
+import{STEP_CONTEXT_KEY as e}from"../context.js";import{getExperience as t,getPicked as n}from"./client.js";import{getStepRouter as r}from"../router/context.js";import{getContext as i,setContext as a}from"svelte";import{combine as o}from"effector";import{createForm as s}from"../form/create-form.svelte";function c(t,i){let c=n(),{activeStep:l}=r(),u=l.map(e=>e?.key===t),d=c.steps.listStore.map(e=>e.find(e=>e.key===t)??{id:t,key:t,name:``,fieldKeys:[]}),f=s(t,d.map(e=>e.name),d.map(e=>e.fieldKeys),i),p=o(d,c.contents.indexStore,(e,t)=>e.layoutContentId?t[e.layoutContentId]??null:null,{skipVoid:!1});return a(e,{step:d,layoutContentStore:p,content:p.map(e=>e?.data??null,{skipVoid:!1}),isActive:u,isActiveStep:u,...f})}function l(t){let n=i(e);return t?.onBeforeSubmit&&n.form.onBeforeSubmit(t.onBeforeSubmit),t?.onSuccess&&n.form.onSuccess(t.onSuccess),t?.onError&&n.form.onError(t.onError),n}function u(){let t=i(e);return t?t.content:d().map(e=>e?.data??null,{skipVoid:!1})}function d(){let e=t(),r=n();return o(e.treeStore,r.contents.indexStore,(e,t)=>{let n=e.steps.find(e=>e.layoutContentId);return n?.layoutContentId?t[n.layoutContentId]??null:null})}export{l as getStep,u as getStepContent,c as setStepContext};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@picked/svelte",
-  "version": "0.0.1-dev.1784511339717",
+  "version": "0.0.1-dev.1785287094311",
   "dependencies": {
     "d3": "^7.9.0"
   },
@@ -106,7 +106,7 @@
   },
   "module": "./dist/index.js",
   "peerDependencies": {
-    "@picked/client": "0.0.1-dev.1784511339717",
+    "@picked/client": "0.0.1-dev.1785287094311",
     "effector": "^23.3.0",
     "svelte": "^5.46.4"
   },