@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.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(FormField, {
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((elements, index) => {
24830
- var _elements$;
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] = [element];
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
  )