@colabcommerce/elements 0.0.1 → 0.0.3

package/dist/index-DqABFy0O.js

@@ -0,0 +1,137 @@
+import { jsx as t, jsxs as g } from "react/jsx-runtime";
+import { createContext as Q, useState as c } from "react";
+import { i as R, u as z, d as Y, S as V, l as K, b as W, k as X, g as J } from "./addressComponentsToAddress-CNK2WJ24.js";
+import { d as $, a as U, Q as H, c as u, B as ee } from "./globals-C3lGVSJ0.js";
+/**
+ * @license lucide-react v0.542.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const se = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]], te = $("check", se);
+/**
+ * @license lucide-react v0.542.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const ne = [
+  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
+  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
+], j = $("x", ne), oe = Q(), we = ({ product: e, children: l }) => {
+  const [n, d] = c(0), m = {
+    currentStep: n,
+    setCurrentStep: d,
+    product: e
+  };
+  return /* @__PURE__ */ t(oe.Provider, { value: m, children: l });
+}, ae = Q(), ye = ({ children: e }) => {
+  const [l, n] = c(null), [d, m] = c(null), [_, r] = c(null), [C, N] = c(null), [k, v] = c(null), [D, x] = c(null), [L, S] = c(""), [I, o] = c(!1), [a, f] = c(!1), { coords: w, isGeolocationAvailable: y, isGeolocationEnabled: O, getPosition: B } = R({ suppressLocationOnMount: !0, onError: () => f(!1), onSuccess: () => f(!1), positionOptions: { enableHighAccuracy: !1 }, userDecisionTimeout: 5e3 }), F = {
+    lat: l,
+    lng: d,
+    isLoading: I,
+    setIsLoading: o,
+    locationName: L,
+    setLocationName: S,
+    setLocation: ({ lat: h, lng: p }) => {
+      n(h), m(p);
+    },
+    mapCenter: { lat: _, lng: C },
+    setMapCenter: ({ lat: h, lng: p }) => {
+      r(h), N(p);
+    },
+    searchCenter: { lat: k, lng: D },
+    setSearchCenter: ({ lat: h, lng: p }) => {
+      v(h), x(p);
+    },
+    loadingGeo: a,
+    geoCoords: w,
+    isGeolocationAvailable: y,
+    isGeolocationEnabled: O,
+    getPosition: B
+  };
+  return /* @__PURE__ */ t(ae.Provider, { value: F, children: e });
+}, ce = "oHxQR", re = "ggY6v", ie = "B-vL7", de = "xpYRZ", le = "PD0AO", ue = "i1mIs", me = "TOu1q", he = "BYI6o", pe = "_8Athb", ge = "wpcV2", s = {
+  header: ce,
+  name: re,
+  address: ie,
+  distance: de,
+  selectBtn: le,
+  productList: ue,
+  productHeader: me,
+  productItem: he,
+  inStock: pe,
+  outOfStock: ge
+}, De = ({ location: e, showProducts: l = !1 }) => {
+  var P, T, A;
+  const { t: n, i18n: d } = U(), m = d.language, _ = K(m), { products: r, searchCenter: C, setSelectedLocationId: N, selectedLocationId: k, setFocusedLocationId: v, setShowMap: D, setShowDetails: x } = z(), L = Y({ lat: (P = e == null ? void 0 : e.address) == null ? void 0 : P.latitude, lng: (T = e.address) == null ? void 0 : T.longitude }, C), S = _ === "km" ? L : X(L), I = Math.round(S * 10) / 10, o = e.retailer_location_hours.find((i) => i.day === (/* @__PURE__ */ new Date()).getDay()), a = /* @__PURE__ */ new Date();
+  let f = /* @__PURE__ */ new Date();
+  o && (f = new H(a.getUTCFullYear(), a.getMonth(), a.getDate(), o.open_at_hour, o.open_at_minute, 0, 0, o.timezone));
+  let w = /* @__PURE__ */ new Date();
+  o && (w = new H(a.getUTCFullYear(), a.getMonth(), a.getDate(), o.close_at_hour, o.close_at_minute, 0, 0, o.timezone));
+  const y = o && a >= f && a <= w, O = o && !y && a - f > 30 * 6e4 * -1, B = o && y && w - a < 30 * 6e4;
+  y ? B ? (u(s.hours, s.soon), n("store.closingSoon")) : (u(s.hours, s.open), n("store.openNow")) : O ? (u(s.hours, s.soon), n("store.openingSoon")) : (u(s.hours, s.closed), n("store.closedNow"));
+  const F = () => {
+    N(e.id);
+  }, h = () => {
+    v(e.id);
+  }, p = e.id === k ? u(s.wrapper, s.selected) : u(s.wrapper), q = (A = e == null ? void 0 : e.store_type) != null && A.includes("Studio") ? "studio" : "retailer", E = r == null ? void 0 : r.map((i) => {
+    var G;
+    const Z = (G = e == null ? void 0 : e.retailer_location_products) == null ? void 0 : G.some((M) => (M.sku === i.sku || M.external_id === i.external_id || M.collection_id === i.collection_id) && M.stocked);
+    return { ...i, isStocked: Z };
+  });
+  return /* @__PURE__ */ g("div", { className: p, onClick: h, children: [
+    /* @__PURE__ */ g("div", { className: s.header, children: [
+      /* @__PURE__ */ t("h4", { className: s.name, children: e.retailer_name }),
+      /* @__PURE__ */ t("div", { className: "text-end", children: /* @__PURE__ */ t(V, { type: q }) })
+    ] }),
+    /* @__PURE__ */ g("div", { className: u(s.distance), children: [
+      I,
+      " ",
+      _,
+      " ",
+      n("away")
+    ] }),
+    /* @__PURE__ */ t("section", { className: `${s.hoursWrapper} d-flex justify-content-between align-items-center pe-3`, children: /* @__PURE__ */ t(W, { hours: e == null ? void 0 : e.retailer_location_hours }) }),
+    /* @__PURE__ */ t("address", { className: u(s.address), children: /* @__PURE__ */ g("div", { children: [
+      e.address.street_line_one,
+      e.address.street_line_two && `, ${e.address.street_line_two}`,
+      " ",
+      e.address.city,
+      ", ",
+      e.address.province,
+      " ",
+      e.address.postal_code
+    ] }) }),
+    (r == null ? void 0 : r.length) > 0 && l && /* @__PURE__ */ g("div", { children: [
+      /* @__PURE__ */ t("div", { className: s.productHeader, children: n("quote.location.product_availability") }),
+      /* @__PURE__ */ t("div", { className: s.productList, children: E.map((i) => /* @__PURE__ */ g("div", { className: s.productItem, children: [
+        /* @__PURE__ */ t("div", { className: s.productStatus, children: i.isStocked ? /* @__PURE__ */ t(te, { className: s.inStock, size: 20 }) : /* @__PURE__ */ t(j, { className: s.outOfStock, size: 20 }) }),
+        /* @__PURE__ */ t("div", { className: s.productName, children: i.name })
+      ] }, i.name)) })
+    ] }),
+    /* @__PURE__ */ t(ee, { variant: "dark", size: "sm", onClick: F, className: `d-flex align-items-center px-3 py-2 ${s.selectBtn}`, children: n("quote.location.select_location") })
+  ] });
+}, _e = "QMwKB", Le = "tlZ-O", Se = "NQEG7", fe = "MGV0F", b = {
+  wrapper: _e,
+  message: Le,
+  dismiss: Se,
+  cta: fe
+}, xe = ({ onSelect: e, onDismiss: l }) => {
+  const { t: n } = U(), { locations: d, searchCenter: m, setSelectedLocationId: _, isLoading: r } = z(), { cc_company_retailer_location_id: C } = J(), [N, k] = c(!1), v = d.length > 0 ? Math.min(...d.map((S) => Y({ lat: S.address.latitude, lng: S.address.longitude }, m))) : null, D = !N && (d.length === 0 || v > 100) && !r, x = () => {
+    _(C);
+  }, L = () => {
+    k(!0), l && l();
+  };
+  return D ? /* @__PURE__ */ g("div", { className: b.wrapper, children: [
+    /* @__PURE__ */ t("button", { className: b.dismiss, onClick: L, children: /* @__PURE__ */ t(j, { size: 20 }) }),
+    /* @__PURE__ */ t("p", { className: b.message, children: n("form_out_of_area.message") }),
+    /* @__PURE__ */ t("button", { className: b.cta, onClick: x, children: n("form_out_of_area.cta") })
+  ] }) : null;
+};
+export {
+  xe as F,
+  De as L,
+  we as Q,
+  ye as a
+};

