@wix/headless-forms 0.0.24 → 0.0.26
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/README.md +12 -10
- package/cjs/dist/react/Form.js +5 -5
- package/cjs/dist/react/core/Form.d.ts +2 -0
- package/cjs/dist/react/core/Form.js +3 -1
- package/cjs/dist/services/form-service.d.ts +4 -0
- package/cjs/dist/services/form-service.js +23 -7
- package/cjs/dist/services/utils/fetch-site-config.d.ts +19 -0
- package/cjs/dist/services/utils/fetch-site-config.js +38 -0
- package/cjs/dist/services/utils/index.d.ts +1 -0
- package/cjs/dist/services/utils/index.js +5 -1
- package/dist/react/Form.js +3 -3
- package/dist/react/core/Form.d.ts +2 -0
- package/dist/react/core/Form.js +3 -1
- package/dist/services/form-service.d.ts +4 -0
- package/dist/services/form-service.js +18 -2
- package/dist/services/utils/fetch-site-config.d.ts +19 -0
- package/dist/services/utils/fetch-site-config.js +31 -0
- package/dist/services/utils/index.d.ts +1 -0
- package/dist/services/utils/index.js +1 -0
- package/package.json +3 -2
package/README.md
CHANGED
|
@@ -20,20 +20,22 @@ Headless React components for rendering and managing forms. It follows the compo
|
|
|
20
20
|
3. **Test Changes Locally**
|
|
21
21
|
Run `examples/astro-forms-demo` to test changes locally.
|
|
22
22
|
|
|
23
|
+
4. Support channel `#verticals-on-wix-vibe`
|
|
24
|
+
|
|
25
|
+
|
|
23
26
|
## Documentation
|
|
24
27
|
|
|
25
28
|
All changes should be documented using `jsdoc` and updating `docs/api/FORM_INTERFACE.md`.
|
|
26
29
|
|
|
27
30
|
## Publishing
|
|
28
31
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
- Check if update has been commited to `auto-sdk-packages` repo (might take around 20mins)
|
|
32
|
+
**Update SDK Exports (@wix/forms package)**
|
|
33
|
+
- @wix/headless-forms package npm version will be updated automatically by Falcon after merging to master
|
|
34
|
+
- Go to Wix Form app in Wix Dev Center
|
|
35
|
+
- Update @wix/headless package version in SDK exports extensions:
|
|
36
|
+
- "Forms SDK Exports Components"
|
|
37
|
+
- "Forms SDK Exports Services"
|
|
38
|
+
- Release new app version
|
|
39
|
+
- Check if update has been commited to `auto-sdk-packages` repo ±20min
|
|
40
|
+
- Create a PR in [Picaso project](https://github.com/wix-private/picasso/blob/master/packages/vibe-remote-machine/main/package.json#L78) with new version. This package.json is used Wix Vibe site code.
|
|
39
41
|
|
package/cjs/dist/react/Form.js
CHANGED
|
@@ -42,7 +42,7 @@ const essentials_1 = require("@wix/essentials");
|
|
|
42
42
|
const Form_js_1 = require("./core/Form.js");
|
|
43
43
|
const FieldContext_js_1 = require("./context/FieldContext.js");
|
|
44
44
|
const FieldLayoutContext_js_1 = require("./context/FieldLayoutContext.js");
|
|
45
|
-
const
|
|
45
|
+
const index_js_1 = require("../services/utils/index.js");
|
|
46
46
|
var TestIds;
|
|
47
47
|
(function (TestIds) {
|
|
48
48
|
TestIds["formRoot"] = "form-root";
|
|
@@ -553,19 +553,19 @@ exports.Fields = react_1.default.forwardRef((props, ref) => {
|
|
|
553
553
|
const handleFormValidate = (0, react_1.useCallback)((errors) => {
|
|
554
554
|
setFormErrors(errors);
|
|
555
555
|
}, []);
|
|
556
|
-
return ((0, jsx_runtime_1.jsx)(Form_js_1.Fields, { children: ({ form, formValues, submitForm, handleForm, addressTemplates }) => {
|
|
556
|
+
return ((0, jsx_runtime_1.jsx)(Form_js_1.Fields, { children: ({ form, formValues, submitForm, handleForm, addressTemplates, siteConfig, }) => {
|
|
557
557
|
if (!form)
|
|
558
558
|
return null;
|
|
559
|
-
return ((0, jsx_runtime_1.jsx)("div", { ref: ref, children: (0, jsx_runtime_1.jsx)(form_public_1.FormProvider, { currency:
|
|
559
|
+
return ((0, jsx_runtime_1.jsx)("div", { ref: ref, children: (0, jsx_runtime_1.jsx)(form_public_1.FormProvider, { currency: siteConfig?.currency ?? index_js_1.DEFAULT_CURRENCY, locale: currentLanguage, regionalFormat: currentLocale, addressTemplates: addressTemplates, children: (0, jsx_runtime_1.jsx)(form_public_1.UniqueFieldSuffixContextProvider, { parentId: form._id ?? '', children: (0, jsx_runtime_1.jsx)(FieldsWithForm, { form: form, values: formValues, onChange: handleForm, errors: formErrors, onValidate: handleFormValidate, fields: props.fieldMap, submitForm: submitForm, rowGapClassname: props.rowGapClassname, columnGapClassname: props.columnGapClassname, formRef: formRef }) }) }) }));
|
|
560
560
|
} }));
|
|
561
561
|
});
|
|
562
562
|
const FieldsWithForm = ({ form, submitForm, values, onChange, errors, onValidate, fields: fieldMap, rowGapClassname, columnGapClassname, formRef, }) => {
|
|
563
563
|
const coreUploadFile = async ({ file, formId, }) => {
|
|
564
|
-
const uploadUrl = await (0,
|
|
564
|
+
const uploadUrl = await (0, index_js_1.getUploadUrl)(formId, file);
|
|
565
565
|
if (uploadUrl === undefined) {
|
|
566
566
|
return { isPrivate: false };
|
|
567
567
|
}
|
|
568
|
-
const url = await (0,
|
|
568
|
+
const url = await (0, index_js_1.uploadFile)(file, uploadUrl);
|
|
569
569
|
return {
|
|
570
570
|
id: '123123',
|
|
571
571
|
isPrivate: false,
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { forms } from '@wix/forms';
|
|
3
|
+
import { SiteConfig } from '../../services/utils';
|
|
3
4
|
import { FormServiceConfig } from '../../services/form-service.js';
|
|
4
5
|
import { FormValues } from '../types.js';
|
|
5
6
|
/**
|
|
@@ -260,6 +261,7 @@ export interface FieldsRenderProps {
|
|
|
260
261
|
submitForm: () => Promise<void>;
|
|
261
262
|
handleForm: (formValues: FormValues) => Promise<void>;
|
|
262
263
|
addressTemplates: any[];
|
|
264
|
+
siteConfig?: SiteConfig;
|
|
263
265
|
}
|
|
264
266
|
/**
|
|
265
267
|
* Props for Fields headless component
|
|
@@ -268,16 +268,18 @@ function Submitted(props) {
|
|
|
268
268
|
* ```
|
|
269
269
|
*/
|
|
270
270
|
function Fields(props) {
|
|
271
|
-
const { formSignal, submitForm, handleForm, formValuesSignal, addressTemplatesSignal, } = (0, services_manager_react_1.useService)(form_service_js_1.FormServiceDefinition);
|
|
271
|
+
const { formSignal, submitForm, handleForm, formValuesSignal, addressTemplatesSignal, siteConfigSignal, } = (0, services_manager_react_1.useService)(form_service_js_1.FormServiceDefinition);
|
|
272
272
|
const form = formSignal.get();
|
|
273
273
|
const formValues = formValuesSignal.get();
|
|
274
274
|
const addressTemplates = addressTemplatesSignal.get();
|
|
275
|
+
const siteConfig = siteConfigSignal.get();
|
|
275
276
|
return props.children({
|
|
276
277
|
form,
|
|
277
278
|
formValues,
|
|
278
279
|
submitForm,
|
|
279
280
|
handleForm,
|
|
280
281
|
addressTemplates,
|
|
282
|
+
siteConfig,
|
|
281
283
|
});
|
|
282
284
|
}
|
|
283
285
|
/**
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { forms } from '@wix/forms';
|
|
2
2
|
import { type ReadOnlySignal } from '@wix/services-definitions/core-services/signals';
|
|
3
3
|
import { FormValues } from '../react/types.js';
|
|
4
|
+
import { type SiteConfig } from './utils';
|
|
4
5
|
/**
|
|
5
6
|
* Response type for form submission operations.
|
|
6
7
|
* Represents the different states a form submission can be in.
|
|
@@ -28,6 +29,8 @@ export interface FormServiceAPI {
|
|
|
28
29
|
formSignal: ReadOnlySignal<forms.Form | null>;
|
|
29
30
|
/** Reactive signal containing the address templates */
|
|
30
31
|
addressTemplatesSignal: ReadOnlySignal<any[]>;
|
|
32
|
+
/** Reactive signal containing the site configuration */
|
|
33
|
+
siteConfigSignal: ReadOnlySignal<SiteConfig | undefined>;
|
|
31
34
|
/** Reactive signal indicating if a form is currently being loaded */
|
|
32
35
|
isLoadingSignal: ReadOnlySignal<boolean>;
|
|
33
36
|
/** Reactive signal containing any error message, or null if no error */
|
|
@@ -72,6 +75,7 @@ export type FormServiceConfig = {
|
|
|
72
75
|
form: forms.Form;
|
|
73
76
|
onSubmit?: OnSubmit;
|
|
74
77
|
addressTemplates?: any[];
|
|
78
|
+
siteConfig?: SiteConfig;
|
|
75
79
|
};
|
|
76
80
|
/**
|
|
77
81
|
* Implementation of the Form service that manages reactive form data and submissions.
|
|
@@ -5,7 +5,7 @@ exports.loadFormServiceConfig = loadFormServiceConfig;
|
|
|
5
5
|
const forms_1 = require("@wix/forms");
|
|
6
6
|
const services_definitions_1 = require("@wix/services-definitions");
|
|
7
7
|
const signals_1 = require("@wix/services-definitions/core-services/signals");
|
|
8
|
-
const
|
|
8
|
+
const utils_1 = require("./utils");
|
|
9
9
|
const auto_sdk_forms_forms_1 = require("@wix/auto_sdk_forms_forms");
|
|
10
10
|
/**
|
|
11
11
|
* Service definition for the Form service.
|
|
@@ -50,10 +50,15 @@ exports.FormService = services_definitions_1.implementService.withConfig()(expor
|
|
|
50
50
|
const formSignal = signalsService.signal(hasSchema ? config.form : null);
|
|
51
51
|
const hasAddressTemplates = 'addressTemplates' in config;
|
|
52
52
|
const addressTemplatesSignal = signalsService.signal(hasAddressTemplates ? config.addressTemplates : null);
|
|
53
|
+
const hasSiteConfig = 'siteConfig' in config;
|
|
54
|
+
const siteConfigSignal = signalsService.signal(hasSiteConfig ? config.siteConfig : undefined);
|
|
53
55
|
const formValuesSignal = signalsService.signal({});
|
|
54
56
|
if (!hasSchema) {
|
|
55
57
|
loadForm(config.formId, config.namespace, config.additionalMetadata);
|
|
56
58
|
}
|
|
59
|
+
if (!hasSiteConfig) {
|
|
60
|
+
loadSiteConfig();
|
|
61
|
+
}
|
|
57
62
|
async function loadForm(id, namespace, additionalMetadata) {
|
|
58
63
|
let form;
|
|
59
64
|
isLoadingSignal.set(true);
|
|
@@ -72,18 +77,18 @@ exports.FormService = services_definitions_1.implementService.withConfig()(expor
|
|
|
72
77
|
isLoadingSignal.set(false);
|
|
73
78
|
throw err;
|
|
74
79
|
}
|
|
75
|
-
if (!hasAddressTemplates && (0,
|
|
80
|
+
if (!hasAddressTemplates && (0, utils_1.hasMultilineAddressField)(form)) {
|
|
76
81
|
loadAddressTemplates();
|
|
77
82
|
}
|
|
78
83
|
isLoadingSignal.set(false);
|
|
79
84
|
}
|
|
80
85
|
async function loadAddressTemplates() {
|
|
81
86
|
const form = formSignal.get();
|
|
82
|
-
if (!form || !(0,
|
|
87
|
+
if (!form || !(0, utils_1.hasMultilineAddressField)(form)) {
|
|
83
88
|
return;
|
|
84
89
|
}
|
|
85
90
|
try {
|
|
86
|
-
const addressTemplates = await (0,
|
|
91
|
+
const addressTemplates = await (0, utils_1.fetchAddressForms)();
|
|
87
92
|
if (addressTemplates) {
|
|
88
93
|
addressTemplatesSignal.set(addressTemplates);
|
|
89
94
|
}
|
|
@@ -97,6 +102,15 @@ exports.FormService = services_definitions_1.implementService.withConfig()(expor
|
|
|
97
102
|
throw err;
|
|
98
103
|
}
|
|
99
104
|
}
|
|
105
|
+
async function loadSiteConfig() {
|
|
106
|
+
const siteConfig = await (0, utils_1.fetchSiteConfig)();
|
|
107
|
+
if (siteConfig) {
|
|
108
|
+
siteConfigSignal.set(siteConfig);
|
|
109
|
+
}
|
|
110
|
+
else {
|
|
111
|
+
errorSignal.set('Site config not found');
|
|
112
|
+
}
|
|
113
|
+
}
|
|
100
114
|
async function defaultSubmitHandler(formId, formValues) {
|
|
101
115
|
try {
|
|
102
116
|
await forms_1.submissions.createSubmission({
|
|
@@ -147,6 +161,7 @@ exports.FormService = services_definitions_1.implementService.withConfig()(expor
|
|
|
147
161
|
submitResponseSignal,
|
|
148
162
|
formValuesSignal,
|
|
149
163
|
addressTemplatesSignal,
|
|
164
|
+
siteConfigSignal,
|
|
150
165
|
submitForm,
|
|
151
166
|
handleForm,
|
|
152
167
|
};
|
|
@@ -190,8 +205,9 @@ async function fetchForm({ id, namespace = 'wix.form_app.form', additionalMetada
|
|
|
190
205
|
async function loadFormServiceConfig(formId, namespace, additionalMetadata) {
|
|
191
206
|
const form = await fetchForm({ id: formId, namespace, additionalMetadata });
|
|
192
207
|
let addressTemplates;
|
|
193
|
-
if ((0,
|
|
194
|
-
addressTemplates = await (0,
|
|
208
|
+
if ((0, utils_1.hasMultilineAddressField)(form)) {
|
|
209
|
+
addressTemplates = await (0, utils_1.fetchAddressForms)();
|
|
195
210
|
}
|
|
196
|
-
|
|
211
|
+
const siteConfig = await (0, utils_1.fetchSiteConfig)();
|
|
212
|
+
return { form, addressTemplates, siteConfig };
|
|
197
213
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const DEFAULT_LOCALE: {
|
|
2
|
+
country: string;
|
|
3
|
+
lang: string;
|
|
4
|
+
};
|
|
5
|
+
export declare const DEFAULT_CURRENCY: {
|
|
6
|
+
sign: string;
|
|
7
|
+
code: string;
|
|
8
|
+
};
|
|
9
|
+
export interface SiteConfig {
|
|
10
|
+
locale: {
|
|
11
|
+
country: string;
|
|
12
|
+
languageCode: string;
|
|
13
|
+
};
|
|
14
|
+
currency: {
|
|
15
|
+
sign: string;
|
|
16
|
+
code: string;
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
export declare function fetchSiteConfig(): Promise<SiteConfig>;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.DEFAULT_CURRENCY = exports.DEFAULT_LOCALE = void 0;
|
|
7
|
+
exports.fetchSiteConfig = fetchSiteConfig;
|
|
8
|
+
const locale_dataset_javascript_1 = __importDefault(require("@wix/locale-dataset-javascript"));
|
|
9
|
+
const essentials_1 = require("@wix/essentials");
|
|
10
|
+
exports.DEFAULT_LOCALE = { country: 'US', lang: 'en' };
|
|
11
|
+
exports.DEFAULT_CURRENCY = { sign: '$', code: 'USD' };
|
|
12
|
+
async function fetchSiteConfig() {
|
|
13
|
+
let siteProperties;
|
|
14
|
+
const url = `https://www.wixapis.com/forms/v4/standalone-forms/site-properties`;
|
|
15
|
+
try {
|
|
16
|
+
const response = await essentials_1.httpClient.fetchWithAuth(url);
|
|
17
|
+
if (response.ok) {
|
|
18
|
+
const data = await response.json();
|
|
19
|
+
siteProperties = data.siteProperties;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
catch (error) {
|
|
23
|
+
console.error('Failed to fetch fetchSiteConfig:', error);
|
|
24
|
+
}
|
|
25
|
+
const country = siteProperties?.localeCountry ?? exports.DEFAULT_LOCALE.country;
|
|
26
|
+
const languageCode = siteProperties?.localeLanguageCode ?? exports.DEFAULT_LOCALE.lang;
|
|
27
|
+
const currency = locale_dataset_javascript_1.default.getCurrencyByKey(siteProperties?.paymentCurrency ?? exports.DEFAULT_CURRENCY.code);
|
|
28
|
+
return {
|
|
29
|
+
locale: {
|
|
30
|
+
country,
|
|
31
|
+
languageCode,
|
|
32
|
+
},
|
|
33
|
+
currency: {
|
|
34
|
+
sign: currency.symbol,
|
|
35
|
+
code: currency.key,
|
|
36
|
+
},
|
|
37
|
+
};
|
|
38
|
+
}
|
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.fetchAddressForms = exports.hasMultilineAddressField = exports.uploadFile = exports.getUploadUrl = void 0;
|
|
3
|
+
exports.DEFAULT_LOCALE = exports.DEFAULT_CURRENCY = exports.fetchSiteConfig = exports.fetchAddressForms = exports.hasMultilineAddressField = exports.uploadFile = exports.getUploadUrl = void 0;
|
|
4
4
|
var file_upload_utils_1 = require("./file-upload-utils");
|
|
5
5
|
Object.defineProperty(exports, "getUploadUrl", { enumerable: true, get: function () { return file_upload_utils_1.getUploadUrl; } });
|
|
6
6
|
Object.defineProperty(exports, "uploadFile", { enumerable: true, get: function () { return file_upload_utils_1.uploadFile; } });
|
|
7
7
|
var address_forms_1 = require("./address-forms");
|
|
8
8
|
Object.defineProperty(exports, "hasMultilineAddressField", { enumerable: true, get: function () { return address_forms_1.hasMultilineAddressField; } });
|
|
9
9
|
Object.defineProperty(exports, "fetchAddressForms", { enumerable: true, get: function () { return address_forms_1.fetchAddressForms; } });
|
|
10
|
+
var fetch_site_config_1 = require("./fetch-site-config");
|
|
11
|
+
Object.defineProperty(exports, "fetchSiteConfig", { enumerable: true, get: function () { return fetch_site_config_1.fetchSiteConfig; } });
|
|
12
|
+
Object.defineProperty(exports, "DEFAULT_CURRENCY", { enumerable: true, get: function () { return fetch_site_config_1.DEFAULT_CURRENCY; } });
|
|
13
|
+
Object.defineProperty(exports, "DEFAULT_LOCALE", { enumerable: true, get: function () { return fetch_site_config_1.DEFAULT_LOCALE; } });
|
package/dist/react/Form.js
CHANGED
|
@@ -6,7 +6,7 @@ import { i18n } from '@wix/essentials';
|
|
|
6
6
|
import { Root as CoreRoot, Loading as CoreLoading, LoadingError as CoreLoadingError, Error as CoreError, Submitted as CoreSubmitted, Fields as CoreFields, Field as CoreField, useFormRef, } from './core/Form.js';
|
|
7
7
|
import { FieldContext, useFieldContext, } from './context/FieldContext.js';
|
|
8
8
|
import { FieldLayoutProvider, useFieldLayout, } from './context/FieldLayoutContext.js';
|
|
9
|
-
import { getUploadUrl, uploadFile } from '../services/utils';
|
|
9
|
+
import { getUploadUrl, uploadFile, DEFAULT_CURRENCY, } from '../services/utils/index.js';
|
|
10
10
|
var TestIds;
|
|
11
11
|
(function (TestIds) {
|
|
12
12
|
TestIds["formRoot"] = "form-root";
|
|
@@ -517,10 +517,10 @@ export const Fields = React.forwardRef((props, ref) => {
|
|
|
517
517
|
const handleFormValidate = useCallback((errors) => {
|
|
518
518
|
setFormErrors(errors);
|
|
519
519
|
}, []);
|
|
520
|
-
return (_jsx(CoreFields, { children: ({ form, formValues, submitForm, handleForm, addressTemplates }) => {
|
|
520
|
+
return (_jsx(CoreFields, { children: ({ form, formValues, submitForm, handleForm, addressTemplates, siteConfig, }) => {
|
|
521
521
|
if (!form)
|
|
522
522
|
return null;
|
|
523
|
-
return (_jsx("div", { ref: ref, children: _jsx(FormProvider, { currency:
|
|
523
|
+
return (_jsx("div", { ref: ref, children: _jsx(FormProvider, { currency: siteConfig?.currency ?? DEFAULT_CURRENCY, locale: currentLanguage, regionalFormat: currentLocale, addressTemplates: addressTemplates, children: _jsx(UniqueFieldSuffixContextProvider, { parentId: form._id ?? '', children: _jsx(FieldsWithForm, { form: form, values: formValues, onChange: handleForm, errors: formErrors, onValidate: handleFormValidate, fields: props.fieldMap, submitForm: submitForm, rowGapClassname: props.rowGapClassname, columnGapClassname: props.columnGapClassname, formRef: formRef }) }) }) }));
|
|
524
524
|
} }));
|
|
525
525
|
});
|
|
526
526
|
const FieldsWithForm = ({ form, submitForm, values, onChange, errors, onValidate, fields: fieldMap, rowGapClassname, columnGapClassname, formRef, }) => {
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { forms } from '@wix/forms';
|
|
3
|
+
import { SiteConfig } from '../../services/utils';
|
|
3
4
|
import { FormServiceConfig } from '../../services/form-service.js';
|
|
4
5
|
import { FormValues } from '../types.js';
|
|
5
6
|
/**
|
|
@@ -260,6 +261,7 @@ export interface FieldsRenderProps {
|
|
|
260
261
|
submitForm: () => Promise<void>;
|
|
261
262
|
handleForm: (formValues: FormValues) => Promise<void>;
|
|
262
263
|
addressTemplates: any[];
|
|
264
|
+
siteConfig?: SiteConfig;
|
|
263
265
|
}
|
|
264
266
|
/**
|
|
265
267
|
* Props for Fields headless component
|
package/dist/react/core/Form.js
CHANGED
|
@@ -255,16 +255,18 @@ export function Submitted(props) {
|
|
|
255
255
|
* ```
|
|
256
256
|
*/
|
|
257
257
|
export function Fields(props) {
|
|
258
|
-
const { formSignal, submitForm, handleForm, formValuesSignal, addressTemplatesSignal, } = useService(FormServiceDefinition);
|
|
258
|
+
const { formSignal, submitForm, handleForm, formValuesSignal, addressTemplatesSignal, siteConfigSignal, } = useService(FormServiceDefinition);
|
|
259
259
|
const form = formSignal.get();
|
|
260
260
|
const formValues = formValuesSignal.get();
|
|
261
261
|
const addressTemplates = addressTemplatesSignal.get();
|
|
262
|
+
const siteConfig = siteConfigSignal.get();
|
|
262
263
|
return props.children({
|
|
263
264
|
form,
|
|
264
265
|
formValues,
|
|
265
266
|
submitForm,
|
|
266
267
|
handleForm,
|
|
267
268
|
addressTemplates,
|
|
269
|
+
siteConfig,
|
|
268
270
|
});
|
|
269
271
|
}
|
|
270
272
|
/**
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { forms } from '@wix/forms';
|
|
2
2
|
import { type ReadOnlySignal } from '@wix/services-definitions/core-services/signals';
|
|
3
3
|
import { FormValues } from '../react/types.js';
|
|
4
|
+
import { type SiteConfig } from './utils';
|
|
4
5
|
/**
|
|
5
6
|
* Response type for form submission operations.
|
|
6
7
|
* Represents the different states a form submission can be in.
|
|
@@ -28,6 +29,8 @@ export interface FormServiceAPI {
|
|
|
28
29
|
formSignal: ReadOnlySignal<forms.Form | null>;
|
|
29
30
|
/** Reactive signal containing the address templates */
|
|
30
31
|
addressTemplatesSignal: ReadOnlySignal<any[]>;
|
|
32
|
+
/** Reactive signal containing the site configuration */
|
|
33
|
+
siteConfigSignal: ReadOnlySignal<SiteConfig | undefined>;
|
|
31
34
|
/** Reactive signal indicating if a form is currently being loaded */
|
|
32
35
|
isLoadingSignal: ReadOnlySignal<boolean>;
|
|
33
36
|
/** Reactive signal containing any error message, or null if no error */
|
|
@@ -72,6 +75,7 @@ export type FormServiceConfig = {
|
|
|
72
75
|
form: forms.Form;
|
|
73
76
|
onSubmit?: OnSubmit;
|
|
74
77
|
addressTemplates?: any[];
|
|
78
|
+
siteConfig?: SiteConfig;
|
|
75
79
|
};
|
|
76
80
|
/**
|
|
77
81
|
* Implementation of the Form service that manages reactive form data and submissions.
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { forms, submissions } from '@wix/forms';
|
|
2
2
|
import { defineService, implementService } from '@wix/services-definitions';
|
|
3
3
|
import { SignalsServiceDefinition, } from '@wix/services-definitions/core-services/signals';
|
|
4
|
-
import { fetchAddressForms, hasMultilineAddressField, } from './utils
|
|
4
|
+
import { fetchAddressForms, hasMultilineAddressField, fetchSiteConfig, } from './utils';
|
|
5
5
|
import { Fieldset } from '@wix/auto_sdk_forms_forms';
|
|
6
6
|
/**
|
|
7
7
|
* Service definition for the Form service.
|
|
@@ -46,10 +46,15 @@ export const FormService = implementService.withConfig()(FormServiceDefinition,
|
|
|
46
46
|
const formSignal = signalsService.signal(hasSchema ? config.form : null);
|
|
47
47
|
const hasAddressTemplates = 'addressTemplates' in config;
|
|
48
48
|
const addressTemplatesSignal = signalsService.signal(hasAddressTemplates ? config.addressTemplates : null);
|
|
49
|
+
const hasSiteConfig = 'siteConfig' in config;
|
|
50
|
+
const siteConfigSignal = signalsService.signal(hasSiteConfig ? config.siteConfig : undefined);
|
|
49
51
|
const formValuesSignal = signalsService.signal({});
|
|
50
52
|
if (!hasSchema) {
|
|
51
53
|
loadForm(config.formId, config.namespace, config.additionalMetadata);
|
|
52
54
|
}
|
|
55
|
+
if (!hasSiteConfig) {
|
|
56
|
+
loadSiteConfig();
|
|
57
|
+
}
|
|
53
58
|
async function loadForm(id, namespace, additionalMetadata) {
|
|
54
59
|
let form;
|
|
55
60
|
isLoadingSignal.set(true);
|
|
@@ -93,6 +98,15 @@ export const FormService = implementService.withConfig()(FormServiceDefinition,
|
|
|
93
98
|
throw err;
|
|
94
99
|
}
|
|
95
100
|
}
|
|
101
|
+
async function loadSiteConfig() {
|
|
102
|
+
const siteConfig = await fetchSiteConfig();
|
|
103
|
+
if (siteConfig) {
|
|
104
|
+
siteConfigSignal.set(siteConfig);
|
|
105
|
+
}
|
|
106
|
+
else {
|
|
107
|
+
errorSignal.set('Site config not found');
|
|
108
|
+
}
|
|
109
|
+
}
|
|
96
110
|
async function defaultSubmitHandler(formId, formValues) {
|
|
97
111
|
try {
|
|
98
112
|
await submissions.createSubmission({
|
|
@@ -143,6 +157,7 @@ export const FormService = implementService.withConfig()(FormServiceDefinition,
|
|
|
143
157
|
submitResponseSignal,
|
|
144
158
|
formValuesSignal,
|
|
145
159
|
addressTemplatesSignal,
|
|
160
|
+
siteConfigSignal,
|
|
146
161
|
submitForm,
|
|
147
162
|
handleForm,
|
|
148
163
|
};
|
|
@@ -189,5 +204,6 @@ export async function loadFormServiceConfig(formId, namespace, additionalMetadat
|
|
|
189
204
|
if (hasMultilineAddressField(form)) {
|
|
190
205
|
addressTemplates = await fetchAddressForms();
|
|
191
206
|
}
|
|
192
|
-
|
|
207
|
+
const siteConfig = await fetchSiteConfig();
|
|
208
|
+
return { form, addressTemplates, siteConfig };
|
|
193
209
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const DEFAULT_LOCALE: {
|
|
2
|
+
country: string;
|
|
3
|
+
lang: string;
|
|
4
|
+
};
|
|
5
|
+
export declare const DEFAULT_CURRENCY: {
|
|
6
|
+
sign: string;
|
|
7
|
+
code: string;
|
|
8
|
+
};
|
|
9
|
+
export interface SiteConfig {
|
|
10
|
+
locale: {
|
|
11
|
+
country: string;
|
|
12
|
+
languageCode: string;
|
|
13
|
+
};
|
|
14
|
+
currency: {
|
|
15
|
+
sign: string;
|
|
16
|
+
code: string;
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
export declare function fetchSiteConfig(): Promise<SiteConfig>;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import localeDataset from '@wix/locale-dataset-javascript';
|
|
2
|
+
import { httpClient } from '@wix/essentials';
|
|
3
|
+
export const DEFAULT_LOCALE = { country: 'US', lang: 'en' };
|
|
4
|
+
export const DEFAULT_CURRENCY = { sign: '$', code: 'USD' };
|
|
5
|
+
export async function fetchSiteConfig() {
|
|
6
|
+
let siteProperties;
|
|
7
|
+
const url = `https://www.wixapis.com/forms/v4/standalone-forms/site-properties`;
|
|
8
|
+
try {
|
|
9
|
+
const response = await httpClient.fetchWithAuth(url);
|
|
10
|
+
if (response.ok) {
|
|
11
|
+
const data = await response.json();
|
|
12
|
+
siteProperties = data.siteProperties;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
catch (error) {
|
|
16
|
+
console.error('Failed to fetch fetchSiteConfig:', error);
|
|
17
|
+
}
|
|
18
|
+
const country = siteProperties?.localeCountry ?? DEFAULT_LOCALE.country;
|
|
19
|
+
const languageCode = siteProperties?.localeLanguageCode ?? DEFAULT_LOCALE.lang;
|
|
20
|
+
const currency = localeDataset.getCurrencyByKey(siteProperties?.paymentCurrency ?? DEFAULT_CURRENCY.code);
|
|
21
|
+
return {
|
|
22
|
+
locale: {
|
|
23
|
+
country,
|
|
24
|
+
languageCode,
|
|
25
|
+
},
|
|
26
|
+
currency: {
|
|
27
|
+
sign: currency.symbol,
|
|
28
|
+
code: currency.key,
|
|
29
|
+
},
|
|
30
|
+
};
|
|
31
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wix/headless-forms",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.26",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -45,6 +45,7 @@
|
|
|
45
45
|
"@wix/form-public": "^0.104.0",
|
|
46
46
|
"@wix/forms": "^1.0.373",
|
|
47
47
|
"@wix/headless-utils": "0.0.8",
|
|
48
|
+
"@wix/locale-dataset-javascript": "^2.3.0",
|
|
48
49
|
"@wix/services-definitions": "^1.0.1",
|
|
49
50
|
"@wix/services-manager-react": "^1.0.2",
|
|
50
51
|
"react-aria-components": "^1.13.0"
|
|
@@ -59,5 +60,5 @@
|
|
|
59
60
|
"groupId": "com.wixpress.headless-components"
|
|
60
61
|
}
|
|
61
62
|
},
|
|
62
|
-
"falconPackageHash": "
|
|
63
|
+
"falconPackageHash": "22029dcca5ca6b784b9b10ab5e50a42d7f020f1fa80a8660e9e86dc7"
|
|
63
64
|
}
|