@wix/form-elements 1.80.0 → 1.81.0

package/dist/component/{phone-input-field-rac-CqYNWmiA.js → phone-input-field-rac-Ce_wuE46.js}

@@ -1,30 +1,30 @@
 import { RicosViewer as ye } from "@wix/ricos/viewer";
 import b from "classnames";
-import t, { useMemo as B, useState as V, useRef as P, useEffect as w, useCallback as j, createContext as te, useContext as q } from "react";
-import { a2 as Ee, as as v, ab as ne, ar as fe, ai as M, af as oe, ak as he } from "./form-BmioUKtQ.js";
+import t, { useMemo as B, useState as V, useRef as v, useEffect as w, useCallback as j, createContext as te, useContext as q } from "react";
+import { a2 as Ee, as as P, ab as ne, ar as fe, ai as M, af as oe, ak as he } from "./form-f0tqdMye.js";
 import { UNSAFE_PortalProvider as ge } from "react-aria";
-import { Dialog as re, OverlayTriggerStateContext as be, ModalOverlay as _e, Modal as Ne, SearchField as Oe, ListBoxItem as Se, Group as Q, DialogTrigger as Le, Select as Ie, Input as ae, ListBox as Pe, Autocomplete as ve } from "react-aria-components";
+import { Dialog as re, OverlayTriggerStateContext as be, ModalOverlay as _e, Modal as Ne, SearchField as Oe, ListBoxItem as Se, Group as Q, DialogTrigger as Le, Select as Ie, Input as ae, ListBox as ve, Autocomplete as Pe } from "react-aria-components";
 import { f as h, a as ce } from "./find-child-C60k4CxG.js";
-import { D as Fe, E as De } from "./field-error-headless-C7IUibkK.js";
-import { L as Re } from "./field-label-headless-BQFy2iAr.js";
-import { N as xe, S as Be } from "./non-modal-popover-DtIMXHbe.js";
+import { D as Fe, E as De } from "./field-error-headless-BErhh9GG.js";
+import { L as xe } from "./field-label-headless-BGyK-5xW.js";
+import { N as Re, S as Be } from "./non-modal-popover-DtIMXHbe.js";
 import { u as Me } from "./use-invoke-callback-UH73A_J3.js";
-import se, { AsYouType as $e, isValidPhoneNumber as Ae, isSupportedCountry as Te } from "libphonenumber-js";
+import se, { AsYouType as Ae, isValidPhoneNumber as $e, isSupportedCountry as Te } from "libphonenumber-js";
 import "libphonenumber-js/metadata.min.json";
 import { C as W } from "./calling-country-codes-PyWuOTmF.js";
 import { C as we } from "./chevron-down-icon-CcpVm6B-.js";
 import { E as Ue } from "./error-icon-hZxQ6DEy.js";
 import { H as J } from "./custom-focus-class-_483Pkwp.js";
 import { s as _ } from "./field-rac.module-ColNPUt0.js";
-import { z as ke, P as Ve, y as qe, B as ze, p as Ge, i as He } from "./form-element-classes-BuM-vthE.js";
+import { y as ke, O as Ve, x as qe, A as Ge, o as He, i as Ye } from "./form-element-classes-jC8D0LnK.js";
 function X(e) {
   const n = e ? se(e) : void 0, r = n == null ? void 0 : n.country;
   if (r)
     return r;
-  const o = new $e();
+  const o = new Ae();
   return e && o.input(e), o.getCountry();
 }
