@wix/form-elements 1.82.0 → 1.83.0

package/dist/component/{dext-tags-rac-CvNjwS5R.js → dext-tags-rac-C_R89noV.js}

@@ -1,6 +1,6 @@
 import r from "react";
-import { ai as e, h as o } from "./form-f0tqdMye.js";
-import { T as s } from "./tags-field-rac-ByC9DnyH.js";
+import { ai as e, h as o } from "./form-D0eeH0lX.js";
+import { T as s } from "./tags-field-rac-DXmZBcpO.js";
 import { b as a } from "./default-limits-D7qVv_Hv.js";
 const l = () => {
   const t = {

package/dist/component/{dext-text-area-rac-X5L0Q3sC.js → dext-text-area-rac-DRpYeQ-K.js}

@@ -1,5 +1,5 @@
 import e from "react";
-import { T as t } from "./text-area-field-rac-CtSa8XW_.js";
+import { T as t } from "./text-area-field-rac-Cy0Mr29Z.js";
 const a = () => /* @__PURE__ */ e.createElement(t, null);
 export {
   a as DextTextAreaRAC

package/dist/component/{dext-text-input-rac-swkyAJqC.js → dext-text-input-rac-D_RtbQQ-.js}

@@ -1,5 +1,5 @@
 import t from "react";
-import { T as e } from "./text-input-field-rac-C6fQYKhI.js";
+import { T as e } from "./text-input-field-rac-D1TB9B_M.js";
 const o = () => /* @__PURE__ */ t.createElement(e, null);
 export {
   o as DextTextInputRAC

package/dist/component/{dext-url-input-rac-BYlXOAkz.js → dext-url-input-rac-BSSjSbIo.js}

@@ -1,5 +1,5 @@
 import t from "react";
-import { U as r } from "./url-input-field-rac-4T8gcMHH.js";
+import { U as r } from "./url-input-field-rac-DINXfZdf.js";
 const n = () => /* @__PURE__ */ t.createElement(r, null);
 export {
   n as DextUrlInputRAC

package/dist/component/{donation-rac-CDWLBZZM.js → donation-rac-De0KyyGR.js}

@@ -1,30 +1,31 @@
-import n, { useMemo as x, useCallback as S, useRef as oe } from "react";
+import n, { useMemo as x, useCallback as F, useRef as oe } from "react";
 import { RicosViewer as re } from "@wix/ricos/viewer";
-import g from "classnames";
+import D from "classnames";
 import { RadioGroup as se, RadioField as G, RadioButton as Y, TextField as ae, Group as le, Input as ie } from "react-aria-components";
 import { debounce as ce } from "ts-debounce";
-import { P as Q, ai as v, af as B, as as ue, ab as A, ak as me } from "./form-f0tqdMye.js";
+import { P as Q, ai as L, af as B, as as ue, ab as A, ak as me } from "./form-D0eeH0lX.js";
 import { f, a as y } from "./find-child-C60k4CxG.js";
 import { a as W } from "./format-currency-BwShJ9vM.js";
-import { D as pe, E as de } from "./field-error-headless-BErhh9GG.js";
-import { L as Ie } from "./field-label-headless-BGyK-5xW.js";
-import { N as Ce } from "./options-layout-constants-DEfIEJWD.js";
+import { D as pe, E as de } from "./field-error-headless-DAy-1oAQ.js";
+import { L as Ce } from "./field-label-headless-BWxHmO0c.js";
+import { N as Ie } from "./options-layout-constants-DEfIEJWD.js";
 import { a as Ee, b as fe } from "./numeric-input-utils-CuBMi4-a.js";
 import { g as Oe } from "./payment-field-utils-DobiK5Xh.js";
 import { u as he } from "./use-synced-display-value-DcAxdn3M.js";
 import { E as _e } from "./error-icon-hZxQ6DEy.js";
-import { s as D } from "./field-rac.module-ColNPUt0.js";
-import { y as be, O as ye, j as Ne, x as Fe, o as ge, i as De, k as Se } from "./form-element-classes-jC8D0LnK.js";
-import { o as Le } from "./options-rac.module-KM-VT_KY.js";
-import { u as Re } from "./use-element-state-class-name-BqmaTba3.js";
-function ve(e, t) {
+import { s as S } from "./field-rac.module-D06m9T9x.js";
+import { y as be, O as ye, j as Ne, o as ge, i as Fe, k as De } from "./form-element-classes-Ct1UaxuQ.js";
+import { o as Se } from "./options-rac.module-KM-VT_KY.js";
+import { u as Re } from "./use-element-state-class-name-j8W1zbdG.js";
+import { u as ve } from "./use-text-input-class-name-8gMUWeCb.js";
+function Le(e, t) {
   return e.reduce((o, r) => (o[r[t]] = r, o), {});
 }
 function Ae(e) {
-  return ve(e, "id");
+  return Le(e, "id");
 }
 const je = 0.01;
-function Me(e) {
+function Te(e) {
   var t;
   return ((t = e == null ? void 0 : e.fixedPriceOptions) == null ? void 0 : t.price) || "0";
 }
@@ -36,41 +37,41 @@ function z(e, t) {
     quantity: 1
   };
 }
-function Pe(e) {
+function Me(e) {
   return e.find((t) => t.priceType === Q.DYNAMIC_PRICE);
 }
-function Te(e, t) {
+function Pe(e, t) {
   return (e == null ? void 0 : e.productId) === (t == null ? void 0 : t.id) ? String((e == null ? void 0 : e.price) ?? "") : "";
 }
 function xe(e, t, o) {
   const r = (t == null ? void 0 : t.productId) === e ? void 0 : e, a = r ? o[r] : void 0;
   return a ? [
-    z(a, Me(a))
+    z(a, Te(a))
   ] : [];
 }
 const s = ({ children: e }) => {
-  const { id: t, value: o, onChange: r, disabled: a, required: m, onBlur: p, onFocus: h, validation: c, addOther: u, addOtherPlaceholder: i, FieldLayout: I, hasError: O } = v(), { labelId: _ } = B(), { t: C } = ue(), { currency: j, regionalFormat: N } = A(), d = o == null ? void 0 : o[0], F = x(() => {
-    var E, T;
-    return ((T = (E = c == null ? void 0 : c.predefined) == null ? void 0 : E.paymentOptions) == null ? void 0 : T.products) || [];
+  const { id: t, value: o, onChange: r, disabled: a, required: m, onBlur: p, onFocus: h, validation: c, addOther: u, addOtherPlaceholder: i, FieldLayout: C, hasError: O } = L(), { labelId: _ } = B(), { t: I } = ue(), { currency: j, regionalFormat: N } = A(), d = o == null ? void 0 : o[0], g = x(() => {
+    var E, P;
+    return ((P = (E = c == null ? void 0 : c.predefined) == null ? void 0 : E.paymentOptions) == null ? void 0 : P.products) || [];
   }, [
     c
-  ]), M = x(() => Ae(F), [
-    F
-  ]), l = x(() => u ? Pe(F) : void 0, [
-    F,
+  ]), T = x(() => Ae(g), [
+    g
+  ]), l = x(() => u ? Me(g) : void 0, [
+    g,
     u
-  ]), J = Te(d, l), [U, P] = he({
+  ]), J = Pe(d, l), [k, M] = he({
     sourceValue: J,
     format: (E) => fe(String(E ?? ""), N),
     regionalFormat: N
-  }), k = S((E) => {
-    r(xe(E, d, M)), P("");
+  }), q = F((E) => {
+    r(xe(E, d, T)), M("");
   }, [
     r,
-    M,
+    T,
     d,
-    P
-  ]), H = S((E) => {
+    M
+  ]), H = F((E) => {
     l && r(typeof E == "number" ? [
       z(l, String(E))
     ] : []);
@@ -79,52 +80,52 @@ const s = ({ children: e }) => {
     l
   ]), $ = x(() => ce(H, 500), [
     H
-  ]), K = S((E) => {
+  ]), K = F((E) => {
     (d == null ? void 0 : d.productId) !== (l == null ? void 0 : l.id) && r(void 0);
-    const { validInput: T, validNumber: ne } = Ee(E.target.value, je, U, N);
-    P(T), $(ne);
+    const { validInput: P, validNumber: ne } = Ee(E.target.value, je, k, N);
+    M(P), $(ne);
   }, [
     N,
     r,
     d,
     l,
-    U,
+    k,
     $,
-    P
-  ]), q = (d == null ? void 0 : d.productId) || null, X = S(() => {
-    l != null && l.id && q !== l.id && k(l.id);
+    M
+  ]), w = (d == null ? void 0 : d.productId) || null, X = F(() => {
+    l != null && l.id && w !== l.id && q(l.id);
   }, [
     l == null ? void 0 : l.id,
-    q,
-    k
+    w,
+    q
   ]), Z = f(e, s.Label), V = f(e, s.Control), ee = f(e, s.Description), te = f(e, s.Error);
-  return /* @__PURE__ */ n.createElement(I, {
+  return /* @__PURE__ */ n.createElement(C, {
     fieldId: t,
     renderLabel: () => Z,
     renderInput: () => /* @__PURE__ */ n.createElement(se, {
       "aria-labelledby": _,
-      value: q,
-      onChange: k,
+      value: w,
+      onChange: q,
       isDisabled: a,
       isInvalid: O,
       isRequired: m,
       onBlur: p,
       onFocus: h
     }, V ? y(V, {
-      productsById: M,
+      productsById: T,
       addOther: u,
-      customAmount: U,
+      customAmount: k,
       onCustomAmountInputChange: K,
       currency: j,
-      t: C,
-      placeholder: i === void 0 ? C("donation.other-option.placeholder") : i,
+      t: I,
+      placeholder: i === void 0 ? I("donation.other-option.placeholder") : i,
       customAmountProductId: l == null ? void 0 : l.id,
       onFocusCustomInput: X
     }) : null),
     renderDescription: () => /* @__PURE__ */ n.createElement(n.Fragment, null, te, ee)
   });
 }, Be = ({ children: e, className: t, ...o }) => {
-  const { productsById: r, addOther: a, customAmount: m, onCustomAmountInputChange: p, currency: h, t: c, placeholder: u, customAmountProductId: i, onFocusCustomInput: I } = o, { hasError: O } = v(), _ = f(e, s.Options), C = f(e, s.OtherInput);
+  const { productsById: r, addOther: a, customAmount: m, onCustomAmountInputChange: p, currency: h, t: c, placeholder: u, customAmountProductId: i, onFocusCustomInput: C } = o, { hasError: O } = L(), _ = f(e, s.Options), I = f(e, s.OtherInput);
   return /* @__PURE__ */ n.createElement("div", {
     className: t,
     "data-invalid": O
@@ -145,38 +146,38 @@ const s = ({ children: e }) => {
     }
   }, /* @__PURE__ */ n.createElement(Y, {
     "aria-label": c("donation.other-option.label", "Custom amount")
-  }, c("donation.other-option.label", "Custom amount"))), C && a ? y(C, {
+  }, c("donation.other-option.label", "Custom amount"))), I && a ? y(I, {
     customAmount: m,
     onCustomAmountInputChange: p,
     currency: h,
     t: c,
     placeholder: u,
     customAmountProductId: i,
-    onFocusCustomInput: I
+    onFocusCustomInput: C
   }) : null);
-}, w = ({ children: e, className: t, ...o }) => {
-  const { productsById: r } = o, { options: a, numberOfColumns: m } = v(), { isMobile: p } = A(), h = f(e, w.Option), c = p ? Ce.ONE : m;
+}, U = ({ children: e, className: t, ...o }) => {
+  const { productsById: r } = o, { options: a, numberOfColumns: m } = L(), { isMobile: p } = A(), h = f(e, U.Option), c = p ? Ie.ONE : m;
   return /* @__PURE__ */ n.createElement("div", {
     className: t,
     "data-columns": c
   }, a.map((u) => {
     var O;
-    const i = r[u.value], I = (O = i == null ? void 0 : i.fixedPriceOptions) == null ? void 0 : O.price;
+    const i = r[u.value], C = (O = i == null ? void 0 : i.fixedPriceOptions) == null ? void 0 : O.price;
     return y(h, {
       key: u.value,
       value: u.value,
-      price: I || "0"
+      price: C || "0"
     });
   }));
-}, L = ({ children: e, className: t, ...o }) => {
-  const { value: r, price: a } = o, { id: m } = v(), { currency: p, regionalFormat: h } = A(), c = f(e, L.Value), u = f(e, L.Currency), { isCurrencyPrefixed: i } = W({
+}, R = ({ children: e, className: t, ...o }) => {
+  const { value: r, price: a } = o, { id: m } = L(), { currency: p, regionalFormat: h } = A(), c = f(e, R.Value), u = f(e, R.Currency), { isCurrencyPrefixed: i } = W({
     amount: a,
     currency: p == null ? void 0 : p.code,
     locale: h
-  }), I = oe(null);
+  }), C = oe(null);
   me(() => {
-    var _, C;
-    (C = (_ = I.current) == null ? void 0 : _.querySelector("input")) == null || C.focus();
+    var _, I;
+    (I = (_ = C.current) == null ? void 0 : _.querySelector("input")) == null || I.focus();
   }, m);
   const O = c ? y(c, {
     price: a
@@ -185,9 +186,9 @@ const s = ({ children: e }) => {
     value: r
   }, /* @__PURE__ */ n.createElement(Y, {
     className: t,
-    ref: I
+    ref: C
   }, /* @__PURE__ */ n.createElement(n.Fragment, null, i && u, O, !i && u)));
-}, Ue = ({ className: e, ...t }) => {
+}, ke = ({ className: e, ...t }) => {
   const { price: o } = t, { currency: r, regionalFormat: a } = A(), { value: m } = W({
     amount: o,
     currency: r == null ? void 0 : r.code,
@@ -196,24 +197,24 @@ const s = ({ children: e }) => {
   return /* @__PURE__ */ n.createElement("span", {
     className: e
   }, m);
-}, ke = ({ className: e }) => {
+}, qe = ({ className: e }) => {
   const { currency: t } = A();
   return /* @__PURE__ */ n.createElement("span", {
     className: e
   }, (t == null ? void 0 : t.sign) || (t == null ? void 0 : t.code) || "");
 };
-L.Value = Ue;
-L.Currency = ke;
-const R = ({ children: e, className: t, ...o }) => {
-  const { customAmount: r, onCustomAmountInputChange: a, currency: m, t: p, placeholder: h, customAmountProductId: c, onFocusCustomInput: u } = o, { disabled: i, hasError: I } = v(), { labelId: O, prefixId: _ } = B(), C = f(e, R.Currency), j = f(e, R.Value), N = S((F) => {
+R.Value = ke;
+R.Currency = qe;
+const v = ({ children: e, className: t, ...o }) => {
+  const { customAmount: r, onCustomAmountInputChange: a, currency: m, t: p, placeholder: h, customAmountProductId: c, onFocusCustomInput: u } = o, { disabled: i, hasError: C } = L(), { labelId: O, prefixId: _ } = B(), I = f(e, v.Currency), j = f(e, v.Value), N = F((g) => {
     a({
       target: {
-        value: F
+        value: g
       }
     });
   }, [
     a
-  ]), d = S(() => {
+  ]), d = F(() => {
     u();
   }, [
     u
@@ -224,19 +225,19 @@ const R = ({ children: e, className: t, ...o }) => {
     onChange: N,
     onFocus: d,
     isDisabled: i,
-    isInvalid: I
+    isInvalid: C
   }, /* @__PURE__ */ n.createElement(le, {
     className: t,
     isDisabled: i,
-    isInvalid: I
-  }, r && m && C ? y(C, {
+    isInvalid: C
+  }, r && m && I ? y(I, {
     currency: m,
     t: p
   }) : null, j ? y(j, {
     placeholder: h,
     customAmountProductId: c
   }) : null));
-}, qe = ({ className: e, ...t }) => {
+}, we = ({ className: e, ...t }) => {
   const { currency: o, t: r } = t, { prefixId: a } = B();
   return /* @__PURE__ */ n.createElement("span", {
     id: a,
@@ -244,7 +245,7 @@ const R = ({ children: e, className: t, ...o }) => {
     "aria-label": Oe(r, o),
     className: e
   }, (o == null ? void 0 : o.sign) || (o == null ? void 0 : o.code) || "");
-}, we = ({ className: e, ...t }) => {
+}, Ue = ({ className: e, ...t }) => {
   const { placeholder: o, customAmountProductId: r } = t, { ariaDescribedBy: a, labelId: m, prefixId: p } = B();
   return /* @__PURE__ */ n.createElement(ie, {
     id: r,
@@ -256,13 +257,13 @@ const R = ({ children: e, className: t, ...o }) => {
     className: e
   });
 };
-R.Currency = qe;
-R.Value = we;
-w.Option = L;
-s.Label = Ie;
+v.Currency = we;
+v.Value = Ue;
+U.Option = R;
+s.Label = Ce;
 s.Control = Be;
-s.Options = w;
-s.OtherInput = R;
+s.Options = U;
+s.OtherInput = v;
 s.Description = pe;
 s.Error = de;
 const He = "_control_1jl2j_1", $e = "_options_1jl2j_7", Ve = "_option_1jl2j_7", Ge = "_optionHover_1jl2j_43", Ye = "_optionSelected_1jl2j_43", Qe = "_optionCurrency_1jl2j_93", We = "_otherInput_1jl2j_97", ze = "_otherInputCurrency_1jl2j_116", b = {
@@ -282,37 +283,37 @@ const He = "_control_1jl2j_1", $e = "_options_1jl2j_7", Ve = "_option_1jl2j_7",
   selected: b.optionSelected,
   hover: b.optionHover
 }, Xe = () => {
-  const e = Re({
-    globalClasses: Se,
+  const e = ve(b.otherInput), t = Re({
+    globalClasses: De,
     moduleClasses: Ke
   });
   return /* @__PURE__ */ n.createElement(s, null, /* @__PURE__ */ n.createElement(s.Label, {
-    className: g(be, D.label)
+    className: D(be, S.label)
   }, /* @__PURE__ */ n.createElement(s.Label.Required, {
-    className: g(ye, D.requiredMark)
+    className: D(ye, S.requiredMark)
   })), /* @__PURE__ */ n.createElement(s.Control, {
     className: b.control
   }, /* @__PURE__ */ n.createElement(s.Options, {
-    className: g(Ne, Le.options, b.options)
+    className: D(Ne, Se.options, b.options)
   }, /* @__PURE__ */ n.createElement(s.Options.Option, {
-    className: ({ isSelected: t, isHovered: o }) => e({
-      isSelected: t,
-      isHovered: o
+    className: ({ isSelected: o, isHovered: r }) => t({
+      isSelected: o,
+      isHovered: r
     })
   }, /* @__PURE__ */ n.createElement(s.Options.Option.Value, null), /* @__PURE__ */ n.createElement(s.Options.Option.Currency, {
     className: b.optionCurrency
   }))), /* @__PURE__ */ n.createElement(s.OtherInput, {
-    className: g(Fe, D.input, b.otherInput)
+    className: e
   }, /* @__PURE__ */ n.createElement(s.OtherInput.Currency, {
     className: b.otherInputCurrency
   }), /* @__PURE__ */ n.createElement(s.OtherInput.Value, {
-    className: D.innerInput
+    className: S.innerInput
   }))), /* @__PURE__ */ n.createElement(s.Error, {
-    className: g(ge, D.error)
+    className: D(ge, S.error)
   }, /* @__PURE__ */ n.createElement(_e, null), /* @__PURE__ */ n.createElement(s.Error.Text, null)), /* @__PURE__ */ n.createElement(s.Description, {
-    className: g(De, D.description)
+    className: D(Fe, S.description)
   }, Je));
-}, Ot = () => /* @__PURE__ */ n.createElement(Xe, null);
+}, ht = () => /* @__PURE__ */ n.createElement(Xe, null);
 export {
-  Ot as DonationRAC
+  ht as DonationRAC
 };

package/dist/component/{dropdown-field-headless-JJzbZvps.js → dropdown-field-headless-DNhnTDlD.js}

@@ -1,10 +1,10 @@
 import e, { useState as E, useCallback as g, useRef as q } from "react";
 import { UNSAFE_PortalProvider as A } from "react-aria";
 import { Select as w, SelectValue as M, ListBox as U, ListBoxItem as _ } from "react-aria-components";
-import { ai as p, af as b, ak as j } from "./form-f0tqdMye.js";
+import { ai as p, af as b, ak as j } from "./form-D0eeH0lX.js";
 import { f as d, a as z } from "./find-child-C60k4CxG.js";
-import { D as G, E as H } from "./field-error-headless-BErhh9GG.js";
-import { L as J } from "./field-label-headless-BGyK-5xW.js";
+import { D as G, E as H } from "./field-error-headless-DAy-1oAQ.js";
+import { L as J } from "./field-label-headless-BWxHmO0c.js";
 import { S as K, N as Q } from "./non-modal-popover-DtIMXHbe.js";
 const n = ({ children: t }) => {
   const { id: o, value: r, defaultValue: l, options: a = [], readOnly: s, onChange: u, placeholder: m, disabled: i, required: v, onBlur: O, onFocus: y, FieldLayout: F, hasError: C } = p(), [D, L] = E(!1), [h, I] = E(null), B = r && a.some((c) => (c.value ?? c.label) === r) ? r : l || null, { labelId: N } = b(), P = g((c) => {

package/dist/component/{dropdown-field-rac-BodpIQ9Q.js → dropdown-field-rac-Bq_FNv9a.js}

@@ -1,12 +1,12 @@
 import { RicosViewer as m } from "@wix/ricos/viewer";
 import t from "classnames";
 import e from "react";
-import { D as o } from "./dropdown-field-headless-JJzbZvps.js";
+import { D as o } from "./dropdown-field-headless-DNhnTDlD.js";
 import { C as n } from "./chevron-down-icon-CcpVm6B-.js";
 import { E as l } from "./error-icon-hZxQ6DEy.js";
 import { H as c } from "./custom-focus-class-_483Pkwp.js";
-import { s as r } from "./field-rac.module-ColNPUt0.js";
-import { y as i, O as E, x as p, A as _, o as S, i as O } from "./form-element-classes-jC8D0LnK.js";
+import { s as r } from "./field-rac.module-D06m9T9x.js";
+import { y as i, O as E, x as p, A as _, o as S, i as O } from "./form-element-classes-Ct1UaxuQ.js";
 const R = ({ content: a, locale: s }) => /* @__PURE__ */ e.createElement(m, {
   content: a,
   locale: s

package/dist/component/{dropdown-rac-Bfbxxx9k.js → dropdown-rac-0UIyqF15.js}

@@ -1,5 +1,5 @@
 import o from "react";
-import { D as r } from "./dropdown-field-rac-BodpIQ9Q.js";
+import { D as r } from "./dropdown-field-rac-Bq_FNv9a.js";
 const n = () => /* @__PURE__ */ o.createElement(r, null);
 export {
   n as DropdownRAC

package/dist/component/{ecom-address-rac-BCnsL5tr.js → ecom-address-rac-7IVbvs3J.js}

@@ -1,5 +1,5 @@
 import e from "react";
-import { M as r } from "./multiline-address-field-rac-fcQYnPlO.js";
+import { M as r } from "./multiline-address-field-rac-Avd9Vlv1.js";
 const l = () => /* @__PURE__ */ e.createElement(r, null);
 export {
   l as EcomAddressRAC

package/dist/component/{ecom-subscription-checkbox-rac-CNSdI_ty.js → ecom-subscription-checkbox-rac-DilgIpiG.js}

@@ -1,7 +1,7 @@
 import o, { useMemo as a } from "react";
-import { ai as n, as as c, h as i } from "./form-f0tqdMye.js";
-import { C } from "./checkbox-field-rac-BnVNfYWL.js";
-import { m as l, n as m, l as p } from "./form-element-classes-jC8D0LnK.js";
+import { ai as n, as as c, h as i } from "./form-D0eeH0lX.js";
+import { C } from "./checkbox-field-rac-CMEI5t4Y.js";
+import { m as l, n as m, l as p } from "./form-element-classes-Ct1UaxuQ.js";
 const _ = (e) => ({
   nodes: [
     {