@stachelock/ui 0.6.14 → 0.6.16

package/dist/ScreenSizeSelector.vue_vue_type_script_setup_true_lang-FINxrVod.js

@@ -0,0 +1,183 @@
+import { defineComponent as h, ref as k, watch as v, provide as b, renderSlot as w, computed as p, createElementBlock as n, openBlock as a, createElementVNode as c, normalizeStyle as S, createVNode as z, withCtx as B, createCommentVNode as m, normalizeClass as f, Fragment as V, renderList as C, toDisplayString as $ } from "vue";
+import { S as A, b as H, u as W, s as j } from "./useScreenSize-Kr6cn5Zr.js";
+import { _ as x } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const M = h({
+  name: "BreakpointWrapper",
+  props: {
+    /**
+     * The screen size to provide to child components
+     */
+    size: {
+      type: String,
+      required: !0,
+      validator: (r) => ["sm", "md", "lg", "xl"].includes(r)
+    }
+  },
+  setup(r) {
+    const s = k(r.size);
+    return v(
+      () => r.size,
+      (t) => {
+        s.value = t;
+      }
+    ), b(A, s), {};
+  }
+});
+function R(r, s, t, d, i, u) {
+  return w(r.$slots, "default");
+}
+const L = /* @__PURE__ */ x(M, [["render", R]]), F = { class: "sl-responsive-preview-wrapper" }, N = /* @__PURE__ */ h({
+  __name: "ResponsivePreviewWrapper",
+  props: {
+    size: {},
+    showBorder: { type: Boolean, default: !1 },
+    centered: { type: Boolean, default: !0 },
+    backgroundColor: { default: "transparent" },
+    animate: { type: Boolean, default: !0 },
+    minHeight: { default: "auto" }
+  },
+  setup(r) {
+    const s = r, t = k(s.size);
+    v(
+      () => s.size,
+      (i) => {
+        t.value = i;
+      }
+    ), H({
+      previewMode: !0,
+      initialSize: s.size
+    });
+    const d = p(() => ({
+      maxWidth: {
+        sm: "375px",
+        md: "768px",
+        lg: "1024px",
+        xl: "100%"
+      }[t.value],
+      width: "100%",
+      margin: s.centered ? "0 auto" : "0",
+      backgroundColor: s.backgroundColor,
+      minHeight: s.minHeight,
+      transition: s.animate ? "max-width 0.3s ease" : "none",
+      ...s.showBorder && {
+        border: "1px solid #e5e7eb",
+        borderRadius: "0.5rem",
+        padding: "1rem"
+      }
+    }));
+    return (i, u) => (a(), n("div", F, [
+      c("div", {
+        class: "sl-preview-container sl-mx-auto",
+        style: S(d.value)
+      }, [
+        z(L, { size: t.value }, {
+          default: B(() => [
+            w(i.$slots, "default", {}, void 0, !0)
+          ]),
+          _: 3
+        }, 8, ["size"])
+      ], 4)
+    ]));
+  }
+}), Q = /* @__PURE__ */ x(N, [["__scopeId", "data-v-7eff9c43"]]), P = ["title", "onClick"], E = {
+  key: 0,
+  class: "sl-h-5 sl-w-5",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  "stroke-width": "1.5",
+  stroke: "currentColor"
+}, q = {
+  key: 1,
+  class: "sl-h-5 sl-w-5",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  "stroke-width": "1.5",
+  stroke: "currentColor"
+}, D = {
+  key: 2,
+  class: "sl-h-5 sl-w-5",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  "stroke-width": "1.5",
+  stroke: "currentColor"
+}, I = {
+  key: 3,
+  class: "sl-h-5 sl-w-5",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  "stroke-width": "1.5",
+  stroke: "currentColor"
+}, K = {
+  key: 4,
+  class: "sl-ml-2 sl-text-sm sl-font-medium"
+}, U = /* @__PURE__ */ h({
+  __name: "ScreenSizeSelector",
+  props: {
+    modelValue: {},
+    sizes: { default: () => ["sm", "md", "lg", "xl"] },
+    theme: { default: "light" },
+    showLabels: { type: Boolean, default: !1 },
+    activeColor: { default: "primary-600" },
+    autoFilter: { type: Boolean, default: !0 }
+  },
+  emits: ["update:modelValue"],
+  setup(r, { emit: s }) {
+    const t = r, d = s, { availablePreviewSizes: i } = W(), u = p(() => {
+      let l = t.sizes;
+      return t.autoFilter && (l = l.filter((e) => i.value.includes(e))), j.filter((e) => l.includes(e.id));
+    });
+    v(u, (l) => {
+      if (l.length > 0 && !l.some((e) => e.id === t.modelValue)) {
+        const e = l[l.length - 1];
+        d("update:modelValue", e.id);
+      }
+    }, { immediate: !0 });
+    const g = p(() => t.theme === "dark" ? "sl-bg-slate-700" : "sl-bg-gray-100"), _ = (l) => t.modelValue === l ? t.theme === "dark" ? "sl-bg-slate-600 sl-shadow sl-text-white" : `sl-bg-white sl-shadow sl-text-${t.activeColor}` : t.theme === "dark" ? "sl-text-slate-300 hover:sl-text-white" : "sl-text-gray-500 hover:sl-text-gray-700", y = (l) => {
+      d("update:modelValue", l);
+    };
+    return (l, e) => u.value.length > 0 ? (a(), n("div", {
+      key: 0,
+      class: f(["sl-inline-flex sl-items-center sl-gap-1 sl-rounded-lg sl-p-1", g.value])
+    }, [
+      (a(!0), n(V, null, C(u.value, (o) => (a(), n("button", {
+        key: o.id,
+        type: "button",
+        class: f(["sl-p-2 sl-rounded-md sl-transition-colors sl-flex sl-items-center sl-justify-center", _(o.id)]),
+        title: o.label,
+        onClick: (T) => y(o.id)
+      }, [
+        o.id === "sm" ? (a(), n("svg", E, [...e[0] || (e[0] = [
+          c("path", {
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            d: "M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"
+          }, null, -1)
+        ])])) : o.id === "md" ? (a(), n("svg", q, [...e[1] || (e[1] = [
+          c("path", {
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            d: "M10.5 19.5h3m-6.75 2.25h10.5a2.25 2.25 0 002.25-2.25v-15a2.25 2.25 0 00-2.25-2.25H6.75A2.25 2.25 0 004.5 4.5v15a2.25 2.25 0 002.25 2.25z"
+          }, null, -1)
+        ])])) : o.id === "lg" ? (a(), n("svg", D, [...e[2] || (e[2] = [
+          c("path", {
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            d: "M9 17.25v1.007a3 3 0 01-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0115 18.257V17.25m6-12V15a2.25 2.25 0 01-2.25 2.25H5.25A2.25 2.25 0 013 15V5.25A2.25 2.25 0 015.25 3h13.5A2.25 2.25 0 0121 5.25z"
+          }, null, -1)
+        ])])) : o.id === "xl" ? (a(), n("svg", I, [...e[3] || (e[3] = [
+          c("path", {
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            d: "M6 20.25h12m-7.5-3v3m3-3v3m-10.125-3h17.25c.621 0 1.125-.504 1.125-1.125V4.875c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125z"
+          }, null, -1)
+        ])])) : m("", !0),
+        r.showLabels ? (a(), n("span", K, $(o.label), 1)) : m("", !0)
+      ], 10, P))), 128))
+    ], 2)) : m("", !0);
+  }
+});
+export {
+  L as B,
+  Q as R,
+  U as _
+};

