@wix/form-public 0.483.0 → 0.485.0

package/dist/index.js

@@ -51761,10 +51761,11 @@ var Options = ({ children, className }) => {
     isOther: true
   }));
 };
-var OptionInput = ({ className }) => {
+var OptionInput = ({ className, ...internal }) => {
+  const renderProps = internal;
   return /* @__PURE__ */ React171.createElement("div", {
     "aria-hidden": "true",
-    className
+    className: typeof className === "function" ? className(renderProps) : className
   });
 };
 var OptionLabel = ({ className, ...internal }) => {
@@ -51829,9 +51830,12 @@ var Checkbox2 = ({ children, className, ...internal }) => {
     ref: checkboxRef,
     className,
     "data-hook": `checkbox-${label}`
-  }, inputElement, applyInternalProps(labelElement, {
+  }, ({ isSelected, isHovered }) => /* @__PURE__ */ React171.createElement(React171.Fragment, null, applyInternalProps(inputElement, {
+    isSelected,
+    isHovered
+  }), applyInternalProps(labelElement, {
     label
-  })));
+  }))));
 };
 Checkbox2.Label = OptionLabel;
 Checkbox2.Input = OptionInput;
@@ -54944,11 +54948,23 @@ var Control3 = ({ children, className, ...internal }) => {
     className,
     "data-invalid": hasError
   }, optionsElement ? applyInternalProps(optionsElement, {
-    productsById,
-    addOther,
-    customAmountProductId,
-    t
-  }) : null, otherInputElement && addOther ? applyInternalProps(otherInputElement, {
+    productsById
+  }) : null, addOther && customAmountProductId && /* @__PURE__ */ React171.createElement(RadioField, {
+    value: customAmountProductId,
+    style: {
+      position: "absolute",
+      width: "1px",
+      height: "1px",
+      padding: "0",
+      margin: "-1px",
+      overflow: "hidden",
+      clip: "rect(0, 0, 0, 0)",
+      whiteSpace: "nowrap",
+      border: "0"
+    }
+  }, /* @__PURE__ */ React171.createElement(RadioButton, {
+    "aria-label": t("donation.other-option.label", "Custom amount")
+  }, t("donation.other-option.label", "Custom amount"))), otherInputElement && addOther ? applyInternalProps(otherInputElement, {
     customAmount,
     onCustomAmountInputChange,
     currency,
@@ -54959,7 +54975,7 @@ var Control3 = ({ children, className, ...internal }) => {
   }) : null);
 };
 var Options2 = ({ children, className, ...internal }) => {
-  const { productsById, addOther, customAmountProductId, t } = internal;
+  const { productsById } = internal;
   const { options, numberOfColumns } = useFieldPropsV2();
   const { isMobile: isMobile2 } = useConfig();
   const optionElement = findChildOfType(children, Options2.Option);
@@ -54975,22 +54991,7 @@ var Options2 = ({ children, className, ...internal }) => {
       value: option2.value,
       price: price || "0"
     });
-  }), addOther && customAmountProductId && /* @__PURE__ */ React171.createElement(RadioField, {
-    value: customAmountProductId,
-    style: {
-      position: "absolute",
-      width: "1px",
-      height: "1px",
-      padding: "0",
-      margin: "-1px",
-      overflow: "hidden",
-      clip: "rect(0, 0, 0, 0)",
-      whiteSpace: "nowrap",
-      border: "0"
-    }
-  }, /* @__PURE__ */ React171.createElement(RadioButton, {
-    "aria-label": t("donation.other-option.label", "Custom amount")
-  }, t("donation.other-option.label", "Custom amount"))));
+  }));
 };
 var Option2 = ({ children, className, ...internal }) => {
   const { value, price } = internal;
@@ -55058,23 +55059,24 @@ var OtherInput2 = ({ children, className, ...internal }) => {
   }, [
     onFocusCustomInput
   ]);
-  const hasValue = customAmount && customAmount.trim() !== "";
   return /* @__PURE__ */ React171.createElement(TextField, {
     "aria-labelledby": `${labelId} ${prefixId}`,
     value: customAmount,
     onChange: handleChange,
     onFocus: handleFocus,
     isDisabled: disabled,
-    isInvalid: hasError,
+    isInvalid: hasError
+  }, /* @__PURE__ */ React171.createElement(Group, {
     className,
-    "data-selected": hasValue ? "true" : void 0
+    isDisabled: disabled,
+    isInvalid: hasError
   }, customAmount && currency && currencyElement ? applyInternalProps(currencyElement, {
     currency,
     t
   }) : null, valueElement ? applyInternalProps(valueElement, {
     placeholder,
     customAmountProductId
-  }) : null);
+  }) : null));
 };
 var OtherInputCurrency = ({ className, ...internal }) => {
   const { currency, t } = internal;