@partbot/stockist-map 0.1.10 → 0.1.11

package/dist/stockist-search.js

@@ -1,6 +1,6 @@
 var ue = Object.defineProperty;
 var de = (e, t, r) => t in e ? ue(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
-var H = (e, t, r) => de(e, typeof t != "symbol" ? t + "" : t, r);
+var P = (e, t, r) => de(e, typeof t != "symbol" ? t + "" : t, r);
 import { jsxs as f, jsx as i } from "react/jsx-runtime";
 import { createRoot as J } from "react-dom/client";
 import * as s from "react";
@@ -26,7 +26,7 @@ const be = pe({
       size: A,
       weight: x = "regular",
       mirrored: T = !1,
-      ...E
+      ...k
     } = s.useContext(be);
     return /* @__PURE__ */ s.createElement(
       "svg",
@@ -38,7 +38,7 @@ const be = pe({
         fill: n ?? L,
         viewBox: "0 0 256 256",
         transform: Z || T ? "scale(-1, 1)" : void 0,
-        ...E,
+        ...k,
         ...v
       },
       !!r && /* @__PURE__ */ s.createElement("title", null, r),
@@ -114,7 +114,7 @@ const he = /* @__PURE__ */ new Map([
   ]
 ]), te = s.forwardRef((e, t) => /* @__PURE__ */ s.createElement(q, { ref: t, ...e, weights: he }));
 te.displayName = "XIcon";
-const me = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", se = "https://basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}@2x.png", re = "OpenStreetMap contributors, CARTO", ne = "https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json", D = {
+const me = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", se = "https://basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}@2x.png", re = "OpenStreetMap contributors, CARTO", ne = "https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json", O = {
   primaryColor: "#111111",
   markerColor: "#111111",
   borderRadius: 8,
@@ -125,7 +125,8 @@ const me = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", se = "https://basem
   styleUrl: ne,
   mapPalette: "monotone",
   tileUrl: se,
-  tileAttribution: re
+  tileAttribution: re,
+  phoneDisplay: "call_now"
 };
 function B(e) {
   const t = e.trim().replace(/^#/, ""), r = t.length === 3 ? t.split("").map((n) => `${n}${n}`).join("") : t;
@@ -135,7 +136,7 @@ function B(e) {
     b: Number.parseInt(r.slice(4, 6), 16)
   } : null;
 }
-function P({ r: e, g: t, b: r }) {
+function $({ r: e, g: t, b: r }) {
   const n = [e, t, r].map((l) => {
     const p = l / 255;
     return p <= 0.03928 ? p / 12.92 : ((p + 0.055) / 1.055) ** 2.4;
@@ -143,7 +144,7 @@ function P({ r: e, g: t, b: r }) {
   return 0.2126 * n[0] + 0.7152 * n[1] + 0.0722 * n[2];
 }
 function V(e, t) {
-  const r = Math.max(P(e), P(t)), n = Math.min(P(e), P(t));
+  const r = Math.max($(e), $(t)), n = Math.min($(e), $(t));
   return (r + 0.05) / (n + 0.05);
 }
 function ge(e, t = "#111111", r = "#ffffff") {
@@ -152,17 +153,18 @@ function ge(e, t = "#111111", r = "#ffffff") {
 }
 function xe(e = {}) {
   return {
-    ...D,
+    ...O,
     ...e,
     defaultCenter: {
-      ...D.defaultCenter,
+      ...O.defaultCenter,
       ...e.defaultCenter || {}
     },
     styleUrl: e.styleUrl || ne,
     mapPalette: e.mapPalette || "monotone",
-    borderRadius: Number.isFinite(Number(e.borderRadius)) ? Number(e.borderRadius) : D.borderRadius,
+    borderRadius: Number.isFinite(Number(e.borderRadius)) ? Number(e.borderRadius) : O.borderRadius,
     tileUrl: !e.tileUrl || e.tileUrl === me ? se : e.tileUrl,
     tileAttribution: e.tileAttribution || re,
+    phoneDisplay: e.phoneDisplay === "number" ? "number" : "call_now",
     radiusUnit: "km"
   };
 }
@@ -178,7 +180,7 @@ async function ve(e) {
   if (!t.ok) throw new Error(`Could not load stockist map config (${t.status})`);
   return t.json();
 }
-async function Ee(e, t = {}) {
+async function ke(e, t = {}) {
   const r = await fetch(we(e, t), { headers: { Accept: "application/json" } });
   if (!r.ok) throw new Error(`Could not search stockists (${r.status})`);
   const n = await r.json();
@@ -189,13 +191,13 @@ async function Ee(e, t = {}) {
     resolvedQuery: n.resolvedQuery || null
   };
 }
-const ke = 6371;
-function $(e) {
+const Ee = 6371;
+function D(e) {
   return e * Math.PI / 180;
 }
 function Se(e, t) {
-  const r = $(t.lat - e.lat), n = $(t.lng - e.lng), l = Math.sin(r / 2) ** 2 + Math.cos($(e.lat)) * Math.cos($(t.lat)) * Math.sin(n / 2) ** 2;
-  return 2 * ke * Math.atan2(Math.sqrt(l), Math.sqrt(1 - l));
+  const r = D(t.lat - e.lat), n = D(t.lng - e.lng), l = Math.sin(r / 2) ** 2 + Math.cos(D(e.lat)) * Math.cos(D(t.lat)) * Math.sin(n / 2) ** 2;
+  return 2 * Ee * Math.atan2(Math.sqrt(l), Math.sqrt(1 - l));
 }
 function Le(e) {
   return `${e.toFixed(1)} km`;
@@ -218,36 +220,39 @@ function Me(e) {
 function Ce(e) {
   return `https://www.google.com/maps/dir/?api=1&destination=${encodeURIComponent(`${e.lat},${e.lng}`)}`;
 }
-function Ne(e) {
-  return e.stockist_id ?? e.id;
+function Ne(e, t = "call_now") {
+  return t === "number" ? e : "Call now";
 }
 function Te(e) {
+  return e.stockist_id ?? e.id;
+}
+function Re(e) {
   const t = /* @__PURE__ */ new Set();
   return e.filter((r) => {
-    const n = Ne(r);
+    const n = Te(r);
     return t.has(n) ? !1 : (t.add(n), !0);
   });
 }
-const Re = 3, Ie = 100, W = 50, _e = 350;
+const _e = 3, Ie = 100, W = 50, Ue = 350;
 function G(e) {
   return e.display_address || e.address;
 }
-function Ue(e) {
+function ze(e) {
   var t;
   return (t = e.categories) != null && t.length ? e.categories : e.category ? [e.category] : [];
 }
-function ze(e, t) {
+function He(e, t) {
   const r = t == null ? void 0 : t[e];
   return r ? {
     "--pbss-category-color": r,
     "--pbss-category-contrast": ge(r)
   } : void 0;
 }
-function He(e, t) {
+function Pe(e, t) {
   const r = t ? e.map((n) => ({ ...n, distanceKm: Se(t, n._geo) })).sort((n, l) => (n.distanceKm || 0) - (l.distanceKm || 0)) : e;
-  return Te(r).slice(0, Re);
+  return Re(r).slice(0, _e);
 }
-function ae({
+function oe({
   token: e,
   configUrl: t,
   config: r,
@@ -258,65 +263,65 @@ function ae({
 }) {
   const [c, N] = s.useState(r || null), [v, L] = s.useState(l), [A, x] = s.useState(
     l.trim() ? "typed" : null
-  ), [T, E] = s.useState([]), [R, I] = s.useState(!1), [k, S] = s.useState(!1), [ie, d] = s.useState(!1), [K, y] = s.useState(!1), [_, h] = s.useState(null), M = s.useRef(null), m = s.useRef(0), w = s.useRef(0), C = s.useRef(null), j = s.useId(), F = s.useMemo(
+  ), [T, k] = s.useState([]), [R, _] = s.useState(!1), [E, S] = s.useState(!1), [ie, d] = s.useState(!1), [K, y] = s.useState(!1), [I, h] = s.useState(null), M = s.useRef(null), m = s.useRef(0), w = s.useRef(0), C = s.useRef(null), j = s.useId(), U = s.useMemo(
     () => xe({ ...(c == null ? void 0 : c.theme) || {}, ...n || {} }),
     [c == null ? void 0 : c.theme, n]
   ), b = s.useCallback(() => {
     C.current && (clearTimeout(C.current), C.current = null);
-  }, []), U = s.useCallback(() => {
-    m.current += 1, b(), E([]), I(!1), y(!1), h(null), d(!1);
-  }, [b]), z = s.useCallback(
-    async ({ activeQuery: a, center: o }) => {
+  }, []), z = s.useCallback(() => {
+    m.current += 1, b(), k([]), _(!1), y(!1), h(null), d(!1);
+  }, [b]), H = s.useCallback(
+    async ({ activeQuery: o, center: a }) => {
       if (!c) return;
       const u = m.current + 1;
-      m.current = u, b(), I(!0), y(!0), h(null), d(!0);
+      m.current = u, b(), _(!0), y(!0), h(null), d(!0);
       try {
-        const g = await Ee(c.search.url, {
-          query: a,
-          center: o,
+        const g = await ke(c.search.url, {
+          query: o,
+          center: a,
           radiusKm: W,
           limit: Ie,
-          locationSearch: !o && !!a
+          locationSearch: !a && !!o
         });
         if (u !== m.current) return;
-        E(He(g.hits, g.center || o));
+        k(Pe(g.hits, g.center || a));
       } catch (g) {
         if (u !== m.current) return;
-        E([]), h(g instanceof Error ? g.message : "Could not search stockists");
+        k([]), h(g instanceof Error ? g.message : "Could not search stockists");
       } finally {
-        u === m.current && I(!1);
+        u === m.current && _(!1);
       }
     },
     [b, c]
   );
   s.useEffect(() => {
-    if (w.current += 1, m.current += 1, b(), N(r || null), L(l), x(l.trim() ? "typed" : null), E([]), I(!1), S(!1), y(!1), d(!1), h(null), r) return;
-    const a = t || (e ? ye(e) : null);
-    if (!a) return;
-    let o = !1;
-    return ve(a).then((u) => {
-      o || N(u);
+    if (w.current += 1, m.current += 1, b(), N(r || null), L(l), x(l.trim() ? "typed" : null), k([]), _(!1), S(!1), y(!1), d(!1), h(null), r) return;
+    const o = t || (e ? ye(e) : null);
+    if (!o) return;
+    let a = !1;
+    return ve(o).then((u) => {
+      a || N(u);
     }).catch((u) => {
-      o || (h(u instanceof Error ? u.message : "Could not load stockist search"), y(!0), d(!0));
+      a || (h(u instanceof Error ? u.message : "Could not load stockist search"), y(!0), d(!0));
     }), () => {
-      o = !0;
+      a = !0;
     };
   }, [b, t, l, r, e]), s.useEffect(() => {
     if (!c || A !== "typed") return;
-    const a = v.trim();
-    if (!a) {
-      U();
+    const o = v.trim();
+    if (!o) {
+      z();
       return;
     }
     return b(), C.current = setTimeout(() => {
-      C.current = null, z({ activeQuery: a, center: null });
-    }, _e), b;
-  }, [b, c, v, U, z, A]), s.useEffect(() => {
-    const a = (o) => {
-      const u = typeof o.composedPath == "function" ? o.composedPath() : [], g = o.target instanceof Node ? o.target : null;
+      C.current = null, H({ activeQuery: o, center: null });
+    }, Ue), b;
+  }, [b, c, v, z, H, A]), s.useEffect(() => {
+    const o = (a) => {
+      const u = typeof a.composedPath == "function" ? a.composedPath() : [], g = a.target instanceof Node ? a.target : null;
       M.current && u.includes(M.current) || M.current && g && M.current.contains(g) || d(!1);
     };
-    return document.addEventListener("pointerdown", a), () => document.removeEventListener("pointerdown", a);
+    return document.addEventListener("pointerdown", o), () => document.removeEventListener("pointerdown", o);
   }, []), s.useEffect(
     () => () => {
       w.current += 1, m.current += 1, b();
@@ -324,7 +329,7 @@ function ae({
     [b]
   );
   const le = () => {
-    if (w.current += 1, U(), x(null), S(!1), typeof window < "u" && window.isSecureContext === !1) {
+    if (w.current += 1, z(), x(null), S(!1), typeof window < "u" && window.isSecureContext === !1) {
       h("Browser location is blocked on this site. Search by suburb or postcode instead."), y(!0), d(!0);
       return;
     }
@@ -335,41 +340,41 @@ function ae({
       return;
     }
     x("location"), S(!0), h(null), d(!0);
-    const a = w.current;
+    const o = w.current;
     navigator.geolocation.getCurrentPosition(
-      (o) => {
-        if (a !== w.current) return;
-        const u = { lat: o.coords.latitude, lng: o.coords.longitude };
-        L(""), S(!1), z({ activeQuery: "", center: u });
+      (a) => {
+        if (o !== w.current) return;
+        const u = { lat: a.coords.latitude, lng: a.coords.longitude };
+        L(""), S(!1), H({ activeQuery: "", center: u });
       },
-      (o) => {
-        a === w.current && (S(!1), y(!0), h(Ae(o)), d(!0));
+      (a) => {
+        o === w.current && (S(!1), y(!0), h(Ae(a)), d(!0));
       },
       { enableHighAccuracy: !1, timeout: 8e3 }
     );
   }, ce = () => {
-    const a = v.trim();
-    a && (x("typed"), z({ activeQuery: a, center: null }));
-  }, O = ie && (R || k || K || !!_);
+    const o = v.trim();
+    o && (x("typed"), H({ activeQuery: o, center: null }));
+  }, F = ie && (R || E || K || !!I);
   return /* @__PURE__ */ f(
     "div",
     {
       ref: M,
-      className: `pbss-root ${F.darkMode ? "is-dark" : ""} ${Z}`.trim(),
+      className: `pbss-root ${U.darkMode ? "is-dark" : ""} ${Z}`.trim(),
       style: {
-        "--pbss-primary": F.primaryColor,
-        "--pbss-radius": `${Math.max(0, F.borderRadius)}px`
+        "--pbss-primary": U.primaryColor,
+        "--pbss-radius": `${Math.max(0, U.borderRadius)}px`
       },
-      onKeyDown: (a) => {
-        a.key === "Escape" && d(!1);
+      onKeyDown: (o) => {
+        o.key === "Escape" && d(!1);
       },
       children: [
         /* @__PURE__ */ f("div", { className: "pbss-search-control", children: [
           /* @__PURE__ */ i(
             "input",
             {
-              "aria-controls": O ? j : void 0,
-              "aria-expanded": O,
+              "aria-controls": F ? j : void 0,
+              "aria-expanded": F,
               "aria-label": "Search stockists",
               autoComplete: "postal-code",
               className: "pbss-input",
@@ -377,34 +382,34 @@ function ae({
               placeholder: "Search suburb or postcode",
               type: "search",
               value: v,
-              onChange: (a) => {
-                const o = a.target.value;
-                w.current += 1, U(), S(!1), L(o), x(o.trim() ? "typed" : null);
+              onChange: (o) => {
+                const a = o.target.value;
+                w.current += 1, z(), S(!1), L(a), x(a.trim() ? "typed" : null);
               },
               onFocus: () => {
-                (R || k || K || _) && d(!0);
+                (R || E || K || I) && d(!0);
               },
-              onKeyDown: (a) => {
-                a.key === "Enter" && (a.preventDefault(), ce());
+              onKeyDown: (o) => {
+                o.key === "Enter" && (o.preventDefault(), ce());
               }
             }
           ),
           /* @__PURE__ */ f(
             "button",
             {
-              "aria-label": k ? "Finding your location" : "Use my location",
+              "aria-label": E ? "Finding your location" : "Use my location",
               className: "pbss-location-button",
-              disabled: k || R || !c,
+              disabled: E || R || !c,
               type: "button",
               onClick: le,
               children: [
-                k ? /* @__PURE__ */ i("span", { "aria-hidden": "true", className: "pbss-spinner" }) : /* @__PURE__ */ i(ee, { "aria-hidden": "true", "data-slot": "icon", weight: "bold" }),
+                E ? /* @__PURE__ */ i("span", { "aria-hidden": "true", className: "pbss-spinner" }) : /* @__PURE__ */ i(ee, { "aria-hidden": "true", "data-slot": "icon", weight: "bold" }),
                 /* @__PURE__ */ i("span", { "aria-hidden": "true", className: "pbss-touch-target" })
               ]
             }
           )
         ] }),
-        O && /* @__PURE__ */ f(
+        F && /* @__PURE__ */ f(
           "div",
           {
             "aria-label": "Nearest stockists",
@@ -428,38 +433,38 @@ function ae({
                   }
                 )
               ] }),
-              /* @__PURE__ */ i("div", { "aria-live": "polite", className: "pbss-results-status", children: R || k ? /* @__PURE__ */ i("div", { className: "pbss-loading", children: "Finding nearby stockists." }) : _ ? /* @__PURE__ */ i("div", { className: "pbss-error", children: _ }) : T.length > 0 ? /* @__PURE__ */ i("ul", { className: "pbss-results", role: "list", children: T.map((a) => {
-                const o = Me(a.website);
+              /* @__PURE__ */ i("div", { "aria-live": "polite", className: "pbss-results-status", children: R || E ? /* @__PURE__ */ i("div", { className: "pbss-loading", children: "Finding nearby stockists." }) : I ? /* @__PURE__ */ i("div", { className: "pbss-error", children: I }) : T.length > 0 ? /* @__PURE__ */ i("ul", { className: "pbss-results", role: "list", children: T.map((o) => {
+                const a = Me(o.website);
                 return /* @__PURE__ */ f("li", { className: "pbss-result", children: [
                   /* @__PURE__ */ f("div", { className: "pbss-result-heading", children: [
-                    /* @__PURE__ */ i("div", { className: "pbss-result-name", children: a.name }),
-                    /* @__PURE__ */ i("div", { className: "pbss-result-categories", children: Ue(a).map((u) => /* @__PURE__ */ i(
+                    /* @__PURE__ */ i("div", { className: "pbss-result-name", children: o.name }),
+                    /* @__PURE__ */ i("div", { className: "pbss-result-categories", children: ze(o).map((u) => /* @__PURE__ */ i(
                       "span",
                       {
                         className: "pbss-result-category",
-                        style: ze(u, c == null ? void 0 : c.search.categoryColors),
+                        style: He(u, c == null ? void 0 : c.search.categoryColors),
                         children: u
                       },
                       u
                     )) })
                   ] }),
-                  G(a) && /* @__PURE__ */ i("div", { className: "pbss-result-address", children: G(a) }),
+                  G(o) && /* @__PURE__ */ i("div", { className: "pbss-result-address", children: G(o) }),
                   /* @__PURE__ */ f("div", { className: "pbss-result-actions", children: [
-                    a.phone && /* @__PURE__ */ i("a", { href: `tel:${a.phone}`, children: "Call now" }),
-                    o && /* @__PURE__ */ i("a", { href: o, rel: "noreferrer", target: "_blank", children: "Website" }),
-                    a.email && /* @__PURE__ */ i("a", { href: `mailto:${a.email}`, children: "Email" }),
-                    a.directions_available !== !1 && /* @__PURE__ */ i(
+                    o.phone && /* @__PURE__ */ i("a", { href: `tel:${o.phone}`, children: Ne(o.phone, U.phoneDisplay) }),
+                    a && /* @__PURE__ */ i("a", { href: a, rel: "noreferrer", target: "_blank", children: "Website" }),
+                    o.email && /* @__PURE__ */ i("a", { href: `mailto:${o.email}`, children: "Email" }),
+                    o.directions_available !== !1 && /* @__PURE__ */ i(
                       "a",
                       {
-                        href: Ce(a._geo),
+                        href: Ce(o._geo),
                         rel: "noreferrer",
                         target: "_blank",
                         children: "Get directions"
                       }
                     ),
-                    typeof a.distanceKm == "number" && /* @__PURE__ */ i("span", { className: "pbss-result-distance", children: Le(a.distanceKm) })
+                    typeof o.distanceKm == "number" && /* @__PURE__ */ i("span", { className: "pbss-result-distance", children: Le(o.distanceKm) })
                   ] })
-                ] }, a.id);
+                ] }, o.id);
               }) }) : /* @__PURE__ */ f("div", { className: "pbss-empty", children: [
                 "No stockists found within ",
                 W,
@@ -473,10 +478,10 @@ function ae({
     }
   );
 }
-const Pe = ":host{display:block;position:relative;z-index:11}partbot-stockist-search{display:block}.pbss-root{--pbss-primary: #111111;--pbss-action-color: var(--pbss-primary);--pbss-radius: 8px;--pbss-surface: #ffffff;--pbss-control-surface: #ffffff;--pbss-border: rgb(28 25 23 / .14);--pbss-divider: rgb(28 25 23 / .09);--pbss-text: #1c1917;--pbss-muted-text: #78716c;--pbss-placeholder-text: #57534e;--pbss-danger-surface: #fff1f2;--pbss-danger-text: #9f1239;color:var(--pbss-text);container-type:inline-size;font-family:inherit;isolation:isolate;position:relative;width:100%;-webkit-font-smoothing:antialiased}.pbss-search-control{align-items:center;display:flex;min-width:0;position:relative}.pbss-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pbss-control-surface);border:0;border-radius:var(--pbss-radius);box-shadow:inset 0 0 0 1px var(--pbss-border);color:var(--pbss-text);font:inherit;font-size:16px;line-height:1.5;min-height:48px;min-width:0;padding:10px 56px 10px 14px;width:100%}.pbss-input::-webkit-search-cancel-button{margin-right:4px}.pbss-input::placeholder{color:var(--pbss-placeholder-text);opacity:1}.pbss-input:focus{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--pbss-action-color) 70%,transparent),0 0 0 3px color-mix(in srgb,var(--pbss-action-color) 14%,transparent);outline:none}.pbss-location-button{align-items:center;background:transparent;border:0;border-radius:max(4px,calc(var(--pbss-radius) - 4px));color:var(--pbss-action-color);cursor:pointer;display:inline-flex;height:40px;justify-content:center;padding:0;position:absolute;right:4px;width:40px}.pbss-location-button [data-slot=icon]{flex:0 0 auto;height:16px;width:16px}.pbss-location-button:hover{background:color-mix(in srgb,var(--pbss-action-color) 8%,transparent)}.pbss-location-button:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:-2px}.pbss-location-button:disabled{cursor:not-allowed;opacity:.5}.pbss-touch-target{height:max(100%,48px);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:max(100%,48px)}.pbss-spinner{animation:pbss-spin .7s linear infinite;border:2px solid color-mix(in srgb,var(--pbss-action-color) 22%,transparent);border-radius:999px;border-top-color:var(--pbss-action-color);height:16px;width:16px}.pbss-results-panel{background:var(--pbss-surface);border-radius:var(--pbss-radius);box-shadow:0 16px 36px #1c191729,0 2px 8px #1c191714,0 0 0 1px #1c19170f;display:grid;left:0;margin-top:6px;overflow:hidden;position:absolute;right:0;z-index:20}.pbss-results-status{min-width:0}.pbss-mobile-results-header{display:none}.pbss-results{list-style:none;margin:0;padding:0}.pbss-result{display:grid;gap:8px;padding:14px}.pbss-result+.pbss-result{border-top:1px solid var(--pbss-divider)}.pbss-result-heading{align-items:center;display:flex;gap:8px;justify-content:space-between;min-width:0}.pbss-result-name{font-size:16px;font-weight:600;line-height:1.35;min-width:0}.pbss-result-categories{display:flex;flex:0 1 auto;flex-wrap:wrap;gap:5px;justify-content:flex-end}.pbss-result-category{background:var( --pbss-category-color, color-mix(in srgb, var(--pbss-action-color) 10%, var(--pbss-control-surface)) );border-radius:999px;color:var(--pbss-category-contrast, var(--pbss-action-color));font-size:11px;font-weight:700;line-height:1.2;padding:3px 7px;width:fit-content}.pbss-loading,.pbss-empty,.pbss-error{font-size:16px;line-height:1.45}.pbss-result-address{color:var(--pbss-muted-text);font-size:14px;line-height:1.4}.pbss-result-actions{align-items:center;display:flex;flex-wrap:wrap;gap:8px 14px}.pbss-result-actions a{color:var(--pbss-action-color);font-size:14px;font-weight:600;line-height:1.35;text-decoration:none}.pbss-result-actions a:hover{text-decoration:underline;text-underline-offset:3px}.pbss-result-actions a:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:2px}.pbss-result-distance{background:color-mix(in srgb,var(--pbss-text) 14%,transparent);border-radius:999px;color:var(--pbss-text);flex:0 0 auto;font-size:12px;font-variant-numeric:tabular-nums;font-weight:600;line-height:1.2;padding:4px 8px}.pbss-loading,.pbss-empty,.pbss-error{padding:16px 14px}.pbss-loading,.pbss-empty{color:var(--pbss-muted-text)}.pbss-error{background:var(--pbss-danger-surface);color:var(--pbss-danger-text)}.pbss-view-all{border-top:1px solid var(--pbss-divider);color:var(--pbss-action-color);font-size:16px;font-weight:600;line-height:1.4;padding:13px 14px;text-align:center;text-decoration:none}.pbss-view-all:hover{background:color-mix(in srgb,var(--pbss-action-color) 6%,var(--pbss-surface));text-decoration:underline;text-underline-offset:3px}.pbss-view-all:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:-3px}@container (min-width: 480px){.pbss-result-name,.pbss-loading,.pbss-empty,.pbss-error,.pbss-view-all{font-size:14px}.pbss-result-address,.pbss-result-actions a{font-size:12px}}@container (max-width: 479px){.pbss-mobile-results-header{align-items:center;border-bottom:1px solid var(--pbss-divider);display:flex;font-size:14px;font-weight:600;justify-content:space-between;line-height:1.35;min-height:48px;padding:4px 4px 4px 14px}.pbss-results-close{align-items:center;background:transparent;border:0;border-radius:max(4px,calc(var(--pbss-radius) - 4px));color:var(--pbss-action-color);cursor:pointer;display:inline-flex;font:inherit;gap:6px;min-height:40px;padding:8px 10px}.pbss-results-close [data-slot=icon]{height:16px;width:16px}.pbss-results-close:hover{background:color-mix(in srgb,var(--pbss-action-color) 8%,transparent)}.pbss-results-close:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:-2px}}.pbss-root.is-dark{--pbss-action-color: #f5f3f0;--pbss-surface: #1c1917;--pbss-control-surface: #292524;--pbss-border: rgb(255 255 255 / .16);--pbss-divider: rgb(255 255 255 / .1);--pbss-text: #f5f3f0;--pbss-muted-text: #d6d3d1;--pbss-placeholder-text: #d6d3d1;--pbss-danger-surface: #4c0519;--pbss-danger-text: #fecdd3}.pbss-root.is-dark .pbss-results-panel{box-shadow:0 18px 38px #0000006b,0 0 0 1px #ffffff1a}@media(prefers-reduced-motion:reduce){.pbss-spinner{animation-duration:1.4s}}@keyframes pbss-spin{to{transform:rotate(360deg)}}";
-function $e(e, t) {
+const $e = ":host{display:block;position:relative;z-index:11}partbot-stockist-search{display:block}.pbss-root{--pbss-primary: #111111;--pbss-action-color: var(--pbss-primary);--pbss-radius: 8px;--pbss-surface: #ffffff;--pbss-control-surface: #ffffff;--pbss-border: rgb(28 25 23 / .14);--pbss-divider: rgb(28 25 23 / .09);--pbss-text: #1c1917;--pbss-muted-text: #78716c;--pbss-placeholder-text: #57534e;--pbss-danger-surface: #fff1f2;--pbss-danger-text: #9f1239;color:var(--pbss-text);container-type:inline-size;font-family:inherit;isolation:isolate;position:relative;width:100%;-webkit-font-smoothing:antialiased}.pbss-search-control{align-items:center;display:flex;min-width:0;position:relative}.pbss-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pbss-control-surface);border:0;border-radius:var(--pbss-radius);box-shadow:inset 0 0 0 1px var(--pbss-border);color:var(--pbss-text);font:inherit;font-size:16px;line-height:1.5;min-height:48px;min-width:0;padding:10px 56px 10px 14px;width:100%}.pbss-input::-webkit-search-cancel-button{margin-right:4px}.pbss-input::placeholder{color:var(--pbss-placeholder-text);opacity:1}.pbss-input:focus{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--pbss-action-color) 70%,transparent),0 0 0 3px color-mix(in srgb,var(--pbss-action-color) 14%,transparent);outline:none}.pbss-location-button{align-items:center;background:transparent;border:0;border-radius:max(4px,calc(var(--pbss-radius) - 4px));color:var(--pbss-action-color);cursor:pointer;display:inline-flex;height:40px;justify-content:center;padding:0;position:absolute;right:4px;width:40px}.pbss-location-button [data-slot=icon]{flex:0 0 auto;height:16px;width:16px}.pbss-location-button:hover{background:color-mix(in srgb,var(--pbss-action-color) 8%,transparent)}.pbss-location-button:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:-2px}.pbss-location-button:disabled{cursor:not-allowed;opacity:.5}.pbss-touch-target{height:max(100%,48px);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:max(100%,48px)}.pbss-spinner{animation:pbss-spin .7s linear infinite;border:2px solid color-mix(in srgb,var(--pbss-action-color) 22%,transparent);border-radius:999px;border-top-color:var(--pbss-action-color);height:16px;width:16px}.pbss-results-panel{background:var(--pbss-surface);border-radius:var(--pbss-radius);box-shadow:0 16px 36px #1c191729,0 2px 8px #1c191714,0 0 0 1px #1c19170f;display:grid;left:0;margin-top:6px;overflow:hidden;position:absolute;right:0;z-index:20}.pbss-results-status{min-width:0}.pbss-mobile-results-header{display:none}.pbss-results{list-style:none;margin:0;padding:0}.pbss-result{display:grid;gap:8px;padding:14px}.pbss-result+.pbss-result{border-top:1px solid var(--pbss-divider)}.pbss-result-heading{align-items:center;display:flex;gap:8px;justify-content:space-between;min-width:0}.pbss-result-name{font-size:16px;font-weight:600;line-height:1.35;min-width:0}.pbss-result-categories{display:flex;flex:0 1 auto;flex-wrap:wrap;gap:5px;justify-content:flex-end}.pbss-result-category{background:var( --pbss-category-color, color-mix(in srgb, var(--pbss-action-color) 10%, var(--pbss-control-surface)) );border-radius:999px;color:var(--pbss-category-contrast, var(--pbss-action-color));font-size:11px;font-weight:700;line-height:1.2;padding:3px 7px;width:fit-content}.pbss-loading,.pbss-empty,.pbss-error{font-size:16px;line-height:1.45}.pbss-result-address{color:var(--pbss-muted-text);font-size:14px;line-height:1.4}.pbss-result-actions{align-items:center;display:flex;flex-wrap:wrap;gap:8px 14px}.pbss-result-actions a{color:var(--pbss-action-color);font-size:14px;font-weight:600;line-height:1.35;text-decoration:none}.pbss-result-actions a:hover{text-decoration:underline;text-underline-offset:3px}.pbss-result-actions a:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:2px}.pbss-result-distance{background:color-mix(in srgb,var(--pbss-text) 14%,transparent);border-radius:999px;color:var(--pbss-text);flex:0 0 auto;font-size:12px;font-variant-numeric:tabular-nums;font-weight:600;line-height:1.2;padding:4px 8px}.pbss-loading,.pbss-empty,.pbss-error{padding:16px 14px}.pbss-loading,.pbss-empty{color:var(--pbss-muted-text)}.pbss-error{background:var(--pbss-danger-surface);color:var(--pbss-danger-text)}.pbss-view-all{border-top:1px solid var(--pbss-divider);color:var(--pbss-action-color);font-size:16px;font-weight:600;line-height:1.4;padding:13px 14px;text-align:center;text-decoration:none}.pbss-view-all:hover{background:color-mix(in srgb,var(--pbss-action-color) 6%,var(--pbss-surface));text-decoration:underline;text-underline-offset:3px}.pbss-view-all:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:-3px}@container (min-width: 480px){.pbss-result-name,.pbss-loading,.pbss-empty,.pbss-error,.pbss-view-all{font-size:14px}.pbss-result-address,.pbss-result-actions a{font-size:12px}}@container (max-width: 479px){.pbss-mobile-results-header{align-items:center;border-bottom:1px solid var(--pbss-divider);display:flex;font-size:14px;font-weight:600;justify-content:space-between;line-height:1.35;min-height:48px;padding:4px 4px 4px 14px}.pbss-results-close{align-items:center;background:transparent;border:0;border-radius:max(4px,calc(var(--pbss-radius) - 4px));color:var(--pbss-action-color);cursor:pointer;display:inline-flex;font:inherit;gap:6px;min-height:40px;padding:8px 10px}.pbss-results-close [data-slot=icon]{height:16px;width:16px}.pbss-results-close:hover{background:color-mix(in srgb,var(--pbss-action-color) 8%,transparent)}.pbss-results-close:focus-visible{outline:2px solid var(--pbss-action-color);outline-offset:-2px}}.pbss-root.is-dark{--pbss-action-color: #f5f3f0;--pbss-surface: #1c1917;--pbss-control-surface: #292524;--pbss-border: rgb(255 255 255 / .16);--pbss-divider: rgb(255 255 255 / .1);--pbss-text: #f5f3f0;--pbss-muted-text: #d6d3d1;--pbss-placeholder-text: #d6d3d1;--pbss-danger-surface: #4c0519;--pbss-danger-text: #fecdd3}.pbss-root.is-dark .pbss-results-panel{box-shadow:0 18px 38px #0000006b,0 0 0 1px #ffffff1a}@media(prefers-reduced-motion:reduce){.pbss-spinner{animation-duration:1.4s}}@keyframes pbss-spin{to{transform:rotate(360deg)}}";
+function De(e, t) {
   const r = J(e);
-  return r.render(/* @__PURE__ */ i(ae, { ...t })), r;
+  return r.render(/* @__PURE__ */ i(oe, { ...t })), r;
 }
 const Y = "data-partbot-stockist-search-styles", Q = "data-partbot-stockist-search-root";
 function Ze(e) {
@@ -485,7 +490,7 @@ function Ze(e) {
 function Fe(e) {
   if (e.querySelector(`style[${Y}]`)) return;
   const t = document.createElement("style");
-  t.setAttribute(Y, ""), t.textContent = Pe, e.prepend(t);
+  t.setAttribute(Y, ""), t.textContent = $e, e.prepend(t);
 }
 function Oe(e) {
   const t = e.querySelector(
@@ -495,13 +500,13 @@ function Oe(e) {
   const r = document.createElement("div");
   return r.setAttribute(Q, ""), e.appendChild(r), r;
 }
-const De = typeof HTMLElement > "u" ? class {
+const Be = typeof HTMLElement > "u" ? class {
 } : HTMLElement;
-class oe extends De {
+class ae extends Be {
   constructor() {
     super(...arguments);
-    H(this, "root");
-    H(this, "mountElement");
+    P(this, "root");
+    P(this, "mountElement");
   }
   connectedCallback() {
     this.renderStockistSearch();
@@ -515,7 +520,7 @@ class oe extends De {
   }
   renderStockistSearch() {
     const r = Ze(this);
-    Fe(r), this.mountElement || (this.mountElement = Oe(r)), this.root || (this.root = J(this.mountElement)), this.root.render(/* @__PURE__ */ i(ae, { ...this.stockistSearchProps() }));
+    Fe(r), this.mountElement || (this.mountElement = Oe(r)), this.root || (this.root = J(this.mountElement)), this.root.render(/* @__PURE__ */ i(oe, { ...this.stockistSearchProps() }));
   }
   stockistSearchProps() {
     return {
@@ -526,17 +531,17 @@ class oe extends De {
     };
   }
 }
-H(oe, "observedAttributes", ["token", "config-url", "initial-query", "view-all-url"]);
+P(ae, "observedAttributes", ["token", "config-url", "initial-query", "view-all-url"]);
 function X() {
-  typeof window > "u" || !window.customElements || window.customElements.get("partbot-stockist-search") || window.customElements.define("partbot-stockist-search", oe);
+  typeof window > "u" || !window.customElements || window.customElements.get("partbot-stockist-search") || window.customElements.define("partbot-stockist-search", ae);
 }
 typeof window < "u" && (X(), window.PartbotStockistSearch = {
   defineCustomElement: X,
-  mount: $e
+  mount: De
 });
 export {
-  oe as PartbotStockistSearchElement,
-  ae as StockistSearch,
+  ae as PartbotStockistSearchElement,
+  oe as StockistSearch,
   X as defineStockistSearchElement,
-  $e as mountStockistSearch
+  De as mountStockistSearch
 };