@wix/form-elements 0.0.0-stage → 1.53.0

package/dist/component/email-input-field-rac-Dq1HVu3Y.js

@@ -0,0 +1,507 @@
+import { RicosViewer as ie } from "@wix/ricos/viewer";
+import x from "classnames";
+import u, { createContext as z, useContext as Z, createElement as H, isValidElement as U, cloneElement as R, useState as le, useCallback as me, useEffect as ue } from "react";
+import { TextField as pe } from "react-aria-components";
+import { ad as fe, aq as ge, ab as ve, c as ye, ag as Ee, ak as de, ae as be, f as Se } from "./form-Dn-MrArr.js";
+import { f as L } from "./find-child-C60k4CxG.js";
+import ee from "@babel/runtime/helpers/objectWithoutProperties";
+import M from "@babel/runtime/helpers/typeof";
+import Oe from "@babel/runtime/helpers/defineProperty";
+import he from "html-parse-stringify";
+import Ie from "@babel/runtime/helpers/classCallCheck";
+import Ne from "@babel/runtime/helpers/createClass";
+import { T as B } from "./text-input-headless-BFldUMDr.js";
+import { E as Ae } from "./error-icon-hZxQ6DEy.js";
+import { s as C } from "./field-rac.module-DXfwku6m.js";
+import { r as Fe, H as ke, q as Te, l as De, h as xe, R as je } from "./form-element-classes-Bi-nNM8q.js";
+var Le = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g, Ce = {
+  "&": "&",
+  "&": "&",
+  "&lt;": "<",
+  "&#60;": "<",
+  "&gt;": ">",
+  "&#62;": ">",
+  "&apos;": "'",
+  "&#39;": "'",
+  "&quot;": '"',
+  "&#34;": '"',
+  "&nbsp;": " ",
+  "&#160;": " ",
+  "&copy;": "©",
+  "&#169;": "©",
+  "&reg;": "®",
+  "&#174;": "®",
+  "&hellip;": "…",
+  "&#8230;": "…",
+  "&#x2F;": "/",
+  "&#47;": "/"
+}, Me = function(t) {
+  return Ce[t];
+}, Pe = function(t) {
+  return t.replace(Le, Me);
+}, _e = {
+  bindI18n: "languageChanged",
+  bindI18nStore: "",
+  transEmptyNodeValue: "",
+  transSupportBasicHtmlNodes: !0,
+  transWrapTextNodes: "",
+  transKeepBasicHtmlNodesFor: ["br", "strong", "i", "p"],
+  useSuspense: !0,
+  unescape: Pe
+}, we, Re = z();
+function He() {
+  return _e;
+}
+(function() {
+  function e() {
+    Ie(this, e), this.usedNamespaces = {};
+  }
+  return Ne(e, [{
+    key: "addUsedNamespaces",
+    value: function(a) {
+      var o = this;
+      a.forEach(function(c) {
+        o.usedNamespaces[c] || (o.usedNamespaces[c] = !0);
+      });
+    }
+  }, {
+    key: "getUsedNamespaces",
+    value: function() {
+      return Object.keys(this.usedNamespaces);
+    }
+  }]), e;
+})();
+function Ke() {
+  return we;
+}
+function K() {
+  if (console && console.warn) {
+    for (var e, t = arguments.length, a = new Array(t), o = 0; o < t; o++)
+      a[o] = arguments[o];
+    typeof a[0] == "string" && (a[0] = "react-i18next:: ".concat(a[0])), (e = console).warn.apply(e, a);
+  }
+}
+var J = {};
+function Ue() {
+  for (var e = arguments.length, t = new Array(e), a = 0; a < e; a++)
+    t[a] = arguments[a];
+  typeof t[0] == "string" && J[t[0]] || (typeof t[0] == "string" && (J[t[0]] = /* @__PURE__ */ new Date()), K.apply(void 0, t));
+}
+var Be = ["format"], qe = ["children", "count", "parent", "i18nKey", "context", "tOptions", "values", "defaults", "components", "ns", "i18n", "t", "shouldUnescape"];
+function Q(e, t) {
+  var a = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    t && (o = o.filter(function(c) {
+      return Object.getOwnPropertyDescriptor(e, c).enumerable;
+    })), a.push.apply(a, o);
+  }
+  return a;
+}
+function p(e) {
+  for (var t = 1; t < arguments.length; t++) {
+    var a = arguments[t] != null ? arguments[t] : {};
+    t % 2 ? Q(Object(a), !0).forEach(function(o) {
+      Oe(e, o, a[o]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(a)) : Q(Object(a)).forEach(function(o) {
+      Object.defineProperty(e, o, Object.getOwnPropertyDescriptor(a, o));
+    });
+  }
+  return e;
+}
+function Y(e, t) {
+  if (!e) return !1;
+  var a = e.props ? e.props.children : e.children;
+  return t ? a.length > 0 : !!a;
+}
+function G(e) {
+  return e ? e.props ? e.props.children : e.children : [];
+}
+function Ve(e) {
+  return Object.prototype.toString.call(e) !== "[object Array]" ? !1 : e.every(function(t) {
+    return U(t);
+  });
+}
+function P(e) {
+  return Array.isArray(e) ? e : [e];
+}
+function Ye(e, t) {
+  var a = p({}, t);
+  return a.props = Object.assign(e.props, t.props), a;
+}
+function te(e, t) {
+  if (!e) return "";
+  var a = "", o = P(e), c = t.transSupportBasicHtmlNodes && t.transKeepBasicHtmlNodesFor ? t.transKeepBasicHtmlNodesFor : [];
+  return o.forEach(function(r, g) {
+    if (typeof r == "string")
+      a += "".concat(r);
+    else if (U(r)) {
+      var v = Object.keys(r.props).length, d = c.indexOf(r.type) > -1, b = r.props.children;
+      if (!b && d && v === 0)
+        a += "<".concat(r.type, "/>");
+      else if (!b && (!d || v !== 0))
+        a += "<".concat(g, "></").concat(g, ">");
+      else if (r.props.i18nIsDynamicList)
+        a += "<".concat(g, "></").concat(g, ">");
+      else if (d && v === 1 && typeof b == "string")
+        a += "<".concat(r.type, ">").concat(b, "</").concat(r.type, ">");
+      else {
+        var T = te(b, t);
+        a += "<".concat(g, ">").concat(T, "</").concat(g, ">");
+      }
+    } else if (r === null)
+      K("Trans: the passed in value is invalid - seems you passed in a null child.");
+    else if (M(r) === "object") {
+      var O = r.format, F = ee(r, Be), A = Object.keys(F);
+      if (A.length === 1) {
+        var S = O ? "".concat(A[0], ", ").concat(O) : A[0];
+        a += "{{".concat(S, "}}");
+      } else
+        K("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.", r);
+    } else
+      K("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.", r);
+  }), a;
+}
+function Ge(e, t, a, o, c, r) {
+  if (t === "") return [];
+  var g = o.transKeepBasicHtmlNodesFor || [], v = t && new RegExp(g.join("|")).test(t);
+  if (!e && !v) return [t];
+  var d = {};
+  function b(y) {
+    var h = P(y);
+    h.forEach(function(s) {
+      typeof s != "string" && (Y(s) ? b(G(s)) : M(s) === "object" && !U(s) && Object.assign(d, s));
+    });
+  }
+  b(e);
+  var T = he.parse("<0>".concat(t, "</0>")), O = p(p({}, d), c);
+  function F(y, h, s) {
+    var i = G(y), I = S(i, h.children, s);
+    return Ve(i) && I.length === 0 ? i : I;
+  }
+  function A(y, h, s, i, I) {
+    y.dummy && (y.children = h), s.push(R(y, p(p({}, y.props), {}, {
+      key: i
+    }), I ? void 0 : h));
+  }
+  function S(y, h, s) {
+    var i = P(y), I = P(h);
+    return I.reduce(function(l, n, E) {
+      var k = n.children && n.children[0] && n.children[0].content && a.services.interpolator.interpolate(n.children[0].content, O, a.language);
+      if (n.type === "tag") {
+        var N = i[parseInt(n.name, 10)];
+        !N && s.length === 1 && s[0][n.name] && (N = s[0][n.name]), N || (N = {});
+        var m = Object.keys(n.attrs).length !== 0 ? Ye({
+          props: n.attrs
+        }, N) : N, D = U(m), q = D && Y(n, !0) && !n.voidElement, _ = v && M(m) === "object" && m.dummy && !D, w = M(e) === "object" && e !== null && Object.hasOwnProperty.call(e, n.name);
+        if (typeof m == "string") {
+          var V = a.services.interpolator.interpolate(m, O, a.language);
+          l.push(V);
+        } else if (Y(m) || q) {
+          var ne = F(m, n, s);
+          A(m, ne, l, E);
+        } else if (_) {
+          var oe = S(i, n.children, s);
+          l.push(R(m, p(p({}, m.props), {}, {
+            key: E
+          }), oe));
+        } else if (Number.isNaN(parseFloat(n.name)))
+          if (w) {
+            var re = F(m, n, s);
+            A(m, re, l, E, n.voidElement);
+          } else if (o.transSupportBasicHtmlNodes && g.indexOf(n.name) > -1)
+            if (n.voidElement)
+              l.push(H(n.name, {
+                key: "".concat(n.name, "-").concat(E)
+              }));
+            else {
+              var se = S(i, n.children, s);
+              l.push(H(n.name, {
+                key: "".concat(n.name, "-").concat(E)
+              }, se));
+            }
+          else if (n.voidElement)
+            l.push("<".concat(n.name, " />"));
+          else {
+            var ce = S(i, n.children, s);
+            l.push("<".concat(n.name, ">").concat(ce, "</").concat(n.name, ">"));
+          }
+        else if (M(m) === "object" && !D) {
+          var $ = n.children[0] ? k : null;
+          $ && l.push($);
+        } else n.children.length === 1 && k ? l.push(R(m, p(p({}, m.props), {}, {
+          key: E
+        }), k)) : l.push(R(m, p(p({}, m.props), {}, {
+          key: E
+        })));
+      } else if (n.type === "text") {
+        var W = o.transWrapTextNodes, X = r ? o.unescape(a.services.interpolator.interpolate(n.content, O, a.language)) : a.services.interpolator.interpolate(n.content, O, a.language);
+        W ? l.push(H(W, {
+          key: "".concat(n.name, "-").concat(E)
+        }, X)) : l.push(X);
+      }
+      return l;
+    }, []);
+  }
+  var j = S([{
+    dummy: !0,
+    children: e || []
+  }], T, P(e || []));
+  return G(j[0]);
+}
+function $e(e) {
+  var t = e.children, a = e.count, o = e.parent, c = e.i18nKey, r = e.context, g = e.tOptions, v = g === void 0 ? {} : g, d = e.values, b = e.defaults, T = e.components, O = e.ns, F = e.i18n, A = e.t, S = e.shouldUnescape, j = ee(e, qe), y = Z(Re) || {}, h = y.i18n, s = y.defaultNS, i = F || h || Ke();
+  if (!i)
+    return Ue("You will need to pass in an i18next instance by using i18nextReactModule"), t;
+  var I = A || i.t.bind(i) || function(V) {
+    return V;
+  };
+  r && (v.context = r);
+  var l = p(p({}, He()), i.options && i.options.react), n = O || I.ns || s || i.options && i.options.defaultNS;
+  n = typeof n == "string" ? [n] : n || ["translation"];
+  var E = b || te(t, l) || l.transEmptyNodeValue || c, k = l.hashTransKey, N = c || (k ? k(E) : E), m = d ? v.interpolation : {
+    interpolation: p(p({}, v.interpolation), {}, {
+      prefix: "#$?",
+      suffix: "?$#"
+    })
+  }, D = p(p(p(p({}, v), {}, {
+    count: a
+  }, d), m), {}, {
+    defaultValue: E,
+    ns: n
+  }), q = N ? I(N, D) : E, _ = Ge(T || t, q, i, l, D, S), w = o !== void 0 ? o : l.defaultTransParent;
+  return w ? H(w, j, _) : _;
+}
+const We = "email-mistype-suggestion", Xe = "email-mistype-suggestion-link", ae = /* @__PURE__ */ z(void 0);
+function Je() {
+  const e = Z(ae);
+  if (e === void 0)
+    throw new Error("useEmailSuggestion must be used inside <EmailInput>");
+  return e;
+}
+const Qe = ({ activeSuggestion: e, applySuggestion: t, children: a }) => /* @__PURE__ */ u.createElement(ae.Provider, {
+  value: {
+    activeSuggestion: e,
+    applySuggestion: t
+  }
+}, a), ze = ({ className: e }) => {
+  const { suggestionId: t } = fe(), { activeSuggestion: a, applySuggestion: o } = Je(), { t: c, i18n: r } = ge();
+  return /* @__PURE__ */ u.createElement("div", {
+    id: t,
+    "data-hook": We,
+    "aria-live": "polite",
+    className: e
+  }, a ? /* @__PURE__ */ u.createElement($e, {
+    i18n: r,
+    t: c,
+    i18nKey: "input.email.mistype-check.suggestion",
+    values: {
+      email: a
+    },
+    components: [
+      /* @__PURE__ */ u.createElement("button", {
+        key: "0",
+        type: "button",
+        "data-hook": Xe,
+        "aria-label": c("input.email.mistype-check.fix-aria-label", {
+          email: a
+        }),
+        onClick: o
+      })
+    ]
+  }) : null);
+}, Ze = {
+  "aol.com": [
+    "aaol.com",
+    "aol.con",
+    "aool.com",
+    "aol.cpm"
+  ],
+  "gmail.com": [
+    "ail.com",
+    "gail.com",
+    "gamail.com",
+    "gamil.com",
+    "gemail.com",
+    "gmai.com",
+    "gmail.cm",
+    "gmail.cmo",
+    "gmail.co",
+    "gmail.com.com",
+    "gmail.con",
+    "gmailc.om",
+    "gmaill.com",
+    "gmaim.com",
+    "gmal.com",
+    "gmali.com",
+    "gmaol.com",
+    "gmeil.com",
+    "gmial.com",
+    "gmqil.com",
+    "gmsil.com",
+    "gnail.com",
+    "hmail.com",
+    "fmail.com",
+    "gmail.cpm",
+    "gmail.vom",
+    "gmail.comm"
+  ],
+  "hotmail.com": [
+    "hitmail.com",
+    "homail.com",
+    "hotmai.com",
+    "hotmail.con",
+    "hotmaill.com",
+    "hotmal.com",
+    "hotmali.com",
+    "hotmaol.com",
+    "hotmial.com",
+    "htmail.com",
+    "hormail.com",
+    "hotmail.cpm",
+    "hotmil.com"
+  ],
+  "icloud.com": [
+    "iclod.com",
+    "iclou.com",
+    "icloud.con",
+    "icloude.com",
+    "iclould.com",
+    "icolud.com",
+    "icoud.com",
+    "ivloud.com",
+    "icloud.cpm"
+  ],
+  "outlook.com": [
+    "otlook.com",
+    "outllook.com",
+    "outlok.com",
+    "outlook.con",
+    "outlookk.com",
+    "outloook.com",
+    "outook.com",
+    "outlook.cpm"
+  ],
+  "yahoo.com": [
+    "yagoo.com",
+    "yaho.com",
+    "yahoo.con",
+    "yahooo.com",
+    "yahou.com",
+    "yaoo.com",
+    "yhaoo.com",
+    "yhoo.com",
+    "yajoo.com",
+    "yahoo.cpm"
+  ],
+  "live.com": [
+    "live.con",
+    "liv.com",
+    "lve.com",
+    "live.cpm"
+  ],
+  "msn.com": [
+    "msn.con",
+    "msn.com.com",
+    "mmsn.com",
+    "msn.cpm"
+  ],
+  "me.com": [
+    "me.con",
+    "me.cpm"
+  ],
+  "mac.com": [
+    "mac.con",
+    "mac.cpm"
+  ],
+  "comcast.net": [
+    "comcast.ne",
+    "comcast.nt",
+    "comcast.netc",
+    "comcast.nrt",
+    "comcast.net.net"
+  ]
+}, et = new Map(Object.entries(Ze).flatMap(([e, t]) => t.map((a) => [
+  a,
+  e
+]))), tt = (e) => {
+  const t = e.trim(), a = t.lastIndexOf("@");
+  if (a <= 0 || a === t.length - 1)
+    return null;
+  const o = t.slice(0, a), c = t.slice(a + 1).toLowerCase(), r = et.get(c);
+  return r ? `${o}@${r}` : null;
+}, at = ({ email: e, hasError: t }) => {
+  const { isExperimentEnabled: a } = ve(), o = a(ye.CHECK_EMAIL_MISTYPE), c = tt((e ?? "").trim()), [r, g] = le(!1), v = me(() => {
+    g(o && !t && c !== null);
+  }, [
+    o,
+    t,
+    c
+  ]);
+  return ue(() => {
+    g(!1);
+  }, [
+    e,
+    t
+  ]), {
+    isMistyped: r,
+    suggestedEmail: c,
+    validate: v
+  };
+}, f = ({ children: e }) => {
+  const { id: t, value: a, onChange: o, disabled: c, readOnly: r, required: g, hasError: v, onBlur: d, onFocus: b, error: T, description: O, FieldLayout: F } = Ee(), { isMistyped: A, suggestedEmail: S, validate: j } = at({
+    email: a,
+    hasError: v
+  }), { setFocusedFieldId: y } = de(), s = A && (!r && !c) && S ? S : void 0, i = be(t, T, O, s), I = () => {
+    o(s), y(t);
+  }, l = () => {
+    j(), d == null || d();
+  }, n = L(e, f.Label), E = L(e, f.Input), k = L(e, f.Description), N = L(e, f.Error), m = L(e, f.Suggestion);
+  return /* @__PURE__ */ u.createElement(Se.Provider, {
+    value: i
+  }, /* @__PURE__ */ u.createElement(Qe, {
+    activeSuggestion: s,
+    applySuggestion: I
+  }, /* @__PURE__ */ u.createElement(F, {
+    fieldId: t,
+    renderLabel: () => n,
+    renderInput: () => /* @__PURE__ */ u.createElement(pe, {
+      "aria-labelledby": i.labelId,
+      value: a ?? "",
+      onChange: o,
+      isDisabled: c,
+      isReadOnly: r,
+      isRequired: g,
+      isInvalid: v,
+      onBlur: l,
+      onFocus: b
+    }, E),
+    renderDescription: () => /* @__PURE__ */ u.createElement(u.Fragment, null, N, m, k)
+  })));
+};
+f.Label = B.Label;
+f.Input = B.Input;
+f.Description = B.Description;
+f.Error = B.Error;
+f.Suggestion = ze;
+const nt = "_suggestion_di65n_1", ot = {
+  suggestion: nt
+}, rt = ({ content: e, locale: t }) => /* @__PURE__ */ u.createElement(ie, {
+  content: e,
+  locale: t
+}), ht = () => /* @__PURE__ */ u.createElement(f, null, /* @__PURE__ */ u.createElement(f.Label, {
+  className: x(Fe, C.label)
+}, /* @__PURE__ */ u.createElement(f.Label.Required, {
+  className: x(ke, C.requiredMark)
+})), /* @__PURE__ */ u.createElement(f.Input, {
+  className: x(Te, C.input)
+}), /* @__PURE__ */ u.createElement(f.Error, {
+  className: x(De, C.error)
+}, /* @__PURE__ */ u.createElement(Ae, null), /* @__PURE__ */ u.createElement(f.Error.Text, null)), /* @__PURE__ */ u.createElement(f.Description, {
+  className: x(xe, C.description)
+}, rt), /* @__PURE__ */ u.createElement(f.Suggestion, {
+  className: x(je, ot.suggestion)
+}));
+export {
+  ht as E
+};

package/dist/component/error-icon-hZxQ6DEy.js

@@ -0,0 +1,15 @@
+import e from "react";
+const o = (r) => /* @__PURE__ */ e.createElement("svg", {
+  viewBox: "0 0 20 20",
+  width: 20,
+  height: 20,
+  fill: "currentColor",
+  "aria-hidden": "true",
+  ...r
+}, /* @__PURE__ */ e.createElement("path", {
+  fillRule: "evenodd",
+  d: "M9.5,3 C13.084,3 16,5.916 16,9.5 C16,13.084 13.084,16 9.5,16 C5.916,16 3,13.084 3,9.5 C3,5.916 5.916,3 9.5,3 Z M9.5,4 C6.467,4 4,6.467 4,9.5 C4,12.533 6.467,15 9.5,15 C12.533,15 15,12.533 15,9.5 C15,6.467 12.533,4 9.5,4 Z M10,11 L10,12 L9,12 L9,11 L10,11 Z M10,7 L10,10 L9,10 L9,7 L10,7 Z"
+}));
+export {
+  o as E
+};