@picked/svelte 0.0.1-dev.1767653321515 → 0.0.1-dev.1767653665615
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/form/form.svelte.d.ts +1 -0
- package/dist/form/form.svelte.ts +52 -28
- package/dist/hooks/step.d.ts +1 -0
- package/package.json +2 -2
|
@@ -7,6 +7,7 @@ interface GetFormOptions {
|
|
|
7
7
|
fields: Store<Field[] | FieldWithValue[]>;
|
|
8
8
|
}
|
|
9
9
|
type SuccessCallback = (options: {
|
|
10
|
+
data: CommitResponses;
|
|
10
11
|
stopNavigation: EventCallable<void>;
|
|
11
12
|
}) => void | Promise<void>;
|
|
12
13
|
type ErrorCallback = (errors: ValidationError[]) => void | Promise<void>;
|
package/dist/form/form.svelte.ts
CHANGED
|
@@ -29,7 +29,15 @@ interface GetFormOptions {
|
|
|
29
29
|
fields: Store<Field[] | FieldWithValue[]>
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
|
|
32
|
+
interface CommitResult {
|
|
33
|
+
data: CommitResponses
|
|
34
|
+
errors: ValidationError[]
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
type SuccessCallback = (options: {
|
|
38
|
+
data: CommitResponses
|
|
39
|
+
stopNavigation: EventCallable<void>
|
|
40
|
+
}) => void | Promise<void>
|
|
33
41
|
type ErrorCallback = (errors: ValidationError[]) => void | Promise<void>
|
|
34
42
|
type SubmitCallback = (
|
|
35
43
|
data: CommitResponses,
|
|
@@ -41,12 +49,12 @@ type SubmitEventWithCurrentTarget = SubmitEvent & { currentTarget: EventTarget &
|
|
|
41
49
|
* Factory function to create a callback observer with automatic cleanup
|
|
42
50
|
* Reduces duplication across success/error/submit callback patterns
|
|
43
51
|
*/
|
|
44
|
-
function createObserver<TCallback extends (...args: any[]) => any>(
|
|
45
|
-
executor: (callbacks: TCallback[], ...params: Parameters<TCallback>) => Promise<
|
|
52
|
+
function createObserver<TCallback extends (...args: any[]) => any, TReturn = void>(
|
|
53
|
+
executor: (callbacks: TCallback[], ...params: Parameters<TCallback>) => Promise<TReturn>,
|
|
46
54
|
) {
|
|
47
55
|
let callbacks: TCallback[] = []
|
|
48
56
|
|
|
49
|
-
const executeFx = createEffect(async (...params: Parameters<TCallback>) => {
|
|
57
|
+
const executeFx = createEffect(async (...params: Parameters<TCallback>): Promise<TReturn> => {
|
|
50
58
|
return await executor(callbacks, ...params)
|
|
51
59
|
})
|
|
52
60
|
|
|
@@ -68,7 +76,7 @@ export function getForm({ id: formId, title, fields }: GetFormOptions) {
|
|
|
68
76
|
const { currentStepStore: stepStore, goToNextStep } = experienceInstance
|
|
69
77
|
|
|
70
78
|
const submitEvent = createEvent<SubmitEventWithCurrentTarget>()
|
|
71
|
-
const formSuccessEvent = createEvent<
|
|
79
|
+
const formSuccessEvent = createEvent<CommitResponses>()
|
|
72
80
|
const formErrorEvent = createEvent<ValidationError[]>()
|
|
73
81
|
const stopNavigationEvent = createEvent<void>()
|
|
74
82
|
const allCallbacksCompleteEvent = createEvent<void>()
|
|
@@ -88,40 +96,56 @@ export function getForm({ id: formId, title, fields }: GetFormOptions) {
|
|
|
88
96
|
await Promise.all(callbacks.map((callback) => Promise.resolve(callback(errors))))
|
|
89
97
|
})
|
|
90
98
|
|
|
91
|
-
const submitObserver = createObserver<SubmitCallback>(
|
|
92
|
-
|
|
99
|
+
const submitObserver = createObserver<SubmitCallback, CommitResponses>(
|
|
100
|
+
async (callbacks, data) => {
|
|
101
|
+
let transformedData = data
|
|
93
102
|
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
103
|
+
// Apply each callback's transformation sequentially
|
|
104
|
+
for (const callback of callbacks) {
|
|
105
|
+
const result = await Promise.resolve(callback(transformedData))
|
|
106
|
+
// If callback returns data, use it; otherwise keep current
|
|
107
|
+
if (result !== undefined) {
|
|
108
|
+
transformedData = result
|
|
109
|
+
}
|
|
100
110
|
}
|
|
101
|
-
}
|
|
102
111
|
|
|
103
|
-
|
|
112
|
+
return transformedData
|
|
113
|
+
},
|
|
114
|
+
)
|
|
115
|
+
|
|
116
|
+
const commitFx = createEffect(async (responses: CommitResponses) => {
|
|
117
|
+
const result = await client.responses.commit(responses)
|
|
118
|
+
// Merge submitted data with validation result
|
|
119
|
+
return {
|
|
120
|
+
data: responses,
|
|
121
|
+
errors: result.errors,
|
|
122
|
+
}
|
|
104
123
|
})
|
|
105
124
|
|
|
106
|
-
const commitFx = createEffect((responses: CommitResponses) => client.responses.commit(responses))
|
|
107
|
-
|
|
108
125
|
const onSuccessFx = attach({
|
|
109
126
|
source: { step: stepStore },
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
form: { id: formId, title },
|
|
114
|
-
experience: experienceInstance,
|
|
115
|
-
step: step ?? undefined,
|
|
116
|
-
})
|
|
127
|
+
mapParams: (commitResult: CommitResult, source) => ({
|
|
128
|
+
step: source.step,
|
|
129
|
+
data: commitResult.data,
|
|
117
130
|
}),
|
|
131
|
+
effect: createEffect(
|
|
132
|
+
async ({ step, data }: { step: ExperienceStep | null; data: CommitResponses }) => {
|
|
133
|
+
client.eventBus({
|
|
134
|
+
type: 'form_submit_success',
|
|
135
|
+
form: { id: formId, title },
|
|
136
|
+
experience: experienceInstance,
|
|
137
|
+
step: step ?? undefined,
|
|
138
|
+
})
|
|
139
|
+
return data
|
|
140
|
+
},
|
|
141
|
+
),
|
|
118
142
|
})
|
|
119
143
|
|
|
120
144
|
const onErrorFx = attach({
|
|
121
145
|
source: { step: stepStore },
|
|
122
|
-
mapParams: (
|
|
146
|
+
mapParams: (commitResult: CommitResult, source) => ({
|
|
123
147
|
step: source.step,
|
|
124
|
-
errors:
|
|
148
|
+
errors: commitResult.errors,
|
|
125
149
|
}),
|
|
126
150
|
effect: createEffect(
|
|
127
151
|
async ({ step, errors }: { step: ExperienceStep | null; errors: ValidationError[] }) => {
|
|
@@ -300,14 +324,14 @@ export function getForm({ id: formId, title, fields }: GetFormOptions) {
|
|
|
300
324
|
})
|
|
301
325
|
|
|
302
326
|
sample({
|
|
303
|
-
clock: onSuccessFx.
|
|
327
|
+
clock: onSuccessFx.doneData,
|
|
304
328
|
target: formSuccessEvent,
|
|
305
329
|
})
|
|
306
330
|
|
|
307
331
|
// When form succeeds, execute all callbacks
|
|
308
332
|
sample({
|
|
309
333
|
clock: formSuccessEvent,
|
|
310
|
-
fn: () => ({ stopNavigation: stopNavigationEvent }), // Pass event reference to callbacks
|
|
334
|
+
fn: (data) => ({ data, stopNavigation: stopNavigationEvent }), // Pass form data and event reference to callbacks
|
|
311
335
|
target: successObserver.executeFx,
|
|
312
336
|
})
|
|
313
337
|
|
package/dist/hooks/step.d.ts
CHANGED
|
@@ -18,6 +18,7 @@ export declare function getStep(): {
|
|
|
18
18
|
};
|
|
19
19
|
onFormSubmit: (callback: (data: import('@picked/client').CommitResponses) => import('@picked/client').CommitResponses | void | Promise<import('@picked/client').CommitResponses | void>) => void;
|
|
20
20
|
onFormSuccess: (callback: (options: {
|
|
21
|
+
data: import('@picked/client').CommitResponses;
|
|
21
22
|
stopNavigation: import('effector').EventCallable<void>;
|
|
22
23
|
}) => void | Promise<void>) => void;
|
|
23
24
|
onFormError: (callback: (errors: import('@picked/client').ValidationError[]) => void | Promise<void>) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@picked/svelte",
|
|
3
|
-
"version": "0.0.1-dev.
|
|
3
|
+
"version": "0.0.1-dev.1767653665615",
|
|
4
4
|
"dependencies": {
|
|
5
5
|
"d3": "^7.9.0"
|
|
6
6
|
},
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
],
|
|
76
76
|
"module": "./dist/index.js",
|
|
77
77
|
"peerDependencies": {
|
|
78
|
-
"@picked/client": "0.0.1-dev.
|
|
78
|
+
"@picked/client": "0.0.1-dev.1767653665615",
|
|
79
79
|
"effector": "^23.3.0",
|
|
80
80
|
"svelte": "^5.34.3"
|
|
81
81
|
},
|