@wix/form-elements 0.0.0-stage → 1.54.0

package/dist/component/checkbox-group-field-headless-4HlJmarB.js

@@ -0,0 +1,204 @@
+import d, { useMemo as x, useCallback as _, useRef as P, useState as w, useEffect as U } from "react";
+import { CheckboxGroup as W, CheckboxField as A, CheckboxButton as j, TextField as z, Input as J } from "react-aria-components";
+import { debounce as K } from "ts-debounce";
+import { ag as N, ad as Q, aq as X, aa as Y, ai as Z } from "./form-DaOKiR16.js";
+import { f as L, a as y } from "./find-child-C60k4CxG.js";
+import { D as ee, E as te } from "./field-error-headless-Dm5UCOBb.js";
+import { L as ae } from "./field-label-headless-C7mDzdLq.js";
+import { F as ne } from "./fieldset-headless-CD3fds9J.js";
+import { N as se } from "./options-layout-constants-DEfIEJWD.js";
+const R = "Other", le = (e, t) => e.some((o) => !t.includes(o)), B = (e, t) => e.length > 0 && le(e, t), oe = (e, t) => {
+  const o = t == null ? void 0 : t("add-other.default-other-option-label");
+  return e || o || R;
+}, M = (e, t) => {
+  const n = t ? t.length + 2 : 0;
+  return (e.find((r) => r.startsWith(`${t}: `)) || "").slice(n);
+}, k = (e) => e.map((t) => t.value ?? t.label), v = ({ children: e }) => {
+  const t = N(), { id: o, value: n, onChange: a, disabled: r, required: i, onBlur: E, onFocus: m, hasError: p, FieldLayout: c } = t, { inputId: b, labelId: u, ariaDescribedBy: l } = Q(), f = L(e, v.Label), h = L(e, v.Options), g = L(e, v.Description), C = L(e, v.Error), s = x(() => n || [], [
+    n
+  ]), O = _((V) => {
+    a == null || a(V);
+  }, [
+    a
+  ]);
+  return /* @__PURE__ */ d.createElement(c, {
+    fieldId: o,
+    renderLabel: () => f,
+    renderInput: () => /* @__PURE__ */ d.createElement(ne, {
+      id: b,
+      ariaLabelledBy: u,
+      ariaDescribedBy: l,
+      required: i,
+      onBlur: E,
+      onFocus: m
+    }, /* @__PURE__ */ d.createElement(W, {
+      "aria-labelledby": u,
+      value: s,
+      onChange: O,
+      isDisabled: r,
+      isRequired: i,
+      isInvalid: p
+    }, h)),
+    renderDescription: () => /* @__PURE__ */ d.createElement(d.Fragment, null, C, g)
+  });
+}, $ = ({ children: e, className: t }) => {
+  const o = N(), { id: n, options: a, addOther: r, addOtherLabel: i, numberOfColumns: E } = o, { t: m } = X(), { isMobile: p } = Y(), c = L(e, $.Option), b = oe(i, m), u = p ? se.ONE : E;
+  return /* @__PURE__ */ d.createElement("div", {
+    className: t,
+    "data-columns": u
+  }, a == null ? void 0 : a.map((l, f) => {
+    const h = l.value ?? l.label;
+    return y(c, {
+      key: l.id || l.label,
+      value: h,
+      label: l.label,
+      isFirst: f === 0,
+      fieldId: n
+    });
+  }), r && y(c, {
+    key: R,
+    value: R,
+    label: b,
+    isOther: !0
+  }));
+}, re = ({ className: e }) => /* @__PURE__ */ d.createElement("div", {
+  "aria-hidden": "true",
+  className: e
+}), ce = ({ className: e, ...t }) => {
+  const { label: o } = t;
+  return /* @__PURE__ */ d.createElement("span", {
+    className: e
+  }, o);
+}, F = ({ children: e, className: t, ...o }) => {
+  const { value: n, label: a, isFirst: r = !1, isOther: i = !1, fieldId: E } = o, m = N(), { value: p, onChange: c, disabled: b, readOnly: u, hasError: l, options: f } = m, h = P(null);
+  Z(() => {
+    var I;
+    r && ((I = h.current) == null || I.focus({
+      preventScroll: !0
+    }));
+  }, E);
+  const g = L(e, F.Label), C = L(e, F.Input), s = x(() => p || [], [
+    p
+  ]), O = x(() => i ? s.find((I) => I === a || I.startsWith(`${a}: `)) || a : n, [
+    i,
+    s,
+    a,
+    n
+  ]), V = _((I) => {
+    if (!i)
+      return;
+    const S = k(f || []), D = s.filter((H) => S.includes(H)), G = I ? [
+      ...D,
+      a
+    ] : D;
+    c == null || c(G);
+  }, [
+    i,
+    a,
+    c,
+    f,
+    s
+  ]);
+  return /* @__PURE__ */ d.createElement(A, {
+    value: O,
+    onChange: i ? V : void 0,
+    isDisabled: b,
+    isReadOnly: u,
+    isInvalid: l
+  }, /* @__PURE__ */ d.createElement(j, {
+    ref: h,
+    className: t,
+    "data-hook": `checkbox-${a}`
+  }, C, y(g, {
+    label: a
+  })));
+};
+F.Label = ce;
+F.Input = re;
+const q = ({ children: e, ...t }) => {
+  const { value: o, label: n, isFirst: a = !1, isOther: r = !1, fieldId: i } = t, E = N(), { value: m, onChange: p, options: c, addOtherPlaceholder: b, otherInputCharacterLimit: u, disabled: l, readOnly: f, hasError: h } = E, g = L(e, F), C = L(e, T), s = x(() => m || [], [
+    m
+  ]), O = x(() => {
+    if (!r)
+      return !1;
+    const V = k(c || []);
+    return B(s, V);
+  }, [
+    r,
+    s,
+    c
+  ]);
+  return /* @__PURE__ */ d.createElement(d.Fragment, null, y(g, {
+    value: o,
+    label: n,
+    isFirst: a,
+    isOther: r,
+    fieldId: i
+  }), r && O && y(C, {
+    fieldValue: s,
+    onChange: p,
+    label: n,
+    placeholder: b,
+    maxLength: u,
+    disabled: l,
+    readOnly: f,
+    hasError: h,
+    ariaLabel: n,
+    addOtherLabel: n,
+    options: c
+  }));
+}, T = ({ className: e, inputClassName: t, ...o }) => {
+  const { fieldValue: n, onChange: a, label: r, placeholder: i, maxLength: E, disabled: m, readOnly: p, hasError: c, ariaLabel: b, addOtherLabel: u, options: l } = o, [f, h] = w(() => {
+    const s = k(l || []);
+    return B(n, s) ? M(n, u) : "";
+  });
+  U(() => {
+    const s = k(l || []), O = B(n, s);
+    h(O ? M(n, u) : "");
+  }, [
+    n,
+    l,
+    u
+  ]);
+  const g = x(() => K((s) => {
+    const O = k(l || []), V = n.filter((D) => O.includes(D)), I = s ? `${u}: ${s}` : r, S = [
+      ...V,
+      I
+    ];
+    a(S);
+  }, 500), [
+    a,
+    l,
+    n,
+    u,
+    r
+  ]), C = _((s) => {
+    h(s), g(s);
+  }, [
+    g
+  ]);
+  return /* @__PURE__ */ d.createElement(z, {
+    "aria-label": b,
+    value: f,
+    onChange: C,
+    isDisabled: m,
+    isReadOnly: p,
+    isInvalid: c,
+    className: e
+  }, /* @__PURE__ */ d.createElement(J, {
+    className: t,
+    placeholder: i,
+    maxLength: E,
+    "aria-label": b
+  }));
+};
+v.Label = ae;
+v.Options = $;
+$.Option = q;
+q.Checkbox = F;
+q.OtherInput = T;
+v.Description = ee;
+v.Error = te;
+export {
+  v as C
+};

