@colabcommerce/elements 0.0.1 → 0.0.2

package/dist/ProductForm.js

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