@opengis/gis 0.2.166 → 0.2.168

package/dist/cartocss-BIveBlgY.js

@@ -0,0 +1,1586 @@
+import { openBlock as x, createElementBlock as R, createElementVNode as u, defineComponent as O, computed as B, createTextVNode as Ve, createVNode as M, mergeModels as pt, defineAsyncComponent as Le, useModel as yt, ref as b, withCtx as j, toDisplayString as Z, unref as U, watch as q, onUnmounted as gt, createCommentVNode as A, onBeforeUnmount as oe, normalizeClass as se, withModifiers as Ee, renderSlot as Ye, onMounted as ae, createBlock as P, normalizeStyle as ye, Transition as ht, Fragment as ge, renderList as Xe, withDirectives as De, vModelText as bt, vModelCheckbox as xt, resolveDynamicComponent as _t } from "vue";
+import { useRouter as wt, useRoute as kt } from "vue-router";
+import { notify as D } from "@opengis/core";
+import { ZoomIn as Ct, ZoomOut as $t, Compass as Mt, Minimize2 as St, Maximize2 as Lt, Link2 as Et, Ruler as Vt, Eye as zt, EyeOff as Bt } from "lucide-vue-next";
+import { _ as He, f as K, o as Rt, p as Pt, q as Tt, M as Nt, i as Ot, j as Ue, r as jt, t as Ft, m as At } from "./index-C3bl1qBS.js";
+import { S as Zt, C as Dt } from "./CardIcon-DzERD2T8.js";
+import { _ as Ut, a as qt, b as Qt, c as Yt } from "./HeaderActions.vue_vue_type_script_setup_true_lang-D1iwSeRN.js";
+import { _ as Je } from "./MonacoEditor.vue_vue_type_script_setup_true_lang-D3ZPeXMw.js";
+import { V as Xt } from "./vs-datatable-Cd2Gp4jo.js";
+import { _ as qe } from "./ExtentOutlineLayer.vue_vue_type_script_setup_true_lang-B-6axJUY.js";
+const Ht = {}, Jt = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "lucide lucide-table"
+};
+function Kt(k, r) {
+  return x(), R("svg", Jt, [...r[0] || (r[0] = [
+    u("path", { d: "M12 3v18" }, null, -1),
+    u("rect", {
+      width: "18",
+      height: "18",
+      x: "3",
+      y: "3",
+      rx: "2"
+    }, null, -1),
+    u("path", { d: "M3 9h18" }, null, -1),
+    u("path", { d: "M3 15h18" }, null, -1)
+  ])]);
+}
+const Gt = /* @__PURE__ */ He(Ht, [["render", Kt]]), Wt = { class: "flex flex-col h-full" }, It = { class: "flex justify-end mb-3 gap-2" }, eo = /* @__PURE__ */ O({
+  __name: "cartocss-css-tab",
+  props: {
+    modelValue: {}
+  },
+  emits: ["update:modelValue", "save"],
+  setup(k, { emit: r }) {
+    const l = k, _ = r, h = B({
+      get: () => l.modelValue,
+      set: (i) => _("update:modelValue", i)
+    });
+    return (i, g) => (x(), R("div", Wt, [
+      u("div", It, [
+        u("button", {
+          type: "button",
+          class: "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium bg-gradient-to-r from-sky-400 to-blue-400 hover:from-sky-500 hover:to-blue-500 text-white shadow-sm px-4 py-2 h-9 text-xs transition-all duration-300",
+          onClick: g[0] || (g[0] = (d) => i.$emit("save"))
+        }, [...g[2] || (g[2] = [
+          u("svg", {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "24",
+            height: "24",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "2",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            class: "h-3.5 w-3.5"
+          }, [
+            u("path", { d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a 2 2 0 0 1-2-2V5a 2 2 0 0 1 2-2z" }),
+            u("path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a 1 1 0 0 0-1 1v7" }),
+            u("path", { d: "M7 3v4a1 1 0 0 0 1 1h7" })
+          ], -1),
+          Ve(" Зберегти ", -1)
+        ])])
+      ]),
+      M(Je, {
+        modelValue: h.value,
+        "onUpdate:modelValue": g[1] || (g[1] = (d) => h.value = d),
+        language: "cartocss",
+        class: "flex-1 rounded-lg overflow-hidden"
+      }, null, 8, ["modelValue"])
+    ]));
+  }
+}), to = { class: "flex flex-col flex-1 min-h-0" }, oo = { class: "flex justify-between mb-3 gap-2" }, ao = { class: "text-left" }, lo = { class: "font-medium text-gray-900" }, no = { class: "text-xs text-gray-500" }, so = { class: "flex justify-center gap-2" }, ro = ["checked", "onChange"], uo = { class: "text-sm font-medium text-gray-900" }, io = /* @__PURE__ */ O({
+  __name: "cartocss-data-tab",
+  props: {
+    modelValue: { default: [] },
+    modelModifiers: {}
+  },
+  emits: /* @__PURE__ */ pt(["save"], ["update:modelValue"]),
+  setup(k, { emit: r }) {
+    const l = [
+      { key: "table", label: "Таблиця", slot: "datasetCell" },
+      {
+        key: "active",
+        label: "Активний",
+        slot: "activeCell",
+        width: "140px"
+      },
+      {
+        key: "zoom",
+        label: "Min Зум",
+        slot: "zoomCell",
+        width: "140px"
+      }
+    ], _ = Le(
+      () => import("@opengis/core").then((C) => C.VsModal)
+    ), h = Le(() => import("@opengis/form")), i = yt(k, "modelValue"), g = r, d = b(!1), w = b({
+      table: "",
+      query: "",
+      srid: "",
+      key: "",
+      columns: "",
+      gcol: "",
+      minzoom: "",
+      maxzoom: "",
+      proj4text: "",
+      active: !0
+    }), a = {
+      table: { type: "text", label: "Таблиця", validators: ["required"] },
+      key: { type: "text", label: "Ключ", validators: ["required"] },
+      query: { type: "text", label: "Query" },
+      columns: { type: "text", label: "Колонки" },
+      gcol: { type: "text", label: "Колонка geometry" },
+      srid: { type: "number", label: "SRID" },
+      proj4text: { type: "text", label: "PROJ4" },
+      active: { type: "switcher", label: "Активна" },
+      minzoom: { type: "number", label: "Min Зум", col: 6 },
+      maxzoom: { type: "number", label: "Max Зум", col: 6 }
+    };
+    function n() {
+      w.value = {
+        table: "",
+        query: "",
+        srid: "",
+        key: "",
+        columns: "",
+        gcol: "",
+        minzoom: "",
+        maxzoom: "",
+        proj4text: "",
+        active: !0
+      }, d.value = !0;
+    }
+    function c() {
+      d.value = !1;
+    }
+    function L() {
+      var f, s;
+      const C = (f = w.value.table) == null ? void 0 : f.trim(), $ = (s = w.value.key) == null ? void 0 : s.trim();
+      if (!C || !$) {
+        D({
+          type: "warning",
+          title: "Перевірка",
+          message: "Вкажіть таблицю та підпис"
+        });
+        return;
+      }
+      i.value = [
+        ...Array.isArray(i.value) ? i.value : [],
+        { ...w.value, table: C, key: $ }
+      ], d.value = !1;
+    }
+    function y(C, $) {
+      var s;
+      const f = ((s = $ == null ? void 0 : $.target) == null ? void 0 : s.checked) ?? !1;
+      C.active = f, i.value = Array.isArray(i.value) ? [...i.value] : [];
+    }
+    return (C, $) => (x(), R("div", to, [
+      u("div", oo, [
+        u("button", {
+          type: "button",
+          class: "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium bg-gradient-to-r from-gray-500 to-gray-400 text-white h-9 px-4 py-2 hover:from-gray-600 hover:to-gray-500",
+          onClick: n
+        }, " Додати таблицю "),
+        u("button", {
+          type: "button",
+          class: "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium bg-gradient-to-r from-sky-400 to-blue-400 hover:from-sky-500 hover:to-blue-500 text-white shadow-sm px-4 py-2 h-9 text-xs transition-all duration-300",
+          onClick: $[0] || ($[0] = (f) => g("save"))
+        }, " Зберегти ")
+      ]),
+      M(Xt, {
+        modelValue: i.value,
+        "onUpdate:modelValue": $[1] || ($[1] = (f) => i.value = f),
+        "columns-scheme": l,
+        "form-scheme": a,
+        "add-button": !1,
+        "main-col-width": "260px"
+      }, {
+        datasetCell: j(({ row: f }) => [
+          u("div", ao, [
+            u("div", lo, Z(f.table), 1),
+            u("div", no, Z(f.key), 1)
+          ])
+        ]),
+        activeCell: j(({ row: f }) => [
+          u("label", so, [
+            u("input", {
+              type: "checkbox",
+              class: "h-4 w-4 text-sky-500 border-gray-300 rounded focus:ring-sky-300",
+              checked: f.active,
+              onChange: (s) => y(f, s)
+            }, null, 40, ro)
+          ])
+        ]),
+        zoomCell: j(({ row: f }) => [
+          u("div", uo, Z(f.zoom), 1)
+        ]),
+        _: 1
+      }, 8, ["modelValue"]),
+      M(U(_), {
+        teleport: "#modal",
+        visible: d.value,
+        "onUpdate:visible": $[3] || ($[3] = (f) => d.value = f),
+        title: "Нова таблиця CartoCSS"
+      }, {
+        footer: j(() => [
+          u("div", { class: "flex justify-end gap-2 p-4 border-т" }, [
+            u("button", {
+              type: "button",
+              class: "px-4 py-2 rounded bg-gray-100 text-gray-700",
+              onClick: c
+            }, " Скасувати "),
+            u("button", {
+              type: "button",
+              class: "px-4 py-2 rounded bg-blue-600 text-white",
+              onClick: L
+            }, " Додати ")
+          ])
+        ]),
+        default: j(() => [
+          M(U(h), {
+            values: w.value,
+            "onUpdate:values": $[2] || ($[2] = (f) => w.value = f),
+            schema: a
+          }, null, 8, ["values"])
+        ]),
+        _: 1
+      }, 8, ["visible"])
+    ]));
+  }
+}), co = { class: "flex flex-col flex-1 min-h-0 gap-4" }, fo = { class: "h-[calc(100vh-230px)] rounded-md border border-gray-200 bg-white" }, mo = /* @__PURE__ */ O({
+  __name: "cartocss-card-tab",
+  props: {
+    card: {},
+    table: {}
+  },
+  emits: ["save"],
+  setup(k, { emit: r }) {
+    const l = k, _ = r, h = b(l.table), i = b(l.card), g = Le(() => import("@opengis/form").then((w) => w.VsInputText));
+    function d() {
+      _("save", {
+        card_html: i.value,
+        card_table: h.value
+      });
+    }
+    return (w, a) => (x(), R("div", co, [
+      u("div", { class: "flex items-center justify-end gap-3" }, [
+        u("button", {
+          type: "button",
+          class: "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium bg-gradient-to-r from-sky-400 to-blue-400 hover:from-sky-500 hover:to-blue-500 text-white shadow-sm px-4 py-2 h-9 text-xs transition-all duration-300",
+          onClick: d
+        }, [...a[2] || (a[2] = [
+          u("svg", {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "24",
+            height: "24",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "2",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            class: "h-3.5 w-3.5"
+          }, [
+            u("path", { d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a 2 2 0 0 1-2-2V5a 2 2 0 0 1 2-2z" }),
+            u("path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a 1 1 0 0 0-1 1v7" }),
+            u("path", { d: "M7 3v4a1 1 0 0 0 1 1h7" })
+          ], -1),
+          Ve(" Зберегти картку ", -1)
+        ])])
+      ]),
+      u("div", null, [
+        M(U(g), {
+          modelValue: h.value,
+          "onUpdate:modelValue": a[0] || (a[0] = (n) => h.value = n)
+        }, null, 8, ["modelValue"])
+      ]),
+      u("div", fo, [
+        M(Je, {
+          modelValue: i.value,
+          "onUpdate:modelValue": a[1] || (a[1] = (n) => i.value = n),
+          language: "html",
+          theme: "vs-light",
+          class: "h-full w-full rounded-md"
+        }, null, 8, ["modelValue"])
+      ])
+    ]));
+  }
+}), vo = /* @__PURE__ */ O({
+  __name: "CartocssLayerLoader",
+  props: {
+    layerId: { type: String, required: !0 },
+    tileUrl: { type: String, default: "" },
+    title: { type: String, default: "" },
+    active: { type: Boolean, default: !1 },
+    owner: { type: String, default: "" },
+    opacity: { type: Number, default: 1 }
+  },
+  setup(k) {
+    const r = k, l = K(), {
+      activateTemporaryLayer: _,
+      deactivateTemporaryLayer: h,
+      setTemporaryLayerOpacity: i
+    } = Rt(l.map), g = B(() => {
+      var c;
+      const n = `${(c = r == null ? void 0 : r.tileUrl) == null ? void 0 : c.trim()}`;
+      return n ? typeof window > "u" || typeof location > "u" || /^https?:\/\//i.test(n) ? n : n.startsWith("//") ? `${window.location.protocol}${n}` : n.startsWith("/") ? `${location.origin}${n}` : `${location.origin}/${n}` : "";
+    });
+    let d = "", w = "";
+    function a() {
+      const n = r.active && !!g.value;
+      d && (!n || d !== r.layerId) && (h(d, w || void 0), d = "", w = ""), n && (_(
+        {
+          id: r.layerId,
+          title: r.title || r.layerId,
+          url: g.value,
+          opacity: r.opacity
+        },
+        {},
+        r.owner
+      ), d = r.layerId, w = r.owner || "");
+    }
+    return q(
+      () => [r.layerId, g.value, r.active, r.owner],
+      a,
+      { immediate: !0 }
+    ), q(
+      () => r.opacity,
+      (n) => {
+        !d || !r.active || i(d, n, w || void 0);
+      },
+      { immediate: !0 }
+    ), gt(() => {
+      d && (h(d, w || void 0), d = "", w = "");
+    }), (n, c) => A("", !0);
+  }
+}), po = /* @__PURE__ */ O({
+  __name: "CartocssMapClickListener",
+  props: {
+    cartocssId: {},
+    infoEnabled: { type: [Boolean, null] },
+    active: { type: [Boolean, null] }
+  },
+  setup(k) {
+    const r = k, l = B(() => r.cartocssId ?? null), _ = B(
+      () => !!r.infoEnabled && r.active !== !1
+    ), { map: h, ready: i } = K(), g = (y) => {
+      !y || typeof window > "u" || window.dispatchEvent(
+        new CustomEvent(Tt, { detail: y })
+      );
+    }, d = async (y) => {
+      const C = await fetch(`/api/map-format?${y.toString()}`);
+      if (!C.ok)
+        throw new Error(`API returned ${C.status}`);
+      return C.json();
+    };
+    let w = null, a = null;
+    const n = (y) => {
+      if (!y) return null;
+      if (typeof y == "string")
+        try {
+          return JSON.parse(y);
+        } catch {
+          return null;
+        }
+      return y;
+    }, c = async (y, C) => {
+      var s;
+      const $ = l.value ? `external:${l.value},${String(y)}` : null, f = new URLSearchParams({
+        layer: l.value ?? "",
+        id: String(y)
+      });
+      try {
+        const m = await d(f), T = typeof m.html == "string" ? m.html : null, z = n(
+          ((s = m == null ? void 0 : m.data) == null ? void 0 : s.geom) ?? (m == null ? void 0 : m.geom) ?? null
+        );
+        (T || z) && g({
+          html: T,
+          geometry: z ?? C,
+          infoToken: $
+        });
+      } catch (m) {
+        console.warn("CartoCSS map-format (id) error", m);
+      }
+    }, L = async (y) => {
+      var s, m, T, z;
+      if (!l.value || r.active === !1) return;
+      if (!_.value) {
+        D({
+          type: "error",
+          title: "CartoCSS",
+          message: "Картка не налаштована"
+        });
+        return;
+      }
+      const C = (s = y == null ? void 0 : y.lngLat) == null ? void 0 : s.lng, $ = (m = y == null ? void 0 : y.lngLat) == null ? void 0 : m.lat;
+      if (typeof C != "number" || typeof $ != "number") return;
+      const f = new URLSearchParams({
+        layer: l.value,
+        lat: $.toFixed(6),
+        lng: C.toFixed(6)
+      });
+      try {
+        const S = await d(f), G = n(
+          ((T = S == null ? void 0 : S.data) == null ? void 0 : T.geom) ?? (S == null ? void 0 : S.geom) ?? null
+        ), Y = ((z = S == null ? void 0 : S.data) == null ? void 0 : z.id) ?? (S == null ? void 0 : S.id);
+        if (Y != null) {
+          await c(Y, G);
+          return;
+        }
+        Pt({ html: S == null ? void 0 : S.html }) && g({
+          html: S == null ? void 0 : S.html,
+          geometry: G,
+          infoToken: null
+        });
+      } catch (S) {
+        console.warn("CartoCSS map-format error", S);
+      }
+    };
+    return i().then(() => {
+      a = h.value, a && (a.on("click", L), w = () => a == null ? void 0 : a.off("click", L));
+    }), oe(() => {
+      w == null || w(), w = null, a = null;
+    }), () => {
+    };
+  }
+}), yo = ["title", "aria-label", "disabled"], go = {
+  key: 0,
+  class: "absolute right-full mr-3 px-1.5 py-0.5 bg-gray-700 text-white text-[0.75rem] font-medium rounded-md opacity-0 group-hover:opacity-100 group-focus-visible:opacity-100 pointer-events-none transition-opacity duration-200 whitespace-nowrap",
+  "aria-hidden": "true"
+}, ee = /* @__PURE__ */ O({
+  __name: "MapIconButton",
+  props: {
+    title: {},
+    ariaLabel: { default: "" },
+    tooltip: { default: "" },
+    active: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["click"],
+  setup(k) {
+    const r = k, l = B(() => [
+      "group relative flex items-center justify-center w-9 h-9 rounded-xl shadow-lg transition-transform transition-shadow duration-200 hover:scale-105 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-400/60 focus-visible:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100",
+      r.active ? "bg-blue-50 text-blue-700 ring-1 ring-blue-300" : "bg-white text-gray-700 hover:bg-gray-50"
+    ].join(" "));
+    return (_, h) => (x(), R("button", {
+      type: "button",
+      class: se(l.value),
+      title: k.title,
+      "aria-label": k.ariaLabel || k.title,
+      disabled: k.disabled,
+      onClick: h[0] || (h[0] = Ee((i) => _.$emit("click", i), ["stop"]))
+    }, [
+      k.tooltip ? (x(), R("span", go, Z(k.tooltip), 1)) : A("", !0),
+      Ye(_.$slots, "default")
+    ], 10, yo));
+  }
+}), ho = /* @__PURE__ */ O({
+  __name: "MapZoomInButton",
+  setup(k) {
+    const { map: r, ready: l } = K(), _ = b(!1);
+    ae(async () => {
+      await (l == null ? void 0 : l()), _.value = !!r.value;
+    });
+    function h() {
+      const i = r.value;
+      i != null && i.zoomIn && i.zoomIn();
+    }
+    return (i, g) => (x(), P(ee, {
+      title: "Збільшити",
+      tooltip: "Плюс зум",
+      disabled: !_.value,
+      onClick: h
+    }, {
+      default: j(() => [
+        M(U(Ct), { class: "w-4 h-4" })
+      ]),
+      _: 1
+    }, 8, ["disabled"]));
+  }
+}), bo = /* @__PURE__ */ O({
+  __name: "MapZoomOutButton",
+  setup(k) {
+    const { map: r, ready: l } = K(), _ = b(!1);
+    ae(async () => {
+      await (l == null ? void 0 : l()), _.value = !!r.value;
+    });
+    function h() {
+      const i = r.value;
+      i != null && i.zoomOut && i.zoomOut();
+    }
+    return (i, g) => (x(), P(ee, {
+      title: "Зменшити",
+      tooltip: "Мінус зум",
+      disabled: !_.value,
+      onClick: h
+    }, {
+      default: j(() => [
+        M(U($t), { class: "w-4 h-4" })
+      ]),
+      _: 1
+    }, 8, ["disabled"]));
+  }
+}), xo = /* @__PURE__ */ O({
+  __name: "MapCompassButton",
+  setup(k) {
+    const { map: r, ready: l } = K(), _ = b(!1), h = b(0), i = b(0), g = B(() => ({
+      transform: `scale(${(1 + i.value / 70).toFixed(5)}) rotateZ(0deg) rotateX(${i.value}deg) rotateZ(${h.value}deg)`
+    }));
+    function d() {
+      var n, c;
+      const a = r.value;
+      a && (h.value = Number(((n = a.getBearing) == null ? void 0 : n.call(a)) ?? 0), i.value = Number(((c = a.getPitch) == null ? void 0 : c.call(a)) ?? 0));
+    }
+    ae(async () => {
+      var n, c, L;
+      await (l == null ? void 0 : l());
+      const a = r.value;
+      _.value = !!a, d(), (n = a == null ? void 0 : a.on) == null || n.call(a, "rotate", d), (c = a == null ? void 0 : a.on) == null || c.call(a, "pitch", d), (L = a == null ? void 0 : a.on) == null || L.call(a, "load", d);
+    }), oe(() => {
+      var n, c, L;
+      const a = r.value;
+      (n = a == null ? void 0 : a.off) == null || n.call(a, "rotate", d), (c = a == null ? void 0 : a.off) == null || c.call(a, "pitch", d), (L = a == null ? void 0 : a.off) == null || L.call(a, "load", d);
+    });
+    function w() {
+      const a = r.value;
+      a != null && a.easeTo && a.easeTo({ bearing: 0, pitch: 0 });
+    }
+    return (a, n) => (x(), P(ee, {
+      title: "Повернути орієнтацію",
+      tooltip: "Компас",
+      disabled: !_.value,
+      onClick: w
+    }, {
+      default: j(() => [
+        M(U(Mt), {
+          class: "w-4 h-4",
+          "aria-hidden": "true",
+          style: ye(g.value)
+        }, null, 8, ["style"])
+      ]),
+      _: 1
+    }, 8, ["disabled"]));
+  }
+}), _o = 100, wo = /* @__PURE__ */ O({
+  __name: "MapFullscreenButton",
+  props: {
+    target: {}
+  },
+  setup(k) {
+    const r = k, { map: l, ready: _ } = K(), h = b(!1), i = b(!1);
+    function g() {
+      var c, L;
+      if (r.target) return r.target;
+      const n = (L = (c = l.value) == null ? void 0 : c.getContainer) == null ? void 0 : L.call(c);
+      return n ? n.closest(".map-view-root") ?? n : null;
+    }
+    function d() {
+      const n = g();
+      i.value = !!(n && document.fullscreenElement === n);
+    }
+    function w() {
+      window.setTimeout(() => {
+        var n, c;
+        (c = (n = l.value) == null ? void 0 : n.resize) == null || c.call(n);
+      }, _o);
+    }
+    async function a() {
+      const n = g();
+      if (n)
+        try {
+          document.fullscreenElement === n ? await document.exitFullscreen() : document.fullscreenElement ? (await document.exitFullscreen(), await n.requestFullscreen()) : await n.requestFullscreen();
+        } catch (c) {
+          console.error("Fullscreen error:", c);
+        } finally {
+          d(), w();
+        }
+    }
+    return ae(async () => {
+      await (_ == null ? void 0 : _()), h.value = !!l.value, d(), document.addEventListener("fullscreenchange", d), document.addEventListener("fullscreenchange", w);
+    }), oe(() => {
+      document.removeEventListener("fullscreenchange", d), document.removeEventListener("fullscreenchange", w);
+    }), (n, c) => (x(), P(ee, {
+      title: i.value ? "Вийти з повного екрана" : "Повний екран",
+      tooltip: i.value ? "Вийти з повного екрана" : "Повний екран",
+      active: i.value,
+      disabled: !h.value,
+      onClick: a
+    }, {
+      default: j(() => [
+        i.value ? (x(), P(U(St), {
+          key: 0,
+          class: "w-4 h-4"
+        })) : (x(), P(U(Lt), {
+          key: 1,
+          class: "w-4 h-4"
+        }))
+      ]),
+      _: 1
+    }, 8, ["title", "tooltip", "active", "disabled"]));
+  }
+}), ko = /* @__PURE__ */ O({
+  __name: "MapCopyLinkButton",
+  props: {
+    url: { default: "" }
+  },
+  setup(k) {
+    const r = k;
+    async function l() {
+      const _ = r.url || (typeof window < "u" ? window.location.href : "");
+      if (!_) {
+        D({
+          type: "warning",
+          title: "Посилання",
+          message: "Немає URL для копіювання"
+        });
+        return;
+      }
+      try {
+        await navigator.clipboard.writeText(_), D({
+          type: "success",
+          title: "Посилання",
+          message: "Посилання скопійовано"
+        });
+      } catch (h) {
+        console.error("Copy link error:", h), D({
+          type: "error",
+          title: "Посилання",
+          message: "Не вдалося скопіювати посилання"
+        });
+      }
+    }
+    return (_, h) => (x(), P(ee, {
+      title: "Копіювати посилання",
+      tooltip: "Копіювати посилання",
+      onClick: l
+    }, {
+      default: j(() => [
+        M(U(Et), { class: "w-4 h-4" })
+      ]),
+      _: 1
+    }));
+  }
+}), Co = {
+  key: 0,
+  class: "absolute right-full top-0 mr-2 z-[450] flex",
+  role: "group",
+  "aria-label": "Вибір рівня зуму"
+}, $o = { class: "flex flex-col items-center rounded-lg border border-gray-200 bg-white/95 py-2.5 pl-1 pr-2 shadow-lg backdrop-blur-sm" }, Mo = ["title", "onClick"], So = {
+  key: 0,
+  class: "absolute right-5 text-[9px] tabular-nums text-gray-400"
+}, Lo = /* @__PURE__ */ O({
+  __name: "MapZoomSlider",
+  props: {
+    visible: { type: Boolean },
+    modelValue: {},
+    min: { default: 5 },
+    max: { default: 20 }
+  },
+  emits: ["update:modelValue"],
+  setup(k, { emit: r }) {
+    const l = k, _ = r, h = b(), i = b(l.modelValue), g = b(!1);
+    q(
+      () => l.modelValue,
+      (f) => {
+        g.value || (i.value = f);
+      }
+    );
+    const d = B(() => {
+      const f = [];
+      for (let s = l.min; s <= l.max; s += 1) f.push(s);
+      return f;
+    }), w = B(() => {
+      const f = /* @__PURE__ */ new Set();
+      for (let s = l.min; s <= l.max; s += 5)
+        f.add(s);
+      return f.add(l.max), f;
+    }), a = (f) => w.value.has(f), n = (f) => {
+      const s = l.max - l.min;
+      return s <= 0 ? 0 : (l.max - f) / s * 100;
+    }, c = (f) => {
+      _("update:modelValue", f);
+    }, L = (f) => {
+      if (!h.value) return;
+      const s = h.value.getBoundingClientRect(), m = (f - s.top) / s.height;
+      i.value = Math.max(
+        l.min,
+        Math.min(l.max, Math.round(l.max - m * (l.max - l.min)))
+      );
+    }, y = (f) => {
+      L(f.clientY);
+    }, C = () => {
+      window.removeEventListener("mousemove", y), window.removeEventListener("mouseup", C), g.value = !1, i.value !== l.modelValue && _("update:modelValue", i.value);
+    }, $ = (f) => {
+      g.value = !0, L(f.clientY), window.addEventListener("mousemove", y), window.addEventListener("mouseup", C);
+    };
+    return (f, s) => (x(), P(ht, { name: "zoom-panel" }, {
+      default: j(() => [
+        k.visible ? (x(), R("div", Co, [
+          u("div", $o, [
+            s[1] || (s[1] = u("span", { class: "mb-1 text-[9px] font-semibold uppercase tracking-wider text-gray-400" }, " Zoom ", -1)),
+            u("div", {
+              ref_key: "sliderRef",
+              ref: h,
+              class: "relative h-44 w-8 cursor-pointer select-none",
+              onMousedown: Ee($, ["prevent"])
+            }, [
+              s[0] || (s[0] = u("div", { class: "absolute right-0 top-0 bottom-0 w-px bg-gray-200" }, null, -1)),
+              (x(!0), R(ge, null, Xe(d.value, (m) => (x(), R("button", {
+                key: m,
+                type: "button",
+                class: "absolute right-0 -translate-y-1/2 flex items-center justify-end group",
+                style: ye({ top: `${n(m)}%` }),
+                title: `Zoom ${m}`,
+                onClick: Ee((T) => c(m), ["stop"])
+              }, [
+                u("span", {
+                  class: se([
+                    "block rounded-full",
+                    a(m) ? "h-px w-2.5 bg-gray-300 group-hover:bg-gray-400" : "h-px w-1.5 bg-gray-200 group-hover:bg-gray-300"
+                  ])
+                }, null, 2),
+                a(m) ? (x(), R("span", So, Z(m), 1)) : A("", !0)
+              ], 12, Mo))), 128)),
+              u("div", {
+                class: "absolute right-0 -translate-y-1/2 flex items-center",
+                style: ye({ top: `${n(i.value)}%` })
+              }, [
+                u("div", {
+                  class: se(["h-[4px] w-4 rounded-full bg-blue-600/80 shadow-sm transition-all", g.value ? "bg-blue-300 transform duration-200" : ""])
+                }, null, 2)
+              ], 4)
+            ], 544)
+          ])
+        ])) : A("", !0)
+      ]),
+      _: 1
+    }));
+  }
+}), Eo = /* @__PURE__ */ He(Lo, [["__scopeId", "data-v-ca77aba8"]]), Vo = { class: "text-[0.7rem] font-bold tabular-nums leading-none text-gray-600" }, Me = 5, Se = 20, zo = 13, Bo = 0.01, Ro = 200, Po = /* @__PURE__ */ O({
+  __name: "MapZoomLevelButton",
+  setup(k) {
+    const { map: r, ready: l } = K(), _ = b(!1), h = b(!1), i = b(zo), g = b(!1), d = b(Me), w = b(Se), a = B(() => String(i.value));
+    function n(s) {
+      return Math.round(Math.min(w.value, Math.max(d.value, s)));
+    }
+    function c() {
+      var z, S;
+      const s = r.value;
+      if (!s) return;
+      const m = (z = s.getMinZoom) == null ? void 0 : z.call(s), T = (S = s.getMaxZoom) == null ? void 0 : S.call(s);
+      Number.isFinite(m) && (d.value = Math.max(Me, Math.floor(Number(m)))), Number.isFinite(T) && (w.value = Math.min(Se, Math.ceil(Number(T)))), d.value > w.value && (d.value = Me, w.value = Se);
+    }
+    function L() {
+      var z;
+      const s = r.value;
+      if (!s || g.value) return;
+      const m = (z = s.getZoom) == null ? void 0 : z.call(s);
+      if (m == null) return;
+      const T = n(m);
+      i.value !== T && (i.value = T);
+    }
+    function y(s) {
+      var G, Y;
+      const m = r.value;
+      if (!(m != null && m.easeTo)) return;
+      const T = (G = m.getCenter) == null ? void 0 : G.call(m);
+      if (!T) return;
+      const z = n(s), S = (Y = m.getZoom) == null ? void 0 : Y.call(m);
+      S != null && Math.abs(S - z) < Bo || (g.value = !0, m.easeTo({
+        center: [T.lng, T.lat],
+        zoom: z,
+        duration: Ro,
+        essential: !0
+      }));
+    }
+    function C() {
+      g.value = !1, L();
+    }
+    function $() {
+      h.value = !h.value, h.value && (c(), L());
+    }
+    function f(s) {
+      i.value = s, y(s);
+    }
+    return ae(async () => {
+      var m;
+      await (l == null ? void 0 : l());
+      const s = r.value;
+      _.value = !!s, c(), L(), (m = s == null ? void 0 : s.on) == null || m.call(s, "zoomend", C);
+    }), oe(() => {
+      var s, m;
+      (m = (s = r.value) == null ? void 0 : s.off) == null || m.call(s, "zoomend", C);
+    }), (s, m) => (x(), R(ge, null, [
+      M(ee, {
+        title: h.value ? "Закрити вибір зуму" : "Вибрати рівень зуму",
+        tooltip: "Рівень зуму",
+        active: h.value,
+        disabled: !_.value,
+        "aria-label": "Рівень зуму",
+        onClick: $
+      }, {
+        default: j(() => [
+          u("div", Vo, Z(a.value), 1)
+        ]),
+        _: 1
+      }, 8, ["title", "active", "disabled"]),
+      M(Eo, {
+        visible: h.value,
+        "model-value": i.value,
+        min: d.value,
+        max: w.value,
+        "onUpdate:modelValue": f
+      }, null, 8, ["visible", "model-value", "min", "max"])
+    ], 64));
+  }
+}), To = /* @__PURE__ */ O({
+  __name: "MapRulerButton",
+  props: {
+    active: { type: Boolean }
+  },
+  emits: ["click"],
+  setup(k) {
+    return (r, l) => (x(), P(ee, {
+      title: k.active ? "Вимкнути лінійку" : "Увімкнути лінійку",
+      tooltip: "Вимірювання",
+      active: k.active,
+      "aria-label": "Вимірювання",
+      onClick: l[0] || (l[0] = (_) => r.$emit("click", _))
+    }, {
+      default: j(() => [
+        M(U(Vt), { class: "w-4 h-4" })
+      ]),
+      _: 1
+    }, 8, ["title", "active"]));
+  }
+}), No = { class: "absolute right-3 top-3 z-[450] flex flex-col gap-1 pointer-events-auto" }, Oo = /* @__PURE__ */ O({
+  name: "MapToolbarRight",
+  __name: "MapToolbarRight",
+  setup(k) {
+    return (r, l) => (x(), R("div", No, [
+      Ye(r.$slots, "default")
+    ]));
+  }
+}), jo = /* @__PURE__ */ O({
+  __name: "RulerMapClickBridge",
+  props: {
+    active: { type: Boolean }
+  },
+  emits: ["map-click"],
+  setup(k, { emit: r }) {
+    const l = k, _ = r, { map: h, ready: i } = K();
+    let g = null;
+    function d(a) {
+      if (!l.active) return;
+      const n = a == null ? void 0 : a.lngLat;
+      typeof (n == null ? void 0 : n.lat) != "number" || typeof (n == null ? void 0 : n.lng) != "number" || _("map-click", { lat: n.lat, lng: n.lng });
+    }
+    async function w() {
+      if (g == null || g(), g = null, !l.active) return;
+      await (i == null ? void 0 : i());
+      const a = h.value;
+      a != null && a.on && (a.on("click", d), g = () => {
+        var n;
+        return (n = a.off) == null ? void 0 : n.call(a, "click", d);
+      });
+    }
+    return q(
+      () => l.active,
+      () => {
+        w();
+      },
+      { immediate: !0 }
+    ), oe(() => {
+      g == null || g(), g = null;
+    }), (a, n) => null;
+  }
+}), Fo = { class: "flex h-full bg-gradient-to-br from-slate-50 to-white" }, Ao = { class: "flex-1 relative overflow-hidden" }, Zo = { class: "absolute top-0 left-0 w-full z-20" }, Do = { class: "px-4 sm:px-6 py-4 border-b border-gray-200 bg-white shadow-sm" }, Uo = { class: "flex items-start justify-between gap-4" }, qo = { class: "flex-1 min-w-0" }, Qo = { class: "flex items-center text-sm text-gray-500 mb-3" }, Yo = { class: "text-gray-900 font-medium truncate max-w-xs" }, Xo = { class: "flex items-center justify-between gap-4" }, Ho = { class: "flex-1 min-w-0" }, Jo = { class: "flex items-center gap-3 mb-1" }, Ko = { class: "text-base font-semibold text-gray-900 truncate" }, Go = {
+  key: 0,
+  class: "px-2 py-0.5 bg-green-50 border border-green-200 rounded flex-shrink-0"
+}, Wo = { class: "text-xs font-medium text-green-700" }, Io = ["title"], ea = { class: "w-full h-full bg-gradient-to-br from-sky-50 via-white to-blue-50 flex items-center justify-center relative pt-[115px]" }, ta = { class: "relative w-full h-full" }, oa = { class: "absolute top-3 left-3 z-20" }, aa = { class: "px-3 py-2 flex items-center gap-2 border-b border-gray-100" }, la = { class: "text-xs text-gray-700 w-9 text-right" }, na = { class: "px-3 py-2 flex items-center gap-2" }, sa = {
+  for: "show-layer",
+  class: "text-xs text-gray-700 flex items-center gap-1 cursor-pointer"
+}, ra = {
+  key: 2,
+  class: "absolute bottom-4 left-1/2 z-30 -translate-x-1/2 rounded-2xl border border-sky-200 bg-white/95 px-4 py-2 text-xs font-medium text-slate-700 shadow-lg backdrop-blur"
+}, ua = { class: "flex-1 flex flex-col h-full" }, ia = {
+  key: 0,
+  class: "px-3 pt-3 pb-2 border-b border-gray-100"
+}, ca = ["aria-selected", "onClick"], da = { class: "leading-none" }, fa = { class: "flex flex-col flex-1 overflow-y-hidden p-3" }, ma = {
+  key: 0,
+  class: "flex-1 flex items-center justify-center text-sm text-gray-500"
+}, va = "cartocss-demo-001", pa = "OpenGIS", Qe = 2, pe = 5, ya = 5, La = /* @__PURE__ */ O({
+  __name: "cartocss",
+  setup(k) {
+    const r = wt(), l = kt(), _ = b(null), h = B(() => {
+      var t;
+      const e = (t = l.matched[l.matched.length - 1]) == null ? void 0 : t.path;
+      return (typeof e == "string" && e ? e : l.path).replace(/\/:id\??$/, "") || "/";
+    }), i = B(() => {
+      var o;
+      const e = (o = l.meta) == null ? void 0 : o.title;
+      return typeof e == "string" && e.trim() ? e : "CartoCSS";
+    });
+    function g() {
+      r.push(h.value);
+    }
+    const d = [
+      { key: "css", label: "CSS", icon: Zt },
+      { key: "data", label: "Дані", icon: Gt },
+      { key: "metadata", label: "Метадані", icon: Yt },
+      { key: "card", label: "Картка", icon: Dt }
+    ], w = d.map((e) => e.key), a = b(
+      w.includes(l.query.tab) ? l.query.tab : "css"
+    ), n = b(!0), c = b(null), L = B(
+      () => {
+        var e;
+        return (e = c.value) != null && e.source_path ? d.filter((o) => o.key === "card" || o.key === "metadata") : d;
+      }
+    ), y = B(
+      () => l.params.id || va
+    ), C = b({
+      id: y.value,
+      name: "",
+      description: ""
+    });
+    let $ = null;
+    const f = b(!1);
+    function s(e) {
+      if (Array.isArray(e)) return s(e[0]);
+      if (typeof e != "string" && typeof e != "number") return null;
+      const o = typeof e == "number" ? e : Number(e.trim());
+      return Number.isFinite(o) ? o : null;
+    }
+    function m(e, o) {
+      return e.toFixed(o);
+    }
+    function T(e, o, t) {
+      const v = 0.5 * 10 ** -t;
+      return Math.abs(e - o) > v;
+    }
+    function z() {
+      var e;
+      return (e = _.value) == null ? void 0 : e.ctx;
+    }
+    function S() {
+      var E, N, J, Q;
+      const e = (N = (E = z()) == null ? void 0 : E.map) == null ? void 0 : N.value;
+      if (!e) return;
+      const o = s(l.query.z), t = s(l.query.x), v = s(l.query.y);
+      if (o == null || t == null || v == null) return;
+      const p = (J = e.getCenter) == null ? void 0 : J.call(e), V = (Q = e.getZoom) == null ? void 0 : Q.call(e);
+      (!p || T(p.lng, t, pe) || T(p.lat, v, pe) || T(V ?? 0, o, Qe)) && (f.value = !0, e.jumpTo({ center: [t, v], zoom: o }), f.value = !1);
+    }
+    function G() {
+      var p, V, F, E;
+      if (f.value) return;
+      const e = (V = (p = z()) == null ? void 0 : p.map) == null ? void 0 : V.value;
+      if (!e) return;
+      const o = (F = e.getCenter) == null ? void 0 : F.call(e), t = (E = e.getZoom) == null ? void 0 : E.call(e);
+      if (!o || t == null) return;
+      const v = {
+        ...l.query,
+        z: m(t, Qe),
+        x: m(o.lng, pe),
+        y: m(o.lat, pe)
+      };
+      l.query.z === v.z && l.query.x === v.x && l.query.y === v.y || r.replace({ query: v });
+    }
+    function Y(e) {
+      typeof document > "u" || (document.title = e ? `${e} — CartoCSS` : pa);
+    }
+    const re = b(""), ue = b([]), he = b(!1), ie = b(!1), be = b(""), xe = b(0), W = b(!0), ce = b(1), X = b(!1), le = b(null), H = b(!1), _e = b(null), de = b(
+      []
+    ), we = b(!1), ze = b("general");
+    function Ke(e) {
+      de.value = e;
+    }
+    function Ge(e) {
+      var o;
+      (o = _e.value) == null || o.addPoint(e);
+    }
+    function Be() {
+      var e;
+      de.value = [], we.value = !1, (e = _e.value) == null || e.clearPoints(), H.value = !1;
+    }
+    function We() {
+      if (H.value) {
+        Be();
+        return;
+      }
+      H.value = !0;
+    }
+    const Ie = B(() => `cartocss-layer-${y.value}`), et = B(
+      () => `${Math.round(ce.value * 100)}%`
+    ), tt = B(
+      () => `cartocss-extent-${y.value}`
+    ), ot = B(
+      () => `cartocss-extent-draft-${y.value}`
+    ), Re = B(() => {
+      var p;
+      const e = (p = be.value) == null ? void 0 : p.trim();
+      if (!e) return "";
+      const o = e.includes("?") ? "&" : "?", t = `${e}${o}nottl=1`, v = xe.value;
+      return v ? `${e}${o}ts=${v}&nocache=1` : t;
+    }), Pe = b(""), Te = b(""), Ne = B(() => {
+      var V;
+      const e = (V = c.value) == null ? void 0 : V.bounds;
+      if (!Array.isArray(e) || e.length < 4) return null;
+      const [o, t, v, p] = e;
+      return [o, t, v, p].some(
+        (F) => typeof F != "number" || Number.isNaN(F)
+      ) ? null : [(o + v) / 2, (t + p) / 2];
+    }), at = B(() => {
+      var V;
+      const e = (V = c.value) == null ? void 0 : V.bounds;
+      if (!Array.isArray(e) || e.length < 4) return null;
+      const [o, t, v, p] = e;
+      return [o, t, v, p].some(
+        (F) => typeof F != "number" || Number.isNaN(F)
+      ) ? null : [o, t, v, p];
+    }), ke = B(() => {
+      const e = c.value;
+      return e ? [
+        e.description,
+        e.group_id ? `Група: ${e.group_id}` : null,
+        e.source_path ? `Шлях: ${e.source_path}` : null,
+        e.is_public === !0 ? "Публічний" : "Не публічний",
+        e.enabled === !0 ? "Активний" : "Неактивний"
+      ].filter(Boolean).join(", ") : "";
+    }), Oe = B(() => {
+      var o;
+      const e = (o = c.value) == null ? void 0 : o.group_id;
+      return e ? String(e).toUpperCase() : "";
+    });
+    let I = null, ne = !1, te = null;
+    function fe(e) {
+      return Number(e.toFixed(ya));
+    }
+    function je(e, o) {
+      const [t, v] = e, [p, V] = o;
+      return [
+        fe(Math.min(t, p)),
+        fe(Math.min(v, V)),
+        fe(Math.max(t, p)),
+        fe(Math.max(v, V))
+      ];
+    }
+    function lt(e) {
+      const [o, t, v, p] = e;
+      return {
+        type: "Polygon",
+        coordinates: [
+          [
+            [o, t],
+            [v, t],
+            [v, p],
+            [o, p],
+            [o, t]
+          ]
+        ]
+      };
+    }
+    function Ce(e) {
+      var v, p, V;
+      const o = (p = (v = z()) == null ? void 0 : v.map) == null ? void 0 : p.value, t = (V = o == null ? void 0 : o.getCanvas) == null ? void 0 : V.call(o);
+      t != null && t.style && (t.style.cursor = e);
+    }
+    async function nt(e, o) {
+      if (!(!y.value || !c.value)) {
+        ie.value = !0;
+        try {
+          const t = lt(e), v = await fetch(`/api/gis-css/${y.value}`, {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ geom: t })
+          });
+          if (!v.ok)
+            throw new Error(`Failed to save cartocss bounds: ${v.status}`);
+          D({
+            type: "success",
+            title: "Bounds збережено",
+            message: "Нові межі успішно збережено."
+          }), await me(y.value, { bustCache: !0 });
+        } catch (t) {
+          console.error("Failed to save CartoCSS bounds", t), c.value && (c.value = {
+            ...c.value,
+            bounds: o ? [...o] : null
+          }), D({
+            type: "error",
+            title: "Помилка",
+            message: "Не вдалося зберегти Bounds"
+          });
+        } finally {
+          ie.value = !1;
+        }
+      }
+    }
+    function Fe(e) {
+      var t, v, p;
+      const o = (v = (t = z()) == null ? void 0 : t.map) == null ? void 0 : v.value;
+      if ((p = o == null ? void 0 : o.dragPan) != null && p.enable && o.dragPan.enable(), (e == null ? void 0 : e.length) === 4 && c.value) {
+        const V = Array.isArray(c.value.bounds) ? [...c.value.bounds] : null;
+        c.value = {
+          ...c.value,
+          bounds: [...e]
+        }, nt(e, V);
+      }
+      I = null, ne = !1, le.value = null, X.value = !1, Ce("");
+    }
+    function $e() {
+      Fe(null);
+    }
+    function st() {
+      var V, F;
+      const e = (F = (V = z()) == null ? void 0 : V.map) == null ? void 0 : F.value;
+      if (!e) return;
+      const o = (E) => {
+        var J, Q, ve;
+        if (!X.value || ((J = E == null ? void 0 : E.originalEvent) == null ? void 0 : J.button) != null && E.originalEvent.button !== 0)
+          return;
+        const N = E == null ? void 0 : E.lngLat;
+        N && (I = [N.lng, N.lat], ne = !0, le.value = [N.lng, N.lat, N.lng, N.lat], (ve = (Q = e.dragPan) == null ? void 0 : Q.disable) == null || ve.call(Q));
+      }, t = (E) => {
+        if (!X.value || !ne || !I)
+          return;
+        const N = E == null ? void 0 : E.lngLat;
+        N && (le.value = je(I, [
+          N.lng,
+          N.lat
+        ]));
+      }, v = (E) => {
+        if (!X.value || !ne || !I)
+          return;
+        const N = E == null ? void 0 : E.lngLat;
+        if (!N) {
+          $e();
+          return;
+        }
+        const J = je(I, [
+          N.lng,
+          N.lat
+        ]), [Q, ve, mt, vt] = J;
+        if (!(Math.abs(mt - Q) > 0 && Math.abs(vt - ve) > 0)) {
+          D({
+            type: "warning",
+            title: "Bounds не змінено",
+            message: "Потрібно протягнути прямокутник з ненульовою площею."
+          }), $e();
+          return;
+        }
+        Fe(J);
+      }, p = (E) => {
+        X.value && E.key === "Escape" && (E.preventDefault(), $e());
+      };
+      e.on("mousedown", o), e.on("mousemove", t), e.on("mouseup", v), window.addEventListener("keydown", p), te = () => {
+        e.off("mousedown", o), e.off("mousemove", t), e.off("mouseup", v), window.removeEventListener("keydown", p);
+      };
+    }
+    async function rt() {
+      var t;
+      const e = z();
+      !(e != null && e.ready) || (await e.ready(), !((t = e.map) == null ? void 0 : t.value)) || (te || st(), X.value = !0, ne = !1, I = null, le.value = null, Ce("crosshair"), D({
+        type: "info",
+        title: "Редагування Bounds",
+        message: "Протягніть прямокутник на карті, щоб задати нові межі."
+      }));
+    }
+    q(
+      y,
+      (e) => {
+        e && me(e);
+      },
+      { immediate: !0 }
+    ), q(
+      () => {
+        var e;
+        return (e = C.value) == null ? void 0 : e.name;
+      },
+      (e) => Y(e),
+      { immediate: !0 }
+    );
+    async function ut() {
+      var v;
+      const e = z();
+      if (!(e != null && e.ready)) return;
+      await e.ready(), S();
+      const o = (v = e.map) == null ? void 0 : v.value;
+      if (!o) return;
+      const t = () => G();
+      o.on("moveend", t), o.on("zoomend", t), $ = () => {
+        o.off("moveend", t), o.off("zoomend", t);
+      };
+    }
+    q(
+      () => [l.query.z, l.query.x, l.query.y],
+      () => {
+        S();
+      }
+    ), ae(() => {
+      ut();
+    }), oe(() => {
+      $ == null || $(), $ = null, te == null || te(), te = null, Ce("");
+    }), q(
+      () => l.query.tab,
+      (e) => {
+        e && L.value.some((o) => o.key === e) && a.value !== e && (a.value = e);
+      }
+    ), q(
+      L,
+      (e) => {
+        e.length && !e.some((o) => o.key === a.value) && (a.value = e[0].key);
+      },
+      { immediate: !0 }
+    ), q(a, (e) => {
+      l.query.tab !== e && L.value.some((o) => o.key === e) && r.replace({ query: { ...l.query, tab: e } });
+    }), q(
+      () => c.value,
+      (e) => {
+        const o = e == null ? void 0 : e.card_html;
+        Pe.value = o, Te.value = e == null ? void 0 : e.card_table;
+      },
+      { immediate: !0 }
+    );
+    function Ae() {
+      y.value && me(y.value, { bustCache: !0 });
+    }
+    async function it(e, o) {
+      if (y.value) {
+        ie.value = !0;
+        try {
+          const t = await fetch(`/api/gis-css/${y.value}`, {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(e)
+          });
+          if (!t.ok) throw new Error(`Failed to save cartocss: ${t.status}`);
+          D({ type: "success", title: "Збережено", message: o }), await me(y.value, { bustCache: !0 });
+        } catch (t) {
+          console.error("Failed to save CartoCSS", t), D({
+            type: "error",
+            title: "Помилка",
+            message: "Не вдалося зберегти CartoCSS"
+          });
+        } finally {
+          ie.value = !1;
+        }
+      }
+    }
+    function ct(e) {
+      if (!e) return null;
+      if (typeof e == "string")
+        try {
+          return JSON.parse(e);
+        } catch (o) {
+          return console.warn("Failed to parse CartoCSS config", o), null;
+        }
+      return typeof e == "object" ? e : null;
+    }
+    function dt(e) {
+      const o = Array.isArray(e) ? e : e == null ? void 0 : e.datasets;
+      return Array.isArray(o) ? o.map((t, v) => ({
+        table: (t == null ? void 0 : t.table) || (t == null ? void 0 : t.id) || `dataset_${v + 1}`,
+        query: (t == null ? void 0 : t.query) || "",
+        srid: (t == null ? void 0 : t.srid) || "",
+        gcol: (t == null ? void 0 : t.gcol) || "",
+        key: (t == null ? void 0 : t.key) || (t == null ? void 0 : t.label) || "Без підпису",
+        active: typeof (t == null ? void 0 : t.active) == "boolean" ? t.active : !0,
+        minzoom: typeof (t == null ? void 0 : t.zoom) > "u" ? "" : String(t.zoom),
+        maxzoom: typeof (t == null ? void 0 : t.maxzoom) > "u" ? "" : String(t.maxzoom),
+        columns: (t == null ? void 0 : t.columns) || "",
+        proj4text: (t == null ? void 0 : t.proj4text) || ""
+      })) : [];
+    }
+    async function me(e, o) {
+      he.value = !0;
+      try {
+        const t = await fetch(`/api/gis-css/${e}`);
+        if (!t.ok) throw new Error(`Failed to load cartocss: ${t.status}`);
+        const v = await t.json(), p = (v == null ? void 0 : v.message) || v || {};
+        c.value = p, C.value = {
+          id: p.cartocss_key || e,
+          name: p.name || C.value.name,
+          description: p.description || C.value.description
+        }, re.value = typeof p.style == "string" ? p.style : "";
+        const V = ct(p.config ?? []);
+        ue.value = dt(V);
+        const F = typeof p.url == "string" ? p.url : "";
+        be.value = F, W.value = !!(F && p.enabled !== !1), xe.value = o != null && o.bustCache ? Date.now() : 0;
+      } catch (t) {
+        console.error("Failed to fetch CartoCSS", t), W.value = !1, be.value = "", xe.value = 0, c.value = null;
+      } finally {
+        he.value = !1;
+      }
+    }
+    async function Ze() {
+      await it(
+        {
+          style: re.value || "",
+          config: ue.value
+        },
+        "CartoCSS оновлено"
+      );
+    }
+    async function ft(e) {
+      const o = await fetch(`/api/gis-css/${y.value}`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(e)
+      });
+      if (!o.ok) throw new Error(`Failed to save cartocss: ${o.status}`);
+      D({
+        type: "success",
+        title: "Збережено",
+        message: "Картка CartoCSS оновлена"
+      });
+    }
+    return (e, o) => (x(), R("div", Fo, [
+      u("div", Ao, [
+        u("div", Zo, [
+          u("div", Do, [
+            u("div", Uo, [
+              u("div", qo, [
+                u("div", Qo, [
+                  u("button", {
+                    type: "button",
+                    class: "hover:text-gray-700 cursor-pointer transition-colors",
+                    onClick: g
+                  }, Z(i.value), 1),
+                  o[7] || (o[7] = u("svg", {
+                    xmlns: "http://www.w3.org/2000/svg",
+                    width: "24",
+                    height: "24",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    "stroke-width": "2",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round",
+                    class: "lucide lucide-chevron-right w-4 h-4 mx-1"
+                  }, [
+                    u("path", { d: "m9 18 6-6-6-6" })
+                  ], -1)),
+                  u("span", Yo, Z(C.value.name || "CartoCSS"), 1)
+                ]),
+                u("div", Xo, [
+                  u("div", Ho, [
+                    u("div", Jo, [
+                      u("h1", Ko, Z(C.value.name || "CartoCSS"), 1),
+                      Oe.value ? (x(), R("div", Go, [
+                        u("span", Wo, Z(Oe.value), 1)
+                      ])) : A("", !0)
+                    ]),
+                    ke.value ? (x(), R("p", {
+                      key: 0,
+                      class: "text-xs text-gray-500 truncate",
+                      title: ke.value
+                    }, Z(ke.value), 9, Io)) : A("", !0)
+                  ])
+                ])
+              ]),
+              M(Ut, {
+                class: "flex-shrink-0",
+                "entity-id": y.value,
+                "entity-info": C.value,
+                "form-endpoint": (t) => `/api/form/gis.cartocss.table/${t}`,
+                "save-endpoint": (t) => `/api/gis-css/${t}`,
+                "entity-label": "CartoCSS",
+                "save-method": "post",
+                onSaved: Ae
+              }, null, 8, ["entity-id", "entity-info", "form-endpoint", "save-endpoint"])
+            ])
+          ])
+        ]),
+        u("div", ea, [
+          u("div", ta, [
+            M(Nt, {
+              ref_key: "mapViewRef",
+              ref: _
+            }, {
+              default: j(() => {
+                var t, v;
+                return [
+                  u("div", oa, [
+                    M(Ot, null, {
+                      default: j(() => [
+                        u("div", aa, [
+                          o[8] || (o[8] = u("span", { class: "text-xs text-gray-600 whitespace-nowrap" }, "Прозорість:", -1)),
+                          De(u("input", {
+                            type: "range",
+                            min: "0",
+                            max: "1",
+                            step: "0.01",
+                            "onUpdate:modelValue": o[0] || (o[0] = (p) => ce.value = p),
+                            class: "flex-1 h-1 accent-blue-600",
+                            style: { "accent-color": "rgb(30, 78, 216)" }
+                          }, null, 512), [
+                            [
+                              bt,
+                              ce.value,
+                              void 0,
+                              { number: !0 }
+                            ]
+                          ]),
+                          u("span", la, Z(et.value), 1)
+                        ]),
+                        u("div", na, [
+                          De(u("input", {
+                            id: "show-layer",
+                            type: "checkbox",
+                            class: "rounded",
+                            "onUpdate:modelValue": o[1] || (o[1] = (p) => W.value = p),
+                            style: { "accent-color": "rgb(30, 78, 216)" }
+                          }, null, 512), [
+                            [xt, W.value]
+                          ]),
+                          u("label", sa, [
+                            W.value ? (x(), P(U(zt), {
+                              key: 0,
+                              class: "w-3.5 h-3.5"
+                            })) : (x(), P(U(Bt), {
+                              key: 1,
+                              class: "w-3.5 h-3.5"
+                            })),
+                            o[9] || (o[9] = Ve(" Показати шар ", -1))
+                          ])
+                        ])
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  M(Oo, null, {
+                    default: j(() => [
+                      M(ho),
+                      M(bo),
+                      M(xo),
+                      M(Ue),
+                      Ne.value ? (x(), P(Ue, {
+                        key: 0,
+                        targetCenter: Ne.value,
+                        targetLabel: "Центр даних",
+                        targetAriaLabel: "Перейти до центру даних"
+                      }, null, 8, ["targetCenter"])) : A("", !0),
+                      M(wo),
+                      M(ko),
+                      M(To, {
+                        active: H.value,
+                        onClick: We
+                      }, null, 8, ["active"]),
+                      M(Po)
+                    ]),
+                    _: 1
+                  }),
+                  H.value ? (x(), P(jt, {
+                    key: 0,
+                    ref_key: "rulerPanelRef",
+                    ref: _e,
+                    onClose: Be,
+                    onTabChange: o[2] || (o[2] = (p) => ze.value = p),
+                    onPointsChange: Ke,
+                    onShapeClosedChange: o[3] || (o[3] = (p) => we.value = p)
+                  }, null, 512)) : A("", !0),
+                  H.value && de.value.length > 0 ? (x(), P(Ft, {
+                    key: 1,
+                    points: de.value,
+                    "is-shape-closed": we.value,
+                    "label-mode": ze.value
+                  }, null, 8, ["points", "is-shape-closed", "label-mode"])) : A("", !0),
+                  M(jo, {
+                    active: H.value,
+                    onMapClick: Ge
+                  }, null, 8, ["active"]),
+                  X.value ? (x(), R("div", ra, " Потягніть на карті, щоб намалювати нові Bounds. Esc скасовує редагування. ")) : A("", !0),
+                  Re.value ? (x(), P(vo, {
+                    key: 3,
+                    "layer-id": Ie.value,
+                    "tile-url": Re.value,
+                    active: W.value,
+                    opacity: ce.value,
+                    title: C.value.name,
+                    owner: y.value
+                  }, null, 8, ["layer-id", "tile-url", "active", "opacity", "title", "owner"])) : A("", !0),
+                  M(qe, {
+                    extent: at.value,
+                    "layer-id": tt.value
+                  }, null, 8, ["extent", "layer-id"]),
+                  M(qe, {
+                    extent: le.value,
+                    "layer-id": ot.value,
+                    "line-color": "#0ea5e9",
+                    "line-width": 3
+                  }, null, 8, ["extent", "layer-id"]),
+                  M(po, {
+                    "cartocss-id": y.value,
+                    bounds: ((t = c.value) == null ? void 0 : t.bounds) ?? null,
+                    active: W.value && !X.value && !H.value,
+                    "info-enabled": (v = c.value) == null ? void 0 : v.info
+                  }, null, 8, ["cartocss-id", "bounds", "active", "info-enabled"]),
+                  M(At, { "map-id": y.value }, null, 8, ["map-id"])
+                ];
+              }),
+              _: 1
+            }, 512)
+          ])
+        ]),
+        c.value ? (x(), P(qt, {
+          key: 0,
+          open: n.value,
+          onToggle: o[4] || (o[4] = (t) => n.value = !n.value)
+        }, null, 8, ["open"])) : A("", !0)
+      ]),
+      c.value ? (x(), R("div", {
+        key: 0,
+        class: se(["bg-white border-l border-gray-100 flex flex-col overflow-hidden shadow-lg flex-shrink-0 transition-[width] duration-100 ease-in-out", n.value ? "w-[650px]" : "w-0"])
+      }, [
+        u("div", ua, [
+          L.value.length > 1 ? (x(), R("div", ia, [
+            u("div", {
+              class: "items-center justify-center text-muted-foreground grid w-full h-12 p-1 bg-gray-50 rounded-xl shadow-sm",
+              style: ye({
+                gridTemplateColumns: `repeat(${L.value.length}, minmax(0, 1fr))`
+              })
+            }, [
+              (x(!0), R(ge, null, Xe(L.value, (t) => (x(), R("button", {
+                key: t.key,
+                type: "button",
+                role: "tab",
+                "aria-selected": a.value === t.key,
+                class: se([
+                  "whitespace-nowrap flex flex-col items-center justify-center gap-0.5 py-1 px-1 text-[9px] font-medium transition-all duration-300 hover:bg-white/70 rounded-lg group",
+                  a.value === t.key ? "bg-white shadow-sm text-gray-700" : ""
+                ]),
+                onClick: (v) => a.value = t.key
+              }, [
+                (x(), P(_t(t.icon), { class: "h-3.5 w-3.5 mb-0.5" })),
+                u("span", da, Z(t.label), 1)
+              ], 10, ca))), 128))
+            ], 4)
+          ])) : A("", !0),
+          u("div", fa, [
+            he.value ? (x(), R("div", ma, " Завантаження стилю… ")) : (x(), R(ge, { key: 1 }, [
+              a.value === "css" ? (x(), P(eo, {
+                key: 0,
+                modelValue: re.value,
+                "onUpdate:modelValue": o[5] || (o[5] = (t) => re.value = t),
+                class: "flex-1 min-h-0",
+                onSave: Ze
+              }, null, 8, ["modelValue"])) : a.value === "data" ? (x(), P(io, {
+                key: 1,
+                modelValue: ue.value,
+                "onUpdate:modelValue": o[6] || (o[6] = (t) => ue.value = t),
+                class: "flex-1 min-h-0 flex flex-col",
+                onSave: Ze
+              }, null, 8, ["modelValue"])) : a.value === "card" ? (x(), P(mo, {
+                key: 2,
+                card: Pe.value,
+                table: Te.value,
+                class: "flex-1 min-h-0",
+                onSave: ft
+              }, null, 8, ["card", "table"])) : a.value === "metadata" ? (x(), P(Qt, {
+                key: 3,
+                data: c.value,
+                "entity-id": y.value,
+                "entity-type": "css",
+                onSaved: Ae,
+                onEditCssBounds: rt
+              }, null, 8, ["data", "entity-id"])) : A("", !0)
+            ], 64))
+          ])
+        ])
+      ], 2)) : A("", !0)
+    ]));
+  }
+});
+export {
+  La as default
+};