-function z(e) {
+function G(e) {
   var n;
   return e && ((n = Ee.getCountryByKey(e)) == null ? void 0 : n.dialCode);
 }
@@ -35,16 +35,16 @@ function ee(e, n) {
   if (e && n)
     try {
       const r = se(e, n), o = r == null ? void 0 : r.formatInternational();
-      if (o && Ae(o))
+      if (o && $e(o))
         return o.replace(/\s+/g, "");
     } catch {
     }
   return e;
 }
-function Ye() {
-  const { t: e } = v(), { language: n } = ne();
+function ze() {
+  const { t: e } = P(), { language: n } = ne();
   return B(() => Object.keys(W).reduce((o, a) => {
-    const c = W[a], l = z(c), u = e(`locale-dataset.countries.${c.toUpperCase()}`);
+    const c = W[a], l = G(c), u = e(`locale-dataset.countries.${c.toUpperCase()}`);
     return l && Te(a) && o.push({
       countryName: u,
       longCountryCode: c,
@@ -67,7 +67,7 @@ function k(e, n) {
   return e.toLowerCase().includes(n.toLowerCase());
 }
 function je({ value: e, defaultCountryCode: n, allowedCountryCodes: r, onChange: o }) {
-  const [a, c] = V(e || ""), l = P(U(e ?? null) ?? ""), [u, i] = V(n);
+  const [a, c] = V(e || ""), l = v(U(e ?? null) ?? ""), [u, i] = V(n);
   fe(() => {
     c(""), l.current = "", i(n), o("");
   });
@@ -123,12 +123,12 @@ const le = /* @__PURE__ */ te(null), N = () => {
   if (!e)
     throw new Error("Phone input components must be used within PhoneInput component");
   return e;
-}, ue = /* @__PURE__ */ te(null), G = () => {
+}, ue = /* @__PURE__ */ te(null), H = () => {
   const e = q(ue);
   if (!e)
     throw new Error("Option sub-components must be used within Option component");
   return e;
-}, H = ({ longCountryCode: e, className: n }) => {
+}, Y = ({ longCountryCode: e, className: n }) => {
   function r(c, l) {
     const u = "https://static.parastorage.com/services/linguist-flags/1.1005.0/assets/flags/square/", m = `${c}${l === "2x" ? "_2x" : ""}.png`;
     return `${u}${m}`;
@@ -144,17 +144,17 @@ const le = /* @__PURE__ */ te(null), N = () => {
   });
 }, s = ({ children: e }) => {
   var I, L;
-  const { id: n, value: r, onChange: o, FieldLayout: a, defaultCountry: c, validation: l } = M(), [u, i] = V(null), m = (L = (I = l == null ? void 0 : l.string) == null ? void 0 : I.phoneOptions) == null ? void 0 : L.allowedCountryCodes, C = Ye(), p = B(() => Ke(C, m), [
+  const { id: n, value: r, onChange: o, FieldLayout: a, defaultCountry: c, validation: l } = M(), [u, i] = V(null), m = (L = (I = l == null ? void 0 : l.string) == null ? void 0 : I.phoneOptions) == null ? void 0 : L.allowedCountryCodes, C = ze(), p = B(() => Ke(C, m), [
     C,
     m
-  ]), d = B(() => p.map((x) => x.shortCountryCode), [
+  ]), d = B(() => p.map((R) => R.shortCountryCode), [
     p
   ]), { currentValue: f, selectedCountryCode: y, handlePhoneChange: O, handleCountryCodeChange: S } = je({
     value: r,
     defaultCountryCode: c,
     allowedCountryCodes: d,
     onChange: o
-  }), A = h(e, s.Label), F = h(e, s.Control), T = h(e, s.Description), D = h(e, s.Error), R = {
+  }), $ = h(e, s.Label), F = h(e, s.Control), T = h(e, s.Description), D = h(e, s.Error), x = {
     currentValue: f,
     selectedCountryCode: y,
     handlePhoneChange: O,
@@ -164,10 +164,10 @@ const le = /* @__PURE__ */ te(null), N = () => {
     popoverContainer: u
   };
   return /* @__PURE__ */ t.createElement(le.Provider, {
-    value: R
+    value: x
   }, /* @__PURE__ */ t.createElement(a, {
     fieldId: n,
-    renderLabel: () => A,
+    renderLabel: () => $,
     renderInput: () => /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement("div", {
       ref: i,
       style: {
@@ -176,8 +176,8 @@ const le = /* @__PURE__ */ te(null), N = () => {
     }), F),
     renderDescription: () => /* @__PURE__ */ t.createElement(t.Fragment, null, D, T)
   }));
-}, Y = ({ children: e, className: n }) => {
-  const { inputId: r, labelId: o } = oe(), { hasError: a, disabled: c, readOnly: l } = M(), { t: u } = v(), { selectedCountryCode: i, countries: m } = N(), C = `${r}-country`, p = i ? m.find((O) => O.shortCountryCode === i) : void 0, d = p && z(p.longCountryCode) || "", f = u("field.phone.country-code.aria-label"), y = p ? `${f}, ${p.countryName}, ${d}` : f;
+}, z = ({ children: e, className: n }) => {
+  const { inputId: r, labelId: o } = oe(), { hasError: a, disabled: c, readOnly: l } = M(), { t: u } = P(), { selectedCountryCode: i, countries: m } = N(), C = `${r}-country`, p = i ? m.find((O) => O.shortCountryCode === i) : void 0, d = p && G(p.longCountryCode) || "", f = u("field.phone.country-code.aria-label"), y = p ? `${f}, ${p.countryName}, ${d}` : f;
   return /* @__PURE__ */ t.createElement(Be, {
     isDisabled: c || l,
     id: C,
@@ -188,7 +188,7 @@ const le = /* @__PURE__ */ te(null), N = () => {
   }, e);
 }, Qe = ({ className: e }) => {
   const { selectedCountryCode: n, countries: r } = N(), o = r.find((a) => a.shortCountryCode === n);
-  return o ? /* @__PURE__ */ t.createElement(H, {
+  return o ? /* @__PURE__ */ t.createElement(Y, {
     className: e,
     longCountryCode: o.longCountryCode
   }) : null;
@@ -198,13 +198,13 @@ const le = /* @__PURE__ */ te(null), N = () => {
     className: n
   }, e);
 };
-Y.Flag = Qe;
-Y.EmptyState = We;
+z.Flag = Qe;
+z.EmptyState = We;
 const g = ({ children: e, className: n, "aria-label": r, placement: o, offset: a, ...c }) => {
   const { triggerRef: l, optionsRef: u } = c, { popoverContainer: i } = N(), m = h(e, g.Search), C = /* @__PURE__ */ t.createElement(ie, null, e);
   return /* @__PURE__ */ t.createElement(ge, {
     getContainer: () => i
-  }, /* @__PURE__ */ t.createElement(xe, {
+  }, /* @__PURE__ */ t.createElement(Re, {
     ref: u,
     triggerRef: l,
     className: n,
@@ -237,11 +237,11 @@ const g = ({ children: e, className: n, "aria-label": r, placement: o, offset: a
     }
   }, e)))));
 }, ie = ({ children: e, listBoxProps: n }) => {
-  const { countries: r } = N(), o = h(e, g.Option), a = h(e, g.Search), c = h(e, g.EmptyState), l = /* @__PURE__ */ t.createElement(Pe, {
+  const { countries: r } = N(), o = h(e, g.Option), a = h(e, g.Search), c = h(e, g.EmptyState), l = /* @__PURE__ */ t.createElement(ve, {
     ...n,
     renderEmptyState: c ? () => c : void 0
   }, r.map((u) => {
-    const i = z(u.longCountryCode) || "";
+    const i = G(u.longCountryCode) || "";
     return ce(o, {
       key: u.shortCountryCode,
       countryCode: u.shortCountryCode,
@@ -250,7 +250,7 @@ const g = ({ children: e, className: n, "aria-label": r, placement: o, offset: a
       longCountryCode: u.longCountryCode
     });
   }));
-  return a ? /* @__PURE__ */ t.createElement(ve, {
+  return a ? /* @__PURE__ */ t.createElement(Pe, {
     filter: (u, i, m) => {
       const C = r.find((p) => p.shortCountryCode === m.key);
       return !!C && Ze(C, i);
@@ -273,7 +273,7 @@ const et = ({ children: e, className: n }) => /* @__PURE__ */ t.createElement("d
   className: n
 }, e);
 g.EmptyState = et;
-const $ = ({ children: e, className: n, ...r }) => {
+const A = ({ children: e, className: n, ...r }) => {
   const { countryCode: o, dialingCode: a, countryName: c, longCountryCode: l } = r, u = {
     countryCode: o,
     dialingCode: a,
@@ -288,28 +288,28 @@ const $ = ({ children: e, className: n, ...r }) => {
     value: u
   }, i));
 }, Ce = ({ className: e }) => {
-  const { longCountryCode: n } = G();
-  return /* @__PURE__ */ t.createElement(H, {
+  const { longCountryCode: n } = H();
+  return /* @__PURE__ */ t.createElement(Y, {
     className: e,
     longCountryCode: n
   });
 }, de = ({ className: e }) => {
-  const { countryName: n } = G();
+  const { countryName: n } = H();
   return /* @__PURE__ */ t.createElement("span", {
     className: e
   }, n);
 }, pe = ({ className: e }) => {
-  const { dialingCode: n } = G();
+  const { dialingCode: n } = H();
   return /* @__PURE__ */ t.createElement("span", {
     className: e
   }, n);
 };
-$.Flag = Ce;
-$.Name = de;
-$.Code = pe;
-g.Option = $;
+A.Flag = Ce;
+A.Name = de;
+A.Code = pe;
+g.Option = A;
 const tt = ({ className: e }) => {
-  const { t: n } = v(), { inputId: r, ariaDescribedBy: o } = oe(), { id: a, placeholder: c, disabled: l, readOnly: u, required: i, label: m, hasError: C } = M(), { currentValue: p, handlePhoneChange: d } = N(), f = P(null);
+  const { t: n } = P(), { inputId: r, ariaDescribedBy: o } = oe(), { id: a, placeholder: c, disabled: l, readOnly: u, required: i, label: m, hasError: C } = M(), { currentValue: p, handlePhoneChange: d } = N(), f = v(null);
   return he(() => {
     var y;
     (y = f.current) == null || y.focus({
@@ -331,14 +331,14 @@ const tt = ({ className: e }) => {
     className: e
   });
 }, nt = ({ children: e, className: n }) => {
-  const r = P(null), o = P(null), a = P(!1), { disabled: c, readOnly: l, required: u, hasError: i, showFlag: m, onFocus: C, onBlur: p } = M(), d = Me(p), { t: f } = v(), { selectedCountryCode: y, handleCountryCodeChange: O, countries: S } = N(), A = h(e, s.CountryButton), F = h(e, s.CountryOptions.Modal), T = F ?? h(e, s.CountryOptions.Popover), D = h(e, s.PhoneNumber), R = {
+  const r = v(null), o = v(null), a = v(!1), { disabled: c, readOnly: l, required: u, hasError: i, showFlag: m, onFocus: C, onBlur: p } = M(), d = Me(p), { t: f } = P(), { selectedCountryCode: y, handleCountryCodeChange: O, countries: S } = N(), $ = h(e, s.CountryButton), F = h(e, s.CountryOptions.Modal), T = F ?? h(e, s.CountryOptions.Popover), D = h(e, s.PhoneNumber), x = {
     onFocus: () => {
       a.current || (a.current = !0, C == null || C());
     },
     onBlur: (L) => {
       var K, Z;
-      const x = L.relatedTarget;
-      !((K = r.current) != null && K.contains(x)) && !((Z = o.current) != null && Z.contains(x)) && (a.current = !1, d());
+      const R = L.relatedTarget;
+      !((K = r.current) != null && K.contains(R)) && !((Z = o.current) != null && Z.contains(R)) && (a.current = !1, d());
     }
   };
   if (S.length === 1)
@@ -347,11 +347,11 @@ const tt = ({ className: e }) => {
       className: n,
       isDisabled: c,
       isInvalid: i,
-      ...R
-    }, m && /* @__PURE__ */ t.createElement(H, {
+      ...x
+    }, m && /* @__PURE__ */ t.createElement(Y, {
       longCountryCode: S[0].longCountryCode
     }), D);
-  const I = /* @__PURE__ */ t.createElement(t.Fragment, null, A, ce(T, {
+  const I = /* @__PURE__ */ t.createElement(t.Fragment, null, $, ce(T, {
     triggerRef: r,
     optionsRef: o
   }));
@@ -360,7 +360,7 @@ const tt = ({ className: e }) => {
     className: n,
     isDisabled: c,
     isInvalid: i,
-    ...R
+    ...x
   }, F ? /* @__PURE__ */ t.createElement(Le, null, I) : /* @__PURE__ */ t.createElement(Ie, {
     "aria-label": f("field.phone.country-code.aria-label"),
     value: y ?? null,
@@ -371,9 +371,9 @@ const tt = ({ className: e }) => {
     placeholder: ""
   }, I), D);
 };
-s.Label = Re;
+s.Label = xe;
 s.Control = nt;
-s.CountryButton = Y;
+s.CountryButton = z;
 s.CountryOptions = g;
 s.PhoneNumber = tt;
 s.Description = Fe;
@@ -421,7 +421,7 @@ const ot = (e) => /* @__PURE__ */ t.createElement("svg", {
   className: E.chevron,
   "aria-hidden": "true"
 }, /* @__PURE__ */ t.createElement(we, null)), Vt = () => {
-  const { t: e } = v(), { isMobile: n, PortalContainer: r } = ne(), o = /* @__PURE__ */ t.createElement(s.CountryOptions.Search, {
+  const { t: e } = P(), { isMobile: n, PortalContainer: r } = ne(), o = /* @__PURE__ */ t.createElement(s.CountryOptions.Search, {
     className: E.countrySearchContainer,
     "aria-label": e("field.phone.country-search-input.aria-label")
   }, /* @__PURE__ */ t.createElement(rt, {
@@ -458,14 +458,14 @@ const ot = (e) => /* @__PURE__ */ t.createElement("svg", {
     portalContainer: r,
     "aria-label": e("field.phone.country-code.aria-label")
   }, o, a, c) : /* @__PURE__ */ t.createElement(s.CountryOptions.Popover, {
-    className: b(ze, _.selectPopover, E.countryOptions),
+    className: b(Ge, _.selectPopover, E.countryOptions),
     placement: "bottom start",
     offset: 0,
     "aria-label": e("field.phone.country-code.aria-label")
   }, o, a, c)), /* @__PURE__ */ t.createElement(s.Error, {
-    className: b(Ge, _.error)
+    className: b(He, _.error)
   }, /* @__PURE__ */ t.createElement(Ue, null), /* @__PURE__ */ t.createElement(s.Error.Text, null)), /* @__PURE__ */ t.createElement(s.Description, {
-    className: b(He, _.description)
+    className: b(Ye, _.description)
   }, bt));
 };
 export {

package/dist/component/{phone-rac-C72xrPL6.js → phone-rac-DslINtcH.js}

@@ -1,5 +1,5 @@
 import e from "react";
-import { P as o } from "./phone-input-field-rac-CqYNWmiA.js";
+import { P as o } from "./phone-input-field-rac-Ce_wuE46.js";
 const r = () => /* @__PURE__ */ e.createElement(o, null);
 export {
   r as PhoneRAC

package/dist/component/{product-list-rac-DbftZgIh.js → product-list-rac-C4P_SOyG.js}

@@ -1,21 +1,21 @@
-import t, { useMemo as H, useCallback as x, useRef as B } from "react";
-import { RicosViewer as K } from "@wix/ricos/viewer";
+import t, { useMemo as $, useCallback as x, useRef as B } from "react";
+import { RicosViewer as z } from "@wix/ricos/viewer";
 import _ from "classnames";
-import { CheckboxField as $, CheckboxButton as X, NumberField as j, Group as J, Button as U, Input as W } from "react-aria-components";
-import { ai as k, af as Y, ab as w, as as Z, ak as ee } from "./form-BmioUKtQ.js";
-import { f as b, a as I } from "./find-child-C60k4CxG.js";
-import { L as te, g as ne } from "./field-label-headless-BQFy2iAr.js";
+import { CheckboxField as G, CheckboxButton as X, NumberField as j, Group as J, Button as U, Input as W } from "react-aria-components";
+import { ai as k, af as Y, ab as w, as as Z, ak as ee } from "./form-f0tqdMye.js";
+import { f as O, a as I } from "./find-child-C60k4CxG.js";
+import { L as te, g as ne } from "./field-label-headless-BGyK-5xW.js";
 import { f as ae } from "./format-currency-BwShJ9vM.js";
-import { D as oe, E as re } from "./field-error-headless-C7IUibkK.js";
+import { D as oe, E as re } from "./field-error-headless-BErhh9GG.js";
 import { F as le } from "./fieldset-headless-CD3fds9J.js";
 import { g as se } from "./payment-field-utils-DobiK5Xh.js";
 import { S as ie } from "./selection-indicator-XQ8MYHUQ.js";
 import { E as ce } from "./error-icon-hZxQ6DEy.js";
 import { C as ue } from "./checkbox-indicator-module-classes-DqzGZQRQ.js";
 import { s as T } from "./field-rac.module-ColNPUt0.js";
-import { z as me, P as pe, C as de, G as Ee, E as ye, y as fe, p as _e, i as Ie, D as be } from "./form-element-classes-BuM-vthE.js";
+import { y as me, O as pe, B as de, E as Ee, D as ye, x as fe, o as _e, i as Ie, C as Oe } from "./form-element-classes-jC8D0LnK.js";
 import { o as Q } from "./options-rac.module-KM-VT_KY.js";
-import { u as Oe } from "./use-element-state-class-name-nCwOVSGM.js";
+import { u as be } from "./use-element-state-class-name-BqmaTba3.js";
 var Le = /* @__PURE__ */ (function(e) {
   return e.crop = "CROP", e.fit = "FIT", e;
 })({}), M = /* @__PURE__ */ (function(e) {
@@ -29,14 +29,14 @@ function Ce({ maxItems: e, products: a } = {}) {
 }
 const o = ({ children: e }) => {
   var D;
-  const { id: a, value: l, onChange: n, disabled: r, readOnly: c, required: y, onBlur: O, onFocus: s, hasError: u, validation: m, FieldLayout: p } = k(), { inputId: q, labelId: N, ariaDescribedBy: h } = Y(), f = b(e, o.Label), g = b(e, o.Options), v = b(e, o.Description), L = b(e, o.Error), i = H(() => l || [], [
+  const { id: a, value: l, onChange: n, disabled: r, readOnly: c, required: y, onBlur: b, onFocus: s, hasError: u, validation: m, FieldLayout: p } = k(), { inputId: q, labelId: N, ariaDescribedBy: h } = Y(), f = O(e, o.Label), g = O(e, o.Options), v = O(e, o.Description), L = O(e, o.Error), i = $(() => l || [], [
     l
   ]), A = Ce((D = m == null ? void 0 : m.predefined) == null ? void 0 : D.paymentOptions) === M.many, F = x((S, R) => {
-    const d = i.filter((G) => G.productId !== S.productId), z = R ? [
+    const d = i.filter((K) => K.productId !== S.productId), H = R ? [
       ...d,
       S
     ] : d;
-    n == null || n(z);
+    n == null || n(H);
   }, [
     i,
     n
@@ -49,7 +49,7 @@ const o = ({ children: e }) => {
       ariaLabelledBy: N,
       ariaDescribedBy: h,
       required: y,
-      onBlur: O,
+      onBlur: b,
       onFocus: s
     }, g ? I(g, {
       allowMany: A,
@@ -62,7 +62,7 @@ const o = ({ children: e }) => {
     renderDescription: () => /* @__PURE__ */ t.createElement(t.Fragment, null, L, v)
   });
 }, V = ({ children: e, className: a, ...l }) => {
-  const { allowMany: n, productValues: r, onProductChange: c, disabled: y, readOnly: O, hasError: s } = l, { options: u, validation: m, imageResize: p } = k(), { currency: q } = w(), { t: N } = Z(), h = b(e, o.Option);
+  const { allowMany: n, productValues: r, onProductChange: c, disabled: y, readOnly: b, hasError: s } = l, { options: u, validation: m, imageResize: p } = k(), { currency: q } = w(), { t: N } = Z(), h = O(e, o.Option);
   return /* @__PURE__ */ t.createElement("div", {
     className: a
   }, u == null ? void 0 : u.map((f, g) => {
@@ -77,7 +77,7 @@ const o = ({ children: e }) => {
       allowMany: n,
       onProductChange: c,
       disabled: y,
-      readOnly: O,
+      readOnly: b,
       hasError: s,
       currencyAriaLabel: L,
       imageResize: p,
@@ -85,7 +85,7 @@ const o = ({ children: e }) => {
     });
   }));
 }, E = ({ children: e, className: a, ...l }) => {
-  const { option: n, price: r, quantity: c = 0, isSelected: y, allowMany: O, onProductChange: s, disabled: u, readOnly: m, hasError: p, currencyAriaLabel: q, imageResize: N, isFirst: h } = l, { id: f } = k(), g = B(null), v = B(null), L = b(e, E.Image), i = b(e, E.Label), C = b(e, E.Price), A = b(e, E.Input), F = b(e, E.Quantity);
+  const { option: n, price: r, quantity: c = 0, isSelected: y, allowMany: b, onProductChange: s, disabled: u, readOnly: m, hasError: p, currencyAriaLabel: q, imageResize: N, isFirst: h } = l, { id: f } = k(), g = B(null), v = B(null), L = O(e, E.Image), i = O(e, E.Label), C = O(e, E.Price), A = O(e, E.Input), F = O(e, E.Quantity);
   ee(() => {
     var d;
     h && ((d = g.current ?? v.current) == null || d.focus({
@@ -113,7 +113,7 @@ const o = ({ children: e }) => {
     n.value,
     r
   ]), R = `${n.label} ${q} ${r}`;
-  return O ? /* @__PURE__ */ t.createElement("div", {
+  return b ? /* @__PURE__ */ t.createElement("div", {
     className: a,
     "data-hook": "product"
   }, L ? I(L, {
@@ -131,7 +131,7 @@ const o = ({ children: e }) => {
     hasError: p,
     ariaLabel: R,
     inputRef: h ? v : void 0
-  }) : null) : /* @__PURE__ */ t.createElement($, {
+  }) : null) : /* @__PURE__ */ t.createElement(G, {
     isSelected: y,
     onChange: D,
     isDisabled: u,
@@ -161,11 +161,11 @@ const o = ({ children: e }) => {
   const c = n === Le.fit, y = ne(r, 96, 96, c ? "fit" : "fill");
   if (!y)
     return null;
-  const O = r.altText || l.label || "";
+  const b = r.altText || l.label || "";
   return /* @__PURE__ */ t.createElement("img", {
     className: e,
     src: y,
-    alt: O,
+    alt: b,
     "data-fit": c ? "contain" : "cover",
     "data-hook": "product-image"
   });
@@ -186,7 +186,7 @@ const o = ({ children: e }) => {
     "data-hook": "product-price"
   }, c);
 }, De = ({ className: e, ...a }) => {
-  const { quantity: l, onQuantityChange: n, disabled: r, readOnly: c, hasError: y, ariaLabel: O, inputRef: s } = a, u = x((p) => {
+  const { quantity: l, onQuantityChange: n, disabled: r, readOnly: c, hasError: y, ariaLabel: b, inputRef: s } = a, u = x((p) => {
     n(p < 0 ? 0 : p);
   }, [
     n
@@ -203,7 +203,7 @@ const o = ({ children: e }) => {
     isDisabled: r,
     isReadOnly: c,
     isInvalid: y,
-    "aria-label": O,
+    "aria-label": b,
     className: e,
     "data-hook": "product-quantity"
   }, /* @__PURE__ */ t.createElement(J, {
@@ -235,12 +235,12 @@ const Se = "_options_11x4v_1", Pe = "_option_11x4v_1", Ne = "_optionInput_11x4v_
   optionLabel: ve,
   optionPrice: Ae,
   quantity: Te
-}, qe = ({ content: e, locale: a }) => /* @__PURE__ */ t.createElement(K, {
+}, qe = ({ content: e, locale: a }) => /* @__PURE__ */ t.createElement(z, {
   content: e,
   locale: a
 }), xe = () => {
-  const e = Oe({
-    globalClasses: be,
+  const e = be({
+    globalClasses: Oe,
     moduleClasses: ue
   });
   return /* @__PURE__ */ t.createElement(o, null, /* @__PURE__ */ t.createElement(o.Label, {

package/dist/component/{quiz-radio-group-rac-Bkg5poft.js → quiz-radio-group-rac-noy4fmD8.js}

@@ -1,6 +1,6 @@
 import _ from "react";
-import { R } from "./radio-group-field-rac-BkoqJYp4.js";
-import { J as o, I as r, H as O } from "./form-element-classes-BuM-vthE.js";
+import { R } from "./radio-group-field-rac-CYBDq7R1.js";
+import { I as o, H as r, G as O } from "./form-element-classes-jC8D0LnK.js";
 const e = () => /* @__PURE__ */ _.createElement(R, {
   classes: {
     container: O,

package/dist/component/{radio-button-module-classes-Do4JmHrh.js → radio-button-module-classes-DXQ1UlmI.js}

@@ -1,9 +1,9 @@
 import l, { useRef as S, useState as V, useEffect as B, useCallback as T } from "react";
 import { RadioGroup as H, RadioField as k, RadioButton as M, TextField as U, Input as A } from "react-aria-components";
-import { ai as v, af as G, as as F, ab as P, ak as $ } from "./form-BmioUKtQ.js";
+import { ai as v, af as G, as as F, ab as P, ak as $ } from "./form-f0tqdMye.js";
 import { f as p, a as y } from "./find-child-C60k4CxG.js";
-import { D as q, E as x } from "./field-error-headless-C7IUibkK.js";
-import { L as j } from "./field-label-headless-BQFy2iAr.js";
+import { D as q, E as x } from "./field-error-headless-BErhh9GG.js";
+import { L as j } from "./field-label-headless-BGyK-5xW.js";
 import { N as w } from "./options-layout-constants-DEfIEJWD.js";
 import { S as z } from "./selection-indicator-XQ8MYHUQ.js";
 const L = "Other", J = (e, t) => e == null ? void 0 : e.find((o) => (o.value ?? o.label) === t), R = (e, t) => !!t && !J(e, t), K = (e, t) => {

package/dist/component/{radio-group-field-rac-BkoqJYp4.js → radio-group-field-rac-CYBDq7R1.js}

@@ -1,11 +1,11 @@
 import { RicosViewer as n } from "@wix/ricos/viewer";
 import t from "classnames";
 import e from "react";
-import { a, s as o, R as m } from "./radio-button-module-classes-Do4JmHrh.js";
+import { a, s as o, R as m } from "./radio-button-module-classes-DXQ1UlmI.js";
 import { E as c } from "./error-icon-hZxQ6DEy.js";
 import { s } from "./field-rac.module-ColNPUt0.js";
-import { M as i, L as E, K as _, z as R, P as O, y as p, p as L, i as I } from "./form-element-classes-BuM-vthE.js";
-import { u as D } from "./use-element-state-class-name-nCwOVSGM.js";
+import { L as i, K as E, J as _, y as O, O as R, x as p, o as L, i as I } from "./form-element-classes-jC8D0LnK.js";
+import { u as D } from "./use-element-state-class-name-BqmaTba3.js";
 const N = ({ content: r, locale: l }) => /* @__PURE__ */ e.createElement(n, {
   content: r,
   locale: l
@@ -19,9 +19,9 @@ const N = ({ content: r, locale: l }) => /* @__PURE__ */ e.createElement(n, {
     moduleClasses: m
   });
   return /* @__PURE__ */ e.createElement(a, null, /* @__PURE__ */ e.createElement(a.Label, {
-    className: t(R, s.label)
+    className: t(O, s.label)
   }, /* @__PURE__ */ e.createElement(a.Label.Required, {
-    className: t(O, s.requiredMark)
+    className: t(R, s.requiredMark)
   }), /* @__PURE__ */ e.createElement(a.Label.Image, {
     className: o.labelImage
   })), /* @__PURE__ */ e.createElement(a.Options, {

package/dist/component/{radio-group-rac-BGp1iRNt.js → radio-group-rac-CGHQFyJY.js}

@@ -1,5 +1,5 @@
 import o from "react";
-import { R as r } from "./radio-group-field-rac-BkoqJYp4.js";
+import { R as r } from "./radio-group-field-rac-CYBDq7R1.js";
 const R = () => /* @__PURE__ */ o.createElement(r, null);
 export {
   R as RadioGroupRAC

package/dist/component/{rating-input-field-rac-Bozwq2E7.js → rating-input-field-rac-elaferlI.js}

@@ -1,23 +1,23 @@
-import { RicosViewer as N } from "@wix/ricos/viewer";
+import { RicosViewer as D } from "@wix/ricos/viewer";
 import m from "classnames";
-import e, { useCallback as y, useState as O, useRef as A } from "react";
-import { ai as b, af as v, as as T } from "./form-BmioUKtQ.js";
-import { RadioGroup as H, RadioField as M, RadioButton as w } from "react-aria-components";
-import { f as u, a as P } from "./find-child-C60k4CxG.js";
-import { D as B, E as q } from "./field-error-headless-C7IUibkK.js";
-import { L as G } from "./field-label-headless-BQFy2iAr.js";
+import e, { useCallback as N, useState as O, useRef as A } from "react";
+import { ai as b, af as v, as as M } from "./form-f0tqdMye.js";
+import { RadioGroup as T, RadioField as H, RadioButton as w } from "react-aria-components";
+import { f as u, a as B } from "./find-child-C60k4CxG.js";
+import { D as P, E as q } from "./field-error-headless-BErhh9GG.js";
+import { L as G } from "./field-label-headless-BGyK-5xW.js";
 import { E as k } from "./error-icon-hZxQ6DEy.js";
 import { s as g } from "./field-rac.module-ColNPUt0.js";
-import { z as x, P as z, N as U, p as Q, i as Z, O as j } from "./form-element-classes-BuM-vthE.js";
-import { u as J } from "./use-element-state-class-name-nCwOVSGM.js";
+import { y as x, O as U, M as z, o as Q, i as Z, N as j } from "./form-element-classes-jC8D0LnK.js";
+import { u as J } from "./use-element-state-class-name-BqmaTba3.js";
 const t = ({ children: a }) => {
-  const { id: n, value: r, onChange: l, disabled: o, readOnly: d, required: c, hasError: i, onBlur: E, onFocus: C, FieldLayout: R } = b(), { labelId: _ } = v(), L = y((D) => l(Number(D)), [
+  const { id: n, value: r, onChange: l, disabled: o, readOnly: d, required: c, hasError: i, onBlur: E, onFocus: C, FieldLayout: R } = b(), { labelId: _ } = v(), L = N((y) => l(Number(y)), [
     l
   ]), f = u(a, t.Label), s = u(a, t.Ratings), S = u(a, t.Description), h = u(a, t.Error);
   return /* @__PURE__ */ e.createElement(R, {
     fieldId: n,
     renderLabel: () => f,
-    renderInput: () => /* @__PURE__ */ e.createElement(H, {
+    renderInput: () => /* @__PURE__ */ e.createElement(T, {
       "aria-labelledby": _,
       value: r ? String(r) : void 0,
       onChange: L,
@@ -46,7 +46,7 @@ const t = ({ children: a }) => {
     className: n,
     "data-invalid": d,
     "data-readonly": o
-  }, L.map((s) => P(_, {
+  }, L.map((s) => B(_, {
     key: s,
     value: s,
     isSelected: f(s),
@@ -65,7 +65,7 @@ const t = ({ children: a }) => {
   whiteSpace: "nowrap"
 }, F = ({ className: a, children: n, ...r }) => {
   const { value: l, isSelected: o, onHoverChange: d, label: c } = r;
-  return /* @__PURE__ */ e.createElement(M, {
+  return /* @__PURE__ */ e.createElement(H, {
     value: l
   }, /* @__PURE__ */ e.createElement(w, {
     className: ({ isHovered: i }) => typeof a == "function" ? a({
@@ -85,7 +85,7 @@ I.Rating = F;
 t.Label = G;
 t.Ratings = I;
 t.Rating = F;
-t.Description = B;
+t.Description = P;
 t.Error = q;
 const W = (a) => /* @__PURE__ */ e.createElement("svg", {
   viewBox: "0 0 32 32",
@@ -102,7 +102,7 @@ const W = (a) => /* @__PURE__ */ e.createElement("svg", {
   rating: Y,
   ratingSelected: $,
   ratingHover: V
-}, ee = ({ content: a, locale: n }) => /* @__PURE__ */ e.createElement(N, {
+}, ee = ({ content: a, locale: n }) => /* @__PURE__ */ e.createElement(D, {
   content: a,
   locale: n
 }), te = {
@@ -110,16 +110,16 @@ const W = (a) => /* @__PURE__ */ e.createElement("svg", {
   selected: p.ratingSelected,
   hover: p.ratingHover
 }, ge = () => {
-  const { t: a } = T(), n = J({
+  const { t: a } = M(), n = J({
     globalClasses: j,
     moduleClasses: te
   });
   return /* @__PURE__ */ e.createElement(t, null, /* @__PURE__ */ e.createElement(t.Label, {
     className: m(x, g.label)
   }, /* @__PURE__ */ e.createElement(t.Label.Required, {
-    className: m(z, g.requiredMark)
+    className: m(U, g.requiredMark)
   })), /* @__PURE__ */ e.createElement(t.Ratings, {
-    className: m(U, p.ratings),
+    className: m(z, p.ratings),
     getReactionLabel: (r) => a("rating-input.a11y.reaction-label", {
       count: r
     })

package/dist/component/{rating-input-rac-Cxha4VPg.js → rating-input-rac-fnOtTKN8.js}

@@ -1,5 +1,5 @@
 import t from "react";
-import { R as e } from "./rating-input-field-rac-Bozwq2E7.js";
+import { R as e } from "./rating-input-field-rac-elaferlI.js";
 const o = () => /* @__PURE__ */ t.createElement(e, null);
 export {
   o as RatingInputRAC

package/dist/component/{rich-content-rac.module-ZXCfVPY-.js → rich-content-rac.module-DbwuwQeo.js}

@@ -1,5 +1,5 @@
 import c, { useState as u } from "react";
-import { ai as a, ab as i, as as T } from "./form-BmioUKtQ.js";
+import { ai as a, ab as i, as as T } from "./form-f0tqdMye.js";
 import { Button as d } from "react-aria-components";
 import { D as r } from "./data-hooks-Dkw1pbRj.js";
 import { truncateRichContent as _ } from "@wix/ricos/content";

package/dist/component/{rich-text-field-rac-Ct4KowMZ.js → rich-text-field-rac-DtcQC8zU.js}

@@ -1,8 +1,8 @@
 import l from "classnames";
 import e from "react";
-import { ai as m, L as i, W as u, Z as R } from "./form-BmioUKtQ.js";
-import { u as T, R as C, s as d, T as p } from "./rich-content-rac.module-ZXCfVPY-.js";
-import { a6 as g } from "./form-element-classes-BuM-vthE.js";
+import { ai as m, L as i, W as u, Z as R } from "./form-f0tqdMye.js";
+import { u as T, R as C, s as d, T as p } from "./rich-content-rac.module-DbwuwQeo.js";
+import { a4 as g } from "./form-element-classes-jC8D0LnK.js";
 const h = {
   colorPalette: R(),
   customStyles: u()