package/dist/component/checkbox-group-field-rac-B1tFZT3o.js

@@ -0,0 +1,33 @@
+import { RicosViewer as l } from "@wix/ricos/viewer";
+import r from "classnames";
+import e from "react";
+import { C as t } from "./checkbox-group-field-headless-4HlJmarB.js";
+import { E as c } from "./error-icon-hZxQ6DEy.js";
+import { s as a } from "./field-rac.module-DAPTqFDM.js";
+import { r as m, H as i, a as E, b as p, c as O, q as _, l as C, h as L } from "./form-element-classes-Bi-nNM8q.js";
+import { o } from "./options-rac.module-KM-VT_KY.js";
+const R = ({ content: s, locale: n }) => /* @__PURE__ */ e.createElement(l, {
+  content: s,
+  locale: n
+}), h = () => /* @__PURE__ */ e.createElement(t, null, /* @__PURE__ */ e.createElement(t.Label, {
+  className: r(m, a.label)
+}, /* @__PURE__ */ e.createElement(t.Label.Required, {
+  className: r(i, a.requiredMark)
+})), /* @__PURE__ */ e.createElement(t.Options, {
+  className: r(E, o.options)
+}, /* @__PURE__ */ e.createElement(t.Options.Option, null, /* @__PURE__ */ e.createElement(t.Options.Option.Checkbox, {
+  className: a.checkbox
+}, /* @__PURE__ */ e.createElement(t.Options.Option.Checkbox.Input, {
+  className: r(p, a.checkboxInput)
+}), /* @__PURE__ */ e.createElement(t.Options.Option.Checkbox.Label, {
+  className: r(O, o.optionLabel)
+})), /* @__PURE__ */ e.createElement(t.Options.Option.OtherInput, {
+  inputClassName: r(_, a.input)
+}))), /* @__PURE__ */ e.createElement(t.Error, {
+  className: r(C, a.error)
+}, /* @__PURE__ */ e.createElement(c, null), /* @__PURE__ */ e.createElement(t.Error.Text, null)), /* @__PURE__ */ e.createElement(t.Description, {
+  className: r(L, a.description)
+}, R));
+export {
+  h as C
+};

