@wix/form-public 0.34.0 → 0.35.0
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/index.cjs +69 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +69 -12
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
package/dist/index.js
CHANGED
|
@@ -24748,17 +24748,20 @@ var createFormFields = (_ref) => {
|
|
|
24748
24748
|
errors,
|
|
24749
24749
|
values,
|
|
24750
24750
|
onFieldChange,
|
|
24751
|
-
FieldLayout
|
|
24751
|
+
FieldLayout,
|
|
24752
|
+
formSchema
|
|
24752
24753
|
} = _ref;
|
|
24753
24754
|
return form.fields.map((formField) => {
|
|
24754
|
-
const component = /* @__PURE__ */ React32__default.createElement(
|
|
24755
|
+
const component = /* @__PURE__ */ React32__default.createElement(FormContext.Provider, {
|
|
24756
|
+
value: formSchema
|
|
24757
|
+
}, /* @__PURE__ */ React32__default.createElement(FormField, {
|
|
24755
24758
|
key: formField.id,
|
|
24756
24759
|
field: formField,
|
|
24757
24760
|
values,
|
|
24758
24761
|
errors,
|
|
24759
24762
|
onFieldChange,
|
|
24760
24763
|
FieldLayout
|
|
24761
|
-
});
|
|
24764
|
+
}));
|
|
24762
24765
|
return {
|
|
24763
24766
|
id: formField.id,
|
|
24764
24767
|
fieldType: formField.fieldType,
|
|
@@ -24826,9 +24829,8 @@ var Grid = (_ref) => {
|
|
|
24826
24829
|
return /* @__PURE__ */ React32__default.createElement("div", {
|
|
24827
24830
|
className: grid_module_default.container,
|
|
24828
24831
|
dir: isRTL ? "rtl" : ""
|
|
24829
|
-
}, reactElementsByRow.map((
|
|
24830
|
-
|
|
24831
|
-
const fieldId = (_elements$ = elements[0]) == null || (_elements$ = _elements$.props) == null || (_elements$ = _elements$.field) == null ? void 0 : _elements$.id;
|
|
24832
|
+
}, reactElementsByRow.map((rowData, index) => {
|
|
24833
|
+
const fieldId = rowData.firstFieldId;
|
|
24832
24834
|
const key = isMobile && fieldId || index;
|
|
24833
24835
|
return /* @__PURE__ */ React32__default.createElement(Focusable, {
|
|
24834
24836
|
key: fieldId,
|
|
@@ -24841,7 +24843,7 @@ var Grid = (_ref) => {
|
|
|
24841
24843
|
className: (0, import_classnames4.default)(grid_module_default.grid, grid_module_default.column, {
|
|
24842
24844
|
[grid_animations_module_default.animations]: enableAnimations
|
|
24843
24845
|
})
|
|
24844
|
-
}, elements));
|
|
24846
|
+
}, rowData.elements));
|
|
24845
24847
|
}));
|
|
24846
24848
|
};
|
|
24847
24849
|
function getReactElementsByRow(items) {
|
|
@@ -24851,9 +24853,12 @@ function getReactElementsByRow(items) {
|
|
|
24851
24853
|
key: item.id
|
|
24852
24854
|
});
|
|
24853
24855
|
if (result2[row]) {
|
|
24854
|
-
result2[row].push(element);
|
|
24856
|
+
result2[row].elements.push(element);
|
|
24855
24857
|
} else {
|
|
24856
|
-
result2[row] =
|
|
24858
|
+
result2[row] = {
|
|
24859
|
+
elements: [element],
|
|
24860
|
+
firstFieldId: item.id
|
|
24861
|
+
};
|
|
24857
24862
|
}
|
|
24858
24863
|
return result2;
|
|
24859
24864
|
}, []);
|
|
@@ -24935,7 +24940,8 @@ var FormRoot = (_ref) => {
|
|
|
24935
24940
|
form,
|
|
24936
24941
|
values,
|
|
24937
24942
|
onFieldChange,
|
|
24938
|
-
errors
|
|
24943
|
+
errors,
|
|
24944
|
+
formSchema
|
|
24939
24945
|
} = _ref;
|
|
24940
24946
|
const {
|
|
24941
24947
|
isRTL
|
|
@@ -24945,7 +24951,8 @@ var FormRoot = (_ref) => {
|
|
|
24945
24951
|
values,
|
|
24946
24952
|
onFieldChange,
|
|
24947
24953
|
errors,
|
|
24948
|
-
FieldLayout: DefaultFieldLayout
|
|
24954
|
+
FieldLayout: DefaultFieldLayout,
|
|
24955
|
+
formSchema
|
|
24949
24956
|
});
|
|
24950
24957
|
return /* @__PURE__ */ React32__default.createElement(Grid, {
|
|
24951
24958
|
isRTL,
|
|
@@ -26113,6 +26120,8 @@ function resolveArrayComponent(arrayComponent) {
|
|
|
26113
26120
|
switch (arrayComponent.componentType) {
|
|
26114
26121
|
case ComponentType3.CHECKBOX_GROUP:
|
|
26115
26122
|
return takeCheckboxGroupViewProperties(arrayComponent.checkboxGroupOptions);
|
|
26123
|
+
case ComponentType3.TAGS:
|
|
26124
|
+
return takeTagsViewProperties(arrayComponent.tagsOptions);
|
|
26116
26125
|
default:
|
|
26117
26126
|
throw new Error(`Unknown array component type: ${arrayComponent.componentType}`);
|
|
26118
26127
|
}
|
|
@@ -26136,6 +26145,25 @@ function takeCheckboxGroupViewProperties(checkboxGroup) {
|
|
|
26136
26145
|
}
|
|
26137
26146
|
};
|
|
26138
26147
|
}
|
|
26148
|
+
function takeTagsViewProperties(tags) {
|
|
26149
|
+
return {
|
|
26150
|
+
[HideLabelKey]: !tags.showLabel,
|
|
26151
|
+
[AddOtherKey]: tags.customOption != null,
|
|
26152
|
+
[OptionsKey]: tags.options.map((option) => makeOptionView(option)),
|
|
26153
|
+
[NumberOfColumnsKey]: numericNumberOfColumns(tags.numberOfColumns ?? NumberOfColumns3.ONE),
|
|
26154
|
+
[DefaultValueKey]: tags.options.filter((option) => option.default).map((option) => option.value),
|
|
26155
|
+
...tags.description && {
|
|
26156
|
+
[DescriptionKey]: tags.description
|
|
26157
|
+
},
|
|
26158
|
+
...tags.label && {
|
|
26159
|
+
[LabelKey]: tags.label
|
|
26160
|
+
},
|
|
26161
|
+
...tags.customOption && {
|
|
26162
|
+
[AddOtherLabelKey]: tags.customOption.label,
|
|
26163
|
+
[AddOtherPlaceholderKey]: tags.customOption.placeholder
|
|
26164
|
+
}
|
|
26165
|
+
};
|
|
26166
|
+
}
|
|
26139
26167
|
function takeProductCheckboxGroupViewProperties(checkboxGroup) {
|
|
26140
26168
|
return {
|
|
26141
26169
|
[HideLabelKey]: !checkboxGroup.showLabel,
|
|
@@ -26386,6 +26414,10 @@ function resolvePaymentComponent(paymentComponent) {
|
|
|
26386
26414
|
return takeProductCheckboxGroupViewProperties(paymentComponent.checkboxGroupOptions);
|
|
26387
26415
|
case PaymentComponentType3.DONATION_INPUT:
|
|
26388
26416
|
return takeDonationsInputViewProperties(paymentComponent.donationInputOptions);
|
|
26417
|
+
case PaymentComponentType3.FIXED_PAYMENT:
|
|
26418
|
+
return takeFixedPaymentViewProperties(paymentComponent.fixedPaymentOptions);
|
|
26419
|
+
case PaymentComponentType3.PAYMENT_INPUT:
|
|
26420
|
+
return takePaymentInputViewProperties(paymentComponent.paymentInputOptions);
|
|
26389
26421
|
default:
|
|
26390
26422
|
throw new Error(`Unknown payment component type: ${paymentComponent.componentType}`);
|
|
26391
26423
|
}
|
|
@@ -26510,6 +26542,31 @@ function takeDonationsInputViewProperties(donationInput) {
|
|
|
26510
26542
|
}
|
|
26511
26543
|
};
|
|
26512
26544
|
}
|
|
26545
|
+
function takeFixedPaymentViewProperties(fixedPayment) {
|
|
26546
|
+
return {
|
|
26547
|
+
[HideLabelKey]: !fixedPayment.showLabel,
|
|
26548
|
+
...fixedPayment.label && {
|
|
26549
|
+
[LabelKey]: fixedPayment.label
|
|
26550
|
+
},
|
|
26551
|
+
...fixedPayment.description && {
|
|
26552
|
+
[DescriptionKey]: fixedPayment.description
|
|
26553
|
+
}
|
|
26554
|
+
};
|
|
26555
|
+
}
|
|
26556
|
+
function takePaymentInputViewProperties(paymentInput) {
|
|
26557
|
+
return {
|
|
26558
|
+
[HideLabelKey]: !paymentInput.showLabel,
|
|
26559
|
+
...paymentInput.label && {
|
|
26560
|
+
[LabelKey]: paymentInput.label
|
|
26561
|
+
},
|
|
26562
|
+
...paymentInput.description && {
|
|
26563
|
+
[DescriptionKey]: paymentInput.description
|
|
26564
|
+
},
|
|
26565
|
+
...paymentInput.placeholder && {
|
|
26566
|
+
[PlaceholderKey]: paymentInput.placeholder
|
|
26567
|
+
}
|
|
26568
|
+
};
|
|
26569
|
+
}
|
|
26513
26570
|
function makeOptionView(option) {
|
|
26514
26571
|
return {
|
|
26515
26572
|
[LabelKey]: option.label,
|
|
@@ -29535,7 +29592,7 @@ var FormRoot2 = ({
|
|
|
29535
29592
|
React32__default.createElement(
|
|
29536
29593
|
"div",
|
|
29537
29594
|
{ "data-hook": DATA_HOOKS.FORM_ROOT },
|
|
29538
|
-
React32__default.createElement(Form, { form: currentView, values: normalizedValues, onFieldChange, errors, dataHook: DATA_HOOKS.FORM_ROOT }),
|
|
29595
|
+
React32__default.createElement(Form, { formSchema: formWithOverrides, form: currentView, values: normalizedValues, onFieldChange, errors, dataHook: DATA_HOOKS.FORM_ROOT }),
|
|
29539
29596
|
React32__default.createElement(StepTitleA11y, { total: formWithOverrides.steps?.length, index: currentStep }),
|
|
29540
29597
|
React32__default.createElement(SubmitStatusMessage, null)
|
|
29541
29598
|
)
|