@colabcommerce/elements 0.0.3 → 0.9.0

package/dist/ProductForm.js

@@ -1,348 +0,0 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import { useEffect as j, useState as E, Suspense as z } from "react";
-import { u as F, L as H, g as $, d as D, S as Q, b as U, k as J, f as V, A as K, c as G, w as X, h as Y, e as Z } from "./addressComponentsToAddress-CNK2WJ24.js";
-import { L as ee, F as te, Q as ae } from "./index-DqABFy0O.js";
-import { a as M, c as k, e as oe, h as b, i as ne, B as R, F as d, R as se, C as _, O as y, l as W, I as re, m as ie } from "./globals-C3lGVSJ0.js";
-import { S as le } from "./index-TPy0P4tu.js";
-const ce = () => {
-  const { locationName: m, setLocationName: l, setSearchCenter: c, setMapCenter: t, setLoadingGeo: f, getPosition: n } = F();
-  return /* @__PURE__ */ e(
-    H,
-    {
-      locationName: m,
-      setLocationName: l,
-      setSearchCenter: c,
-      setMapCenter: t,
-      handleLocate: () => {
-        f(!0), n();
-      }
-    }
-  );
-}, de = "_5BvSp", me = "NnCF-", ue = "OxA-3", he = "fIWeh", C = {
-  loading: de,
-  itemWrapper: me,
-  selected: ue,
-  wrapper: he
-}, pe = () => {
-  const { t: m } = M(), { locations: l, isLoading: c, focusedLocationId: t } = F();
-  function f(n, u) {
-    if (!n || !u) return;
-    const h = n.getBoundingClientRect(), i = u.getBoundingClientRect().top - h.top + n.scrollTop;
-    n.scrollTo({
-      top: i,
-      behavior: "smooth"
-    });
-  }
-  return j(() => {
-    const n = document.getElementById(`location-${t}`);
-    if (n) {
-      const u = document.getElementById("llw");
-      f(u, n);
-    }
-  }, [t]), c ? /* @__PURE__ */ e("div", { className: k(C.loading), children: /* @__PURE__ */ e("img", { src: "https://images.sofasandsectionals.com/cc/pal-loader.svg", width: "50", height: "50", alt: m("store_locator.loading") }) }) : /* @__PURE__ */ e("div", { className: k(C.wrapper), id: "llw", children: l.map((n) => /* @__PURE__ */ e("div", { className: t === n.id ? k(C.itemWrapper, C.selected) : k(C.itemWrapper), id: `location-${n.id}`, children: /* @__PURE__ */ e(ee, { id: n.id, location: n }) }, n.id)) });
-}, fe = "NQ6-h", _e = "_4wmyC", ge = "_9dVCP", P = {
-  wrapper: fe,
-  name: _e,
-  address: ge
-}, ve = () => {
-  var I, q, x, w, L, a, B;
-  const { cc_company_retailer_location_id: m } = $(), { distanceUnit: l, searchCenter: c, selectedLocation: t, setSelectedLocationId: f, selectedLocationId: n, setMessageModalOpen: u, setShowMap: h, setShowDetails: v } = F(), i = D({ lat: (I = t == null ? void 0 : t.address) == null ? void 0 : I.latitude, lng: (q = t == null ? void 0 : t.address) == null ? void 0 : q.longitude }, c), o = l === "km" ? i : J(i), N = Math.round(o * 10) / 10, S = (x = t == null ? void 0 : t.store_type) != null && x.includes("Studio") ? "studio" : "retailer";
-  return !t || t.location_id === m ? null : /* @__PURE__ */ e("div", { children: /* @__PURE__ */ s("div", { className: P.wrapper, children: [
-    /* @__PURE__ */ s("div", { className: "d-flex align-items-center justify-content-between", children: [
-      /* @__PURE__ */ e("h3", { className: P.name, children: t == null ? void 0 : t.retailer_name }),
-      /* @__PURE__ */ e("div", { className: "text-end", children: /* @__PURE__ */ e(Q, { type: S }) })
-    ] }),
-    /* @__PURE__ */ s("div", { className: "text-muted fs-6 fw-normal mt-1", children: [
-      N,
-      " ",
-      l
-    ] }),
-    /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(U, { hours: t == null ? void 0 : t.retailer_location_hours }) }),
-    /* @__PURE__ */ s("address", { className: P.address, children: [
-      /* @__PURE__ */ e("div", { children: (w = t == null ? void 0 : t.address) == null ? void 0 : w.street_line_one }),
-      /* @__PURE__ */ s("div", { children: [
-        (L = t == null ? void 0 : t.address) == null ? void 0 : L.city,
-        ", ",
-        (a = t == null ? void 0 : t.address) == null ? void 0 : a.province,
-        " ",
-        (B = t == null ? void 0 : t.address) == null ? void 0 : B.postal_code
-      ] })
-    ] })
-  ] }) });
-}, Ne = "KsfpB", be = "t-v-7", ye = "UFm9T", Ce = "c3v8k", g = {
-  changeLocationBtn: Ne,
-  submitButton: be,
-  successContainer: ye,
-  successBtn: Ce
-}, Se = ({ id: m, product: l = null, onSuccess: c, onCancel: t, onClose: f, optInText: n }) => {
-  l || console.warn("Colab Commerce: No product(s) provided to the ProductForm component.");
-  const { cc_company_retailer_location_id: u } = $(), { selectedLocationId: h, setSelectedLocationId: v, searchCenter: i } = F(), { t: o } = M("default"), [N, S] = E(!1), [I, q] = E(!1), x = {
-    firstName: "",
-    lastName: "",
-    email: "",
-    phone: "",
-    notes: ""
-  }, w = oe().shape({
-    firstName: b().required(o("quote_form.first_name_required")),
-    lastName: b().required(o("quote_form.last_name_required")),
-    email: b().email(o("quote_form.invalid_email")).required(o("quote_form.email_required")),
-    phone: b().required(o("quote_form.phone_required")),
-    notes: b()
-  }), a = ne({
-    initialValues: x,
-    validationSchema: w,
-    onSubmit: async (p) => {
-      X("AIzaSyAnJmWEU1r63DiRWHkjczxzHyIEq3dhj4M");
-      const T = await K(i == null ? void 0 : i.lat, i == null ? void 0 : i.lng), r = G(T.results[0].address_components), A = await fetch("https://api.colabcommerce.com/widget_api/leads", {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json"
-        },
-        body: JSON.stringify({
-          id: m,
-          lead: {
-            name: `${p.firstName} ${p.lastName}`,
-            emails_attributes: [{ email: p.email }],
-            phone_numbers_attributes: [{ phone_number: p.phone, country_code: "US" }],
-            message: p.message,
-            opt_in: p.optIn,
-            location_attributes: {
-              street_line_one: r == null ? void 0 : r.addressLine1,
-              street_line_two: r == null ? void 0 : r.addressLine2,
-              city: r == null ? void 0 : r.city,
-              province: r == null ? void 0 : r.province,
-              postal_code: r == null ? void 0 : r.postalCode,
-              country: r == null ? void 0 : r.country,
-              latitude: (i == null ? void 0 : i.lat) || null,
-              longitude: (i == null ? void 0 : i.lng) || null
-            },
-            assignee_id: h || null,
-            assignee_type: "CompanyRetailerLocation",
-            lead_activities_attributes: [{
-              type: "LeadActivity::QuoteRequest",
-              products: [l],
-              notes: p.notes,
-              source_type: "Company",
-              source_id: m
-            }]
-          }
-        })
-      });
-      if (!A.ok) {
-        q(!0);
-        return;
-      }
-      const O = await A.json();
-      S(!0), c && c(O);
-    }
-  });
-  j(() => {
-    const p = document.getElementById("cc-accordion-anchor");
-    p && p.scrollIntoView({ behavior: "instant" });
-  }, [h]);
-  const B = () => {
-    S(!1), v(null), f && f();
-  };
-  return /* @__PURE__ */ s("div", { className: "cc", children: [
-    N && /* @__PURE__ */ e("div", { className: g.successContainer, children: /* @__PURE__ */ s("div", { className: "text-center", children: [
-      /* @__PURE__ */ e("h2", { className: "fw-bold fs-2", style: { marginBottom: "3.2rem" }, children: o("cart_form.success_title") }),
-      /* @__PURE__ */ e("div", { className: "fs-6", style: { fontWeight: 600, marginBottom: "3.2rem" }, children: o("cart_form.success_message") }),
-      /* @__PURE__ */ e(R, { variant: "dark", className: g.successBtn, onClick: B, children: o("cart_form.success_button") })
-    ] }) }),
-    !N && /* @__PURE__ */ s("div", { id: "cc-accordion-anchor", children: [
-      !h && /* @__PURE__ */ s("div", { children: [
-        /* @__PURE__ */ e("div", { className: "mb-3", children: /* @__PURE__ */ e(ce, {}) }),
-        /* @__PURE__ */ s("div", { className: "position-relative", children: [
-          /* @__PURE__ */ e(V, {}),
-          /* @__PURE__ */ e(le, {})
-        ] }),
-        /* @__PURE__ */ e(te, {}),
-        /* @__PURE__ */ e(pe, {})
-      ] }),
-      h && /* @__PURE__ */ s("div", { children: [
-        /* @__PURE__ */ s("div", { children: [
-          /* @__PURE__ */ s("div", { className: "d-flex align-items-center justify-content-between px-3 mb-2 fs-6", children: [
-            /* @__PURE__ */ e("span", { className: "fw-bold", children: u === h ? "" : o("quote.selected_location.title") }),
-            /* @__PURE__ */ e("button", { onClick: () => v(null), className: g.changeLocationBtn, children: o("quote.change_location") })
-          ] }),
-          /* @__PURE__ */ e("div", { className: g.selectedLocation, children: /* @__PURE__ */ e(ve, {}) })
-        ] }),
-        /* @__PURE__ */ e("div", { className: "p-3", children: /* @__PURE__ */ e(d, { onSubmit: a.handleSubmit, className: g.form, children: /* @__PURE__ */ s(se, { children: [
-          /* @__PURE__ */ e(_, { xs: 12, md: 12, children: /* @__PURE__ */ s(
-            y,
-            {
-              controlId: "floatingInput",
-              label: o("quote_form.first_name"),
-              className: "mb-3",
-              children: [
-                /* @__PURE__ */ e(
-                  d.Control,
-                  {
-                    type: "text",
-                    name: "firstName",
-                    placeholder: o("quote_form.first_name_placeholder"),
-                    onChange: a.handleChange,
-                    value: a.values.firstName,
-                    className: "rounded-0",
-                    isInvalid: !!a.errors.firstName
-                  }
-                ),
-                /* @__PURE__ */ e(d.Control.Feedback, { type: "invalid", children: a.errors.firstName })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e(_, { xs: 12, md: 12, children: /* @__PURE__ */ s(
-            y,
-            {
-              controlId: "floatingInput",
-              label: o("quote_form.last_name"),
-              className: "mb-3",
-              children: [
-                /* @__PURE__ */ e(
-                  d.Control,
-                  {
-                    type: "text",
-                    name: "lastName",
-                    className: "rounded-0",
-                    placeholder: o("quote_form.last_name_placeholder"),
-                    onChange: a.handleChange,
-                    value: a.values.lastName,
-                    isInvalid: !!a.errors.lastName
-                  }
-                ),
-                /* @__PURE__ */ e(d.Control.Feedback, { type: "invalid", children: a.errors.lastName })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e(_, { xs: 12, md: 12, children: /* @__PURE__ */ s(
-            y,
-            {
-              controlId: "floatingInput",
-              label: o("quote_form.email"),
-              className: "mb-3",
-              children: [
-                /* @__PURE__ */ e(
-                  d.Control,
-                  {
-                    type: "email",
-                    name: "email",
-                    className: "rounded-0",
-                    placeholder: o("quote_form.email_placeholder"),
-                    onChange: a.handleChange,
-                    value: a.values.email,
-                    isInvalid: !!a.errors.email
-                  }
-                ),
-                /* @__PURE__ */ e(d.Control.Feedback, { type: "invalid", children: a.errors.email })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e(_, { xs: 12, md: 12, children: /* @__PURE__ */ s(
-            y,
-            {
-              controlId: "floatingInput",
-              label: o("quote_form.phone"),
-              className: "mb-3",
-              children: [
-                /* @__PURE__ */ e(
-                  d.Control,
-                  {
-                    type: "text",
-                    name: "phone",
-                    className: "rounded-0",
-                    placeholder: o("quote_form.phone_placeholder"),
-                    onChange: a.handleChange,
-                    value: a.values.phone,
-                    isInvalid: !!a.errors.phone
-                  }
-                ),
-                /* @__PURE__ */ e(d.Control.Feedback, { type: "invalid", children: a.errors.phone })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e(_, { xs: 12, children: /* @__PURE__ */ s(
-            y,
-            {
-              controlId: "floatingTextarea",
-              label: o("quote_form.notes"),
-              className: ["mb-3", g.textarea].join(" "),
-              children: [
-                /* @__PURE__ */ e(
-                  d.Control,
-                  {
-                    as: "textarea",
-                    name: "notes",
-                    className: "rounded-0",
-                    placeholder: o("quote_form.notes_placeholder"),
-                    onChange: a.handleChange,
-                    value: a.values.notes,
-                    isInvalid: !!a.errors.notes,
-                    style: { height: "100px" }
-                  }
-                ),
-                /* @__PURE__ */ e(d.Control.Feedback, { type: "invalid", children: a.errors.notes })
-              ]
-            }
-          ) }),
-          n && /* @__PURE__ */ s(_, { xs: 12, children: [
-            /* @__PURE__ */ e(
-              d.Check,
-              {
-                name: "optIn",
-                type: "checkbox",
-                label: n,
-                className: "mb-3 fs-6",
-                onChange: a.handleChange,
-                isInvalid: !!a.errors.optIn
-              }
-            ),
-            /* @__PURE__ */ e(d.Control.Feedback, { type: "invalid", children: a.errors.optIn })
-          ] }),
-          /* @__PURE__ */ s(_, { xs: 12, className: "text-start d-flex align-items-center", children: [
-            /* @__PURE__ */ e(R, { type: "submit", variant: "dark", className: g.submitButton, disabled: N, children: a.isSubmitting ? o("quote.submitting") : o("quote_form.submit") }),
-            I && /* @__PURE__ */ e("div", { className: "text-danger ms-2", children: o("quote_form.error") }),
-            N && /* @__PURE__ */ e("div", { className: "text-success ms-2", children: o("quote_form.success") })
-          ] })
-        ] }) }) })
-      ] })
-    ] })
-  ] });
-}, Fe = ({
-  id: m,
-  // The entity ID for the Store Locator.
-  locale: l,
-  product: c,
-  filterRetailerByStockedProduct: t = !1,
-  filterRetailerByAvailableProduct: f = !1,
-  optInText: n = null,
-  onCancel: u,
-  onClose: h,
-  onSuccess: v
-}) => (j(() => {
-  W.changeLanguage(l);
-}, [l]), c || (console.warn("Colab Commerce: No product(s) provided to the ProductForm component."), c = []), /* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(re, { i18n: W, children: /* @__PURE__ */ e(ie, { apiKey: "AIzaSyAnJmWEU1r63DiRWHkjczxzHyIEq3dhj4M", libraries: ["places"], children: /* @__PURE__ */ e(Y, { id: m, children: /* @__PURE__ */ e(
-  Z,
-  {
-    id: m,
-    locale: l,
-    filterRetailerByStockedProduct: t,
-    filterRetailerByAvailableProduct: f,
-    optInText: n,
-    autoLocate: !0,
-    products: [c],
-    children: /* @__PURE__ */ e(ae, { children: /* @__PURE__ */ e(
-      Se,
-      {
-        id: m,
-        product: c,
-        onSuccess: v,
-        optInText: n,
-        onCancel: u,
-        onClose: h
-      }
-    ) })
-  }
-) }) }) }) }));
-export {
-  Fe as default
-};