package/dist/component/checkbox-group-rac-C0SzN2Bx.js

@@ -0,0 +1,6 @@
+import e from "react";
+import { C as o } from "./checkbox-group-field-rac-B1tFZT3o.js";
+const c = () => /* @__PURE__ */ e.createElement(o, null);
+export {
+  c as CheckboxGroupRAC
+};

package/dist/component/checkbox-rac-ssJIVvZI.js

@@ -0,0 +1,6 @@
+import e from "react";
+import { C as o } from "./checkbox-field-rac-CaloY2Hs.js";
+const c = () => /* @__PURE__ */ e.createElement(o, null);
+export {
+  c as CheckboxRAC
+};

package/dist/component/chevron-down-icon-CcpVm6B-.js

@@ -0,0 +1,15 @@
+import e from "react";
+const o = (t) => /* @__PURE__ */ e.createElement("svg", {
+  width: 16,
+  height: 16,
+  viewBox: "0 0 20 20",
+  fill: "currentColor",
+  "aria-hidden": "true",
+  ...t
+}, /* @__PURE__ */ e.createElement("path", {
+  fillRule: "evenodd",
+  d: "M15.6478199,6.64528691 L16.3549267,7.35239369 L11.0627131,12.6461801 L11.0652534,12.6489483 L10.3581467,13.356055 L10.3557131,13.3531801 L10.3548199,13.3549267 L9.64771309,12.6478199 L9.64771309,12.6451801 L4.35471309,7.35228691 L5.06181987,6.64518013 L10.3547131,11.9381801 L15.6478199,6.64528691 Z"
+}));
+export {
+  o as C
+};

package/dist/component/contacts-address-rac-Dwf4yrGq.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { T as e } from "./text-input-field-rac-DF9dD_KW.js";
+const n = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  n as ContactsAddressRAC
+};

package/dist/component/contacts-birthdate-rac-C195rG5w.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { D as e } from "./date-input-field-rac-BnFvhqe1.js";
+const a = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  a as ContactsBirthdateRAC
+};

package/dist/component/contacts-company-rac-BHX6xZU8.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { T as e } from "./text-input-field-rac-DF9dD_KW.js";
+const n = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  n as ContactsCompanyRAC
+};

package/dist/component/contacts-email-rac-CFY-m-r2.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { E as e } from "./email-input-field-rac-C7Wn2XVU.js";
+const o = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  o as ContactsEmailRAC
+};

package/dist/component/contacts-first-name-rac-D23QFUGK.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { T as e } from "./text-input-field-rac-DF9dD_KW.js";
+const m = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  m as ContactsFirstNameRAC
+};

package/dist/component/contacts-last-name-rac-COuQB15p.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { T as e } from "./text-input-field-rac-DF9dD_KW.js";
+const a = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  a as ContactsLastNameRAC
+};

package/dist/component/contacts-phone-rac-BfhY_I7p.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { P as e } from "./phone-input-field-rac-Cd7RFaoD.js";
+const r = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  r as ContactsPhoneRAC
+};

package/dist/component/contacts-position-rac-D80_knc8.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { T as e } from "./text-input-field-rac-DF9dD_KW.js";
+const n = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  n as ContactsPositionRAC
+};

package/dist/component/contacts-subscribe-rac--NuPoBFm.js

@@ -0,0 +1,13 @@
+import C from "react";
+import { C as _ } from "./checkbox-field-rac-CaloY2Hs.js";
+import { P as e, Q as o, O as r } from "./form-element-classes-Bi-nNM8q.js";
+const a = () => /* @__PURE__ */ C.createElement(_, {
+  classes: {
+    container: r,
+    label: o,
+    control: e
+  }
+});
+export {
+  a as ContactsSubscribeRAC
+};