package/dist/UiMapAll.vue_vue_type_script_setup_true_lang-DKcK0HmT.js

@@ -0,0 +1,501 @@
+import { defineComponent as de, ref as m, computed as B, watch as E, onMounted as ce, createElementBlock as g, openBlock as f, Fragment as S, createVNode as C, mergeProps as fe, withCtx as M, createElementVNode as x, createCommentVNode as y, renderSlot as Z, normalizeClass as d, unref as b, toDisplayString as U, renderList as K, createBlock as q, nextTick as me } from "vue";
+import { PlusIcon as ge, MinusIcon as ve, ArrowsPointingOutIcon as he } from "@heroicons/vue/24/outline";
+import pe from "./maps/UiMap.js";
+import G from "./maps/UiMapMarker.js";
+import ye from "./maps/UiInfoWindow.js";
+import { u as be } from "./useMap-CM59TKX6.js";
+import { g as H } from "./mapThemes-DFE9fZm3.js";
+const ke = { class: "sl-flex sl-flex-col sl-gap-2" }, Se = /* @__PURE__ */ de({
+  __name: "UiMapAll",
+  props: {
+    /** Google Maps API key */
+    apiKey: {
+      type: String,
+      default: ""
+    },
+    /** Google Cloud Map ID (required for Advanced Markers) */
+    googleMapId: {
+      type: String,
+      default: ""
+    },
+    /** Array of markers or data objects */
+    items: {
+      type: Array,
+      default: () => []
+    },
+    /** Custom coordinate extractor for data objects */
+    coordinateExtractor: {
+      type: Function,
+      default: void 0
+    },
+    /** ID field for data objects */
+    idField: {
+      type: String,
+      default: "id"
+    },
+    /** Title field for data objects */
+    titleField: {
+      type: String,
+      default: "name"
+    },
+    /** Initial map center */
+    center: {
+      type: Object,
+      default: () => ({ lat: 39.8283, lng: -98.5795 })
+      // US center
+    },
+    /** Initial zoom level */
+    zoom: {
+      type: Number,
+      default: 4
+    },
+    /** Map width */
+    width: {
+      type: String,
+      default: "100%"
+    },
+    /** Map height */
+    height: {
+      type: String,
+      default: "400px"
+    },
+    /** Map theme */
+    theme: {
+      type: String,
+      default: "ultraLight"
+    },
+    /** Auto-switch theme based on dark mode */
+    autoTheme: {
+      type: Boolean,
+      default: !0
+    },
+    /** Enable clustering */
+    enableClustering: {
+      type: Boolean,
+      default: !0
+    },
+    /** Clustering options */
+    clusteringOptions: {
+      type: Object,
+      default: () => ({
+        minimumClusterSize: 2,
+        maxZoom: 15,
+        gridSize: 60,
+        maxMarkersWithoutClustering: 50
+        // Lower threshold for better performance
+      })
+    },
+    /** Maximum markers to render */
+    maxMarkers: {
+      type: Number,
+      default: 500
+    },
+    /** Marker color */
+    markerColor: {
+      type: String,
+      default: "primary"
+    },
+    /** Marker size */
+    markerSize: {
+      type: String,
+      default: "md"
+    },
+    /** Use pin-style markers */
+    pinMarkers: {
+      type: Boolean,
+      default: !1
+    },
+    /** Custom marker icon */
+    markerIcon: {
+      type: Object,
+      default: void 0
+    },
+    /** Show info window on marker click */
+    showInfoWindow: {
+      type: Boolean,
+      default: !0
+    },
+    /** Show avatar in info window */
+    showInfoAvatar: {
+      type: Boolean,
+      default: !0
+    },
+    /** Info window actions */
+    infoActions: {
+      type: Array,
+      default: () => []
+    },
+    /** Info window field mapping */
+    infoFields: {
+      type: Array,
+      default: () => []
+    },
+    /** Data loading state */
+    isDataLoading: {
+      type: Boolean,
+      default: !1
+    },
+    /** Data loading text */
+    dataLoadingText: {
+      type: String,
+      default: "Loading data..."
+    },
+    /** Show marker count badge */
+    showMarkerCount: {
+      type: Boolean,
+      default: !1
+    },
+    /** Show controls */
+    showControls: {
+      type: Boolean,
+      default: !0
+    },
+    /** Show default zoom controls */
+    showDefaultZoomControls: {
+      type: Boolean,
+      default: !0
+    },
+    /** Show fit to markers button */
+    showFitButton: {
+      type: Boolean,
+      default: !0
+    },
+    /** Controls position */
+    controlsPosition: {
+      type: String,
+      default: "bottom-left"
+    },
+    /** Auto fit to markers on load */
+    autoFit: {
+      type: Boolean,
+      default: !1
+    },
+    /** Fit padding */
+    fitPadding: {
+      type: Number,
+      default: 50
+    }
+  },
+  emits: ["marker-click", "cluster-click", "info-action", "ready", "error", "update:visible-markers", "update:center", "update:zoom"],
+  setup(n, { expose: J, emit: Q }) {
+    function X(e, o) {
+      let t = null;
+      return (...c) => {
+        t && clearTimeout(t), t = setTimeout(() => e(...c), o);
+      };
+    }
+    const l = n, h = Q, {
+      markers: z,
+      clusters: k,
+      processMarkers: F,
+      markersFromData: Y
+    } = be({
+      clustering: l.enableClustering ? {
+        enabled: !0,
+        ...l.clusteringOptions
+      } : { enabled: !1 }
+    }), T = m(!1), w = m(null), A = m(l.center), i = m(l.zoom), u = m(null), v = m(null), p = m(null), O = m(!1), r = m({
+      visible: !1,
+      loading: !1,
+      error: null,
+      title: "",
+      subtitle: "",
+      imageUrl: "",
+      details: [],
+      actions: [],
+      data: void 0
+    }), D = B(() => ({
+      apiKey: l.apiKey,
+      googleMapId: l.googleMapId,
+      width: l.width,
+      height: l.height,
+      theme: l.theme,
+      autoTheme: l.autoTheme
+    })), a = B(() => {
+      if (!l.items.length) return [];
+      const e = l.items[0];
+      return "position" in e && "id" in e ? l.items : Y(
+        l.items,
+        l.coordinateExtractor,
+        l.idField
+      ).slice(0, l.maxMarkers);
+    }), W = B(() => {
+      if (!l.enableClustering) return !1;
+      const e = l.clusteringOptions?.maxZoom ?? 15;
+      return i.value < e && k.value.length > 0;
+    }), N = X((e, o) => {
+      T.value || (T.value = !0, me(() => {
+        z.value = a.value, F(e, o), T.value = !1;
+      }));
+    }, 150), j = B(() => {
+      if (W.value && l.enableClustering) {
+        const e = /* @__PURE__ */ new Set();
+        return k.value.forEach((o) => {
+          o.markers.forEach((t) => e.add(t.id));
+        }), a.value.filter((o) => !e.has(o.id)).slice(0, l.maxMarkers);
+      }
+      return a.value.slice(0, l.maxMarkers);
+    });
+    function _(e) {
+      if (p.value = e.map, O.value = !0, h("ready", e), l.enableClustering && a.value.length > 0) {
+        z.value = a.value;
+        const o = e.map.getBounds();
+        if (o) {
+          const t = o.getNorthEast(), c = o.getSouthWest(), s = {
+            north: t.lat(),
+            south: c.lat(),
+            east: t.lng(),
+            west: c.lng()
+          };
+          u.value = s;
+          const P = e.map.getZoom() || i.value;
+          i.value = P, F(P, void 0);
+        }
+      }
+      l.autoFit && a.value.length > 0 && setTimeout(() => I(), 100);
+    }
+    function ee() {
+      L();
+    }
+    function te(e) {
+      const o = e.bounds;
+      u.value && !(Math.abs(u.value.north - o.north) > 1e-3 || Math.abs(u.value.south - o.south) > 1e-3 || Math.abs(u.value.east - o.east) > 1e-3 || Math.abs(u.value.west - o.west) > 1e-3) || (u.value = o, l.enableClustering && a.value.length > 0 && N(i.value, o));
+    }
+    function le(e) {
+      i.value !== e.zoom && (i.value = e.zoom, h("update:zoom", e.zoom), l.enableClustering && u.value && a.value.length > 0 && N(e.zoom, u.value));
+    }
+    function oe() {
+    }
+    function ae(e) {
+      h("error", e);
+    }
+    function se(e) {
+      h("marker-click", e), l.showInfoWindow && (v.value = e.marker, R(e.marker));
+    }
+    function ne(e, o) {
+      h("cluster-click", { cluster: e, markers: e.markers });
+      const t = new google.maps.LatLngBounds();
+      e.markers.forEach((c) => t.extend(c.position)), o.fitBounds(t, l.fitPadding);
+    }
+    function R(e) {
+      const o = e.data;
+      r.value = {
+        visible: !0,
+        loading: !1,
+        error: null,
+        title: e.title || o?.[l.titleField] || "Details",
+        subtitle: o?.subtitle || "",
+        imageUrl: o?.imageUrl || o?.profile_image || o?.image || "",
+        details: l.infoFields.length > 0 ? l.infoFields.map((t) => ({
+          label: t.label,
+          value: o?.[t.field] || "",
+          type: t.type
+        })) : [],
+        actions: l.infoActions,
+        data: e.data
+      };
+    }
+    function L() {
+      r.value.visible = !1, v.value = null;
+    }
+    function re() {
+      v.value && R(v.value);
+    }
+    function ie(e) {
+      h("info-action", { ...e, marker: v.value || void 0 });
+    }
+    function ue(e) {
+      return {
+        path: 0,
+        // google.maps.SymbolPath.CIRCLE
+        scale: Math.min(20 + Math.log(e.size) * 5, 40),
+        fillColor: H(e.size),
+        fillOpacity: 0.8,
+        strokeColor: "#ffffff",
+        strokeWeight: 2
+      };
+    }
+    function $() {
+      if (w.value) {
+        const e = i.value;
+        w.value.setZoom?.(Math.min(e + 1, 21));
+      }
+    }
+    function V() {
+      if (w.value) {
+        const e = i.value;
+        w.value.setZoom?.(Math.max(e - 1, 1));
+      }
+    }
+    function I() {
+      if (!p.value || a.value.length === 0) return;
+      const e = new google.maps.LatLngBounds();
+      a.value.forEach((o) => e.extend(o.position)), p.value.fitBounds(e, l.fitPadding);
+    }
+    return E(() => l.items, () => {
+      z.value = a.value, l.enableClustering && u.value && a.value.length > 0 && F(i.value, u.value), l.autoFit && O.value && a.value.length > 0 && I();
+    }, { deep: !0 }), E(() => l.center, (e) => {
+      A.value = e;
+    }), E(() => l.zoom, (e) => {
+      i.value = e;
+    }), ce(() => {
+      z.value = a.value;
+    }), J({
+      getMap: () => p.value,
+      fitToMarkers: I,
+      zoomIn: $,
+      zoomOut: V,
+      panTo: (e) => p.value?.panTo(e),
+      setZoom: (e) => p.value?.setZoom(e),
+      closeInfoWindow: L,
+      getMarkers: () => a.value,
+      getVisibleMarkers: () => j.value,
+      getClusters: () => k.value,
+      getClusterIcon: ue
+    }), (e, o) => (f(), g(S, null, [
+      C(pe, fe({
+        ref_key: "mapRef",
+        ref: w
+      }, D.value, {
+        "show-custom-controls": n.showControls,
+        "show-default-zoom-controls": n.showDefaultZoomControls,
+        "controls-position": n.controlsPosition,
+        onReady: _,
+        onClick: ee,
+        onBoundsChanged: te,
+        onZoomChanged: le,
+        onIdle: oe,
+        onError: ae,
+        center: A.value,
+        "onUpdate:center": o[0] || (o[0] = (t) => A.value = t),
+        zoom: i.value,
+        "onUpdate:zoom": o[1] || (o[1] = (t) => i.value = t)
+      }), {
+        default: M(({ ready: t, map: c }) => [
+          t && c ? (f(), g(S, { key: 0 }, [
+            W.value ? (f(!0), g(S, { key: 0 }, K(b(k), (s) => (f(), q(G, {
+              key: s.id,
+              position: s.position,
+              id: s.id,
+              title: `${s.size} items in this area`,
+              ready: t,
+              cluster: !0,
+              "cluster-size": s.size,
+              "cluster-color": b(H)(s.size),
+              "z-index": 1e3,
+              onClick: (P) => ne(s, c)
+            }, null, 8, ["position", "id", "title", "ready", "cluster-size", "cluster-color", "onClick"]))), 128)) : y("", !0),
+            (f(!0), g(S, null, K(j.value, (s) => (f(), q(G, {
+              key: s.id,
+              position: s.position,
+              id: s.id,
+              title: s.title,
+              data: s.data,
+              ready: t,
+              color: n.markerColor,
+              size: n.markerSize,
+              pin: n.pinMarkers,
+              icon: n.markerIcon,
+              "z-index": 100,
+              onClick: se
+            }, null, 8, ["position", "id", "title", "data", "ready", "color", "size", "pin", "icon"]))), 128))
+          ], 64)) : y("", !0)
+        ]),
+        overlay: M(({ isDark: t }) => [
+          n.isDataLoading ? (f(), g("div", {
+            key: 0,
+            class: d(["sl-absolute sl-top-4 sl-left-4 sl-z-10 sl-flex sl-items-center sl-gap-2 sl-px-3 sl-py-2 sl-rounded-lg sl-shadow-md", t ? "sl-bg-gray-800" : "sl-bg-white"])
+          }, [
+            x("div", {
+              class: d(["sl-animate-spin sl-h-4 sl-w-4 sl-border-2 sl-border-t-transparent sl-rounded-full", t ? "sl-border-primary-400" : "sl-border-primary-600"])
+            }, null, 2),
+            x("span", {
+              class: d(["sl-text-sm", t ? "sl-text-gray-300" : "sl-text-gray-600"])
+            }, U(n.dataLoadingText), 3)
+          ], 2)) : y("", !0),
+          n.showMarkerCount && a.value.length > 0 ? (f(), g("div", {
+            key: 1,
+            class: d(["sl-absolute sl-top-4 sl-right-4 sl-z-10 sl-px-2 sl-py-1 sl-rounded-md sl-text-xs sl-font-medium", t ? "sl-bg-gray-800/90 sl-text-gray-300" : "sl-bg-white/90 sl-text-gray-700"])
+          }, U(a.value.length) + " " + U(a.value.length === 1 ? "marker" : "markers"), 3)) : y("", !0),
+          Z(e.$slots, "overlay", {
+            isDark: t,
+            markers: a.value,
+            clusters: b(k)
+          })
+        ]),
+        controls: M(({ isDark: t }) => [
+          x("div", ke, [
+            n.showDefaultZoomControls ? (f(), g("div", {
+              key: 0,
+              class: d(["sl-flex sl-flex-col sl-rounded-lg sl-shadow-md sl-overflow-hidden", t ? "sl-bg-gray-800" : "sl-bg-white"])
+            }, [
+              x("button", {
+                onClick: $,
+                class: d(["sl-w-8 sl-h-8 sl-flex sl-items-center sl-justify-center sl-border-b sl-transition-colors", t ? "sl-border-gray-700 hover:sl-bg-gray-700" : "sl-border-gray-200 hover:sl-bg-gray-50"]),
+                title: "Zoom in"
+              }, [
+                C(b(ge), {
+                  class: d(["sl-w-4 sl-h-4", t ? "sl-text-gray-300" : "sl-text-gray-600"])
+                }, null, 8, ["class"])
+              ], 2),
+              x("button", {
+                onClick: V,
+                class: d(["sl-w-8 sl-h-8 sl-flex sl-items-center sl-justify-center sl-transition-colors", t ? "hover:sl-bg-gray-700" : "hover:sl-bg-gray-50"]),
+                title: "Zoom out"
+              }, [
+                C(b(ve), {
+                  class: d(["sl-w-4 sl-h-4", t ? "sl-text-gray-300" : "sl-text-gray-600"])
+                }, null, 8, ["class"])
+              ], 2)
+            ], 2)) : y("", !0),
+            n.showFitButton && a.value.length > 0 ? (f(), g("button", {
+              key: 1,
+              onClick: I,
+              class: d(["sl-w-8 sl-h-8 sl-flex sl-items-center sl-justify-center sl-rounded-lg sl-shadow-md sl-transition-colors", t ? "sl-bg-gray-800 hover:sl-bg-gray-700" : "sl-bg-white hover:sl-bg-gray-50"]),
+              title: "Fit to all markers"
+            }, [
+              C(b(he), {
+                class: d(["sl-w-4 sl-h-4", t ? "sl-text-gray-300" : "sl-text-gray-600"])
+              }, null, 8, ["class"])
+            ], 2)) : y("", !0),
+            Z(e.$slots, "controls", { isDark: t })
+          ])
+        ]),
+        _: 3
+      }, 16, ["show-custom-controls", "show-default-zoom-controls", "controls-position", "center", "zoom"]),
+      C(ye, {
+        visible: r.value.visible,
+        "onUpdate:visible": o[2] || (o[2] = (t) => r.value.visible = t),
+        loading: r.value.loading,
+        error: r.value.error,
+        title: r.value.title,
+        subtitle: r.value.subtitle,
+        "image-url": r.value.imageUrl,
+        details: r.value.details,
+        actions: r.value.actions,
+        data: r.value.data,
+        "show-avatar": n.showInfoAvatar,
+        onClose: L,
+        onRetry: re,
+        onAction: ie
+      }, {
+        footer: M(() => [
+          Z(e.$slots, "info-footer", {
+            data: r.value.data,
+            marker: v.value
+          })
+        ]),
+        default: M(() => [
+          Z(e.$slots, "info-content", {
+            data: r.value.data,
+            marker: v.value
+          })
+        ]),
+        _: 3
+      }, 8, ["visible", "loading", "error", "title", "subtitle", "image-url", "details", "actions", "data", "show-avatar"])
+    ], 64));
+  }
+});
+export {
+  Se as _
+};