@ogc-maps/storybook-components 0.12.1 → 0.12.3

package/dist/main.js

@@ -1,39 +1,39 @@
-import { B as $i } from "./BasemapSwitcher-BW7lyZ2Y.js";
-import { C as Bi } from "./CollapsibleControl-qo9daiD8.js";
-import { C as Ui, f as Gi, a as qi } from "./CoordinateDisplay-PxPmVjpm.js";
-import { E as _i } from "./ExportButton-BsNrOvRE.js";
+import { B as Ri } from "./BasemapSwitcher-BW7lyZ2Y.js";
+import { C as zi } from "./CollapsibleControl-qo9daiD8.js";
+import { C as Gi, f as qi, a as Wi } from "./CoordinateDisplay-PxPmVjpm.js";
+import { E as Vi } from "./ExportButton-BsNrOvRE.js";
 import { jsx as a, jsxs as l, Fragment as z } from "react/jsx-runtime";
 import { useState as T, useEffect as q, useRef as H, useCallback as Be, useId as ze, useMemo as Ue } from "react";
-import { F as Hi } from "./FeatureDetailPanel-CkFpdEKW.js";
-import { F as Xi } from "./FeatureTooltip-DxzN-jnp.js";
-import { L as Ji } from "./LayerPanel-SCdJ8948.js";
-import { L as Qi } from "./Legend-BLWBzD7Y.js";
-import { LuRuler as Ke, LuPentagon as Qe, LuTrash2 as be, LuMousePointer2 as ea, LuSquareDashedMousePointer as aa, LuList as ia, LuGripHorizontal as ta, LuDownload as ra, LuX as la, LuInfo as pa } from "react-icons/lu";
-import { Y as na, Z as ua, _ as xe, U as Ge, o as qe, n as ye, W as oa, k as ma } from "./geo--Ta-t__y.js";
-import { a as at, b as it, c as tt, d as rt, $ as lt, a0 as pt, a1 as nt, a2 as ut, a3 as ot, a4 as mt, e as st, a5 as ct, f as dt, g as ht, h as gt, i as bt, j as yt, l as ft, m as xt, a6 as wt, a7 as Nt, p as vt, q as kt, r as Ct, s as St, t as Tt, u as Dt, v as Lt, w as At, x as Et, y as It, z as Mt, A as Ft, B as Pt, C as Ot, D as jt, E as $t, F as Rt, G as Bt, a8 as zt, H as Ut, I as Gt, J as qt, K as Wt, L as _t, a9 as Vt, M as Ht, N as Yt, O as Xt, P as Zt, Q as Jt, R as Kt, S as Qt, T as er, V as ar, X as ir } from "./geo--Ta-t__y.js";
-import { S as rr } from "./SearchPanel-4Y12jfuP.js";
-import { s as sa } from "./index-CtbLVsqD.js";
-import { B as pr, a as nr, C as ur, b as or, c as mr, D as sr, d as cr, F as dr, e as hr, f as gr, g as br, G as yr, L as fr, h as xr, i as wr, j as Nr, k as vr, l as kr, M as Cr, N as Sr, O as Tr, P as Dr, m as Lr, S as Ar, n as Er, o as Ir, p as Mr, q as Fr, r as Pr, t as Or, u as jr, T as $r, U as Rr, V as Br, v as zr } from "./index-CtbLVsqD.js";
-import './style.css';function xi({
+import { F as Yi } from "./FeatureDetailPanel-CkFpdEKW.js";
+import { F as Zi } from "./FeatureTooltip-DxzN-jnp.js";
+import { L as Ki } from "./LayerPanel-SCdJ8948.js";
+import { L as et } from "./Legend-BLWBzD7Y.js";
+import { LuRuler as Ke, LuPentagon as Qe, LuTrash2 as be, LuMousePointer2 as ea, LuSquareDashedMousePointer as aa, LuPenTool as ia, LuList as ta, LuGripHorizontal as ra, LuDownload as la, LuX as pa, LuInfo as na } from "react-icons/lu";
+import { Y as ua, Z as oa, _ as xe, U as Ge, o as qe, n as ye, W as ma, k as sa } from "./geo--Ta-t__y.js";
+import { a as it, b as tt, c as rt, d as lt, $ as pt, a0 as nt, a1 as ut, a2 as ot, a3 as mt, a4 as st, e as ct, a5 as dt, f as ht, g as gt, h as bt, i as yt, j as ft, l as xt, m as wt, a6 as Nt, a7 as vt, p as kt, q as Ct, r as St, s as Tt, t as Dt, u as Lt, v as At, w as Et, x as It, y as Mt, z as Ft, A as Pt, B as Ot, C as jt, D as $t, E as Rt, F as Bt, G as zt, a8 as Ut, H as Gt, I as qt, J as Wt, K as _t, L as Vt, a9 as Ht, M as Yt, N as Xt, O as Zt, P as Jt, Q as Kt, R as Qt, S as er, T as ar, V as ir, X as tr } from "./geo--Ta-t__y.js";
+import { S as lr } from "./SearchPanel-4Y12jfuP.js";
+import { s as ca } from "./index-CtbLVsqD.js";
+import { B as nr, a as ur, C as or, b as mr, c as sr, D as cr, d as dr, F as hr, e as gr, f as br, g as yr, G as fr, L as xr, h as wr, i as Nr, j as vr, k as kr, l as Cr, M as Sr, N as Tr, O as Dr, P as Lr, m as Ar, S as Er, n as Ir, o as Mr, p as Fr, q as Pr, r as Or, t as jr, u as $r, T as Rr, U as Br, V as zr, v as Ur } from "./index-CtbLVsqD.js";
+import './style.css';function wi({
   open: e,
   layers: i,
   availableFormats: t,
   hasActiveFilter: r,
   loading: p = !1,
-  progress: u,
+  progress: m,
   error: n,
-  onExport: x,
+  onExport: f,
   onClose: s
 }) {
-  const [g, d] = T(""), [w, c] = T(""), [o, h] = T(!0);
+  const [h, d] = T(""), [x, v] = T(""), [u, c] = T(!0);
   if (q(() => {
-    e && (d(i.length === 1 ? i[0].id : ""), c(t.length > 0 ? t[0].id : ""), h(!0));
+    e && (d(i.length === 1 ? i[0].id : ""), v(t.length > 0 ? t[0].id : ""), c(!0));
   }, [e, i, t]), !e) return null;
-  const N = i.find((m) => m.id === g), v = t.find((m) => m.id === w), C = N != null && r(N.id), E = N != null && v != null && !p, O = () => {
-    !N || !v || x({
-      layer: N,
-      format: v,
-      filtered: C ? o : !1
+  const w = i.find((o) => o.id === h), N = t.find((o) => o.id === x), C = w != null && r(w.id), E = w != null && N != null && !p, O = () => {
+    !w || !N || f({
+      layer: w,
+      format: N,
+      filtered: C ? u : !1
     });
   };
   return /* @__PURE__ */ a(
@@ -65,19 +65,19 @@ import './style.css';function xi({
             "select",
             {
               id: "export-layer-select",
-              value: g,
-              onChange: (m) => d(m.target.value),
+              value: h,
+              onChange: (o) => d(o.target.value),
               className: "mapui:w-full mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-3 mapui:py-2 mapui:text-sm mapui:text-gray-700",
               children: [
                 /* @__PURE__ */ a("option", { value: "", disabled: !0, children: "Select a layer..." }),
-                i.map((m) => /* @__PURE__ */ a("option", { value: m.id, children: m.label }, m.id))
+                i.map((o) => /* @__PURE__ */ a("option", { value: o.id, children: o.label }, o.id))
               ]
             }
           )
         ] }),
         /* @__PURE__ */ l("fieldset", { className: "mapui:mb-4", children: [
           /* @__PURE__ */ a("legend", { className: "mapui:mb-1 mapui:text-sm mapui:font-medium mapui:text-gray-700", children: "Format" }),
-          /* @__PURE__ */ a("div", { className: "mapui:space-y-1", children: t.map((m) => /* @__PURE__ */ l(
+          /* @__PURE__ */ a("div", { className: "mapui:space-y-1", children: t.map((o) => /* @__PURE__ */ l(
             "label",
             {
               className: "mapui:flex mapui:cursor-pointer mapui:items-center mapui:gap-2 mapui:rounded mapui:px-2 mapui:py-1.5 hover:mapui:bg-gray-50",
@@ -87,22 +87,22 @@ import './style.css';function xi({
                   {
                     type: "radio",
                     name: "export-format",
-                    value: m.id,
-                    checked: w === m.id,
-                    onChange: () => c(m.id),
+                    value: o.id,
+                    checked: x === o.id,
+                    onChange: () => v(o.id),
                     className: "mapui:accent-blue-600"
                   }
                 ),
                 /* @__PURE__ */ l("span", { className: "mapui:text-sm mapui:text-gray-700", children: [
-                  m.label,
-                  m.description && /* @__PURE__ */ l("span", { className: "mapui:ml-1 mapui:text-gray-400", children: [
+                  o.label,
+                  o.description && /* @__PURE__ */ l("span", { className: "mapui:ml-1 mapui:text-gray-400", children: [
                     "— ",
-                    m.description
+                    o.description
                   ] })
                 ] })
               ]
             },
-            m.id
+            o.id
           )) })
         ] }),
         C && /* @__PURE__ */ l("label", { className: "mapui:mb-4 mapui:flex mapui:cursor-pointer mapui:items-center mapui:gap-2", children: [
@@ -110,14 +110,14 @@ import './style.css';function xi({
             "input",
             {
               type: "checkbox",
-              checked: o,
-              onChange: (m) => h(m.target.checked),
+              checked: u,
+              onChange: (o) => c(o.target.checked),
               className: "mapui:accent-blue-600"
             }
           ),
           /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:text-gray-700", children: "Apply current filters" })
         ] }),
-        p && u && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-3 mapui:text-sm mapui:text-blue-600", children: u }),
+        p && m && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-3 mapui:text-sm mapui:text-blue-600", children: m }),
         n && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-3 mapui:text-sm mapui:text-red-600", children: n }),
         /* @__PURE__ */ l("div", { className: "mapui:flex mapui:justify-end mapui:gap-2", children: [
           /* @__PURE__ */ a(
@@ -148,66 +148,66 @@ import './style.css';function xi({
     }
   );
 }
-const ca = [
+const da = [
   { mode: "distance", icon: Ke, label: "Distance" },
   { mode: "area", icon: Qe, label: "Area" }
 ];
-function da(e, i) {
+function ha(e, i) {
   return e ? i === 0 ? "Click on the map to start measuring" : e === "distance" ? "Click to add points, double-click to finish" : i < 3 ? "Click to add points (min 3 for area)" : "Click to add points, double-click to close" : "Select a measurement mode";
 }
-function wi({
+function Ni({
   mode: e,
   onModeChange: i,
   points: t,
   measurement: r,
   unit: p,
-  onUnitChange: u,
+  onUnitChange: m,
   onClear: n,
-  className: x
+  className: f
 }) {
-  const s = e ? na[e] : [];
-  return /* @__PURE__ */ l("div", { className: `mapui:flex mapui:flex-col mapui:gap-3 ${x ?? ""}`, children: [
-    /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: ca.map(({ mode: g, icon: d, label: w }) => {
-      const c = e === g;
+  const s = e ? ua[e] : [];
+  return /* @__PURE__ */ l("div", { className: `mapui:flex mapui:flex-col mapui:gap-3 ${f ?? ""}`, children: [
+    /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: da.map(({ mode: h, icon: d, label: x }) => {
+      const v = e === h;
       return /* @__PURE__ */ l(
         "button",
         {
           type: "button",
-          onClick: () => i(c ? null : g),
-          "aria-label": w,
-          "aria-pressed": c,
+          onClick: () => i(v ? null : h),
+          "aria-label": x,
+          "aria-pressed": v,
           className: [
             "mapui:flex mapui:flex-1 mapui:items-center mapui:justify-center mapui:gap-1.5 mapui:rounded mapui:px-3 mapui:py-1.5 mapui:text-sm mapui:font-medium mapui:transition-colors",
-            c ? "mapui:bg-blue-600 mapui:text-white" : "mapui:bg-gray-100 mapui:text-gray-700 hover:mapui:bg-gray-200"
+            v ? "mapui:bg-blue-600 mapui:text-white" : "mapui:bg-gray-100 mapui:text-gray-700 hover:mapui:bg-gray-200"
           ].join(" "),
           children: [
             /* @__PURE__ */ a(d, { size: 16 }),
-            w
+            x
           ]
         },
-        g
+        h
       );
     }) }),
     e && /* @__PURE__ */ l(z, { children: [
-      /* @__PURE__ */ a("div", { className: "mapui:text-center", children: /* @__PURE__ */ a("div", { className: "mapui:text-2xl mapui:font-semibold mapui:text-gray-900", children: r ? ua(r) : "—" }) }),
-      /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: s.map((g) => {
-        const d = p === g;
+      /* @__PURE__ */ a("div", { className: "mapui:text-center", children: /* @__PURE__ */ a("div", { className: "mapui:text-2xl mapui:font-semibold mapui:text-gray-900", children: r ? oa(r) : "—" }) }),
+      /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: s.map((h) => {
+        const d = p === h;
         return /* @__PURE__ */ a(
           "button",
           {
             type: "button",
-            onClick: () => u(g),
-            "aria-label": `Unit: ${xe[g]}`,
+            onClick: () => m(h),
+            "aria-label": `Unit: ${xe[h]}`,
             className: [
               "mapui:flex-1 mapui:rounded mapui:px-2 mapui:py-1 mapui:text-xs mapui:font-medium mapui:transition-colors",
               d ? "mapui:bg-blue-100 mapui:text-blue-700" : "mapui:bg-gray-50 mapui:text-gray-500 hover:mapui:bg-gray-100"
             ].join(" "),
-            children: xe[g]
+            children: xe[h]
           },
-          g
+          h
         );
       }) }),
-      /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-center mapui:text-xs mapui:text-gray-500", children: da(e, t.length) }),
+      /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-center mapui:text-xs mapui:text-gray-500", children: ha(e, t.length) }),
       t.length > 0 && /* @__PURE__ */ l(
         "button",
         {
@@ -223,25 +223,26 @@ function wi({
     ] })
   ] });
 }
-const ha = [
+const ga = [
   { mode: "click", icon: ea, label: "Click" },
-  { mode: "box", icon: aa, label: "Box" }
+  { mode: "box", icon: aa, label: "Box" },
+  { mode: "polygon", icon: ia, label: "Polygon" }
 ];
-function ga(e, i, t) {
-  return i ? e ? t === 0 ? e === "click" ? "Click on features to select them" : "Click and drag to draw a selection box" : `${t} feature${t !== 1 ? "s" : ""} selected` : "Choose a selection mode" : "Select a layer to begin";
+function ba(e, i, t) {
+  return i ? e ? t === 0 ? e === "click" ? "Click on features to select them" : e === "box" ? "Click and drag to draw a selection box" : e === "polygon" ? "Click to add points, double-click to finish" : "Choose a selection mode" : `${t} feature${t !== 1 ? "s" : ""} selected` : "Choose a selection mode" : "Select a layer to begin";
 }
-function Ni({
+function vi({
   mode: e,
   onModeChange: i,
   layers: t,
   activeLayerId: r,
   onActiveLayerChange: p,
-  selectedCount: u,
+  selectedCount: m,
   onClear: n,
-  onViewResults: x,
+  onViewResults: f,
   className: s
 }) {
-  const g = t.filter((d) => d.visible);
+  const h = t.filter((d) => d.visible);
   return /* @__PURE__ */ l("div", { className: `mapui:flex mapui:flex-col mapui:gap-3 ${s ?? ""}`, children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: [
       /* @__PURE__ */ a("label", { className: "mapui:text-xs mapui:font-medium mapui:text-gray-600", children: "Layer" }),
@@ -253,43 +254,43 @@ function Ni({
           className: "mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-2 mapui:py-1.5 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500",
           children: [
             /* @__PURE__ */ a("option", { value: "", children: "Select a layer…" }),
-            g.map((d) => /* @__PURE__ */ a("option", { value: d.id, children: d.label }, d.id))
+            h.map((d) => /* @__PURE__ */ a("option", { value: d.id, children: d.label }, d.id))
           ]
         }
       )
     ] }),
     r && /* @__PURE__ */ l(z, { children: [
-      /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: ha.map(({ mode: d, icon: w, label: c }) => {
-        const o = e === d;
+      /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: ga.map(({ mode: d, icon: x, label: v }) => {
+        const u = e === d;
         return /* @__PURE__ */ l(
           "button",
           {
             type: "button",
-            onClick: () => i(o ? null : d),
-            "aria-label": c,
-            "aria-pressed": o,
+            onClick: () => i(u ? null : d),
+            "aria-label": v,
+            "aria-pressed": u,
             className: [
               "mapui:flex mapui:flex-1 mapui:items-center mapui:justify-center mapui:gap-1.5 mapui:rounded mapui:px-3 mapui:py-1.5 mapui:text-sm mapui:font-medium mapui:transition-colors",
-              o ? "mapui:bg-blue-600 mapui:text-white" : "mapui:bg-gray-100 mapui:text-gray-700 hover:mapui:bg-gray-200"
+              u ? "mapui:bg-blue-600 mapui:text-white" : "mapui:bg-gray-100 mapui:text-gray-700 hover:mapui:bg-gray-200"
             ].join(" "),
             children: [
-              /* @__PURE__ */ a(w, { size: 16 }),
-              c
+              /* @__PURE__ */ a(x, { size: 16 }),
+              v
             ]
           },
           d
         );
       }) }),
-      /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-center mapui:text-xs mapui:text-gray-500", children: ga(e, r, u) }),
-      u > 0 && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:gap-2", children: [
+      /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-center mapui:text-xs mapui:text-gray-500", children: ba(e, r, m) }),
+      m > 0 && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:gap-2", children: [
         /* @__PURE__ */ l(
           "button",
           {
             type: "button",
-            onClick: x,
+            onClick: f,
             className: "mapui:flex mapui:flex-1 mapui:items-center mapui:justify-center mapui:gap-1.5 mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1.5 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700",
             children: [
-              /* @__PURE__ */ a(ia, { size: 14 }),
+              /* @__PURE__ */ a(ta, { size: 14 }),
               "View Results"
             ]
           }
@@ -310,37 +311,37 @@ function Ni({
     ] })
   ] });
 }
-function ba(e) {
+function ya(e) {
   return e == null ? "--" : typeof e == "boolean" ? e ? "Yes" : "No" : typeof e == "object" ? JSON.stringify(e) : String(e);
 }
-const ya = 200, fa = 0.6, xa = 300;
-function vi({
+const fa = 200, xa = 0.6, wa = 300;
+function ki({
   open: e,
   features: i,
   columns: t,
   title: r = "Results",
   onClose: p,
-  onExport: u,
+  onExport: m,
   onFeatureClick: n,
-  onClearSelection: x
+  onClearSelection: f
 }) {
-  const [s, g] = T(xa), d = H(!1), w = H(0), c = H(0), o = Be((N) => {
-    N.preventDefault(), d.current = !0, w.current = N.clientY, c.current = s;
+  const [s, h] = T(wa), d = H(!1), x = H(0), v = H(0), u = Be((w) => {
+    w.preventDefault(), d.current = !0, x.current = w.clientY, v.current = s;
   }, [s]);
   if (q(() => {
     if (!e) return;
-    const N = (C) => {
+    const w = (C) => {
       if (!d.current) return;
-      const E = window.innerHeight * fa, O = w.current - C.clientY, m = Math.min(E, Math.max(ya, c.current + O));
-      g(m);
-    }, v = () => {
+      const E = window.innerHeight * xa, O = x.current - C.clientY, o = Math.min(E, Math.max(fa, v.current + O));
+      h(o);
+    }, N = () => {
       d.current = !1;
     };
-    return window.addEventListener("mousemove", N), window.addEventListener("mouseup", v), () => {
-      window.removeEventListener("mousemove", N), window.removeEventListener("mouseup", v);
+    return window.addEventListener("mousemove", w), window.addEventListener("mouseup", N), () => {
+      window.removeEventListener("mousemove", w), window.removeEventListener("mouseup", N);
     };
   }, [e]), !e) return null;
-  const h = t ?? (i.length > 0 ? Object.keys(i[0].properties).filter((N) => N !== "geometry") : []);
+  const c = t ?? (i.length > 0 ? Object.keys(i[0].properties).filter((w) => w !== "geometry") : []);
   return /* @__PURE__ */ l(
     "div",
     {
@@ -351,8 +352,8 @@ function vi({
           "div",
           {
             className: "mapui:flex mapui:items-center mapui:justify-center mapui:h-3 mapui:cursor-ns-resize mapui:bg-gray-100 mapui:border-b mapui:border-gray-200 hover:mapui:bg-gray-200",
-            onMouseDown: o,
-            children: /* @__PURE__ */ a(ta, { size: 14, className: "mapui:text-gray-400" })
+            onMouseDown: u,
+            children: /* @__PURE__ */ a(ra, { size: 14, className: "mapui:text-gray-400" })
           }
         ),
         /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between mapui:px-4 mapui:py-2 mapui:border-b mapui:border-gray-200 mapui:shrink-0", children: [
@@ -361,21 +362,21 @@ function vi({
             /* @__PURE__ */ a("span", { className: "mapui:rounded-full mapui:bg-blue-100 mapui:px-2 mapui:py-0.5 mapui:text-xs mapui:font-medium mapui:text-blue-700", children: i.length })
           ] }),
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-1", children: [
-            u && /* @__PURE__ */ a(
+            m && /* @__PURE__ */ a(
               "button",
               {
                 type: "button",
-                onClick: u,
+                onClick: m,
                 title: "Export",
                 className: "mapui:flex mapui:items-center mapui:justify-center mapui:w-7 mapui:h-7 mapui:rounded hover:mapui:bg-gray-100 mapui:text-gray-500",
-                children: /* @__PURE__ */ a(ra, { size: 16 })
+                children: /* @__PURE__ */ a(la, { size: 16 })
               }
             ),
-            x && /* @__PURE__ */ a(
+            f && /* @__PURE__ */ a(
               "button",
               {
                 type: "button",
-                onClick: x,
+                onClick: f,
                 title: "Clear selection",
                 className: "mapui:flex mapui:items-center mapui:justify-center mapui:w-7 mapui:h-7 mapui:rounded hover:mapui:bg-gray-100 mapui:text-gray-500",
                 children: /* @__PURE__ */ a(be, { size: 16 })
@@ -388,7 +389,7 @@ function vi({
                 onClick: p,
                 title: "Close",
                 className: "mapui:flex mapui:items-center mapui:justify-center mapui:w-7 mapui:h-7 mapui:rounded hover:mapui:bg-gray-100 mapui:text-gray-500",
-                children: /* @__PURE__ */ a(la, { size: 16 })
+                children: /* @__PURE__ */ a(pa, { size: 16 })
               }
             )
           ] })
@@ -396,44 +397,44 @@ function vi({
         /* @__PURE__ */ a("div", { className: "mapui:overflow-auto mapui:flex-1", children: i.length === 0 ? /* @__PURE__ */ a("div", { className: "mapui:flex mapui:items-center mapui:justify-center mapui:h-full mapui:text-sm mapui:text-gray-400", children: "No features to display" }) : /* @__PURE__ */ l("table", { className: "mapui:w-full mapui:text-xs mapui:border-collapse", children: [
           /* @__PURE__ */ a("thead", { children: /* @__PURE__ */ l("tr", { className: "mapui:bg-gray-50 mapui:sticky mapui:top-0", children: [
             /* @__PURE__ */ a("th", { className: "mapui:px-3 mapui:py-2 mapui:text-left mapui:font-medium mapui:text-gray-600 mapui:border-b mapui:border-gray-200", children: "#" }),
-            h.map((N) => /* @__PURE__ */ a(
+            c.map((w) => /* @__PURE__ */ a(
               "th",
               {
                 className: "mapui:px-3 mapui:py-2 mapui:text-left mapui:font-medium mapui:text-gray-600 mapui:border-b mapui:border-gray-200 mapui:whitespace-nowrap",
-                children: N
+                children: w
               },
-              N
+              w
             ))
           ] }) }),
-          /* @__PURE__ */ a("tbody", { children: i.map((N, v) => /* @__PURE__ */ l(
+          /* @__PURE__ */ a("tbody", { children: i.map((w, N) => /* @__PURE__ */ l(
             "tr",
             {
-              onClick: () => n == null ? void 0 : n(v),
+              onClick: () => n == null ? void 0 : n(N),
               className: [
                 n ? "mapui:cursor-pointer" : "",
-                v % 2 === 0 ? "mapui:bg-white" : "mapui:bg-gray-50",
+                N % 2 === 0 ? "mapui:bg-white" : "mapui:bg-gray-50",
                 "hover:mapui:bg-blue-50"
               ].join(" "),
               children: [
-                /* @__PURE__ */ a("td", { className: "mapui:px-3 mapui:py-1.5 mapui:text-gray-400 mapui:border-b mapui:border-gray-100", children: v + 1 }),
-                h.map((C) => /* @__PURE__ */ a(
+                /* @__PURE__ */ a("td", { className: "mapui:px-3 mapui:py-1.5 mapui:text-gray-400 mapui:border-b mapui:border-gray-100", children: N + 1 }),
+                c.map((C) => /* @__PURE__ */ a(
                   "td",
                   {
                     className: "mapui:px-3 mapui:py-1.5 mapui:text-gray-700 mapui:border-b mapui:border-gray-100 mapui:whitespace-nowrap",
-                    children: ba(N.properties[C])
+                    children: ya(w.properties[C])
                   },
                   C
                 ))
               ]
             },
-            v
+            N
           )) })
         ] }) })
       ]
     }
   );
 }
-function wa({ text: e, id: i }) {
+function Na({ text: e, id: i }) {
   const t = ze(), r = i ?? t;
   return /* @__PURE__ */ l("span", { className: "mapui:relative mapui:inline-flex mapui:group", children: [
     /* @__PURE__ */ a(
@@ -443,7 +444,7 @@ function wa({ text: e, id: i }) {
         "aria-label": "Info",
         "aria-describedby": r,
         className: "mapui:inline-flex mapui:items-center mapui:text-gray-400 mapui:cursor-default hover:mapui:text-gray-600 focus:mapui:text-gray-600 focus:mapui:outline-none",
-        children: /* @__PURE__ */ a(pa, { className: "mapui:h-3.5 mapui:w-3.5" })
+        children: /* @__PURE__ */ a(na, { className: "mapui:h-3.5 mapui:w-3.5" })
       }
     ),
     /* @__PURE__ */ l(
@@ -460,16 +461,16 @@ function wa({ text: e, id: i }) {
     )
   ] });
 }
-function S({ label: e, error: i, required: t, description: r, htmlFor: p, children: u }) {
+function S({ label: e, error: i, required: t, description: r, htmlFor: p, children: m }) {
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-1", children: [
       /* @__PURE__ */ l("label", { htmlFor: p, className: "mapui:flex mapui:items-center mapui:gap-1 mapui:text-xs mapui:font-medium mapui:text-gray-700", children: [
         e,
         t && /* @__PURE__ */ a("span", { className: "mapui:ml-0.5 mapui:text-red-500", "aria-hidden": "true", children: "*" })
       ] }),
-      r && /* @__PURE__ */ a(wa, { text: r })
+      r && /* @__PURE__ */ a(Na, { text: r })
     ] }),
-    u,
+    m,
     i && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-xs mapui:text-red-600", role: "alert", children: i })
   ] });
 }
@@ -550,13 +551,13 @@ function X({
   defaultOpen: t = !1,
   badge: r
 }) {
-  const [p, u] = T(t);
+  const [p, m] = T(t);
   return /* @__PURE__ */ l("div", { className: "mapui:rounded mapui:border mapui:border-gray-200", children: [
     /* @__PURE__ */ l(
       "button",
       {
         type: "button",
-        onClick: () => u((n) => !n),
+        onClick: () => m((n) => !n),
         className: "mapui:flex mapui:w-full mapui:cursor-pointer mapui:items-center mapui:justify-between mapui:rounded mapui:border-none mapui:bg-gray-50 mapui:px-3 mapui:py-2 mapui:text-sm mapui:font-medium mapui:text-gray-700 hover:mapui:bg-gray-100",
         children: [
           /* @__PURE__ */ l("span", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
@@ -578,14 +579,14 @@ function we({
   testStatus: r = "idle",
   testError: p
 }) {
-  const u = (n) => i({ ...e, ...n });
+  const m = (n) => i({ ...e, ...n });
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ a(S, { label: "ID", required: !0, children: /* @__PURE__ */ a(
       "input",
       {
         type: "text",
         value: e.id,
-        onChange: (n) => u({ id: n.target.value }),
+        onChange: (n) => m({ id: n.target.value }),
         placeholder: "my-source",
         className: ee
       }
@@ -597,7 +598,7 @@ function we({
           {
             type: "url",
             value: e.url,
-            onChange: (n) => u({ url: n.target.value }),
+            onChange: (n) => m({ url: n.target.value }),
             placeholder: "https://example.com/ogcapi",
             className: `${ee} mapui:flex-1`
           }
@@ -621,7 +622,7 @@ function we({
       {
         type: "text",
         value: e.label ?? "",
-        onChange: (n) => u({ label: n.target.value || void 0 }),
+        onChange: (n) => m({ label: n.target.value || void 0 }),
         placeholder: "My OGC API Source",
         className: ee
       }
@@ -631,7 +632,7 @@ function we({
       {
         type: "text",
         value: e.tileMatrixSetId ?? "WebMercatorQuad",
-        onChange: (n) => u({ tileMatrixSetId: n.target.value || void 0 }),
+        onChange: (n) => m({ tileMatrixSetId: n.target.value || void 0 }),
         placeholder: "WebMercatorQuad",
         className: ee
       }
@@ -644,21 +645,21 @@ const le = () => ({
   label: void 0,
   tileMatrixSetId: "WebMercatorQuad"
 });
-function ki({ sources: e, onChange: i }) {
-  const [t, r] = T(null), [p, u] = T(null), [n, x] = T(!1), [s, g] = T(le()), [d, w] = T({}), [c, o] = T({}), [h, N] = T(null), v = async (m, L) => {
-    w((F) => ({ ...F, [m]: "loading" }));
+function Ci({ sources: e, onChange: i }) {
+  const [t, r] = T(null), [p, m] = T(null), [n, f] = T(!1), [s, h] = T(le()), [d, x] = T({}), [v, u] = T({}), [c, w] = T(null), N = async (o, D) => {
+    x((F) => ({ ...F, [o]: "loading" }));
     try {
-      const F = await fetch(`${L}/conformance`);
-      F.ok ? w((b) => ({ ...b, [m]: "success" })) : (w((b) => ({ ...b, [m]: "error" })), o((b) => ({ ...b, [m]: `HTTP ${F.status}` })));
+      const F = await fetch(`${D}/conformance`);
+      F.ok ? x((g) => ({ ...g, [o]: "success" })) : (x((g) => ({ ...g, [o]: "error" })), u((g) => ({ ...g, [o]: `HTTP ${F.status}` })));
     } catch (F) {
-      w((b) => ({ ...b, [m]: "error" })), o((b) => ({ ...b, [m]: F instanceof Error ? F.message : "Network error" }));
+      x((g) => ({ ...g, [o]: "error" })), u((g) => ({ ...g, [o]: F instanceof Error ? F.message : "Network error" }));
     }
   }, C = () => {
-    p && (i(e.map((m) => m.id === t ? p : m)), r(null), u(null));
+    p && (i(e.map((o) => o.id === t ? p : o)), r(null), m(null));
   }, E = () => {
-    i([...e, s]), x(!1), g(le());
-  }, O = (m) => {
-    i(e.filter((L) => L.id !== m)), N(null);
+    i([...e, s]), f(!1), h(le());
+  }, O = (o) => {
+    i(e.filter((D) => D.id !== o)), w(null);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between", children: [
@@ -668,7 +669,7 @@ function ki({ sources: e, onChange: i }) {
         {
           type: "button",
           onClick: () => {
-            x(!0), g(le());
+            f(!0), h(le());
           },
           className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700",
           children: "+ Add Source"
@@ -676,19 +677,19 @@ function ki({ sources: e, onChange: i }) {
       )
     ] }),
     e.length === 0 && !n && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No sources configured." }),
-    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((m) => /* @__PURE__ */ a(
+    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((o) => /* @__PURE__ */ a(
       "li",
       {
         className: "mapui:rounded-lg mapui:border mapui:border-gray-200 mapui:bg-white mapui:p-3",
-        children: t === m.id ? /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
+        children: t === o.id ? /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
           /* @__PURE__ */ a(
             we,
             {
-              value: p ?? m,
-              onChange: u,
-              onTestConnection: (L) => v(`edit-${m.id}`, L),
-              testStatus: d[`edit-${m.id}`],
-              testError: c[`edit-${m.id}`]
+              value: p ?? o,
+              onChange: m,
+              onTestConnection: (D) => N(`edit-${o.id}`, D),
+              testStatus: d[`edit-${o.id}`],
+              testError: v[`edit-${o.id}`]
             }
           ),
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:gap-2", children: [
@@ -707,7 +708,7 @@ function ki({ sources: e, onChange: i }) {
               {
                 type: "button",
                 onClick: () => {
-                  r(null), u(null);
+                  r(null), m(null);
                 },
                 className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-3 mapui:py-1 mapui:text-xs mapui:text-gray-700 hover:mapui:bg-gray-50",
                 children: "Cancel"
@@ -716,11 +717,11 @@ function ki({ sources: e, onChange: i }) {
           ] })
         ] }) : /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-start mapui:justify-between mapui:gap-2", children: [
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-0.5", children: [
-            /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: m.label ?? m.id }),
-            /* @__PURE__ */ a("span", { className: "mapui:font-mono mapui:text-xs mapui:text-gray-500", children: m.url }),
-            m.tileMatrixSetId && /* @__PURE__ */ l("span", { className: "mapui:text-xs mapui:text-gray-400", children: [
+            /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: o.label ?? o.id }),
+            /* @__PURE__ */ a("span", { className: "mapui:font-mono mapui:text-xs mapui:text-gray-500", children: o.url }),
+            o.tileMatrixSetId && /* @__PURE__ */ l("span", { className: "mapui:text-xs mapui:text-gray-400", children: [
               "TMS: ",
-              m.tileMatrixSetId
+              o.tileMatrixSetId
             ] })
           ] }),
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:shrink-0 mapui:gap-1", children: [
@@ -729,7 +730,7 @@ function ki({ sources: e, onChange: i }) {
               {
                 type: "button",
                 onClick: () => {
-                  r(m.id), u(m);
+                  r(o.id), m(o);
                 },
                 className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-gray-600 hover:mapui:bg-gray-50",
                 children: "Edit"
@@ -739,7 +740,7 @@ function ki({ sources: e, onChange: i }) {
               "button",
               {
                 type: "button",
-                onClick: () => N(m.id),
+                onClick: () => w(o.id),
                 className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
                 children: "Remove"
               }
@@ -747,7 +748,7 @@ function ki({ sources: e, onChange: i }) {
           ] })
         ] })
       },
-      m.id
+      o.id
     )) }),
     n && /* @__PURE__ */ l("div", { className: "mapui:rounded-lg mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:p-3", children: [
       /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-3 mapui:text-xs mapui:font-semibold mapui:text-blue-700", children: "New Source" }),
@@ -755,10 +756,10 @@ function ki({ sources: e, onChange: i }) {
         we,
         {
           value: s,
-          onChange: g,
-          onTestConnection: (m) => v("new", m),
+          onChange: h,
+          onTestConnection: (o) => N("new", o),
           testStatus: d.new,
-          testError: c.new
+          testError: v.new
         }
       ),
       /* @__PURE__ */ l("div", { className: "mapui:mt-3 mapui:flex mapui:gap-2", children: [
@@ -776,7 +777,7 @@ function ki({ sources: e, onChange: i }) {
           "button",
           {
             type: "button",
-            onClick: () => x(!1),
+            onClick: () => f(!1),
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-3 mapui:py-1 mapui:text-xs mapui:text-gray-700 hover:mapui:bg-gray-50",
             children: "Cancel"
           }
@@ -786,30 +787,30 @@ function ki({ sources: e, onChange: i }) {
     /* @__PURE__ */ a(
       re,
       {
-        open: h !== null,
+        open: c !== null,
         title: "Remove Source",
         description: "Are you sure you want to remove this source? Any layers using it will be affected.",
-        onConfirm: () => h && O(h),
-        onCancel: () => N(null)
+        onConfirm: () => c && O(c),
+        onCancel: () => w(null)
       }
     )
   ] });
 }
-function Ci({
+function Si({
   sourceUrl: e,
   selectedCollectionIds: i,
   onSelect: t,
   onDeselect: r
 }) {
-  const { collections: p, loading: u, error: n } = Ge(e || null);
-  return u ? /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2 mapui:py-4 mapui:text-sm mapui:text-gray-500", children: [
+  const { collections: p, loading: m, error: n } = Ge(e || null);
+  return m ? /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2 mapui:py-4 mapui:text-sm mapui:text-gray-500", children: [
     /* @__PURE__ */ a("span", { className: "mapui:inline-block mapui:h-4 mapui:w-4 mapui:animate-spin mapui:rounded-full mapui:border-2 mapui:border-gray-300 mapui:border-t-blue-600" }),
     "Loading collections…"
   ] }) : n ? /* @__PURE__ */ l("div", { className: "mapui:rounded mapui:bg-red-50 mapui:p-3 mapui:text-sm mapui:text-red-700", children: [
     "Failed to load collections: ",
     n.message
-  ] }) : p.length === 0 ? /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No collections found at this source." }) : /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-1 mapui:p-0", children: p.map((x) => {
-    const s = i.includes(x.id);
+  ] }) : p.length === 0 ? /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No collections found at this source." }) : /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-1 mapui:p-0", children: p.map((f) => {
+    const s = i.includes(f.id);
     return /* @__PURE__ */ l(
       "li",
       {
@@ -819,63 +820,63 @@ function Ci({
             "input",
             {
               type: "checkbox",
-              id: `collection-${x.id}`,
+              id: `collection-${f.id}`,
               checked: s,
-              onChange: () => s ? r(x.id) : t(x.id),
+              onChange: () => s ? r(f.id) : t(f.id),
               className: "mapui:mt-0.5 mapui:h-4 mapui:w-4 mapui:cursor-pointer mapui:accent-blue-600"
             }
           ),
           /* @__PURE__ */ l(
             "label",
             {
-              htmlFor: `collection-${x.id}`,
+              htmlFor: `collection-${f.id}`,
               className: "mapui:flex mapui:cursor-pointer mapui:flex-col mapui:gap-0.5",
               children: [
-                /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: x.title ?? x.id }),
-                /* @__PURE__ */ a("span", { className: "mapui:font-mono mapui:text-xs mapui:text-gray-500", children: x.id }),
-                x.description && /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-gray-400 mapui:line-clamp-2", children: x.description })
+                /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: f.title ?? f.id }),
+                /* @__PURE__ */ a("span", { className: "mapui:font-mono mapui:text-xs mapui:text-gray-500", children: f.id }),
+                f.description && /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-gray-400 mapui:line-clamp-2", children: f.description })
               ]
             }
           )
         ]
       },
-      x.id
+      f.id
     );
   }) });
 }
-function Na({ value: e, onChange: i, availableIcons: t }) {
-  const [r, p] = T(!1), [u, n] = T(-1), x = H(null), s = ze(), g = u >= 0 ? `${s}-option-${u}` : void 0, d = Ue(() => {
+function va({ value: e, onChange: i, availableIcons: t }) {
+  const [r, p] = T(!1), [m, n] = T(-1), f = H(null), s = ze(), h = m >= 0 ? `${s}-option-${m}` : void 0, d = Ue(() => {
     if (!t || t.length === 0) return [];
     if (!e) return t;
-    const v = e.toLowerCase();
-    return t.filter((C) => C.toLowerCase().includes(v));
-  }, [t, e]), w = r && d.length > 0, c = Be(
-    (v) => {
-      i(v), p(!1), n(-1);
+    const N = e.toLowerCase();
+    return t.filter((C) => C.toLowerCase().includes(N));
+  }, [t, e]), x = r && d.length > 0, v = Be(
+    (N) => {
+      i(N), p(!1), n(-1);
     },
     [i]
-  ), o = (v) => {
-    i(v.target.value), p(!0), n(-1);
-  }, h = (v) => {
-    w && (v.key === "ArrowDown" ? (v.preventDefault(), n((C) => Math.min(C + 1, d.length - 1))) : v.key === "ArrowUp" ? (v.preventDefault(), n((C) => Math.max(C - 1, 0))) : v.key === "Enter" && u >= 0 ? (v.preventDefault(), c(d[u])) : v.key === "Escape" && (p(!1), n(-1)));
+  ), u = (N) => {
+    i(N.target.value), p(!0), n(-1);
+  }, c = (N) => {
+    x && (N.key === "ArrowDown" ? (N.preventDefault(), n((C) => Math.min(C + 1, d.length - 1))) : N.key === "ArrowUp" ? (N.preventDefault(), n((C) => Math.max(C - 1, 0))) : N.key === "Enter" && m >= 0 ? (N.preventDefault(), v(d[m])) : N.key === "Escape" && (p(!1), n(-1)));
   };
   q(() => {
-    const v = (C) => {
-      x.current && !x.current.contains(C.target) && (p(!1), n(-1));
+    const N = (C) => {
+      f.current && !f.current.contains(C.target) && (p(!1), n(-1));
     };
-    return document.addEventListener("mousedown", v), () => document.removeEventListener("mousedown", v);
+    return document.addEventListener("mousedown", N), () => document.removeEventListener("mousedown", N);
   }, []);
-  const N = "mapui:w-full mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
+  const w = "mapui:w-full mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
   return !t || t.length === 0 ? /* @__PURE__ */ a(
     "input",
     {
       type: "text",
       value: e,
-      onChange: (v) => i(v.target.value || ""),
+      onChange: (N) => i(N.target.value || ""),
       placeholder: "icon-name",
-      className: N
+      className: w
     }
-  ) : /* @__PURE__ */ l("div", { ref: x, className: "mapui:relative", children: [
+  ) : /* @__PURE__ */ l("div", { ref: f, className: "mapui:relative", children: [
     /* @__PURE__ */ a(
       "input",
       {
@@ -883,35 +884,35 @@ function Na({ value: e, onChange: i, availableIcons: t }) {
         value: e,
         placeholder: "Search icons…",
         role: "combobox",
-        "aria-expanded": w,
+        "aria-expanded": x,
         "aria-autocomplete": "list",
         "aria-controls": s,
-        "aria-activedescendant": g,
-        onChange: o,
+        "aria-activedescendant": h,
+        onChange: u,
         onFocus: () => p(!0),
-        onKeyDown: h,
-        className: N
+        onKeyDown: c,
+        className: w
       }
     ),
-    w && /* @__PURE__ */ a(
+    x && /* @__PURE__ */ a(
       "ul",
       {
         id: s,
         role: "listbox",
         className: "mapui:absolute mapui:z-10 mapui:mt-1 mapui:w-full mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:shadow-lg mapui:max-h-48 mapui:overflow-y-auto mapui:p-0 mapui:m-0 mapui:list-none",
-        children: d.map((v, C) => /* @__PURE__ */ a(
+        children: d.map((N, C) => /* @__PURE__ */ a(
           "li",
           {
             id: `${s}-option-${C}`,
             role: "option",
-            "aria-selected": C === u,
+            "aria-selected": C === m,
             onMouseDown: (E) => {
-              E.preventDefault(), c(v);
+              E.preventDefault(), v(N);
             },
-            className: `mapui:cursor-pointer mapui:px-2 mapui:py-1 mapui:text-sm mapui:font-mono ${C === u ? "mapui:bg-blue-100" : "hover:mapui:bg-gray-50"}`,
-            children: v
+            className: `mapui:cursor-pointer mapui:px-2 mapui:py-1 mapui:text-sm mapui:font-mono ${C === m ? "mapui:bg-blue-100" : "hover:mapui:bg-gray-50"}`,
+            children: N
           },
-          `${C}-${v}`
+          `${C}-${N}`
         ))
       }
     )
@@ -932,10 +933,10 @@ const Ne = [
 function pe(e) {
   return Ne[e % Ne.length];
 }
-function va(e) {
+function ka(e) {
   return e[0] === "interpolate" ? "interpolate" : "match";
 }
-function ka(e) {
+function Ca(e) {
   const i = Array.isArray(e[1]) ? e[1][1] ?? "" : "", t = e[e.length - 1] ?? "#000000", r = [];
   for (let p = 2; p < e.length - 1; p += 2)
     r.push({ value: String(e[p] ?? ""), color: e[p + 1] ?? "#000000" });
@@ -965,7 +966,7 @@ function ke(e, i) {
 function Ce(e) {
   return e.map((i) => ({ stopText: String(i.stop), color: i.color }));
 }
-function Ca(e) {
+function Sa(e) {
   return e.map((i, t) => {
     if (i.stopText.trim() === "") return "Value required";
     const r = parseFloat(i.stopText);
@@ -977,7 +978,7 @@ function Ca(e) {
     return "";
   });
 }
-function Sa(e) {
+function Ta(e) {
   const i = [];
   for (const t of e) {
     const r = parseFloat(t.stopText);
@@ -987,117 +988,117 @@ function Sa(e) {
   return i;
 }
 const ae = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500", ue = "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-gray-700 hover:mapui:bg-gray-50", Se = "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50";
-function Ta({
+function Da({
   value: e,
   onChange: i,
   availableProperties: t = [],
   onFetchDistinctValues: r
 }) {
-  const [p, u] = T(() => va(e)), [n, x] = T(!1), s = ka(e), g = p === "match" ? s.property : "", d = p === "match" ? s.pairs : [], w = p === "match" ? s.fallback : "#000000", [c, o] = T(() => {
-    const f = ne(e);
-    return Ce(f.stops);
-  }), [h, N] = T(() => p === "interpolate" ? ne(e).property : ""), [v, C] = T([]), E = H(e);
+  const [p, m] = T(() => ka(e)), [n, f] = T(!1), s = Ca(e), h = p === "match" ? s.property : "", d = p === "match" ? s.pairs : [], x = p === "match" ? s.fallback : "#000000", [v, u] = T(() => {
+    const y = ne(e);
+    return Ce(y.stops);
+  }), [c, w] = T(() => p === "interpolate" ? ne(e).property : ""), [N, C] = T([]), E = H(e);
   q(() => {
     if (E.current !== e && p === "interpolate") {
-      const f = ne(e);
-      o(Ce(f.stops)), N(f.property), C([]);
+      const y = ne(e);
+      u(Ce(y.stops)), w(y.property), C([]);
     }
     E.current = e;
   }, [e, p]);
   const O = t.filter(
-    (f) => !f.type || f.type === "string"
-  ), m = t.filter(
-    (f) => f.type === "number" || f.type === "integer"
-  ), L = (f, D, I) => {
-    i(ve(f, D, I));
-  }, F = (f) => {
-    L(f, d, w);
-  }, b = (f) => {
-    L(g, d, f);
-  }, M = (f, D) => {
-    const I = d.map((A, B) => B === f ? { ...A, value: D } : A);
-    L(g, I, w);
-  }, P = (f, D) => {
-    const I = d.map((A, B) => B === f ? { ...A, color: D } : A);
-    L(g, I, w);
-  }, y = (f) => {
-    const D = d.filter((I, A) => A !== f);
-    L(g, D, w);
+    (y) => !y.type || y.type === "string"
+  ), o = t.filter(
+    (y) => y.type === "number" || y.type === "integer"
+  ), D = (y, L, I) => {
+    i(ve(y, L, I));
+  }, F = (y) => {
+    D(y, d, x);
+  }, g = (y) => {
+    D(h, d, y);
+  }, M = (y, L) => {
+    const I = d.map((A, B) => B === y ? { ...A, value: L } : A);
+    D(h, I, x);
+  }, P = (y, L) => {
+    const I = d.map((A, B) => B === y ? { ...A, color: L } : A);
+    D(h, I, x);
+  }, b = (y) => {
+    const L = d.filter((I, A) => A !== y);
+    D(h, L, x);
   }, k = () => {
-    const f = [...d, { value: "", color: pe(d.length) }];
-    L(g, f, w);
+    const y = [...d, { value: "", color: pe(d.length) }];
+    D(h, y, x);
   }, j = async () => {
-    if (!(!r || !g)) {
-      x(!0);
+    if (!(!r || !h)) {
+      f(!0);
       try {
-        const D = (await r(g)).map((I, A) => ({
+        const L = (await r(h)).map((I, A) => ({
           value: I,
           color: pe(A)
         }));
-        L(g, D, w);
+        D(h, L, x);
       } finally {
-        x(!1);
+        f(!1);
       }
     }
-  }, R = (f, D) => {
-    const I = Ca(D);
-    if (C(I), f && D.length >= 2 && I.every((A) => !A)) {
-      const A = Sa(D);
-      A && i(ke(f, A));
+  }, R = (y, L) => {
+    const I = Sa(L);
+    if (C(I), y && L.length >= 2 && I.every((A) => !A)) {
+      const A = Ta(L);
+      A && i(ke(y, A));
     }
-  }, W = (f) => {
-    N(f), R(f, c);
-  }, U = (f, D) => {
-    const I = c.map((A, B) => B === f ? { ...A, stopText: D } : A);
-    o(I), R(h, I);
-  }, G = (f, D) => {
-    const I = c.map((A, B) => B === f ? { ...A, color: D } : A);
-    o(I), R(h, I);
-  }, J = (f) => {
-    const D = c.filter((I, A) => A !== f);
-    o(D), R(h, D);
+  }, W = (y) => {
+    w(y), R(y, v);
+  }, U = (y, L) => {
+    const I = v.map((A, B) => B === y ? { ...A, stopText: L } : A);
+    u(I), R(c, I);
+  }, G = (y, L) => {
+    const I = v.map((A, B) => B === y ? { ...A, color: L } : A);
+    u(I), R(c, I);
+  }, J = (y) => {
+    const L = v.filter((I, A) => A !== y);
+    u(L), R(c, L);
   }, K = () => {
     var B;
-    const f = ((B = c[c.length - 1]) == null ? void 0 : B.stopText) ?? "0", D = parseFloat(f), I = isNaN(D) ? 0 : D + 10, A = [...c, { stopText: String(I), color: pe(c.length) }];
-    o(A), R(h, A);
-  }, Q = (f) => {
-    u(f), f === "match" ? i(ve("", [], "#000000")) : (o([]), N(""), C([]), i(ke("", [])));
+    const y = ((B = v[v.length - 1]) == null ? void 0 : B.stopText) ?? "0", L = parseFloat(y), I = isNaN(L) ? 0 : L + 10, A = [...v, { stopText: String(I), color: pe(v.length) }];
+    u(A), R(c, A);
+  }, Q = (y) => {
+    m(y), y === "match" ? i(ve("", [], "#000000")) : (u([]), w(""), C([]), i(ke("", [])));
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
-    /* @__PURE__ */ a("div", { className: "mapui:flex mapui:overflow-hidden mapui:rounded mapui:border mapui:border-gray-300", children: ["match", "interpolate"].map((f) => /* @__PURE__ */ a(
+    /* @__PURE__ */ a("div", { className: "mapui:flex mapui:overflow-hidden mapui:rounded mapui:border mapui:border-gray-300", children: ["match", "interpolate"].map((y) => /* @__PURE__ */ a(
       "button",
       {
         type: "button",
-        onClick: () => Q(f),
+        onClick: () => Q(y),
         className: [
           "mapui:flex-1 mapui:cursor-pointer mapui:border-0 mapui:px-3 mapui:py-1 mapui:text-xs mapui:capitalize mapui:outline-none",
           "focus:mapui:ring-1 focus:mapui:ring-inset focus:mapui:ring-blue-400",
-          p === f ? "mapui:bg-blue-500 mapui:text-white" : "mapui:bg-white mapui:text-gray-700 hover:mapui:bg-gray-50"
+          p === y ? "mapui:bg-blue-500 mapui:text-white" : "mapui:bg-white mapui:text-gray-700 hover:mapui:bg-gray-50"
         ].join(" "),
-        children: f === "match" ? "Categorical" : "Gradient"
+        children: y === "match" ? "Categorical" : "Gradient"
       },
-      f
+      y
     )) }),
     p === "match" && /* @__PURE__ */ l(z, { children: [
       /* @__PURE__ */ l(
         "select",
         {
-          value: g,
-          onChange: (f) => F(f.target.value),
+          value: h,
+          onChange: (y) => F(y.target.value),
           className: ae,
           children: [
             /* @__PURE__ */ a("option", { value: "", children: "Select a property…" }),
-            O.map((f) => /* @__PURE__ */ a("option", { value: f.name, children: f.title ?? f.name }, f.name))
+            O.map((y) => /* @__PURE__ */ a("option", { value: y.name, children: y.title ?? y.name }, y.name))
           ]
         }
       ),
-      d.length > 0 && /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: d.map((f, D) => /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      d.length > 0 && /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: d.map((y, L) => /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "input",
           {
             type: "text",
-            value: f.value,
-            onChange: (I) => M(D, I.target.value),
+            value: y.value,
+            onChange: (I) => M(L, I.target.value),
             placeholder: "value",
             className: `${ae} mapui:flex-1`
           }
@@ -1105,20 +1106,20 @@ function Ta({
         /* @__PURE__ */ a(
           Z,
           {
-            value: f.color,
-            onChange: (I) => P(D, I),
-            label: `Color for "${f.value}"`
+            value: y.color,
+            onChange: (I) => P(L, I),
+            label: `Color for "${y.value}"`
           }
         ),
-        /* @__PURE__ */ a("button", { type: "button", onClick: () => y(D), className: Se, children: "×" })
-      ] }, D)) }),
+        /* @__PURE__ */ a("button", { type: "button", onClick: () => b(L), className: Se, children: "×" })
+      ] }, L)) }),
       /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
         /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-gray-500 mapui:shrink-0", children: "Fallback:" }),
-        /* @__PURE__ */ a(Z, { value: w, onChange: b, label: "Fallback color" })
+        /* @__PURE__ */ a(Z, { value: x, onChange: g, label: "Fallback color" })
       ] }),
       /* @__PURE__ */ l("div", { className: "mapui:flex mapui:gap-2", children: [
         /* @__PURE__ */ a("button", { type: "button", onClick: k, className: ue, children: "+ Add value" }),
-        r && g && /* @__PURE__ */ a(
+        r && h && /* @__PURE__ */ a(
           "button",
           {
             type: "button",
@@ -1134,17 +1135,17 @@ function Ta({
       /* @__PURE__ */ l(
         "select",
         {
-          value: h,
-          onChange: (f) => W(f.target.value),
+          value: c,
+          onChange: (y) => W(y.target.value),
           className: ae,
           children: [
             /* @__PURE__ */ a("option", { value: "", children: "Select a numeric property…" }),
-            m.map((f) => /* @__PURE__ */ a("option", { value: f.name, children: f.title ?? f.name }, f.name))
+            o.map((y) => /* @__PURE__ */ a("option", { value: y.name, children: y.title ?? y.name }, y.name))
           ]
         }
       ),
-      c.length > 0 && /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: c.map((f, D) => {
-        const I = v[D];
+      v.length > 0 && /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: v.map((y, L) => {
+        const I = N[L];
         return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-0.5", children: [
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
             /* @__PURE__ */ a(
@@ -1152,8 +1153,8 @@ function Ta({
               {
                 type: "text",
                 inputMode: "numeric",
-                value: f.stopText,
-                onChange: (A) => U(D, A.target.value),
+                value: y.stopText,
+                onChange: (A) => U(L, A.target.value),
                 placeholder: "stop",
                 className: `${ae} mapui:w-24`
               }
@@ -1161,22 +1162,22 @@ function Ta({
             /* @__PURE__ */ a(
               Z,
               {
-                value: f.color,
-                onChange: (A) => G(D, A),
-                label: `Color at stop ${f.stopText}`
+                value: y.color,
+                onChange: (A) => G(L, A),
+                label: `Color at stop ${y.stopText}`
               }
             ),
-            /* @__PURE__ */ a("button", { type: "button", onClick: () => J(D), className: Se, children: "×" })
+            /* @__PURE__ */ a("button", { type: "button", onClick: () => J(L), className: Se, children: "×" })
           ] }),
           I && /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-red-500", children: I })
-        ] }, D);
+        ] }, L);
       }) }),
       /* @__PURE__ */ a("button", { type: "button", onClick: K, className: ue, children: "+ Add stop" })
     ] })
   ] });
 }
 const Y = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
-function Da({
+function La({
   value: e,
   onChange: i
 }) {
@@ -1208,7 +1209,7 @@ function Da({
     )
   ] });
 }
-function La({
+function Aa({
   value: e,
   onChange: i
 }) {
@@ -1235,12 +1236,12 @@ function Te({
   onChange: t,
   availableIcons: r,
   availableProperties: p,
-  onFetchDistinctValues: u
+  onFetchDistinctValues: m
 }) {
-  var n, x;
+  var n, f;
   switch (e.widget) {
     case "color": {
-      const s = Array.isArray(i), g = s ? i[i.length - 1] ?? "#000000" : "#000000";
+      const s = Array.isArray(i), h = s ? i[i.length - 1] ?? "#000000" : "#000000";
       return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-1 mapui:w-full", children: [
         /* @__PURE__ */ a("div", { className: "mapui:flex mapui:items-center mapui:justify-end", children: /* @__PURE__ */ a(
           "button",
@@ -1248,7 +1249,7 @@ function Te({
             type: "button",
             title: s ? "Switch to static color" : "Switch to data-driven color",
             onClick: () => {
-              t(s ? g : ["match", ["get", ""], g]);
+              t(s ? h : ["match", ["get", ""], h]);
             },
             className: [
               "mapui:cursor-pointer mapui:rounded mapui:border mapui:px-1.5 mapui:py-0.5 mapui:font-mono mapui:text-xs mapui:outline-none",
@@ -1259,12 +1260,12 @@ function Te({
           }
         ) }),
         s ? /* @__PURE__ */ a(
-          Ta,
+          Da,
           {
             value: i,
             onChange: (d) => t(d),
             availableProperties: p,
-            onFetchDistinctValues: u
+            onFetchDistinctValues: m
           }
         ) : /* @__PURE__ */ a(
           Z,
@@ -1278,7 +1279,7 @@ function Te({
     }
     case "opacity":
       return /* @__PURE__ */ a(
-        La,
+        Aa,
         {
           value: i,
           onChange: t
@@ -1314,12 +1315,12 @@ function Te({
           value: i ?? ((n = e.options) == null ? void 0 : n[0]) ?? "",
           onChange: (s) => t(s.target.value),
           className: Y,
-          children: (x = e.options) == null ? void 0 : x.map((s) => /* @__PURE__ */ a("option", { value: s, children: s }, s))
+          children: (f = e.options) == null ? void 0 : f.map((s) => /* @__PURE__ */ a("option", { value: s, children: s }, s))
         }
       );
     case "translate":
       return /* @__PURE__ */ a(
-        Da,
+        La,
         {
           value: i,
           onChange: t
@@ -1327,24 +1328,24 @@ function Te({
       );
     case "dasharray":
     case "stringArray": {
-      const s = i, g = s ? s.join(", ") : "";
+      const s = i, h = s ? s.join(", ") : "";
       return /* @__PURE__ */ a(
         "input",
         {
           type: "text",
-          value: g,
+          value: h,
           onChange: (d) => {
-            const w = d.target.value.trim();
-            if (!w) {
+            const x = d.target.value.trim();
+            if (!x) {
               t(void 0);
               return;
             }
             if (e.widget === "dasharray") {
-              const c = w.split(",").map((o) => parseFloat(o.trim())).filter((o) => !isNaN(o));
-              t(c.length > 0 ? c : void 0);
+              const v = x.split(",").map((u) => parseFloat(u.trim())).filter((u) => !isNaN(u));
+              t(v.length > 0 ? v : void 0);
             } else {
-              const c = w.split(",").map((o) => o.trim()).filter(Boolean);
-              t(c.length > 0 ? c : void 0);
+              const v = x.split(",").map((u) => u.trim()).filter(Boolean);
+              t(v.length > 0 ? v : void 0);
             }
           },
           placeholder: e.widget === "dasharray" ? "e.g. 2, 4" : "comma-separated",
@@ -1364,7 +1365,7 @@ function Te({
       );
     case "icon-image":
       return /* @__PURE__ */ a(
-        Na,
+        va,
         {
           value: i ?? "",
           onChange: (s) => t(s ?? void 0),
@@ -1375,8 +1376,8 @@ function Te({
       return null;
   }
 }
-function Aa({ def: e, value: i, onChange: t, availableIcons: r, availableProperties: p, onFetchDistinctValues: u }) {
-  const n = e.enableDefault !== void 0, x = i !== void 0;
+function Ea({ def: e, value: i, onChange: t, availableIcons: r, availableProperties: p, onFetchDistinctValues: m }) {
+  const n = e.enableDefault !== void 0, f = i !== void 0;
   if (n && e.widget === "boolean") {
     const s = !e.enableDefault;
     return /* @__PURE__ */ a(S, { label: e.label, description: e.description, children: /* @__PURE__ */ a(
@@ -1384,8 +1385,8 @@ function Aa({ def: e, value: i, onChange: t, availableIcons: r, availablePropert
       {
         type: "checkbox",
         checked: i === s,
-        onChange: (g) => {
-          t(e.key, g.target.checked ? s : void 0);
+        onChange: (h) => {
+          t(e.key, h.target.checked ? s : void 0);
         },
         className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
       }
@@ -1396,14 +1397,14 @@ function Aa({ def: e, value: i, onChange: t, availableIcons: r, availablePropert
       "input",
       {
         type: "checkbox",
-        checked: x,
+        checked: f,
         onChange: (s) => {
           t(e.key, s.target.checked ? e.enableDefault : void 0);
         },
         className: "mapui:h-4 mapui:w-4 mapui:shrink-0 mapui:accent-blue-600"
       }
     ),
-    x && /* @__PURE__ */ a(
+    f && /* @__PURE__ */ a(
       Te,
       {
         def: e,
@@ -1411,7 +1412,7 @@ function Aa({ def: e, value: i, onChange: t, availableIcons: r, availablePropert
         onChange: (s) => t(e.key, s),
         availableIcons: r,
         availableProperties: p,
-        onFetchDistinctValues: u
+        onFetchDistinctValues: m
       }
     )
   ] }) }) : /* @__PURE__ */ a(S, { label: e.label, description: e.description, children: /* @__PURE__ */ a(
@@ -1422,7 +1423,7 @@ function Aa({ def: e, value: i, onChange: t, availableIcons: r, availablePropert
       onChange: (s) => t(e.key, s),
       availableIcons: r,
       availableProperties: p,
-      onFetchDistinctValues: u
+      onFetchDistinctValues: m
     }
   ) });
 }
@@ -1432,30 +1433,30 @@ function De({
   values: t,
   onChange: r,
   defaultOpen: p = !1,
-  availableIcons: u,
+  availableIcons: m,
   availableProperties: n,
-  onFetchDistinctValues: x
+  onFetchDistinctValues: f
 }) {
   const s = i.filter(
-    (g) => g.enableDefault !== void 0 && t[g.key] !== void 0
+    (h) => h.enableDefault !== void 0 && t[h.key] !== void 0
   ).length;
-  return /* @__PURE__ */ a(X, { title: e, defaultOpen: p, badge: s || void 0, children: /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: i.map((g) => /* @__PURE__ */ a(
-    Aa,
+  return /* @__PURE__ */ a(X, { title: e, defaultOpen: p, badge: s || void 0, children: /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: i.map((h) => /* @__PURE__ */ a(
+    Ea,
     {
-      def: g,
-      value: t[g.key],
+      def: h,
+      value: t[h.key],
       onChange: r,
-      availableIcons: u,
+      availableIcons: m,
       availableProperties: n,
-      onFetchDistinctValues: x
+      onFetchDistinctValues: f
     },
-    g.key
+    h.key
   )) }) });
 }
 function V(e) {
   return Array.isArray(e);
 }
-function Ea(e) {
+function Ia(e) {
   return e[0] === "match" ? "match" : e[0] === "interpolate" ? "interpolate" : null;
 }
 function We(e) {
@@ -1474,12 +1475,12 @@ function We(e) {
   }
   return [];
 }
-function Ia(e) {
+function Ma(e) {
   if (e[0] === "match") {
     const i = [];
     for (let r = 2; r < e.length - 1; r += 2) {
-      const p = String(e[r]), u = e[r + 1];
-      typeof u == "string" && i.push({ label: p, color: u });
+      const p = String(e[r]), m = e[r + 1];
+      typeof m == "string" && i.push({ label: p, color: m });
     }
     const t = e[e.length - 1];
     return typeof t == "string" && i.push({ label: "Other", color: t }), i;
@@ -1494,7 +1495,7 @@ function Ia(e) {
   }
   return [];
 }
-function Ma(e) {
+function Fa(e) {
   const i = e[0] === "match" ? e[1] : e[0] === "interpolate" ? e[2] : null;
   if (Array.isArray(i)) {
     if (i[0] === "get" && typeof i[1] == "string") return i[1];
@@ -1503,7 +1504,7 @@ function Ma(e) {
   }
   return null;
 }
-function Fa(e) {
+function Pa(e) {
   switch (e.type) {
     case "fill":
       return e.paint["fill-color"] ?? "#000000";
@@ -1515,7 +1516,7 @@ function Fa(e) {
       return e.paint["text-color"] ?? e.paint["icon-color"] ?? "#000000";
   }
 }
-function Pa(e) {
+function Oa(e) {
   switch (e.type) {
     case "fill":
       return "square";
@@ -1536,7 +1537,7 @@ function oe({ expr: e, height: i }) {
         title: "Expression (no preview)"
       }
     );
-  const r = e[0] === "interpolate", p = r ? `linear-gradient(to right, ${t.join(", ")})` : t.map((u, n) => `${u} ${n / t.length * 100}% ${(n + 1) / t.length * 100}%`).join(", ");
+  const r = e[0] === "interpolate", p = r ? `linear-gradient(to right, ${t.join(", ")})` : t.map((m, n) => `${m} ${n / t.length * 100}% ${(n + 1) / t.length * 100}%`).join(", ");
   return /* @__PURE__ */ a(
     "div",
     {
@@ -1553,7 +1554,7 @@ function oe({ expr: e, height: i }) {
 function Le(e, i) {
   return typeof e == "string" ? e : V(e) ? We(e)[0] ?? i : i;
 }
-function Oa({ style: e }) {
+function ja({ style: e }) {
   if (e.type === "fill") {
     const r = e.paint["fill-color"];
     return /* @__PURE__ */ a(
@@ -1640,7 +1641,7 @@ function Oa({ style: e }) {
     }
   );
 }
-const ja = [
+const $a = [
   // Appearance (paint)
   { key: "fill-color", label: "Fill Color", widget: "color", group: "Appearance", category: "paint" },
   { key: "fill-opacity", label: "Fill Opacity", widget: "opacity", group: "Appearance", category: "paint" },
@@ -1652,7 +1653,7 @@ const ja = [
   { key: "fill-translate-anchor", label: "Translate Anchor", widget: "enum", group: "Transform", category: "paint", options: ["map", "viewport"], enableDefault: "map", description: '"map" moves the fill with the map when panning; "viewport" keeps the offset fixed on screen.' },
   // Sorting (layout)
   { key: "fill-sort-key", label: "Sort Key", widget: "number", group: "Sorting", category: "layout", step: 1, enableDefault: 0, description: "Features with a higher sort key are drawn on top of features with a lower sort key within this layer." }
-], $a = [
+], Ra = [
   // Appearance (paint)
   { key: "line-color", label: "Line Color", widget: "color", group: "Appearance", category: "paint" },
   { key: "line-width", label: "Line Width", widget: "number", group: "Appearance", category: "paint", min: 0, step: 0.5 },
@@ -1673,7 +1674,7 @@ const ja = [
   { key: "line-round-limit", label: "Round Limit", widget: "number", group: "Cap & Join", category: "layout", step: 0.1, enableDefault: 1.05, description: 'When line-join is "round", angles sharper than this threshold (in radians) are bevelled instead of rounded.' },
   // Sorting (layout)
   { key: "line-sort-key", label: "Sort Key", widget: "number", group: "Sorting", category: "layout", step: 1, enableDefault: 0, description: "Features with a higher sort key are drawn on top of features with a lower sort key within this layer." }
-], Ra = [
+], Ba = [
   // Appearance (paint)
   { key: "circle-color", label: "Circle Color", widget: "color", group: "Appearance", category: "paint" },
   { key: "circle-radius", label: "Radius", widget: "number", group: "Appearance", category: "paint", min: 0, step: 1 },
@@ -1691,7 +1692,7 @@ const ja = [
   { key: "circle-pitch-alignment", label: "Pitch Alignment", widget: "enum", group: "Alignment", category: "paint", options: ["map", "viewport"], enableDefault: "viewport", description: '"map" orients circles flat on the map surface; "viewport" keeps circles facing the screen (default).' },
   // Sorting (layout)
   { key: "circle-sort-key", label: "Sort Key", widget: "number", group: "Sorting", category: "layout", step: 1, enableDefault: 0, description: "Features with a higher sort key are drawn on top of features with a lower sort key within this layer." }
-], Ba = [
+], za = [
   // Icon Appearance (paint)
   { key: "icon-color", label: "Icon Color", widget: "color", group: "Icon Appearance", category: "paint", enableDefault: "#000000" },
   { key: "icon-opacity", label: "Icon Opacity", widget: "opacity", group: "Icon Appearance", category: "paint", enableDefault: 1 },
@@ -1740,14 +1741,14 @@ const ja = [
   { key: "symbol-avoid-edges", label: "Avoid Edges", widget: "boolean", group: "Placement", category: "layout", enableDefault: !1, description: "When enabled, symbols near tile edges are hidden to avoid being clipped or doubled at tile boundaries." },
   { key: "symbol-sort-key", label: "Sort Key", widget: "number", group: "Placement", category: "layout", step: 1, enableDefault: 0, description: "Features with a higher sort key are prioritised in collision detection and drawn on top within this layer." },
   { key: "symbol-z-order", label: "Z-Order", widget: "enum", group: "Placement", category: "layout", options: ["auto", "viewport-y", "source"], enableDefault: "auto", description: '"viewport-y" renders symbols in top-to-bottom screen order (closer = higher); "source" preserves data source order; "auto" uses "viewport-y" when sort-key is unset.' }
-], za = {
-  fill: ja,
-  line: $a,
-  circle: Ra,
-  symbol: Ba
+], Ua = {
+  fill: $a,
+  line: Ra,
+  circle: Ba,
+  symbol: za
 };
-function Ua(e) {
-  return za[e] ?? [];
+function Ga(e) {
+  return Ua[e] ?? [];
 }
 function Ae(e) {
   const i = {};
@@ -1758,17 +1759,17 @@ function Ae(e) {
 const ge = {
   type: "fill",
   paint: { "fill-color": "#4a90d9", "fill-opacity": 0.6, "fill-outline-color": "transparent", "fill-antialias": !0 }
-}, Ga = {
+}, qa = {
   type: "line",
   paint: { "line-color": "#2980b9", "line-width": 2, "line-opacity": 1 }
 }, _e = {
   type: "circle",
   paint: { "circle-color": "#e74c3c", "circle-radius": 5, "circle-opacity": 0.9 }
-}, qa = {
+}, Wa = {
   type: "symbol",
   paint: { "text-color": "#333333" },
   layout: { "text-field": "{name}", "text-size": 14 }
-}, Wa = {
+}, _a = {
   layout: { "icon-image": "" }
 };
 function Ee(e) {
@@ -1776,133 +1777,133 @@ function Ee(e) {
   const i = e.layout ?? {}, t = "icon-image" in i, r = "text-field" in i;
   return t && r ? "both" : t ? "icon" : "text";
 }
-const _a = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500", ie = {
+const Va = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500", ie = {
   fill: "Fill",
   line: "Line",
   circle: "Circle",
   symbol: "Symbol"
-}, Va = ["text", "icon", "both"];
-function Ha({ value: e, onChange: i, suggestedType: t, suggestedTypes: r, availableIcons: p, availableProperties: u, onFetchDistinctValues: n }) {
-  const x = r ?? (t ? [t] : []), [s, g] = T(() => Ee(e));
+}, Ha = ["text", "icon", "both"];
+function Ya({ value: e, onChange: i, suggestedType: t, suggestedTypes: r, availableIcons: p, availableProperties: m, onFetchDistinctValues: n }) {
+  const f = r ?? (t ? [t] : []), [s, h] = T(() => Ee(e));
   q(() => {
-    g(Ee(e));
+    h(Ee(e));
   }, [e.type]);
-  const d = (b) => {
-    i(b === "fill" ? ge : b === "line" ? Ga : b === "circle" ? _e : qa);
-  }, w = (b) => {
-    if (b === s) return;
+  const d = (g) => {
+    i(g === "fill" ? ge : g === "line" ? qa : g === "circle" ? _e : Wa);
+  }, x = (g) => {
+    if (g === s) return;
     const M = e.paint ?? {}, P = e.layout ?? {};
-    let y = { ...M }, k = { ...P };
-    b === "icon" ? (y = Object.fromEntries(Object.entries(y).filter(([j]) => !j.startsWith("text-"))), k = Object.fromEntries(Object.entries(k).filter(([j]) => !j.startsWith("text-"))), "icon-image" in k || (k["icon-image"] = Wa.layout["icon-image"])) : b === "text" && (y = Object.fromEntries(Object.entries(y).filter(([j]) => !j.startsWith("icon-"))), k = Object.fromEntries(Object.entries(k).filter(([j]) => !j.startsWith("icon-"))), "text-field" in k || (k["text-field"] = "{name}"), "text-size" in k || (k["text-size"] = 14), "text-color" in y || (y["text-color"] = "#333333")), g(b), i({
+    let b = { ...M }, k = { ...P };
+    g === "icon" ? (b = Object.fromEntries(Object.entries(b).filter(([j]) => !j.startsWith("text-"))), k = Object.fromEntries(Object.entries(k).filter(([j]) => !j.startsWith("text-"))), "icon-image" in k || (k["icon-image"] = _a.layout["icon-image"])) : g === "text" && (b = Object.fromEntries(Object.entries(b).filter(([j]) => !j.startsWith("icon-"))), k = Object.fromEntries(Object.entries(k).filter(([j]) => !j.startsWith("icon-"))), "text-field" in k || (k["text-field"] = "{name}"), "text-size" in k || (k["text-size"] = 14), "text-color" in b || (b["text-color"] = "#333333")), h(g), i({
       ...e,
-      paint: y,
+      paint: b,
       layout: Object.keys(k).length > 0 ? k : void 0
     });
-  }, c = (b, M) => {
-    const P = { ...e.paint, [b]: M };
-    for (const y of Object.keys(P))
-      P[y] === void 0 && delete P[y];
+  }, v = (g, M) => {
+    const P = { ...e.paint, [g]: M };
+    for (const b of Object.keys(P))
+      P[b] === void 0 && delete P[b];
     i({ ...e, paint: P });
-  }, o = (b, M) => {
-    const y = { ...e.layout ?? {}, [b]: M };
-    for (const k of Object.keys(y))
-      y[k] === void 0 && delete y[k];
+  }, u = (g, M) => {
+    const b = { ...e.layout ?? {}, [g]: M };
+    for (const k of Object.keys(b))
+      b[k] === void 0 && delete b[k];
     i({
       ...e,
-      layout: Object.keys(y).length > 0 ? y : void 0
+      layout: Object.keys(b).length > 0 ? b : void 0
     });
   };
-  let h = Ua(e.type);
-  e.type === "symbol" && (s === "text" ? h = h.filter((b) => !b.key.startsWith("icon-")) : s === "icon" && (h = h.filter((b) => !b.key.startsWith("text-"))));
-  const N = h.filter((b) => b.category === "paint"), v = h.filter((b) => b.category === "layout"), C = Ae(N), E = Ae(v), O = e.paint, m = e.layout ?? {}, L = Object.keys(C), F = Object.keys(E);
+  let c = Ga(e.type);
+  e.type === "symbol" && (s === "text" ? c = c.filter((g) => !g.key.startsWith("icon-")) : s === "icon" && (c = c.filter((g) => !g.key.startsWith("text-"))));
+  const w = c.filter((g) => g.category === "paint"), N = c.filter((g) => g.category === "layout"), C = Ae(w), E = Ae(N), O = e.paint, o = e.layout ?? {}, D = Object.keys(C), F = Object.keys(E);
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
-    x.length > 0 && !x.includes(e.type) && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between mapui:rounded mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:px-3 mapui:py-2 mapui:text-sm mapui:text-blue-800", children: [
+    f.length > 0 && !f.includes(e.type) && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between mapui:rounded mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:px-3 mapui:py-2 mapui:text-sm mapui:text-blue-800", children: [
       /* @__PURE__ */ l("span", { children: [
         "Detected geometry is suitable for",
         " ",
-        x.map((b, M) => /* @__PURE__ */ l("span", { children: [
-          M > 0 && (M === x.length - 1 ? " or " : ", "),
-          /* @__PURE__ */ a("strong", { children: ie[b] })
-        ] }, b)),
+        f.map((g, M) => /* @__PURE__ */ l("span", { children: [
+          M > 0 && (M === f.length - 1 ? " or " : ", "),
+          /* @__PURE__ */ a("strong", { children: ie[g] })
+        ] }, g)),
         " ",
         "style."
       ] }),
-      /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: x.map((b) => /* @__PURE__ */ a(
+      /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1", children: f.map((g) => /* @__PURE__ */ a(
         "button",
         {
           type: "button",
-          onClick: () => d(b),
+          onClick: () => d(g),
           className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-blue-400 mapui:bg-white mapui:px-2 mapui:py-0.5 mapui:text-xs mapui:text-blue-700 hover:mapui:bg-blue-100",
-          children: ie[b]
+          children: ie[g]
         },
-        b
+        g
       )) })
     ] }),
     /* @__PURE__ */ a(S, { label: "Style Type", children: /* @__PURE__ */ a(
       "select",
       {
         value: e.type,
-        onChange: (b) => d(b.target.value),
-        className: _a,
-        children: Object.keys(ie).map((b) => /* @__PURE__ */ a("option", { value: b, children: ie[b] }, b))
+        onChange: (g) => d(g.target.value),
+        className: Va,
+        children: Object.keys(ie).map((g) => /* @__PURE__ */ a("option", { value: g, children: ie[g] }, g))
       }
     ) }),
-    e.type === "symbol" && /* @__PURE__ */ a(S, { label: "Symbol Mode", children: /* @__PURE__ */ a("div", { className: "mapui:flex mapui:overflow-hidden mapui:rounded mapui:border mapui:border-gray-300", children: Va.map((b) => /* @__PURE__ */ a(
+    e.type === "symbol" && /* @__PURE__ */ a(S, { label: "Symbol Mode", children: /* @__PURE__ */ a("div", { className: "mapui:flex mapui:overflow-hidden mapui:rounded mapui:border mapui:border-gray-300", children: Ha.map((g) => /* @__PURE__ */ a(
       "button",
       {
         type: "button",
-        onClick: () => w(b),
+        onClick: () => x(g),
         className: [
           "mapui:flex-1 mapui:cursor-pointer mapui:border-0 mapui:px-3 mapui:py-1 mapui:text-sm mapui:capitalize mapui:outline-none",
           "focus:mapui:ring-1 focus:mapui:ring-inset focus:mapui:ring-blue-400",
-          s === b ? "mapui:bg-blue-500 mapui:text-white" : "mapui:bg-white mapui:text-gray-700 hover:mapui:bg-gray-50"
+          s === g ? "mapui:bg-blue-500 mapui:text-white" : "mapui:bg-white mapui:text-gray-700 hover:mapui:bg-gray-50"
         ].join(" "),
-        children: b === "both" ? "Both" : b.charAt(0).toUpperCase() + b.slice(1)
+        children: g === "both" ? "Both" : g.charAt(0).toUpperCase() + g.slice(1)
       },
-      b
+      g
     )) }) }),
     /* @__PURE__ */ l("div", { className: "mapui:rounded mapui:border mapui:border-gray-100 mapui:p-2", children: [
       /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-1 mapui:text-xs mapui:text-gray-500", children: "Preview" }),
-      /* @__PURE__ */ a(Oa, { style: e })
+      /* @__PURE__ */ a(ja, { style: e })
     ] }),
     F.length > 0 && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
       /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-xs mapui:font-medium mapui:uppercase mapui:tracking-wide mapui:text-gray-500", children: "Layout" }),
-      F.map((b, M) => /* @__PURE__ */ a(
+      F.map((g, M) => /* @__PURE__ */ a(
         De,
         {
-          title: b,
-          properties: E[b],
-          values: m,
-          onChange: o,
+          title: g,
+          properties: E[g],
+          values: o,
+          onChange: u,
           defaultOpen: M === 0,
           availableIcons: p,
-          availableProperties: u,
+          availableProperties: m,
           onFetchDistinctValues: n
         },
-        b
+        g
       ))
     ] }),
-    L.length > 0 && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
+    D.length > 0 && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
       /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-xs mapui:font-medium mapui:uppercase mapui:tracking-wide mapui:text-gray-500", children: "Paint" }),
-      L.map((b) => /* @__PURE__ */ a(
+      D.map((g) => /* @__PURE__ */ a(
         De,
         {
-          title: b,
-          properties: C[b],
+          title: g,
+          properties: C[g],
           values: O,
-          onChange: c,
+          onChange: v,
           defaultOpen: !1,
           availableIcons: p,
-          availableProperties: u,
+          availableProperties: m,
           onFetchDistinctValues: n
         },
-        b
+        g
       ))
     ] })
   ] });
 }
 const Ie = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
-function Ya({ value: e, onChange: i }) {
+function Xa({ value: e, onChange: i }) {
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
     /* @__PURE__ */ a(S, { label: "Label", children: /* @__PURE__ */ a(
       "input",
@@ -1938,42 +1939,42 @@ function Ya({ value: e, onChange: i }) {
   ] });
 }
 const Me = () => ({ label: "", color: "#4a90d9", shape: "square" }), me = 8, Fe = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
-function Xa({ value: e, onChange: i, styles: t }) {
-  const r = (e == null ? void 0 : e.entries) ?? [], p = (e == null ? void 0 : e.displayMode) ?? "simple", u = Ue(() => {
+function Za({ value: e, onChange: i, styles: t, layerLabel: r }) {
+  const p = (e == null ? void 0 : e.entries) ?? [], m = (e == null ? void 0 : e.displayMode) ?? "simple", n = Ue(() => {
     if (!t || t.length === 0) return null;
-    const c = [];
-    let o = "simple", h = null;
+    const u = [];
+    let c = "simple", w = null;
     for (const N of t) {
-      const v = Fa(N), C = Pa(N);
-      if (V(v)) {
-        const E = Ea(v);
-        if (!E) continue;
-        const O = Ia(v).map((m) => ({ label: m.label, color: m.color, shape: C }));
-        c.push(...O), E === "interpolate" ? (o = "gradient", h || (h = Ma(v))) : o === "simple" && (o = "categorical");
-      } else typeof v == "string" && c.length === 0 && c.push({ label: N.type, color: v, shape: C });
+      const C = Pa(N), E = Oa(N);
+      if (V(C)) {
+        const O = Ia(C);
+        if (!O) continue;
+        const o = Ma(C).map((D) => ({ label: D.label, color: D.color, shape: E }));
+        u.push(...o), O === "interpolate" ? (c = "gradient", w || (w = Fa(C))) : c === "simple" && (c = "categorical");
+      } else typeof C == "string" && u.length === 0 && u.push({ label: r || N.type, color: C, shape: E });
     }
-    return c.length === 0 ? null : { entries: c, mode: o, property: h };
-  }, [t]), n = () => {
-    i({ ...e, entries: [...r, Me()] });
-  }, x = (c, o) => {
-    const h = r.map((N, v) => v === c ? o : N);
-    i({ ...e, entries: h });
-  }, s = (c) => {
-    const o = r.filter((h, N) => N !== c);
-    i(o.length > 0 ? { ...e, entries: o } : void 0);
-  }, g = (c) => {
-    i(c ? { entries: [Me()] } : void 0);
-  }, d = () => {
-    u && i({
-      entries: u.entries,
-      displayMode: u.mode,
-      ...u.mode === "gradient" && u.property ? { gradientProperty: u.property } : {},
-      ...u.mode === "categorical" ? { showLabelsCollapsed: !1 } : {}
+    return u.length === 0 ? null : { entries: u, mode: c, property: w };
+  }, [t, r]), f = () => {
+    i({ ...e, entries: [...p, Me()] });
+  }, s = (u, c) => {
+    const w = p.map((N, C) => C === u ? c : N);
+    i({ ...e, entries: w });
+  }, h = (u) => {
+    const c = p.filter((w, N) => N !== u);
+    i(c.length > 0 ? { ...e, entries: c } : void 0);
+  }, d = (u) => {
+    i(u ? { entries: [Me()] } : void 0);
+  }, x = () => {
+    n && i({
+      entries: n.entries,
+      displayMode: n.mode,
+      ...n.mode === "gradient" && n.property ? { gradientProperty: n.property } : {},
+      ...n.mode === "categorical" ? { showLabelsCollapsed: !1 } : {}
     });
-  }, w = (c) => {
+  }, v = (u) => {
     if (!e) return;
-    const o = { ...e, displayMode: c };
-    c !== "categorical" && delete o.showLabelsCollapsed, c !== "categorical" && c !== "gradient" && delete o.showColorBar, c !== "gradient" && delete o.gradientProperty, c === "simple" && delete o.showDisclosureArrow, i(o);
+    const c = { ...e, displayMode: u };
+    u !== "categorical" && delete c.showLabelsCollapsed, u !== "categorical" && u !== "gradient" && delete c.showColorBar, u !== "gradient" && delete c.gradientProperty, u === "simple" && delete c.showDisclosureArrow, i(c);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
@@ -1983,36 +1984,36 @@ function Xa({ value: e, onChange: i, styles: t }) {
           type: "checkbox",
           id: "legend-enabled",
           checked: e !== void 0,
-          onChange: (c) => g(c.target.checked),
+          onChange: (u) => d(u.target.checked),
           className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
         }
       ),
       /* @__PURE__ */ a("label", { htmlFor: "legend-enabled", className: "mapui:text-sm mapui:font-medium mapui:text-gray-700", children: "Enable Legend" })
     ] }),
-    e === void 0 && u && u.entries.length > 0 && /* @__PURE__ */ l("div", { className: "mapui:rounded mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:p-3", children: [
-      /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-blue-800", children: u.mode !== "simple" ? `This layer uses data-driven colors (${u.entries.length} ${u.entries.length === 1 ? "category" : "categories"})` : `This layer has ${u.entries.length} style ${u.entries.length === 1 ? "color" : "colors"}` }),
+    e === void 0 && n && n.entries.length > 0 && /* @__PURE__ */ l("div", { className: "mapui:rounded mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:p-3", children: [
+      /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-blue-800", children: n.mode !== "simple" ? `This layer uses data-driven colors (${n.entries.length} ${n.entries.length === 1 ? "category" : "categories"})` : `This layer has ${n.entries.length} style ${n.entries.length === 1 ? "color" : "colors"}` }),
       /* @__PURE__ */ l("div", { className: "mapui:mt-2 mapui:flex mapui:flex-wrap mapui:items-center mapui:gap-1.5", children: [
-        u.entries.slice(0, me).map((c, o) => /* @__PURE__ */ l(
+        n.entries.slice(0, me).map((u, c) => /* @__PURE__ */ l(
           "div",
           {
             className: "mapui:flex mapui:items-center mapui:gap-1",
-            title: c.label,
+            title: u.label,
             children: [
               /* @__PURE__ */ a(
                 "span",
                 {
                   className: "mapui:inline-block mapui:h-3 mapui:w-3 mapui:rounded-sm mapui:shrink-0",
-                  style: { backgroundColor: c.color }
+                  style: { backgroundColor: u.color }
                 }
               ),
-              /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-blue-700 mapui:truncate mapui:max-w-16", children: c.label })
+              /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-blue-700 mapui:truncate mapui:max-w-16", children: u.label })
             ]
           },
-          `${c.label}-${o}`
+          `${u.label}-${c}`
         )),
-        u.entries.length > me && /* @__PURE__ */ l("span", { className: "mapui:text-xs mapui:text-blue-600", children: [
+        n.entries.length > me && /* @__PURE__ */ l("span", { className: "mapui:text-xs mapui:text-blue-600", children: [
           "+",
-          u.entries.length - me,
+          n.entries.length - me,
           " more"
         ] })
       ] }),
@@ -2020,7 +2021,7 @@ function Xa({ value: e, onChange: i, styles: t }) {
         "button",
         {
           type: "button",
-          onClick: d,
+          onClick: x,
           className: "mapui:mt-2 mapui:cursor-pointer mapui:rounded mapui:border mapui:border-blue-300 mapui:bg-white mapui:px-3 mapui:py-1.5 mapui:text-sm mapui:font-medium mapui:text-blue-700 hover:mapui:bg-blue-100",
           children: "Generate from Style"
         }
@@ -2033,8 +2034,8 @@ function Xa({ value: e, onChange: i, styles: t }) {
           "select",
           {
             id: "legend-display-mode",
-            value: p,
-            onChange: (c) => w(c.target.value),
+            value: m,
+            onChange: (u) => v(u.target.value),
             className: Fe,
             children: [
               /* @__PURE__ */ a("option", { value: "simple", children: "Simple" }),
@@ -2044,46 +2045,46 @@ function Xa({ value: e, onChange: i, styles: t }) {
           }
         )
       ] }),
-      p === "categorical" && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      m === "categorical" && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "input",
           {
             type: "checkbox",
             id: "legend-show-labels-collapsed",
             checked: e.showLabelsCollapsed ?? !1,
-            onChange: (c) => i({ ...e, showLabelsCollapsed: c.target.checked }),
+            onChange: (u) => i({ ...e, showLabelsCollapsed: u.target.checked }),
             className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
           }
         ),
         /* @__PURE__ */ a("label", { htmlFor: "legend-show-labels-collapsed", className: "mapui:text-sm mapui:text-gray-700", children: "Show labels in collapsed view" })
       ] }),
-      (p === "categorical" || p === "gradient") && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      (m === "categorical" || m === "gradient") && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "input",
           {
             type: "checkbox",
             id: "legend-show-color-bar",
             checked: e.showColorBar !== !1,
-            onChange: (c) => i({ ...e, showColorBar: c.target.checked }),
+            onChange: (u) => i({ ...e, showColorBar: u.target.checked }),
             className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
           }
         ),
         /* @__PURE__ */ a("label", { htmlFor: "legend-show-color-bar", className: "mapui:text-sm mapui:text-gray-700", children: "Show color bar" })
       ] }),
-      (p === "categorical" || p === "gradient") && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      (m === "categorical" || m === "gradient") && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "input",
           {
             type: "checkbox",
             id: "legend-show-disclosure-arrow",
             checked: e.showDisclosureArrow !== !1,
-            onChange: (c) => i({ ...e, showDisclosureArrow: c.target.checked }),
+            onChange: (u) => i({ ...e, showDisclosureArrow: u.target.checked }),
             className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
           }
         ),
         /* @__PURE__ */ a("label", { htmlFor: "legend-show-disclosure-arrow", className: "mapui:text-sm mapui:text-gray-700", children: "Show disclosure arrow" })
       ] }),
-      p === "gradient" && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      m === "gradient" && /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
         /* @__PURE__ */ a("label", { htmlFor: "legend-gradient-property", className: "mapui:text-sm mapui:text-gray-700", children: "Gradient Label" }),
         /* @__PURE__ */ a(
           "input",
@@ -2091,13 +2092,13 @@ function Xa({ value: e, onChange: i, styles: t }) {
             type: "text",
             id: "legend-gradient-property",
             value: e.gradientProperty ?? "",
-            onChange: (c) => i({ ...e, gradientProperty: c.target.value || void 0 }),
+            onChange: (u) => i({ ...e, gradientProperty: u.target.value || void 0 }),
             placeholder: "e.g. Population",
             className: Fe
           }
         )
       ] }),
-      /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: r.map((c, o) => /* @__PURE__ */ l(
+      /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: p.map((u, c) => /* @__PURE__ */ l(
         "li",
         {
           className: "mapui:rounded mapui:border mapui:border-gray-200 mapui:p-3",
@@ -2105,48 +2106,48 @@ function Xa({ value: e, onChange: i, styles: t }) {
             /* @__PURE__ */ l("div", { className: "mapui:mb-2 mapui:flex mapui:items-center mapui:justify-between", children: [
               /* @__PURE__ */ l("span", { className: "mapui:text-xs mapui:font-medium mapui:text-gray-600", children: [
                 "Entry ",
-                o + 1
+                c + 1
               ] }),
               /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
-                  onClick: () => s(o),
+                  onClick: () => h(c),
                   className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-0.5 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
                   children: "Remove"
                 }
               )
             ] }),
             /* @__PURE__ */ a(
-              Ya,
+              Xa,
               {
-                value: c,
-                onChange: (h) => x(o, h)
+                value: u,
+                onChange: (w) => s(c, w)
               }
             )
           ]
         },
-        o
+        c
       )) }),
       /* @__PURE__ */ l("div", { className: "mapui:flex mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "button",
           {
             type: "button",
-            onClick: n,
+            onClick: f,
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-dashed mapui:border-gray-300 mapui:px-3 mapui:py-2 mapui:text-sm mapui:text-gray-600 hover:mapui:border-blue-400 hover:mapui:text-blue-600",
             children: "+ Add Entry"
           }
         ),
-        u && u.entries.length > 0 && /* @__PURE__ */ l(
+        n && n.entries.length > 0 && /* @__PURE__ */ l(
           "button",
           {
             type: "button",
-            onClick: d,
+            onClick: x,
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-blue-300 mapui:bg-white mapui:px-3 mapui:py-2 mapui:text-sm mapui:font-medium mapui:text-blue-700 hover:mapui:bg-blue-50",
             children: [
               "Populate from Style (",
-              u.entries.length,
+              n.entries.length,
               " entries)"
             ]
           }
@@ -2161,34 +2162,34 @@ function Pe({
   placeholder: t,
   className: r
 }) {
-  const [p, u] = T(() => (e == null ? void 0 : e.join(", ")) ?? "");
+  const [p, m] = T(() => (e == null ? void 0 : e.join(", ")) ?? "");
   return q(() => {
-    u((e == null ? void 0 : e.join(", ")) ?? "");
+    m((e == null ? void 0 : e.join(", ")) ?? "");
   }, [e == null ? void 0 : e.join(",")]), /* @__PURE__ */ a(
     "input",
     {
       type: "text",
       value: p,
-      onChange: (x) => u(x.target.value),
+      onChange: (f) => m(f.target.value),
       onBlur: () => {
-        const x = p.trim(), s = x ? x.split(",").map((g) => g.trim()).filter(Boolean) : void 0;
-        i(s), u((s == null ? void 0 : s.join(", ")) ?? "");
+        const f = p.trim(), s = f ? f.split(",").map((h) => h.trim()).filter(Boolean) : void 0;
+        i(s), m((s == null ? void 0 : s.join(", ")) ?? "");
       },
       placeholder: t,
       className: r
     }
   );
 }
-const $ = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500", Za = {
+const $ = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500", Ja = {
   text: { type: "text", property: "", label: "", autocomplete: !1 },
   number: { type: "number", property: "", label: "", inputMode: "input", operator: "eq" },
   datetime: { type: "datetime", property: "", label: "", range: !1 },
   select: { type: "select", property: "", label: "" }
 };
-function Ja({ value: e, onChange: i, availableProperties: t }) {
+function Ka({ value: e, onChange: i, availableProperties: t }) {
   const r = (n) => {
-    i({ ...Za[n], property: e.property, label: e.label });
-  }, p = (n) => i({ ...e, ...n }), u = t && t.length > 0;
+    i({ ...Ja[n], property: e.property, label: e.label });
+  }, p = (n) => i({ ...e, ...n }), m = t && t.length > 0;
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ a(S, { label: "Field Type", children: /* @__PURE__ */ l(
       "select",
@@ -2204,7 +2205,7 @@ function Ja({ value: e, onChange: i, availableProperties: t }) {
         ]
       }
     ) }),
-    /* @__PURE__ */ a(S, { label: "Property", required: !0, children: u ? /* @__PURE__ */ l(
+    /* @__PURE__ */ a(S, { label: "Property", required: !0, children: m ? /* @__PURE__ */ l(
       "select",
       {
         value: e.property,
@@ -2449,40 +2450,40 @@ function Ja({ value: e, onChange: i, availableProperties: t }) {
     ] })
   ] });
 }
-const Ka = () => ({
+const Qa = () => ({
   type: "text",
   property: "",
   label: "",
   autocomplete: !1
 });
-function Qa({ fields: e, onChange: i, availableProperties: t }) {
-  const [r, p] = T(null), u = () => {
-    const d = [...e, Ka()];
+function ei({ fields: e, onChange: i, availableProperties: t }) {
+  const [r, p] = T(null), m = () => {
+    const d = [...e, Qa()];
     i(d), p(d.length - 1);
-  }, n = (d, w) => {
-    i(e.map((c, o) => o === d ? w : c));
-  }, x = (d) => {
-    i(e.filter((w, c) => c !== d)), p(null);
+  }, n = (d, x) => {
+    i(e.map((v, u) => u === d ? x : v));
+  }, f = (d) => {
+    i(e.filter((x, v) => v !== d)), p(null);
   }, s = (d) => {
     if (d === 0) return;
-    const w = [...e];
-    [w[d - 1], w[d]] = [w[d], w[d - 1]], i(w), p(d - 1);
-  }, g = (d) => {
+    const x = [...e];
+    [x[d - 1], x[d]] = [x[d], x[d - 1]], i(x), p(d - 1);
+  }, h = (d) => {
     if (d === e.length - 1) return;
-    const w = [...e];
-    [w[d], w[d + 1]] = [w[d + 1], w[d]], i(w), p(d + 1);
+    const x = [...e];
+    [x[d], x[d + 1]] = [x[d + 1], x[d]], i(x), p(d + 1);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
     e.length === 0 && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No search fields configured." }),
-    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((d, w) => /* @__PURE__ */ l("li", { className: "mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white", children: [
+    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((d, x) => /* @__PURE__ */ l("li", { className: "mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white", children: [
       /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-1 mapui:px-3 mapui:py-2", children: [
         /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-0.5", children: [
           /* @__PURE__ */ a(
             "button",
             {
               type: "button",
-              onClick: () => s(w),
-              disabled: w === 0,
+              onClick: () => s(x),
+              disabled: x === 0,
               "aria-label": "Move up",
               className: "mapui:cursor-pointer mapui:rounded mapui:border-none mapui:bg-transparent mapui:px-1 mapui:text-xs mapui:text-gray-400 hover:mapui:text-gray-600 disabled:mapui:opacity-30",
               children: "▲"
@@ -2492,8 +2493,8 @@ function Qa({ fields: e, onChange: i, availableProperties: t }) {
             "button",
             {
               type: "button",
-              onClick: () => g(w),
-              disabled: w === e.length - 1,
+              onClick: () => h(x),
+              disabled: x === e.length - 1,
               "aria-label": "Move down",
               className: "mapui:cursor-pointer mapui:rounded mapui:border-none mapui:bg-transparent mapui:px-1 mapui:text-xs mapui:text-gray-400 hover:mapui:text-gray-600 disabled:mapui:opacity-30",
               children: "▼"
@@ -2504,7 +2505,7 @@ function Qa({ fields: e, onChange: i, availableProperties: t }) {
           "button",
           {
             type: "button",
-            onClick: () => p(r === w ? null : w),
+            onClick: () => p(r === x ? null : x),
             className: "mapui:flex-1 mapui:cursor-pointer mapui:border-none mapui:bg-transparent mapui:text-left mapui:text-sm mapui:font-medium mapui:text-gray-800",
             children: [
               /* @__PURE__ */ a("span", { className: "mapui:mr-1 mapui:rounded mapui:bg-gray-100 mapui:px-1 mapui:py-0.5 mapui:text-xs mapui:font-mono mapui:text-gray-500", children: d.type }),
@@ -2516,41 +2517,41 @@ function Qa({ fields: e, onChange: i, availableProperties: t }) {
           "button",
           {
             type: "button",
-            onClick: () => x(w),
+            onClick: () => f(x),
             "aria-label": "Remove field",
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-0.5 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
             children: "Remove"
           }
         )
       ] }),
-      r === w && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(
-        Ja,
+      r === x && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(
+        Ka,
         {
           value: d,
-          onChange: (c) => n(w, c),
+          onChange: (v) => n(x, v),
           availableProperties: t
         }
       ) })
-    ] }, w)) }),
+    ] }, x)) }),
     /* @__PURE__ */ a(
       "button",
       {
         type: "button",
-        onClick: u,
+        onClick: m,
         className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-dashed mapui:border-gray-300 mapui:px-3 mapui:py-2 mapui:text-sm mapui:text-gray-600 hover:mapui:border-blue-400 hover:mapui:text-blue-600",
         children: "+ Add Search Field"
       }
     )
   ] });
 }
-function ei(e) {
+function ai(e) {
   return Object.entries(e).map(([i, t]) => ({
     key: i,
     label: t.label ?? "",
     visible: t.visible ?? !0
   }));
 }
-function ai(e) {
+function ii(e) {
   const i = {};
   for (const t of e)
     i[t.key] = {
@@ -2560,32 +2561,32 @@ function ai(e) {
   return i;
 }
 const se = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
-function ii({ value: e, onChange: i, availableProperties: t }) {
-  const r = ei(e), p = t && t.length > 0, u = (o) => i(ai(o)), n = () => {
-    u([...r, { key: "", label: "", visible: !0 }]);
-  }, x = (o) => {
-    u(r.filter((h, N) => N !== o));
-  }, s = (o, h) => {
-    u(r.map((N, v) => v === o ? { ...N, ...h } : N));
-  }, g = (o, h) => {
-    const N = t == null ? void 0 : t.find((C) => C.name === h), v = (N == null ? void 0 : N.title) ?? r[o].label;
-    u(r.map((C, E) => E === o ? { ...C, key: h, label: v } : C));
-  }, d = (o) => {
-    if (o === 0) return;
-    const h = [...r];
-    [h[o - 1], h[o]] = [h[o], h[o - 1]], u(h);
-  }, w = (o) => {
-    if (o === r.length - 1) return;
-    const h = [...r];
-    [h[o], h[o + 1]] = [h[o + 1], h[o]], u(h);
-  }, c = () => {
+function ti({ value: e, onChange: i, availableProperties: t }) {
+  const r = ai(e), p = t && t.length > 0, m = (u) => i(ii(u)), n = () => {
+    m([...r, { key: "", label: "", visible: !0 }]);
+  }, f = (u) => {
+    m(r.filter((c, w) => w !== u));
+  }, s = (u, c) => {
+    m(r.map((w, N) => N === u ? { ...w, ...c } : w));
+  }, h = (u, c) => {
+    const w = t == null ? void 0 : t.find((C) => C.name === c), N = (w == null ? void 0 : w.title) ?? r[u].label;
+    m(r.map((C, E) => E === u ? { ...C, key: c, label: N } : C));
+  }, d = (u) => {
+    if (u === 0) return;
+    const c = [...r];
+    [c[u - 1], c[u]] = [c[u], c[u - 1]], m(c);
+  }, x = (u) => {
+    if (u === r.length - 1) return;
+    const c = [...r];
+    [c[u], c[u + 1]] = [c[u + 1], c[u]], m(c);
+  }, v = () => {
     if (!t) return;
-    const o = t.map((h) => ({
-      key: h.name,
-      label: h.title ?? "",
+    const u = t.map((c) => ({
+      key: c.name,
+      label: c.title ?? "",
       visible: !0
     }));
-    u(o);
+    m(u);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
     r.length === 0 ? /* @__PURE__ */ l(z, { children: [
@@ -2594,7 +2595,7 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
         "button",
         {
           type: "button",
-          onClick: c,
+          onClick: v,
           className: "mapui:cursor-pointer mapui:self-start mapui:rounded mapui:border mapui:border-blue-300 mapui:bg-blue-50 mapui:px-3 mapui:py-1.5 mapui:text-sm mapui:text-blue-700 hover:mapui:bg-blue-100",
           children: "Populate from API metadata"
         }
@@ -2605,14 +2606,14 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
         /* @__PURE__ */ a(S, { label: "Display Label", children: /* @__PURE__ */ a("span", {}) }),
         /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:font-medium mapui:text-gray-600", children: "Visible" })
       ] }),
-      /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-1.5 mapui:p-0", children: r.map((o, h) => /* @__PURE__ */ l("li", { className: "mapui:flex mapui:items-center mapui:gap-1 mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:px-2 mapui:py-1.5", children: [
+      /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-1.5 mapui:p-0", children: r.map((u, c) => /* @__PURE__ */ l("li", { className: "mapui:flex mapui:items-center mapui:gap-1 mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:px-2 mapui:py-1.5", children: [
         /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-0.5", children: [
           /* @__PURE__ */ a(
             "button",
             {
               type: "button",
-              onClick: () => d(h),
-              disabled: h === 0,
+              onClick: () => d(c),
+              disabled: c === 0,
               "aria-label": "Move up",
               className: "mapui:cursor-pointer mapui:rounded mapui:border-none mapui:bg-transparent mapui:px-1 mapui:text-xs mapui:text-gray-400 hover:mapui:text-gray-600 disabled:mapui:opacity-30",
               children: "▲"
@@ -2622,8 +2623,8 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
             "button",
             {
               type: "button",
-              onClick: () => w(h),
-              disabled: h === r.length - 1,
+              onClick: () => x(c),
+              disabled: c === r.length - 1,
               "aria-label": "Move down",
               className: "mapui:cursor-pointer mapui:rounded mapui:border-none mapui:bg-transparent mapui:px-1 mapui:text-xs mapui:text-gray-400 hover:mapui:text-gray-600 disabled:mapui:opacity-30",
               children: "▼"
@@ -2634,21 +2635,21 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
           p ? /* @__PURE__ */ l(
             "select",
             {
-              value: o.key,
-              onChange: (N) => g(h, N.target.value),
+              value: u.key,
+              onChange: (w) => h(c, w.target.value),
               "aria-label": "Property key",
               className: se,
               children: [
                 /* @__PURE__ */ a("option", { value: "", children: "Select a property…" }),
-                t.map((N) => /* @__PURE__ */ a("option", { value: N.name, children: N.title ?? N.name }, N.name))
+                t.map((w) => /* @__PURE__ */ a("option", { value: w.name, children: w.title ?? w.name }, w.name))
               ]
             }
           ) : /* @__PURE__ */ a(
             "input",
             {
               type: "text",
-              value: o.key,
-              onChange: (N) => s(h, { key: N.target.value }),
+              value: u.key,
+              onChange: (w) => s(c, { key: w.target.value }),
               placeholder: "property_name",
               "aria-label": "Property key",
               className: se
@@ -2658,8 +2659,8 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
             "input",
             {
               type: "text",
-              value: o.label,
-              onChange: (N) => s(h, { label: N.target.value }),
+              value: u.label,
+              onChange: (w) => s(c, { label: w.target.value }),
               placeholder: "Friendly name",
               "aria-label": "Display label",
               className: se
@@ -2669,8 +2670,8 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
             "input",
             {
               type: "checkbox",
-              checked: o.visible,
-              onChange: (N) => s(h, { visible: N.target.checked }),
+              checked: u.visible,
+              onChange: (w) => s(c, { visible: w.target.checked }),
               "aria-label": "Visible",
               className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
             }
@@ -2679,14 +2680,14 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
             "button",
             {
               type: "button",
-              onClick: () => x(h),
+              onClick: () => f(c),
               "aria-label": "Remove property",
               className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-0.5 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
               children: "Remove"
             }
           )
         ] })
-      ] }, h)) })
+      ] }, c)) })
     ] }),
     /* @__PURE__ */ a(
       "button",
@@ -2700,7 +2701,7 @@ function ii({ value: e, onChange: i, availableProperties: t }) {
   ] });
 }
 const Ve = /geojson\.org\/schema\/(\w+)\.json/;
-function ti(e) {
+function ri(e) {
   return !!e.$ref && Ve.test(e.$ref);
 }
 function He(e) {
@@ -2715,7 +2716,7 @@ function fe(e) {
   const i = e.toLowerCase();
   return i.includes("polygon") ? ["fill", "line"] : i.includes("linestring") ? ["line"] : i.includes("point") ? ["circle", "symbol"] : [];
 }
-function ri(e) {
+function li(e) {
   for (const i of Object.values(e.properties))
     if (i.$ref) {
       const t = He(i.$ref);
@@ -2731,8 +2732,8 @@ function Xe(e) {
     }
   return [];
 }
-function li(e) {
-  return Object.entries(e.properties).filter(([, i]) => !ti(i)).map(([i, t]) => ({
+function pi(e) {
+  return Object.entries(e.properties).filter(([, i]) => !ri(i)).map(([i, t]) => ({
     name: i,
     title: t.title,
     type: t.type,
@@ -2749,11 +2750,11 @@ function Ze(e) {
     (t = r.geometry) != null && t.type && i.add(r.geometry.type);
   return Array.from(i);
 }
-function pi(e) {
+function ni(e) {
   const i = /* @__PURE__ */ new Set();
   for (const p of e) {
-    const u = p.toLowerCase();
-    u.includes("polygon") ? i.add("polygon") : u.includes("linestring") ? i.add("line") : u.includes("point") && i.add("point");
+    const m = p.toLowerCase();
+    m.includes("polygon") ? i.add("polygon") : m.includes("linestring") ? i.add("line") : m.includes("point") && i.add("point");
   }
   const t = i.size > 1, r = [];
   return i.has("polygon") && r.push({
@@ -2770,21 +2771,21 @@ function pi(e) {
     ...t ? { geometryFilter: ["Point", "MultiPoint"] } : {}
   }), r;
 }
-async function Si(e, i) {
+async function Ti(e, i) {
   var t, r;
   try {
-    const p = await qe(e, i), u = ri(p);
-    if (u) return u;
+    const p = await qe(e, i), m = li(p);
+    if (m) return m;
   } catch {
   }
   try {
-    const u = (r = (t = (await ye(e, i, { limit: 1 })).features[0]) == null ? void 0 : t.geometry) == null ? void 0 : r.type;
-    if (typeof u == "string") return Ye(u);
+    const m = (r = (t = (await ye(e, i, { limit: 1 })).features[0]) == null ? void 0 : t.geometry) == null ? void 0 : r.type;
+    if (typeof m == "string") return Ye(m);
   } catch {
   }
   return null;
 }
-async function Ti(e, i) {
+async function Di(e, i) {
   try {
     const t = await qe(e, i), r = Xe(t);
     if (r.length > 0) return r;
@@ -2792,79 +2793,79 @@ async function Ti(e, i) {
   }
   try {
     const t = await ye(e, i, { limit: 20 }), r = Ze(t.features), p = /* @__PURE__ */ new Set();
-    for (const u of r)
-      for (const n of fe(u))
+    for (const m of r)
+      for (const n of fe(m))
         p.add(n);
     return Array.from(p);
   } catch {
   }
   return [];
 }
-function Di(e) {
+function Li(e) {
   return e.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/\b\w/g, (i) => i.toUpperCase());
 }
-function ni(e, i, t) {
+function ui(e, i, t) {
   const r = [...e ?? []];
   return r[i] = t, r;
 }
-function ui(e, i) {
+function oi(e, i) {
   return (e ?? []).filter((t, r) => r !== i);
 }
 const _ = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
 function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
   var O;
-  const p = (m) => i({ ...e, ...m }), u = H(e);
-  u.current = e;
+  const p = (o) => i({ ...e, ...o }), m = H(e);
+  m.current = e;
   const n = H(i);
   n.current = i;
-  const x = t.find((m) => m.id === e.sourceId), s = (x == null ? void 0 : x.url) ?? null, g = e.collection || null, { collections: d, loading: w } = Ge(s), { queryables: c, loading: o } = oa(s, g), h = c ? li(c) : [], [N, v] = T([]), [C, E] = T([]);
+  const f = t.find((o) => o.id === e.sourceId), s = (f == null ? void 0 : f.url) ?? null, h = e.collection || null, { collections: d, loading: x } = Ge(s), { queryables: v, loading: u } = ma(s, h), c = v ? pi(v) : [], [w, N] = T([]), [C, E] = T([]);
   return q(() => {
-    if (!c) {
-      v([]), E([]);
+    if (!v) {
+      N([]), E([]);
       return;
     }
-    const m = (b, M) => {
-      var y;
-      const P = pi(b);
-      v(P), E(M), P.length > 0 && !((y = u.current.styles) != null && y.length) && n.current({ ...u.current, styles: P });
-    }, L = Xe(c);
-    if (L.length > 0) {
-      const b = [];
-      for (const M of L)
-        M === "fill" ? b.push("Polygon") : M === "line" ? b.push("LineString") : (M === "circle" || M === "symbol") && b.push("Point");
-      m(b, L);
+    const o = (g, M) => {
+      var b;
+      const P = ni(g);
+      N(P), E(M), P.length > 0 && !((b = m.current.styles) != null && b.length) && n.current({ ...m.current, styles: P });
+    }, D = Xe(v);
+    if (D.length > 0) {
+      const g = [];
+      for (const M of D)
+        M === "fill" ? g.push("Polygon") : M === "line" ? g.push("LineString") : (M === "circle" || M === "symbol") && g.push("Point");
+      o(g, D);
       return;
     }
-    if (!s || !g) {
-      v([]), E([]);
+    if (!s || !h) {
+      N([]), E([]);
       return;
     }
     let F = !1;
-    return ye(s, g, { limit: 20 }).then((b) => {
+    return ye(s, h, { limit: 20 }).then((g) => {
       if (F) return;
-      const M = Ze(b.features);
+      const M = Ze(g.features);
       if (M.length > 0) {
         const P = /* @__PURE__ */ new Set();
-        for (const y of M)
-          for (const k of fe(y)) P.add(k);
-        m(M, Array.from(P));
+        for (const b of M)
+          for (const k of fe(b)) P.add(k);
+        o(M, Array.from(P));
       } else
-        v([]), E([]);
+        N([]), E([]);
     }).catch(() => {
-      F || (v([]), E([]));
+      F || (N([]), E([]));
     }), () => {
       F = !0;
     };
-  }, [c, s, g]), q(() => {
-    v([]), E([]);
-  }, [s, g]), /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
+  }, [v, s, h]), q(() => {
+    N([]), E([]);
+  }, [s, h]), /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:grid mapui:grid-cols-2 mapui:gap-3", children: [
       /* @__PURE__ */ a(S, { label: "Layer ID", required: !0, children: /* @__PURE__ */ a(
         "input",
         {
           type: "text",
           value: e.id,
-          onChange: (m) => p({ id: m.target.value }),
+          onChange: (o) => p({ id: o.target.value }),
           placeholder: "my-layer",
           className: _
         }
@@ -2874,7 +2875,7 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
         {
           type: "text",
           value: e.label,
-          onChange: (m) => p({ label: m.target.value }),
+          onChange: (o) => p({ label: o.target.value }),
           placeholder: "My Layer",
           className: _
         }
@@ -2884,11 +2885,11 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
       "select",
       {
         value: e.sourceId,
-        onChange: (m) => p({ sourceId: m.target.value }),
+        onChange: (o) => p({ sourceId: o.target.value }),
         className: _,
         children: [
           /* @__PURE__ */ a("option", { value: "", children: "Select a source…" }),
-          t.map((m) => /* @__PURE__ */ a("option", { value: m.id, children: m.label ?? m.id }, m.id))
+          t.map((o) => /* @__PURE__ */ a("option", { value: o.id, children: o.label ?? o.id }, o.id))
         ]
       }
     ) }),
@@ -2897,11 +2898,11 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
         "select",
         {
           value: e.collection,
-          onChange: (m) => p({ collection: m.target.value }),
+          onChange: (o) => p({ collection: o.target.value }),
           className: _,
           children: [
             /* @__PURE__ */ a("option", { value: "", children: "Select a collection…" }),
-            d.map((m) => /* @__PURE__ */ a("option", { value: m.id, children: m.title ?? m.id }, m.id))
+            d.map((o) => /* @__PURE__ */ a("option", { value: o.id, children: o.title ?? o.id }, o.id))
           ]
         }
       ) : /* @__PURE__ */ a(
@@ -2909,27 +2910,27 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
         {
           type: "text",
           value: e.collection,
-          onChange: (m) => p({ collection: m.target.value }),
-          placeholder: w ? "Loading collections…" : "collection-id",
+          onChange: (o) => p({ collection: o.target.value }),
+          placeholder: x ? "Loading collections…" : "collection-id",
           className: _
         }
       ),
-      o && /* @__PURE__ */ a("span", { className: "mapui:mt-0.5 mapui:block mapui:text-xs mapui:text-gray-400", children: "Loading properties…" })
+      u && /* @__PURE__ */ a("span", { className: "mapui:mt-0.5 mapui:block mapui:text-xs mapui:text-gray-400", children: "Loading properties…" })
     ] }),
-    /* @__PURE__ */ a(S, { label: "Data Mode", children: /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-4", children: ["vector-tiles", "geojson"].map((m) => /* @__PURE__ */ l("label", { className: "mapui:flex mapui:cursor-pointer mapui:items-center mapui:gap-1.5", children: [
+    /* @__PURE__ */ a(S, { label: "Data Mode", children: /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-4", children: ["vector-tiles", "geojson"].map((o) => /* @__PURE__ */ l("label", { className: "mapui:flex mapui:cursor-pointer mapui:items-center mapui:gap-1.5", children: [
       /* @__PURE__ */ a(
         "input",
         {
           type: "radio",
           name: `data-mode-${e.id}`,
-          value: m,
-          checked: e.dataMode === m,
-          onChange: () => p({ dataMode: m }),
+          value: o,
+          checked: e.dataMode === o,
+          onChange: () => p({ dataMode: o }),
           className: "mapui:accent-blue-600"
         }
       ),
-      /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:text-gray-700", children: m })
-    ] }, m)) }) }),
+      /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:text-gray-700", children: o })
+    ] }, o)) }) }),
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
       /* @__PURE__ */ a(
         "input",
@@ -2937,7 +2938,7 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
           type: "checkbox",
           id: "layer-visible",
           checked: e.visible,
-          onChange: (m) => p({ visible: m.target.checked }),
+          onChange: (o) => p({ visible: o.target.checked }),
           className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
         }
       ),
@@ -2950,7 +2951,7 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
           type: "checkbox",
           id: `layer-tooltip-${e.id}`,
           checked: e.showTooltip ?? !0,
-          onChange: (m) => p({ showTooltip: m.target.checked }),
+          onChange: (o) => p({ showTooltip: o.target.checked }),
           className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
         }
       ),
@@ -2963,7 +2964,7 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
           type: "checkbox",
           id: `layer-detail-${e.id}`,
           checked: e.showDetailPanel ?? !0,
-          onChange: (m) => p({ showDetailPanel: m.target.checked }),
+          onChange: (o) => p({ showDetailPanel: o.target.checked }),
           className: "mapui:h-4 mapui:w-4 mapui:accent-blue-600"
         }
       ),
@@ -2978,9 +2979,9 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
           max: 24,
           step: 1,
           value: e.minZoom ?? "",
-          onChange: (m) => {
-            const L = m.target.valueAsNumber;
-            p({ minZoom: isNaN(L) ? void 0 : L });
+          onChange: (o) => {
+            const D = o.target.valueAsNumber;
+            p({ minZoom: isNaN(D) ? void 0 : D });
           },
           placeholder: "0",
           className: _
@@ -2994,9 +2995,9 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
           max: 24,
           step: 1,
           value: e.maxZoom ?? "",
-          onChange: (m) => {
-            const L = m.target.valueAsNumber;
-            p({ maxZoom: isNaN(L) ? void 0 : L });
+          onChange: (o) => {
+            const D = o.target.valueAsNumber;
+            p({ maxZoom: isNaN(D) ? void 0 : D });
           },
           placeholder: "24",
           className: _
@@ -3004,38 +3005,38 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
       ) })
     ] }),
     /* @__PURE__ */ a(X, { title: "Style", children: /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-4", children: [
-      (e.styles ?? [ge]).map((m, L) => {
+      (e.styles ?? [ge]).map((o, D) => {
         var F;
         return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-2", children: [
-          m.geometryFilter && m.geometryFilter.length > 0 && /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-wrap mapui:gap-1", children: m.geometryFilter.map((b) => /* @__PURE__ */ a(
+          o.geometryFilter && o.geometryFilter.length > 0 && /* @__PURE__ */ a("div", { className: "mapui:flex mapui:flex-wrap mapui:gap-1", children: o.geometryFilter.map((g) => /* @__PURE__ */ a(
             "span",
             {
               className: "mapui:rounded mapui:bg-indigo-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-indigo-700",
-              children: b
+              children: g
             },
-            b
+            g
           )) }),
           /* @__PURE__ */ a(
-            Ha,
+            Ya,
             {
-              value: m,
-              onChange: (b) => p({ styles: ni(e.styles, L, b) }),
+              value: o,
+              onChange: (g) => p({ styles: ui(e.styles, D, g) }),
               suggestedTypes: C,
               availableIcons: r,
-              availableProperties: h,
-              onFetchDistinctValues: s && g ? (b) => ma(s, g, b, { fetchAll: !0 }) : void 0
+              availableProperties: c,
+              onFetchDistinctValues: s && h ? (g) => sa(s, h, g, { fetchAll: !0 }) : void 0
             }
           ),
           (((F = e.styles) == null ? void 0 : F.length) ?? 0) > 0 && /* @__PURE__ */ a(
             "button",
             {
               type: "button",
-              onClick: () => p({ styles: ui(e.styles, L) }),
+              onClick: () => p({ styles: oi(e.styles, D) }),
               className: "mapui:cursor-pointer mapui:self-start mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
               children: "Remove style"
             }
           )
-        ] }, L);
+        ] }, D);
       }),
       /* @__PURE__ */ a(
         "button",
@@ -3048,27 +3049,28 @@ function Oe({ value: e, onChange: i, availableSources: t, availableIcons: r }) {
       )
     ] }) }),
     /* @__PURE__ */ a(X, { title: "Legend", children: /* @__PURE__ */ a(
-      Xa,
+      Za,
       {
         value: e.legend,
-        onChange: (m) => p({ legend: m }),
-        styles: e.styles
+        onChange: (o) => p({ legend: o }),
+        styles: e.styles,
+        layerLabel: e.label
       }
     ) }),
     /* @__PURE__ */ a(X, { title: "Search Fields", children: /* @__PURE__ */ a(
-      Qa,
+      ei,
       {
         fields: ((O = e.search) == null ? void 0 : O.fields) ?? [],
-        onChange: (m) => p({ search: m.length > 0 ? { fields: m } : void 0 }),
-        availableProperties: h
+        onChange: (o) => p({ search: o.length > 0 ? { fields: o } : void 0 }),
+        availableProperties: c
       }
     ) }),
     /* @__PURE__ */ a(X, { title: "Property Display", children: /* @__PURE__ */ a(
-      ii,
+      ti,
       {
         value: e.propertyDisplay ?? {},
-        onChange: (m) => p({ propertyDisplay: Object.keys(m).length > 0 ? m : void 0 }),
-        availableProperties: h
+        onChange: (o) => p({ propertyDisplay: Object.keys(o).length > 0 ? o : void 0 }),
+        availableProperties: c
       }
     ) })
   ] });
@@ -3081,37 +3083,37 @@ const ce = () => ({
   visible: !0,
   dataMode: "vector-tiles"
 });
-function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r }) {
-  const [p, u] = T(null), [n, x] = T(!1), [s, g] = T(ce()), [d, w] = T(null), [c, o] = T(null), [h, N] = T(null), v = () => {
-    i([...e, s]), x(!1), g(ce());
-  }, C = (y) => {
-    i(e.map((k) => k.id === p ? y : k));
-  }, E = (y) => {
-    i(e.filter((k) => k.id !== y)), w(null), p === y && u(null);
-  }, O = (y) => {
-    if (y === 0) return;
+function Ai({ layers: e, onChange: i, availableSources: t, availableIcons: r }) {
+  const [p, m] = T(null), [n, f] = T(!1), [s, h] = T(ce()), [d, x] = T(null), [v, u] = T(null), [c, w] = T(null), N = () => {
+    i([...e, s]), f(!1), h(ce());
+  }, C = (b) => {
+    i(e.map((k) => k.id === p ? b : k));
+  }, E = (b) => {
+    i(e.filter((k) => k.id !== b)), x(null), p === b && m(null);
+  }, O = (b) => {
+    if (b === 0) return;
     const k = [...e];
-    [k[y - 1], k[y]] = [k[y], k[y - 1]], i(k);
-  }, m = (y) => {
-    if (y === e.length - 1) return;
+    [k[b - 1], k[b]] = [k[b], k[b - 1]], i(k);
+  }, o = (b) => {
+    if (b === e.length - 1) return;
     const k = [...e];
-    [k[y], k[y + 1]] = [k[y + 1], k[y]], i(k);
-  }, L = (y, k) => {
-    o(k), y.dataTransfer.effectAllowed = "move", y.dataTransfer.setData("text/plain", k);
-  }, F = (y, k) => {
-    y.preventDefault(), y.dataTransfer.dropEffect = "move", N(k);
-  }, b = () => {
-    N(null);
-  }, M = (y, k) => {
-    y.preventDefault(), N(null);
-    const j = c;
-    if (o(null), !j || j === k) return;
+    [k[b], k[b + 1]] = [k[b + 1], k[b]], i(k);
+  }, D = (b, k) => {
+    u(k), b.dataTransfer.effectAllowed = "move", b.dataTransfer.setData("text/plain", k);
+  }, F = (b, k) => {
+    b.preventDefault(), b.dataTransfer.dropEffect = "move", w(k);
+  }, g = () => {
+    w(null);
+  }, M = (b, k) => {
+    b.preventDefault(), w(null);
+    const j = v;
+    if (u(null), !j || j === k) return;
     const R = e.findIndex((G) => G.id === j), W = e.findIndex((G) => G.id === k);
     if (R === -1 || W === -1) return;
     const U = [...e];
     U.splice(R, 1), U.splice(W, 0, e[R]), i(U);
   }, P = () => {
-    o(null), N(null);
+    u(null), w(null);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between", children: [
@@ -3121,7 +3123,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
         {
           type: "button",
           onClick: () => {
-            x(!0), g(ce());
+            f(!0), h(ce());
           },
           className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700",
           children: "+ Add Layer"
@@ -3129,17 +3131,17 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
       )
     ] }),
     e.length === 0 && !n && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No layers configured." }),
-    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((y, k) => {
+    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((b, k) => {
       var U, G, J, K, Q;
-      const j = c === y.id, R = h === y.id, W = p === y.id;
+      const j = v === b.id, R = c === b.id, W = p === b.id;
       return /* @__PURE__ */ l(
         "li",
         {
           draggable: !W,
-          onDragStart: W ? void 0 : (f) => L(f, y.id),
-          onDragOver: (f) => F(f, y.id),
-          onDragLeave: b,
-          onDrop: (f) => M(f, y.id),
+          onDragStart: W ? void 0 : (y) => D(y, b.id),
+          onDragOver: (y) => F(y, b.id),
+          onDragLeave: g,
+          onDrop: (y) => M(y, b.id),
           onDragEnd: P,
           className: [
             "mapui:rounded-lg mapui:border mapui:bg-white mapui:transition-colors",
@@ -3165,7 +3167,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
                     "button",
                     {
                       type: "button",
-                      onClick: () => m(k),
+                      onClick: () => o(k),
                       disabled: k === e.length - 1,
                       "aria-label": "Move layer down",
                       className: "mapui:cursor-pointer mapui:rounded mapui:border-none mapui:bg-transparent mapui:px-1 mapui:text-xs mapui:text-gray-400 hover:mapui:text-gray-600 disabled:mapui:opacity-30",
@@ -3182,24 +3184,24 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
                   }
                 ),
                 /* @__PURE__ */ l("div", { className: "mapui:flex mapui:min-w-0 mapui:flex-col mapui:gap-0.5", children: [
-                  /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: y.label || y.id }),
-                  /* @__PURE__ */ a("span", { className: "mapui:font-mono mapui:text-xs mapui:text-gray-500", children: y.collection }),
+                  /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: b.label || b.id }),
+                  /* @__PURE__ */ a("span", { className: "mapui:font-mono mapui:text-xs mapui:text-gray-500", children: b.collection }),
                   /* @__PURE__ */ l("div", { className: "mapui:mt-1 mapui:flex mapui:flex-wrap mapui:gap-1", children: [
-                    /* @__PURE__ */ a("span", { className: "mapui:rounded mapui:bg-slate-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-slate-700", children: y.dataMode }),
-                    (((U = y.styles) == null ? void 0 : U.length) ?? 0) > 0 && /* @__PURE__ */ a("span", { className: "mapui:rounded mapui:bg-purple-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-purple-700", children: y.styles.map((f) => f.type).join(" · ") }),
-                    y.visible === !1 && /* @__PURE__ */ a("span", { className: "mapui:rounded mapui:bg-amber-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-amber-700", children: "hidden" }),
-                    (((J = (G = y.search) == null ? void 0 : G.fields) == null ? void 0 : J.length) ?? 0) > 0 && /* @__PURE__ */ l("span", { className: "mapui:rounded mapui:bg-blue-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-blue-700", children: [
-                      y.search.fields.length,
+                    /* @__PURE__ */ a("span", { className: "mapui:rounded mapui:bg-slate-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-slate-700", children: b.dataMode }),
+                    (((U = b.styles) == null ? void 0 : U.length) ?? 0) > 0 && /* @__PURE__ */ a("span", { className: "mapui:rounded mapui:bg-purple-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-purple-700", children: b.styles.map((y) => y.type).join(" · ") }),
+                    b.visible === !1 && /* @__PURE__ */ a("span", { className: "mapui:rounded mapui:bg-amber-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-amber-700", children: "hidden" }),
+                    (((J = (G = b.search) == null ? void 0 : G.fields) == null ? void 0 : J.length) ?? 0) > 0 && /* @__PURE__ */ l("span", { className: "mapui:rounded mapui:bg-blue-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-blue-700", children: [
+                      b.search.fields.length,
                       " search fields"
                     ] }),
-                    (y.minZoom != null || y.maxZoom != null) && /* @__PURE__ */ l("span", { className: "mapui:rounded mapui:bg-cyan-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-cyan-700", children: [
+                    (b.minZoom != null || b.maxZoom != null) && /* @__PURE__ */ l("span", { className: "mapui:rounded mapui:bg-cyan-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-cyan-700", children: [
                       "z",
-                      y.minZoom ?? 0,
+                      b.minZoom ?? 0,
                       "–",
-                      y.maxZoom ?? 24
+                      b.maxZoom ?? 24
                     ] }),
-                    (((Q = (K = y.legend) == null ? void 0 : K.entries) == null ? void 0 : Q.length) ?? 0) > 0 && /* @__PURE__ */ l("span", { className: "mapui:rounded mapui:bg-green-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-green-700", children: [
-                      y.legend.entries.length,
+                    (((Q = (K = b.legend) == null ? void 0 : K.entries) == null ? void 0 : Q.length) ?? 0) > 0 && /* @__PURE__ */ l("span", { className: "mapui:rounded mapui:bg-green-100 mapui:px-1.5 mapui:py-0.5 mapui:text-[10px] mapui:font-medium mapui:text-green-700", children: [
+                      b.legend.entries.length,
                       " legend entries"
                     ] })
                   ] })
@@ -3210,26 +3212,26 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
                   "button",
                   {
                     type: "button",
-                    onClick: () => u(p === y.id ? null : y.id),
+                    onClick: () => m(p === b.id ? null : b.id),
                     className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-gray-600 hover:mapui:bg-gray-50",
-                    children: p === y.id ? "Close" : "Edit"
+                    children: p === b.id ? "Close" : "Edit"
                   }
                 ),
                 /* @__PURE__ */ a(
                   "button",
                   {
                     type: "button",
-                    onClick: () => w(y.id),
+                    onClick: () => x(b.id),
                     className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
                     children: "Remove"
                   }
                 )
               ] })
             ] }),
-            p === y.id && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(
+            p === b.id && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(
               Oe,
               {
-                value: y,
+                value: b,
                 onChange: C,
                 availableSources: t,
                 availableIcons: r
@@ -3237,7 +3239,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
             ) })
           ]
         },
-        y.id
+        b.id
       );
     }) }),
     n && /* @__PURE__ */ l("div", { className: "mapui:rounded-lg mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:p-3", children: [
@@ -3246,7 +3248,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
         Oe,
         {
           value: s,
-          onChange: g,
+          onChange: h,
           availableSources: t,
           availableIcons: r
         }
@@ -3256,7 +3258,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
           "button",
           {
             type: "button",
-            onClick: v,
+            onClick: N,
             disabled: !s.id || !s.sourceId || !s.collection,
             className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700 disabled:mapui:cursor-not-allowed disabled:mapui:opacity-50",
             children: "Save"
@@ -3266,7 +3268,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
           "button",
           {
             type: "button",
-            onClick: () => x(!1),
+            onClick: () => f(!1),
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-3 mapui:py-1 mapui:text-xs mapui:text-gray-700 hover:mapui:bg-gray-50",
             children: "Cancel"
           }
@@ -3280,7 +3282,7 @@ function Li({ layers: e, onChange: i, availableSources: t, availableIcons: r })
         title: "Remove Layer",
         description: "Are you sure you want to remove this layer from the configuration?",
         onConfirm: () => d && E(d),
-        onCancel: () => w(null)
+        onCancel: () => x(null)
       }
     )
   ] });
@@ -3342,13 +3344,13 @@ function je({ value: e, onChange: i }) {
   ] });
 }
 const de = () => ({ id: "", label: "", url: "" });
-function Ai({ basemaps: e, onChange: i }) {
-  const [t, r] = T(null), [p, u] = T(!1), [n, x] = T(de()), [s, g] = T(null), d = (o) => {
-    i(e.map((h) => h.id === t ? o : h));
-  }, w = () => {
-    i([...e, n]), u(!1), x(de());
-  }, c = (o) => {
-    i(e.filter((h) => h.id !== o)), g(null);
+function Ei({ basemaps: e, onChange: i }) {
+  const [t, r] = T(null), [p, m] = T(!1), [n, f] = T(de()), [s, h] = T(null), d = (u) => {
+    i(e.map((c) => c.id === t ? u : c));
+  }, x = () => {
+    i([...e, n]), m(!1), f(de());
+  }, v = (u) => {
+    i(e.filter((c) => c.id !== u)), h(null);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between", children: [
@@ -3358,7 +3360,7 @@ function Ai({ basemaps: e, onChange: i }) {
         {
           type: "button",
           onClick: () => {
-            u(!0), x(de());
+            m(!0), f(de());
           },
           className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700",
           children: "+ Add Basemap"
@@ -3366,59 +3368,59 @@ function Ai({ basemaps: e, onChange: i }) {
       )
     ] }),
     e.length === 0 && !p && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No basemaps configured." }),
-    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((o) => /* @__PURE__ */ l(
+    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((u) => /* @__PURE__ */ l(
       "li",
       {
         className: "mapui:rounded-lg mapui:border mapui:border-gray-200 mapui:bg-white",
         children: [
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-3 mapui:px-3 mapui:py-2", children: [
-            o.thumbnail && /* @__PURE__ */ a(
+            u.thumbnail && /* @__PURE__ */ a(
               "img",
               {
-                src: o.thumbnail,
+                src: u.thumbnail,
                 alt: "",
                 className: "mapui:h-10 mapui:w-14 mapui:shrink-0 mapui:rounded mapui:object-cover"
               }
             ),
             /* @__PURE__ */ l("div", { className: "mapui:flex-1 mapui:overflow-hidden", children: [
-              /* @__PURE__ */ a("span", { className: "mapui:block mapui:text-sm mapui:font-medium mapui:text-gray-800", children: o.label || o.id }),
-              /* @__PURE__ */ a("span", { className: "mapui:block mapui:truncate mapui:font-mono mapui:text-xs mapui:text-gray-500", children: o.url })
+              /* @__PURE__ */ a("span", { className: "mapui:block mapui:text-sm mapui:font-medium mapui:text-gray-800", children: u.label || u.id }),
+              /* @__PURE__ */ a("span", { className: "mapui:block mapui:truncate mapui:font-mono mapui:text-xs mapui:text-gray-500", children: u.url })
             ] }),
             /* @__PURE__ */ l("div", { className: "mapui:flex mapui:shrink-0 mapui:gap-1", children: [
               /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
-                  onClick: () => r(t === o.id ? null : o.id),
+                  onClick: () => r(t === u.id ? null : u.id),
                   className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-gray-600 hover:mapui:bg-gray-50",
-                  children: t === o.id ? "Close" : "Edit"
+                  children: t === u.id ? "Close" : "Edit"
                 }
               ),
               /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
-                  onClick: () => g(o.id),
+                  onClick: () => h(u.id),
                   className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
                   children: "Remove"
                 }
               )
             ] })
           ] }),
-          t === o.id && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(je, { value: o, onChange: d }) })
+          t === u.id && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(je, { value: u, onChange: d }) })
         ]
       },
-      o.id
+      u.id
     )) }),
     p && /* @__PURE__ */ l("div", { className: "mapui:rounded-lg mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:p-3", children: [
       /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-3 mapui:text-xs mapui:font-semibold mapui:text-blue-700", children: "New Basemap" }),
-      /* @__PURE__ */ a(je, { value: n, onChange: x }),
+      /* @__PURE__ */ a(je, { value: n, onChange: f }),
       /* @__PURE__ */ l("div", { className: "mapui:mt-3 mapui:flex mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "button",
           {
             type: "button",
-            onClick: w,
+            onClick: x,
             disabled: !n.id || !n.url,
             className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700 disabled:mapui:cursor-not-allowed disabled:mapui:opacity-50",
             children: "Save"
@@ -3428,7 +3430,7 @@ function Ai({ basemaps: e, onChange: i }) {
           "button",
           {
             type: "button",
-            onClick: () => u(!1),
+            onClick: () => m(!1),
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-3 mapui:py-1 mapui:text-xs mapui:text-gray-700 hover:mapui:bg-gray-50",
             children: "Cancel"
           }
@@ -3441,8 +3443,8 @@ function Ai({ basemaps: e, onChange: i }) {
         open: s !== null,
         title: "Remove Basemap",
         description: "Are you sure you want to remove this basemap from the configuration?",
-        onConfirm: () => s && c(s),
-        onCancel: () => g(null)
+        onConfirm: () => s && v(s),
+        onCancel: () => h(null)
       }
     )
   ] });
@@ -3482,21 +3484,21 @@ function Re({ value: e, onChange: i }) {
     ] })
   ] });
 }
-const he = () => ({ id: "", url: "" }), oi = (e) => {
+const he = () => ({ id: "", url: "" }), mi = (e) => {
   try {
     return new URL(e), !0;
   } catch {
     return !1;
   }
 };
-function Ei({ sprites: e, onChange: i }) {
-  const [t, r] = T(null), [p, u] = T(!1), [n, x] = T(he()), [s, g] = T(null), d = (o) => {
-    i(e.map((h, N) => N === t ? o : h));
-  }, w = () => {
-    i([...e, n]), u(!1), x(he());
-  }, c = (o) => {
-    const h = e.findIndex((N) => N.id === o);
-    i(e.filter((N) => N.id !== o)), t !== null && (h === t ? r(null) : h < t && r(t - 1)), g(null);
+function Ii({ sprites: e, onChange: i }) {
+  const [t, r] = T(null), [p, m] = T(!1), [n, f] = T(he()), [s, h] = T(null), d = (u) => {
+    i(e.map((c, w) => w === t ? u : c));
+  }, x = () => {
+    i([...e, n]), m(!1), f(he());
+  }, v = (u) => {
+    const c = e.findIndex((w) => w.id === u);
+    i(e.filter((w) => w.id !== u)), t !== null && (c === t ? r(null) : c < t && r(t - 1)), h(null);
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:justify-between", children: [
@@ -3506,7 +3508,7 @@ function Ei({ sprites: e, onChange: i }) {
         {
           type: "button",
           onClick: () => {
-            u(!0), x(he());
+            m(!0), f(he());
           },
           className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700",
           children: "+ Add Sprite Sheet"
@@ -3514,52 +3516,52 @@ function Ei({ sprites: e, onChange: i }) {
       )
     ] }),
     e.length === 0 && !p && /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-500", children: "No custom sprite sheets. Basemap icons are available automatically." }),
-    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((o, h) => /* @__PURE__ */ l(
+    /* @__PURE__ */ a("ul", { className: "mapui:m-0 mapui:list-none mapui:flex mapui:flex-col mapui:gap-2 mapui:p-0", children: e.map((u, c) => /* @__PURE__ */ l(
       "li",
       {
         className: "mapui:rounded-lg mapui:border mapui:border-gray-200 mapui:bg-white",
         children: [
           /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-3 mapui:px-3 mapui:py-2", children: [
             /* @__PURE__ */ l("div", { className: "mapui:flex-1 mapui:overflow-hidden", children: [
-              /* @__PURE__ */ a("span", { className: "mapui:block mapui:text-sm mapui:font-medium mapui:text-gray-800", children: o.id }),
-              /* @__PURE__ */ a("span", { className: "mapui:block mapui:truncate mapui:font-mono mapui:text-xs mapui:text-gray-500", children: o.url })
+              /* @__PURE__ */ a("span", { className: "mapui:block mapui:text-sm mapui:font-medium mapui:text-gray-800", children: u.id }),
+              /* @__PURE__ */ a("span", { className: "mapui:block mapui:truncate mapui:font-mono mapui:text-xs mapui:text-gray-500", children: u.url })
             ] }),
             /* @__PURE__ */ l("div", { className: "mapui:flex mapui:shrink-0 mapui:gap-1", children: [
               /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
-                  onClick: () => r(t === h ? null : h),
+                  onClick: () => r(t === c ? null : c),
                   className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-gray-600 hover:mapui:bg-gray-50",
-                  children: t === h ? "Close" : "Edit"
+                  children: t === c ? "Close" : "Edit"
                 }
               ),
               /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
-                  onClick: () => g(o.id),
+                  onClick: () => h(u.id),
                   className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-red-200 mapui:bg-white mapui:px-2 mapui:py-1 mapui:text-xs mapui:text-red-600 hover:mapui:bg-red-50",
                   children: "Remove"
                 }
               )
             ] })
           ] }),
-          t === h && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(Re, { value: o, onChange: d }) })
+          t === c && /* @__PURE__ */ a("div", { className: "mapui:border-t mapui:border-gray-100 mapui:p-3", children: /* @__PURE__ */ a(Re, { value: u, onChange: d }) })
         ]
       },
-      h
+      c
     )) }),
     p && /* @__PURE__ */ l("div", { className: "mapui:rounded-lg mapui:border mapui:border-blue-200 mapui:bg-blue-50 mapui:p-3", children: [
       /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-3 mapui:text-xs mapui:font-semibold mapui:text-blue-700", children: "New Sprite Sheet" }),
-      /* @__PURE__ */ a(Re, { value: n, onChange: x }),
+      /* @__PURE__ */ a(Re, { value: n, onChange: f }),
       /* @__PURE__ */ l("div", { className: "mapui:mt-3 mapui:flex mapui:gap-2", children: [
         /* @__PURE__ */ a(
           "button",
           {
             type: "button",
-            onClick: w,
-            disabled: !n.id || !n.url || !oi(n.url) || e.some((o) => o.id === n.id),
+            onClick: x,
+            disabled: !n.id || !n.url || !mi(n.url) || e.some((u) => u.id === n.id),
             className: "mapui:cursor-pointer mapui:rounded mapui:bg-blue-600 mapui:px-3 mapui:py-1 mapui:text-xs mapui:font-medium mapui:text-white hover:mapui:bg-blue-700 disabled:mapui:cursor-not-allowed disabled:mapui:opacity-50",
             children: "Save"
           }
@@ -3568,7 +3570,7 @@ function Ei({ sprites: e, onChange: i }) {
           "button",
           {
             type: "button",
-            onClick: () => u(!1),
+            onClick: () => m(!1),
             className: "mapui:cursor-pointer mapui:rounded mapui:border mapui:border-gray-300 mapui:bg-white mapui:px-3 mapui:py-1 mapui:text-xs mapui:text-gray-700 hover:mapui:bg-gray-50",
             children: "Cancel"
           }
@@ -3581,13 +3583,13 @@ function Ei({ sprites: e, onChange: i }) {
         open: s !== null,
         title: "Remove Sprite Sheet",
         description: "Are you sure you want to remove this sprite sheet from the configuration?",
-        onConfirm: () => s && c(s),
-        onCancel: () => g(null)
+        onConfirm: () => s && v(s),
+        onCancel: () => h(null)
       }
     )
   ] });
 }
-const mi = [
+const si = [
   { key: "showLayerPanel", label: "Layer Panel", description: "Toggle layer visibility" },
   { key: "showLegend", label: "Legend", description: "Map legend" },
   { key: "showBasemapSwitcher", label: "Basemap Switcher", description: "Switch basemap styles" },
@@ -3600,13 +3602,13 @@ const mi = [
   { key: "showMeasureTool", label: "Measure Tool", description: "Measure distances and areas on the map" },
   { key: "showSelectionTool", label: "Selection Tool", description: "Select features by click or box draw" }
 ];
-function Ii({ value: e, onChange: i }) {
+function Mi({ value: e, onChange: i }) {
   const t = (r, p) => {
     i({ ...e, [r]: p });
   };
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-1", children: [
     /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:mb-2 mapui:text-xs mapui:text-gray-500", children: "Enable or disable UI panels and controls." }),
-    /* @__PURE__ */ a("div", { className: "mapui:grid mapui:grid-cols-1 mapui:gap-2 sm:mapui:grid-cols-2", children: mi.map(({ key: r, label: p, description: u }) => {
+    /* @__PURE__ */ a("div", { className: "mapui:grid mapui:grid-cols-1 mapui:gap-2 sm:mapui:grid-cols-2", children: si.map(({ key: r, label: p, description: m }) => {
       const n = e[r];
       return /* @__PURE__ */ l(
         "label",
@@ -3615,7 +3617,7 @@ function Ii({ value: e, onChange: i }) {
           children: [
             /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-0.5", children: [
               /* @__PURE__ */ a("span", { className: "mapui:text-sm mapui:font-medium mapui:text-gray-800", children: p }),
-              /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-gray-500", children: u })
+              /* @__PURE__ */ a("span", { className: "mapui:text-xs mapui:text-gray-500", children: m })
             ] }),
             /* @__PURE__ */ l("div", { className: "mapui:relative mapui:flex mapui:shrink-0 mapui:items-center", children: [
               /* @__PURE__ */ a(
@@ -3623,7 +3625,7 @@ function Ii({ value: e, onChange: i }) {
                 {
                   type: "checkbox",
                   checked: n,
-                  onChange: (x) => t(r, x.target.checked),
+                  onChange: (f) => t(r, f.target.checked),
                   className: "mapui:sr-only",
                   "aria-label": p
                 }
@@ -3661,7 +3663,7 @@ const Je = [
   { key: "pitch", label: "Pitch (°)", min: 0, max: 85, step: 1, placeholder: "0" },
   { key: "bearing", label: "Bearing (°)", min: -180, max: 180, step: 1, placeholder: "0" }
 ];
-function si(e, i) {
+function ci(e, i) {
   const t = Je.find((r) => r.key === e);
   if (t) {
     if (isNaN(i)) return "Must be a number";
@@ -3669,31 +3671,31 @@ function si(e, i) {
     if (i > t.max) return `Must be at most ${t.max}`;
   }
 }
-const ci = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
-function Mi({ value: e, onChange: i }) {
+const di = "mapui:rounded mapui:border mapui:border-gray-300 mapui:px-2 mapui:py-1 mapui:text-sm mapui:outline-none focus:mapui:border-blue-500 focus:mapui:ring-1 focus:mapui:ring-blue-500";
+function Fi({ value: e, onChange: i }) {
   const t = (r, p) => {
-    const u = parseFloat(p);
-    i({ ...e, [r]: isNaN(u) ? 0 : u });
+    const m = parseFloat(p);
+    i({ ...e, [r]: isNaN(m) ? 0 : m });
   };
-  return /* @__PURE__ */ a("div", { className: "mapui:grid mapui:grid-cols-2 mapui:gap-3", children: Je.map(({ key: r, label: p, min: u, max: n, step: x, placeholder: s }) => {
-    const g = si(r, e[r]);
-    return /* @__PURE__ */ a(S, { label: p, error: g, children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ a("div", { className: "mapui:grid mapui:grid-cols-2 mapui:gap-3", children: Je.map(({ key: r, label: p, min: m, max: n, step: f, placeholder: s }) => {
+    const h = ci(r, e[r]);
+    return /* @__PURE__ */ a(S, { label: p, error: h, children: /* @__PURE__ */ a(
       "input",
       {
         type: "number",
-        min: u,
+        min: m,
         max: n,
-        step: x,
+        step: f,
         value: e[r],
         placeholder: s,
         onChange: (d) => t(r, d.target.value),
-        className: `${ci} ${g ? "mapui:border-red-400" : ""}`
+        className: `${di} ${h ? "mapui:border-red-400" : ""}`
       }
     ) }, r);
   }) });
 }
-function Fi({ config: e }) {
-  const i = sa(e);
+function Pi({ config: e }) {
+  const i = ca(e);
   return /* @__PURE__ */ l("div", { className: "mapui:flex mapui:flex-col mapui:gap-3", children: [
     /* @__PURE__ */ l("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
       /* @__PURE__ */ a(
@@ -3718,188 +3720,188 @@ function Fi({ config: e }) {
     /* @__PURE__ */ a("div", { className: "mapui:overflow-auto mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-gray-50", children: /* @__PURE__ */ a("pre", { className: "mapui:m-0 mapui:p-3 mapui:text-xs mapui:text-gray-800 mapui:whitespace-pre", children: JSON.stringify(e, null, 2) }) })
   ] });
 }
-function di(e, i) {
-  const [t, r] = e, [p, u] = i;
+function hi(e, i) {
+  const [t, r] = e, [p, m] = i;
   return {
     type: "Polygon",
     coordinates: [[
       [t, r],
       [p, r],
-      [p, u],
-      [t, u],
+      [p, m],
+      [t, m],
       [t, r]
     ]]
   };
 }
-function Pi(e, i) {
+function Oi(e, i) {
   return {
     type: "Feature",
     properties: {},
-    geometry: di(e, i)
+    geometry: hi(e, i)
   };
 }
 export {
-  pr as BasemapConfigSchema,
+  nr as BasemapConfigSchema,
   je as BasemapEditor,
-  Ai as BasemapList,
-  $i as BasemapSwitcher,
-  nr as BrandingConfigSchema,
-  ur as CircleLayoutSchema,
-  or as CirclePaintSchema,
-  mr as CircleStyleSchema,
-  Bi as CollapsibleControl,
+  Ei as BasemapList,
+  Ri as BasemapSwitcher,
+  ur as BrandingConfigSchema,
+  or as CircleLayoutSchema,
+  mr as CirclePaintSchema,
+  sr as CircleStyleSchema,
+  zi as CollapsibleControl,
   X as CollapsibleSection,
-  Ci as CollectionBrowser,
+  Si as CollectionBrowser,
   Z as ColorPicker,
-  Fi as ConfigPreview,
+  Pi as ConfigPreview,
   re as ConfirmDialog,
-  Ui as CoordinateDisplay,
-  sr as DEFAULT_HEADER_COLOR,
-  cr as DatetimeSearchFieldSchema,
-  _i as ExportButton,
-  xi as ExportModal,
-  Hi as FeatureDetailPanel,
-  Xi as FeatureTooltip,
-  dr as FillLayoutSchema,
-  hr as FillPaintSchema,
-  gr as FillStyleSchema,
-  br as FilterConfigSchema,
+  Gi as CoordinateDisplay,
+  cr as DEFAULT_HEADER_COLOR,
+  dr as DatetimeSearchFieldSchema,
+  Vi as ExportButton,
+  wi as ExportModal,
+  Yi as FeatureDetailPanel,
+  Zi as FeatureTooltip,
+  hr as FillLayoutSchema,
+  gr as FillPaintSchema,
+  br as FillStyleSchema,
+  yr as FilterConfigSchema,
   S as FormField,
-  yr as GeometryTypeSchema,
-  fr as LayerConfigSchema,
+  fr as GeometryTypeSchema,
+  xr as LayerConfigSchema,
   Oe as LayerEditor,
-  Li as LayerList,
-  Ji as LayerPanel,
-  Qi as Legend,
-  xr as LegendConfigSchema,
-  Xa as LegendEditor,
-  Ya as LegendEntryEditor,
-  wr as LegendEntrySchema,
-  Nr as LineLayoutSchema,
-  vr as LinePaintSchema,
-  kr as LineStyleSchema,
-  Cr as MapConfigSchema,
-  wi as MeasurePanel,
-  Sr as NumberSearchFieldSchema,
-  Tr as OgcApiSourceSchema,
-  Dr as PropertyDisplayConfigSchema,
-  ii as PropertyDisplayEditor,
-  Lr as PropertyDisplaySchema,
-  vi as ResultsDrawer,
-  Ar as SearchConfigSchema,
-  Ja as SearchFieldEditor,
-  Qa as SearchFieldList,
-  Er as SearchFieldSchema,
-  rr as SearchPanel,
-  Ir as SelectSearchFieldSchema,
-  Ni as SelectionPanel,
+  Ai as LayerList,
+  Ki as LayerPanel,
+  et as Legend,
+  wr as LegendConfigSchema,
+  Za as LegendEditor,
+  Xa as LegendEntryEditor,
+  Nr as LegendEntrySchema,
+  vr as LineLayoutSchema,
+  kr as LinePaintSchema,
+  Cr as LineStyleSchema,
+  Sr as MapConfigSchema,
+  Ni as MeasurePanel,
+  Tr as NumberSearchFieldSchema,
+  Dr as OgcApiSourceSchema,
+  Lr as PropertyDisplayConfigSchema,
+  ti as PropertyDisplayEditor,
+  Ar as PropertyDisplaySchema,
+  ki as ResultsDrawer,
+  Er as SearchConfigSchema,
+  Ka as SearchFieldEditor,
+  ei as SearchFieldList,
+  Ir as SearchFieldSchema,
+  lr as SearchPanel,
+  Mr as SelectSearchFieldSchema,
+  vi as SelectionPanel,
   we as SourceEditor,
-  ki as SourceList,
+  Ci as SourceList,
   Re as SpriteSourceEditor,
-  Ei as SpriteSourceList,
-  Mr as SpriteSourceSchema,
-  Fr as StyleConfigSchema,
-  Ha as StyleEditor,
-  Pr as SymbolLayoutSchema,
-  Or as SymbolPaintSchema,
-  jr as SymbolStyleSchema,
-  $r as TextSearchFieldSchema,
-  Ii as UIConfigEditor,
-  Rr as UIConfigSchema,
-  na as UNITS_FOR_MODE,
+  Ii as SpriteSourceList,
+  Fr as SpriteSourceSchema,
+  Pr as StyleConfigSchema,
+  Ya as StyleEditor,
+  Or as SymbolLayoutSchema,
+  jr as SymbolPaintSchema,
+  $r as SymbolStyleSchema,
+  Rr as TextSearchFieldSchema,
+  Mi as UIConfigEditor,
+  Br as UIConfigSchema,
+  ua as UNITS_FOR_MODE,
   xe as UNIT_LABELS,
-  Br as ViewConfigSchema,
-  Mi as ViewEditor,
-  at as and,
-  it as bboxFromGeometry,
-  tt as between,
-  Pi as buildBoxDrawData,
-  di as buildBoxPolygon,
-  pi as buildDefaultStylesForGeometryTypes,
-  rt as buildGeometryFilter,
-  lt as buildMeasureGeometryData,
-  pt as buildMeasurePointsData,
-  nt as calculateArea,
-  ut as calculateDistance,
-  ot as calculateMeasurement,
+  zr as ViewConfigSchema,
+  Fi as ViewEditor,
+  it as and,
+  tt as bboxFromGeometry,
+  rt as between,
+  Oi as buildBoxDrawData,
+  hi as buildBoxPolygon,
+  ni as buildDefaultStylesForGeometryTypes,
+  lt as buildGeometryFilter,
+  pt as buildMeasureGeometryData,
+  nt as buildMeasurePointsData,
+  ut as calculateArea,
+  ot as calculateDistance,
+  mt as calculateMeasurement,
   _e as defaultCircle,
   ge as defaultFill,
-  Ga as defaultLine,
-  qa as defaultSymbol,
-  mt as defaultUnitForMode,
+  qa as defaultLine,
+  Wa as defaultSymbol,
+  st as defaultUnitForMode,
   Xe as detectGeometryStyleTypesFromQueryables,
-  ri as detectGeometryTypeFromQueryables,
+  li as detectGeometryTypeFromQueryables,
   Ze as detectGeometryTypesFromFeatures,
-  Si as detectStyleTypeForCollection,
-  Ti as detectStyleTypesForCollection,
-  st as downloadBlob,
-  ct as downloadCsv,
-  dt as eq,
+  Ti as detectStyleTypeForCollection,
+  Di as detectStyleTypesForCollection,
+  ct as downloadBlob,
+  dt as downloadCsv,
+  ht as eq,
   We as expressionColors,
-  Ia as expressionEntries,
-  Ma as expressionPropertyName,
-  Ea as expressionType,
+  Ma as expressionEntries,
+  Fa as expressionPropertyName,
+  Ia as expressionType,
   He as extractGeometryType,
-  ht as featuresToCsv,
-  gt as fetchCollectionDetail,
-  bt as fetchCollections,
-  yt as fetchConformance,
-  ma as fetchDistinctValues,
-  ft as fetchFeatureById,
-  xt as fetchFeatureCount,
+  gt as featuresToCsv,
+  bt as fetchCollectionDetail,
+  yt as fetchCollections,
+  ft as fetchConformance,
+  sa as fetchDistinctValues,
+  xt as fetchFeatureById,
+  wt as fetchFeatureCount,
   ye as fetchFeatures,
   qe as fetchQueryables,
-  wt as fetchSpriteNames,
-  Nt as fetchSpriteUrlFromStyle,
-  vt as fetchTileJson,
-  Gi as formatDMS,
-  qi as formatDecimal,
-  ua as formatMeasurement,
-  kt as fromSimpleFilters,
-  Ct as fromStructuredFilters,
+  Nt as fetchSpriteNames,
+  vt as fetchSpriteUrlFromStyle,
+  kt as fetchTileJson,
+  qi as formatDMS,
+  Wi as formatDecimal,
+  oa as formatMeasurement,
+  Ct as fromSimpleFilters,
+  St as fromStructuredFilters,
   Ye as geometryTypeToStyleType,
   fe as geometryTypeToStyleTypes,
   pe as getColorFromPalette,
-  St as getCql2FilteredVectorTileUrl,
-  Tt as getFilteredVectorTileUrl,
-  Fa as getPrimaryColor,
-  Pa as getShapeForStyleType,
-  Dt as getTileJsonUrl,
-  Lt as getVectorTileSourceKey,
-  At as getVectorTileUrl,
-  Et as gt,
-  It as gte,
-  Di as humanizePropertyName,
-  Mt as inList,
+  Tt as getCql2FilteredVectorTileUrl,
+  Dt as getFilteredVectorTileUrl,
+  Pa as getPrimaryColor,
+  Oa as getShapeForStyleType,
+  Lt as getTileJsonUrl,
+  At as getVectorTileSourceKey,
+  Et as getVectorTileUrl,
+  It as gt,
+  Mt as gte,
+  Li as humanizePropertyName,
+  Ft as inList,
   V as isExpression,
-  ti as isGeometryProperty,
-  Ft as isNull,
-  Pt as like,
-  Ot as lt,
-  jt as lte,
-  $t as neq,
-  Rt as not,
-  Bt as or,
-  zt as resolveAvailableIcons,
-  Ut as resolvePropertyDisplay,
-  Gt as resolveStyleWithSprites,
-  qt as sDwithin,
-  Wt as sIntersects,
-  _t as sWithin,
-  sa as safeValidateMapConfig,
-  Vt as selectedFeatureKey,
-  Ht as serializeCql2,
-  Yt as tAfter,
-  Xt as tBefore,
-  Zt as tDuring,
-  li as toAvailableProperties,
-  Jt as useCsvExport,
-  Kt as useExport,
-  Qt as useMeasure,
-  er as useOgcCollectionDetail,
+  ri as isGeometryProperty,
+  Pt as isNull,
+  Ot as like,
+  jt as lt,
+  $t as lte,
+  Rt as neq,
+  Bt as not,
+  zt as or,
+  Ut as resolveAvailableIcons,
+  Gt as resolvePropertyDisplay,
+  qt as resolveStyleWithSprites,
+  Wt as sDwithin,
+  _t as sIntersects,
+  Vt as sWithin,
+  ca as safeValidateMapConfig,
+  Ht as selectedFeatureKey,
+  Yt as serializeCql2,
+  Xt as tAfter,
+  Zt as tBefore,
+  Jt as tDuring,
+  pi as toAvailableProperties,
+  Kt as useCsvExport,
+  Qt as useExport,
+  er as useMeasure,
+  ar as useOgcCollectionDetail,
   Ge as useOgcCollections,
-  ar as useOgcFeatures,
-  oa as useOgcQueryables,
-  ir as useSelection,
-  zr as validateMapConfig
+  ir as useOgcFeatures,
+  ma as useOgcQueryables,
+  tr as useSelection,
+  Ur as validateMapConfig
 };