package/dist/component/contacts-tax-id-rac-BURE313k.js

@@ -0,0 +1,6 @@
+import t from "react";
+import { T as e } from "./text-input-field-rac-DF9dD_KW.js";
+const n = () => /* @__PURE__ */ t.createElement(e, null);
+export {
+  n as ContactsTaxIdRAC
+};

package/dist/component/custom-focus-class-_483Pkwp.js

@@ -0,0 +1,4 @@
+const s = "has-custom-focus";
+export {
+  s as H
+};

package/dist/component/data-hooks-Dkw1pbRj.js

@@ -0,0 +1,6 @@
+var e = /* @__PURE__ */ (function(E) {
+  return E.OPTION = "option", E.FIELD_SETTINGS_PANEL_ADD_NEW_OPTION_BUTTON = "add-new-option-button", E.FIELD_SETTINGS_PANEL_ADD_OTHER_OPTION = "add-other-option-toggle-switch", E.FIELD_SETTINGS_PANEL_OPTION_LABEL = "field-settings-panel-option-label", E.FIELD_SETTINGS_PANEL_PRODUCT_LABEL = "field-settings-panel-product-label", E.FIELD_SETTINGS_PANEL_BULK_EDIT_BUTTON = "field-settings-panel-bulk-edit-button", E.FIELD_SETTINGS_PANEL_BULK_EDIT_MODAL = "field-settings-panel-bulk-edit-modal", E.FIELD_SETTINGS_PANEL_BULK_EDIT_MODAL_LAYOUT = "field-settings-panel-bulk-edit-modal-layout", E.FIELD_SETTINGS_PANEL_LABEL_FORM_FIELD = "field-settings-label-form-field", E.FIELD_SETTINGS_PANEL_LABEL_INPUT = "field-settings-label", E.FIELD_SETTINGS_PANEL_CONTENT = "field-settings-panel-content", E.FIELD_SETTINGS_TABS = "field-settings-tabs", E.LABEL_MEDIA_TOGGLE = "label-media-toggle", E.LABEL_MEDIA_ADD_IMAGE = "label-media-add-image", E.LABEL_MEDIA_IMAGE_SETTINGS_MENU = "label-media-image-settings-menu", E.LABEL_MEDIA_IMAGE_SETTINGS_MENU_TRIGGER = "label-media-image-settings-menu-button", E.LABEL_MEDIA_DELETE_IMAGE = "label-media-delete-image", E.LABEL_MEDIA_IMAGE_SETTINGS = "label-media-image-settings", E.LABEL_MEDIA_IMAGE_FIT_TOGGLE = "label-media-image-fit-toggle", E.LABEL_MEDIA_IMAGE_FIT_COVER = "label-media-image-fit-cover", E.LABEL_MEDIA_IMAGE_FIT_CONTAIN = "label-media-image-fit-contain", E.LABEL_MEDIA_IMAGE_ALIGNMENT_TOGGLE = "label-media-image-alignment-toggle", E.LABEL_MEDIA_IMAGE_ALIGNMENT_LEFT = "label-media-image-alignment-left", E.LABEL_MEDIA_IMAGE_ALIGNMENT_CENTER = "label-media-image-alignment-center", E.LABEL_MEDIA_IMAGE_ALIGNMENT_RIGHT = "label-media-image-alignment-right", E.SHOW_FLAG_TOGGLE = "show-flag-toggle", E.DEFAULT_COUNTRY_TOGGLE = "default-country-toggle", E.DEFAULT_COUNTRY_DROPDOWN = "default-country-dropdown", E.DEFAULT_DESCRIPTION_TOGGLE = "description-toggle-switch", E.PLACEHOLDER_TOGGLE = "placeholder-toggle-switch", E.SHOW_DATE_LABELS_TOGGLE = "show-date-labels-toggle-switch", E.PLACEHOLDER_INPUT = "placeholder-input", E.OTHER_OPTION_INPUT = "other-option-input", E.DONATION_AMOUNT_OPTION = "donation-amount-option", E.DROPDOWN_DEFAULT_OPTION_TOGGLE = "default-view-toggle-switch", E.SIGNATURE_FIELD_MODE_SELECT = "signature-field-mode-select", E.CHECKED_BY_DEFAULT_TOGGLE = "checked-by-default-toggle-switch", E.ALLOWED_COUNTRIES_TOGGLE = "allowed-countries-toggle", E.ALLOWED_COUNTRIES_MODAL_TRIGGER = "allowed-countries-modal-trigger", E.ALLOWED_COUNTRIES_MODAL = "allowed-countries-modal", E.ALLOWED_COUNTRIES_MODAL_LAYOUT = "allowed-countries-modal-layout", E.ALLOWED_COUNTRIES_MODAL_SEARCH = "allowed-countries-modal-search", E.ALLOWED_COUNTRIES_MODAL_DESELECT_ALL = "allowed-countries-modal-deselect-all", E.ALLOWED_COUNTRIES_MODAL_SELECT_ALL = "allowed-countries-modal-select-all", E.ALLOWED_COUNTRIES_MODAL_FILTER = "allowed-countries-modal-filter", E.ALLOWED_COUNTRIES_MODAL_FILTER_TRIGGER = "allowed-countries-modal-filter-trigger-button", E.OPTIONS_BULK_EDIT_MODAL_INPUT_AREA = "options-bulk-edit-modal-input-area", E.ADD_PANEL_ITEM_TOOLTIP = "add-panel-item-tooltip", E.ADD_PANEL_ITEM = "add-panel-item", E.ADD_PANEL_ITEM_BUTTON = "add-panel-item-button", E.TOGGLE_TRUNCATE_BUTTON_READ_MORE = "toggle-truncate-button-read-more", E.TOGGLE_TRUNCATE_BUTTON_READ_LESS = "toggle-truncate-button-read-less", E.REGEX_SETTING_TOGGLE = "regex-setting-toggle", E.REGEX_SETTING_INPUT = "regex-setting-input", E.REGEX_SETTING_ERROR_MESSAGE_ADD_BUTTON = "regex-setting-error-message-add-button", E.REGEX_SETTING_ERROR_MESSAGE = "regex-setting-error-message", E.SUBMIT_BUTTON = "submit-button", E.POPOVER = "popover", E.OPTION_MENU_TRIGGER_BUTTON = "option-menu-trigger-button", E.DEFAULT_VALUE_TOGGLE = "default-value-toggle-switch", E.DEFAULT_VALUE_INPUT = "default-value-input", E.DEFAULT_VALUE_RADIO_GROUP = "default-value-radio-group", E.SCORE_SETTING_NUMBER_INPUT = "score-setting-number-input", E.OPTION_IMAGE_ASPECT_RATIO_DROPDOWN = "option-image-aspect-ratio-dropdown", E.OPTION_IMAGE_ALIGNMENT_TOGGLE = "option-image-alignment-toggle", E.DURATION_SETTING_DROPDOWN = "duration-setting-dropdown", E.DURATION_SETTING_HOURS_INPUT = "duration-setting-hours-input", E.DURATION_SETTING_MINUTES_INPUT = "duration-setting-minutes-input", E.AVAILABILITY_DATE_RANGE_START = "availability-date-range-start", E.AVAILABILITY_DATE_RANGE_END = "availability-date-range-end", E;
+})({});
+export {
+  e as D
+};