package/dist/index-TPy0P4tu.js

@@ -0,0 +1,98 @@
+import { jsxs as Z, jsx as p } from "react/jsx-runtime";
+import { useState as k, useEffect as y, useCallback as x } from "react";
+import { j as v, A as z, o as E, a as j, k as D, M as N } from "./globals-C3lGVSJ0.js";
+import { u as I } from "./addressComponentsToAddress-CNK2WJ24.js";
+const P = "lzEEu", _ = {
+  label: P
+}, T = ({ location: t }) => {
+  var r, a, m, h, b;
+  const { setSelectedLocationId: u, selectedLocationId: L, setShowDetails: c, settings: o } = I(), i = ((r = o == null ? void 0 : o.entity) == null ? void 0 : r.store_type_icons) || [], d = (a = o == null ? void 0 : o.entity) == null ? void 0 : a.store_locator_default_store_icon, [w, l] = k(!1), e = () => {
+    u(t.id);
+  }, S = () => {
+    l(!0);
+  }, M = () => {
+    l(!1);
+  }, f = v(), g = L === t.id, C = (t == null ? void 0 : t.store_type) === "Palliser Studio", s = i == null ? void 0 : i.find((B) => B.name === t.store_type);
+  return s != null && s.url || (C ? f.studioSelected : f.standardSelected), /* @__PURE__ */ Z(
+    z,
+    {
+      onClick: e,
+      onMouseEnter: S,
+      onMouseLeave: M,
+      zIndex: g ? w ? 3 : 2 : w ? 1 : 0,
+      position: { lat: ((m = t == null ? void 0 : t.address) == null ? void 0 : m.latitude) * 1, lng: ((h = t.address) == null ? void 0 : h.longitude) * 1 },
+      children: [
+        w && /* @__PURE__ */ p("div", { className: _.label, children: t.retailer_name }),
+        /* @__PURE__ */ p("img", { src: ((b = s == null ? void 0 : s.icon) == null ? void 0 : b.url) || (d == null ? void 0 : d.url), width: g ? 32 : 24, className: E("markerIcon", _, "map-marker") })
+      ]
+    }
+  );
+}, U = "wdRt8", $ = {
+  map: U
+}, q = () => {
+  const {
+    locations: t,
+    selectedLocationId: u,
+    searchCenter: L,
+    mapCenter: c,
+    setMapCenter: o,
+    zoom: i,
+    setZoom: d
+  } = I(), { t: w } = j(), l = D(), [e, S] = k(null);
+  y(() => {
+    l && S(l);
+  }, [l, S]);
+  const M = x((s) => {
+    var r, a, m, h;
+    if (!e) return;
+    o({ lat: (r = e == null ? void 0 : e.getCenter()) == null ? void 0 : r.lat(), lng: (a = e == null ? void 0 : e.getCenter()) == null ? void 0 : a.lng() });
+    const n = new URLSearchParams(window.location.search);
+    n.set("lat", ((m = e == null ? void 0 : e.getCenter()) == null ? void 0 : m.lat()) * 1), n.set("lng", ((h = e == null ? void 0 : e.getCenter()) == null ? void 0 : h.lng()) * 1), window.history.replaceState({}, "", `?${n.toString()}`);
+  }, [e, o]), f = x((s) => {
+    if (!e) return;
+    d(e == null ? void 0 : e.getZoom());
+    const n = new URLSearchParams(window.location.search);
+    n.set("zoom", (e == null ? void 0 : e.getZoom()) * 1), window.history.replaceState({}, "", `?${n.toString()}`);
+  }, [e, d]), g = () => {
+    if (!e) return;
+    let s = 0;
+    if (t.forEach((r) => {
+      var a;
+      (a = e == null ? void 0 : e.getBounds()) != null && a.contains({ lat: r.address.latitude * 1, lng: r.address.longitude * 1 }) && s++;
+    }), s >= 2) return;
+    const n = new window.google.maps.LatLngBounds();
+    t.slice(0, 2).map((r) => {
+      n.extend({ lat: r.address.latitude * 1, lng: r.address.longitude * 1 });
+    }), n.extend(c), e.fitBounds(n, 15);
+  }, C = (s) => {
+    var r;
+    if (!e) return;
+    const n = new window.google.maps.LatLngBounds();
+    (r = e == null ? void 0 : e.getBounds()) != null && r.contains({ lat: s.address.latitude * 1, lng: s.address.longitude * 1 }) || (n.extend({ lat: s.address.latitude * 1, lng: s.address.longitude * 1 }), n.extend(L), e.fitBounds(n, 150));
+  };
+  return y(() => {
+    if (u && t.length > 0) {
+      const s = t.find((n) => n.id === u);
+      s && C(s);
+    } else t.length > 0 && g();
+  }, [u, t, e]), y(() => {
+    t.length > 0 && g();
+  }, [t]), !c.lat || !c.lng ? null : /* @__PURE__ */ p(
+    N,
+    {
+      className: [$.map, "cc-map-map"].join(" "),
+      defaultZoom: i,
+      defaultCenter: c,
+      mapId: "fb10c7a27b297863",
+      gestureHandling: "greedy",
+      disableDefaultUI: !0,
+      zoomControl: !0,
+      onDragend: M,
+      onZoomChanged: f,
+      children: t == null ? void 0 : t.map((s) => /* @__PURE__ */ p(T, { location: s }, s.id))
+    }
+  );
+};
+export {
+  q as S
+};