package/dist/component/date-availability-BQyNH-7j.js

@@ -0,0 +1,49 @@
+import { D as r } from "./form-DaOKiR16.js";
+const o = {
+  0: r.SUNDAY,
+  1: r.MONDAY,
+  2: r.TUESDAY,
+  3: r.WEDNESDAY,
+  4: r.THURSDAY,
+  5: r.FRIDAY,
+  6: r.SATURDAY
+}, c = /^(\d{4})-(\d{2})-(\d{2})$/;
+function i(t) {
+  const e = c.exec(t);
+  return !e || isNaN(new Date(t).getTime()) ? null : new Date(Number(e[1]), Number(e[2]) - 1, Number(e[3]));
+}
+function u(t) {
+  if (t instanceof Date)
+    return isNaN(t.getTime()) ? null : t;
+  const e = i(t);
+  if (e)
+    return e;
+  const n = new Date(t);
+  return isNaN(n.getTime()) ? null : n;
+}
+function D(t) {
+  return new Date(t.getFullYear(), t.getMonth(), t.getDate());
+}
+function f(t, e) {
+  if (!e.start || !e.end)
+    return !0;
+  const n = u(e.start), s = u(e.end);
+  if (!n || !s)
+    return !1;
+  const a = D(t);
+  return a >= D(n) && a <= D(s);
+}
+function A(t, e) {
+  var n, s;
+  if (e.availableDays) {
+    const a = o[t.getDay()];
+    if (!e.availableDays.includes(a))
+      return !1;
+  }
+  return !((n = e.availableDates) != null && n.length && !e.availableDates.some((a) => f(t, a)) || (s = e.unavailableDates) != null && s.length && e.unavailableDates.some((a) => f(t, a)));
+}
+export {
+  i as a,
+  A as i,
+  u as p
+};