@ogc-maps/storybook-components 0.4.1 → 0.5.1

package/dist/{FeatureDetailPanel-DpcaTS9I.js → FeatureDetailPanel-CkFpdEKW.js}

@@ -1,13 +1,14 @@
 import { jsxs as p, jsx as a } from "react/jsx-runtime";
-import { P as s } from "./PropertyList-BH_DTkcU.js";
-function x({
+import { P as c } from "./PropertyList-BGXHLVBM.js";
+function f({
   isOpen: r,
   onClose: m,
   properties: i,
   title: t = "Feature Properties",
   fields: l,
+  labels: o,
   variant: e = "panel",
-  className: o = ""
+  className: n = ""
 }) {
   if (!r) return null;
   const u = /* @__PURE__ */ p(
@@ -16,9 +17,9 @@ function x({
       className: [
         "mapui:flex mapui:flex-col mapui:rounded mapui:border mapui:border-gray-200 mapui:bg-white mapui:shadow-md",
         e === "modal" ? "mapui:max-h-[80vh] mapui:w-full mapui:max-w-lg" : "mapui:max-h-[calc(100vh-4rem)] mapui:w-72",
-        o
+        n
       ].filter(Boolean).join(" ").trim(),
-      onClick: e === "modal" ? (n) => n.stopPropagation() : void 0,
+      onClick: e === "modal" ? (s) => s.stopPropagation() : void 0,
       children: [
         /* @__PURE__ */ p("div", { className: "mapui:flex mapui:shrink-0 mapui:items-center mapui:justify-between mapui:border-b mapui:border-gray-200 mapui:px-4 mapui:py-3", children: [
           /* @__PURE__ */ a("h3", { className: "mapui:m-0 mapui:text-sm mapui:font-semibold mapui:text-gray-700", children: t }),
@@ -32,7 +33,7 @@ function x({
             }
           )
         ] }),
-        /* @__PURE__ */ a("div", { className: "mapui:overflow-y-auto mapui:px-4 mapui:py-3", children: i && Object.keys(i).length > 0 ? /* @__PURE__ */ a(s, { properties: i, fields: l, density: "default" }) : /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-400", children: "No properties available." }) })
+        /* @__PURE__ */ a("div", { className: "mapui:overflow-y-auto mapui:px-4 mapui:py-3", children: i && Object.keys(i).length > 0 ? /* @__PURE__ */ a(c, { properties: i, fields: l, labels: o, density: "default" }) : /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-sm mapui:text-gray-400", children: "No properties available." }) })
       ]
     }
   );
@@ -46,5 +47,5 @@ function x({
   ) : u;
 }
 export {
-  x as F
+  f as F
 };

package/dist/{FeatureTooltip-CM0ZTudi.js → FeatureTooltip-Db1LgLQV.js}

@@ -1,9 +1,10 @@
 import { jsx as a, jsxs as e } from "react/jsx-runtime";
-import { P as s } from "./PropertyList-BH_DTkcU.js";
-function x({
+import { P as n } from "./PropertyList-BGXHLVBM.js";
+function h({
   title: p,
   properties: m,
   fields: t,
+  labels: o,
   maxItems: i = 4,
   className: u = ""
 }) {
@@ -15,7 +16,7 @@ function x({
         children: /* @__PURE__ */ a("p", { className: "mapui:m-0 mapui:text-xs mapui:text-gray-400", children: "No data" })
       }
     );
-  const r = t ?? Object.keys(m), o = r.length > i, d = r.length - i;
+  const r = t ?? Object.keys(m), d = r.length > i, s = r.length - i;
   return /* @__PURE__ */ e(
     "div",
     {
@@ -23,17 +24,18 @@ function x({
       children: [
         p && /* @__PURE__ */ a("p", { className: "mapui:mb-1.5 mapui:mt-0 mapui:text-xs mapui:font-semibold mapui:text-gray-700", children: p }),
         /* @__PURE__ */ a(
-          s,
+          n,
           {
             properties: m,
             fields: t,
+            labels: o,
             maxItems: i,
             density: "compact"
           }
         ),
-        o && /* @__PURE__ */ e("p", { className: "mapui:mb-0 mapui:mt-1 mapui:text-xs mapui:text-gray-400", children: [
+        d && /* @__PURE__ */ e("p", { className: "mapui:mb-0 mapui:mt-1 mapui:text-xs mapui:text-gray-400", children: [
           "+",
-          d,
+          s,
           " more"
         ] })
       ]
@@ -41,5 +43,5 @@ function x({
   );
 }
 export {
-  x as F
+  h as F
 };

package/dist/{LayerPanel-BHpb8dbm.js → LayerPanel-SCdJ8948.js}

@@ -1,40 +1,40 @@
-import { jsxs as o, jsx as s } from "react/jsx-runtime";
-import { useState as g, useCallback as u } from "react";
+import { jsxs as o, jsx as u } from "react/jsx-runtime";
+import { useState as g, useCallback as m } from "react";
 function E({
-  layers: l,
+  layers: r,
   activeLayerIds: f,
   onToggleVisibility: v,
   onReorder: i,
   className: x = "",
   hideTitle: h
 }) {
-  const [n, r] = g(null), [D, m] = g(null), b = u(
+  const [n, l] = g(null), [D, s] = g(null), b = m(
     (a, e) => {
-      r(e), a.dataTransfer.effectAllowed = "move", a.dataTransfer.setData("text/plain", e);
+      l(e), a.dataTransfer.effectAllowed = "move", a.dataTransfer.setData("text/plain", e);
     },
     []
-  ), N = u(
+  ), N = m(
     (a, e) => {
-      a.preventDefault(), a.dataTransfer.dropEffect = "move", m(e);
+      a.preventDefault(), a.dataTransfer.dropEffect = "move", s(e);
     },
     []
-  ), O = u(() => {
-    m(null);
-  }, []), I = u(
+  ), O = m(() => {
+    s(null);
+  }, []), I = m(
     (a, e) => {
-      if (a.preventDefault(), m(null), r(null), !i || !n || n === e) return;
-      const p = l.map((j) => j.id), c = p.indexOf(n), t = p.indexOf(e);
+      if (a.preventDefault(), s(null), l(null), !i || !n || n === e) return;
+      const p = r.map((w) => w.id), c = p.indexOf(n), t = p.indexOf(e);
       if (c === -1 || t === -1) return;
       const d = [...p];
       d.splice(c, 1), d.splice(t, 0, n), i(d);
     },
-    [n, l, i]
-  ), L = u(() => {
-    r(null), m(null);
+    [n, r, i]
+  ), L = m(() => {
+    l(null), s(null);
   }, []);
   return /* @__PURE__ */ o("div", { className: `mapui:flex mapui:flex-col mapui:gap-1 ${x}`.trim(), children: [
-    !h && /* @__PURE__ */ s("h3", { className: "mapui:m-0 mapui:mb-2 mapui:text-sm mapui:font-semibold mapui:text-gray-700", children: "Layers" }),
-    /* @__PURE__ */ s("ul", { className: "mapui:m-0 mapui:list-none mapui:p-0", children: l.map((a) => {
+    !h && /* @__PURE__ */ u("h3", { className: "mapui:m-0 mapui:mb-2 mapui:text-sm mapui:font-semibold mapui:text-gray-700", children: "Layers" }),
+    /* @__PURE__ */ u("ul", { className: "mapui:m-0 mapui:list-none mapui:p-0", children: r.map((a) => {
       const e = f.includes(a.id), p = n === a.id, c = D === a.id;
       return /* @__PURE__ */ o(
         "li",
@@ -52,7 +52,7 @@ function E({
             p ? "mapui:opacity-50" : "mapui:opacity-100"
           ].join(" "),
           children: [
-            i && /* @__PURE__ */ s(
+            i && /* @__PURE__ */ u(
               "span",
               {
                 className: "mapui:cursor-grab mapui:text-gray-400 active:mapui:cursor-grabbing",
@@ -60,8 +60,8 @@ function E({
                 children: "⠿"
               }
             ),
-            /* @__PURE__ */ o("label", { className: "mapui:flex mapui:flex-1 mapui:cursor-pointer mapui:items-center mapui:gap-2", children: [
-              /* @__PURE__ */ s(
+            /* @__PURE__ */ o("label", { className: "mapui:flex mapui:flex-1 mapui:cursor-pointer mapui:items-center mapui:gap-2 mapui:min-w-0", children: [
+              /* @__PURE__ */ u(
                 "input",
                 {
                   type: "checkbox",
@@ -70,7 +70,7 @@ function E({
                   className: "mapui:h-4 mapui:w-4 mapui:cursor-pointer mapui:accent-blue-600"
                 }
               ),
-              /* @__PURE__ */ s("span", { className: "mapui:text-sm mapui:text-gray-800", children: a.label })
+              /* @__PURE__ */ u("span", { className: "mapui:text-sm mapui:text-gray-800 mapui:truncate", children: a.label })
             ] })
           ]
         },

package/dist/{Legend-D4cc1JzQ.js → Legend-BMrkY-rw.js}

@@ -62,7 +62,7 @@ function g({ layers: i, visibleLayerIds: p, className: n }) {
       className: `mapui:rounded-lg mapui:bg-white mapui:p-3 mapui:shadow-md mapui:text-sm${n ? ` ${n}` : ""}`,
       children: [
         /* @__PURE__ */ e("h3", { className: "mapui:m-0 mapui:mb-2 mapui:text-xs mapui:font-semibold mapui:uppercase mapui:tracking-wide mapui:text-gray-500", children: "Legend" }),
-        /* @__PURE__ */ e("ul", { className: "mapui:m-0 mapui:list-none mapui:space-y-2 mapui:p-0", children: r.map(({ layer: a, entries: l }) => /* @__PURE__ */ e("li", { children: l.length === 1 ? /* @__PURE__ */ m("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+        /* @__PURE__ */ e("ul", { className: "mapui:m-0 mapui:list-none mapui:space-y-2 mapui:p-0", children: r.map(({ layer: a, entries: l }) => /* @__PURE__ */ e("li", { children: l.length === 1 ? /* @__PURE__ */ m("div", { className: "mapui:flex mapui:items-center mapui:gap-2 mapui:min-w-0", children: [
           /* @__PURE__ */ e(
             s,
             {
@@ -70,16 +70,16 @@ function g({ layers: i, visibleLayerIds: p, className: n }) {
               shape: l[0].shape
             }
           ),
-          /* @__PURE__ */ e("span", { className: "mapui:text-gray-700", children: l[0].label })
+          /* @__PURE__ */ e("span", { className: "mapui:text-gray-700 mapui:truncate", children: l[0].label })
         ] }) : /* @__PURE__ */ m("div", { children: [
           /* @__PURE__ */ e("div", { className: "mapui:mb-1 mapui:text-xs mapui:font-medium mapui:text-gray-600", children: a.label }),
           /* @__PURE__ */ e("ul", { className: "mapui:m-0 mapui:list-none mapui:space-y-1 mapui:p-0 mapui:pl-1", children: l.map((u, c) => /* @__PURE__ */ m(
             "li",
             {
-              className: "mapui:flex mapui:items-center mapui:gap-2",
+              className: "mapui:flex mapui:items-center mapui:gap-2 mapui:min-w-0",
               children: [
                 /* @__PURE__ */ e(s, { color: u.color, shape: u.shape }),
-                /* @__PURE__ */ e("span", { className: "mapui:text-gray-700", children: u.label })
+                /* @__PURE__ */ e("span", { className: "mapui:text-gray-700 mapui:truncate", children: u.label })
               ]
             },
             `${u.label}-${c}`

package/dist/PropertyList-BGXHLVBM.js

@@ -0,0 +1,33 @@
+import { jsx as t, jsxs as a } from "react/jsx-runtime";
+function p(i) {
+  return i == null ? "--" : typeof i == "boolean" ? i ? "Yes" : "No" : Array.isArray(i) ? i.map(p).join(", ") : typeof i == "object" ? JSON.stringify(i) : String(i);
+}
+function f({
+  properties: i,
+  fields: s,
+  labels: r,
+  maxItems: n,
+  density: o = "default",
+  className: u = ""
+}) {
+  const c = s ?? Object.keys(i), d = n != null ? c.slice(0, n) : c;
+  return o === "compact" ? /* @__PURE__ */ t("dl", { className: `mapui:m-0 mapui:text-xs ${u}`.trim(), children: d.map((m) => /* @__PURE__ */ a("div", { className: "mapui:flex mapui:gap-1 mapui:py-0.5", children: [
+    /* @__PURE__ */ a("dt", { className: "mapui:shrink-0 mapui:font-medium mapui:text-gray-500", children: [
+      (r == null ? void 0 : r[m]) ?? m,
+      ":"
+    ] }),
+    /* @__PURE__ */ t("dd", { className: "mapui:m-0 mapui:truncate mapui:text-gray-800", children: p(i[m]) })
+  ] }, m)) }) : /* @__PURE__ */ t(
+    "dl",
+    {
+      className: `mapui:m-0 mapui:grid mapui:grid-cols-2 mapui:gap-x-4 mapui:gap-y-2 mapui:text-sm ${u}`.trim(),
+      children: d.map((m) => /* @__PURE__ */ a("div", { className: "mapui:contents", children: [
+        /* @__PURE__ */ t("dt", { className: "mapui:break-words mapui:font-medium mapui:text-gray-500", children: (r == null ? void 0 : r[m]) ?? m }),
+        /* @__PURE__ */ t("dd", { className: "mapui:m-0 mapui:break-words mapui:text-gray-800", children: p(i[m]) })
+      ] }, m))
+    }
+  );
+}
+export {
+  f as P
+};

package/dist/SearchPanel-DCY01Wa-.js

@@ -0,0 +1,363 @@
+import { jsxs as h, jsx as m } from "react/jsx-runtime";
+import { useState as j, useRef as L, useId as D, useMemo as S, useCallback as A, useEffect as I } from "react";
+function V({
+  value: e,
+  onChange: t,
+  suggestions: u,
+  onQueryChange: d,
+  placeholder: N = "",
+  className: l = "",
+  id: y
+}) {
+  const [f, c] = j(!1), [p, o] = j(-1), g = L(null), i = D(), r = p >= 0 ? `${i}-option-${p}` : void 0, v = S(
+    () => u.filter((n) => n.toLowerCase().includes(e.toLowerCase())),
+    [u, e]
+  ), b = f && v.length > 0, a = A(
+    (n) => {
+      t(n), d == null || d(n), c(!1), o(-1);
+    },
+    [t, d]
+  ), x = (n) => {
+    const s = n.target.value;
+    t(s), d == null || d(s), c(!0), o(-1);
+  }, w = (n) => {
+    b && (n.key === "ArrowDown" ? (n.preventDefault(), o((s) => Math.min(s + 1, v.length - 1))) : n.key === "ArrowUp" ? (n.preventDefault(), o((s) => Math.max(s - 1, 0))) : n.key === "Enter" && p >= 0 ? (n.preventDefault(), a(v[p])) : n.key === "Escape" && (c(!1), o(-1)));
+  };
+  return I(() => {
+    const n = (s) => {
+      g.current && !g.current.contains(s.target) && (c(!1), o(-1));
+    };
+    return document.addEventListener("mousedown", n), () => document.removeEventListener("mousedown", n);
+  }, []), /* @__PURE__ */ h("div", { ref: g, className: `mapui:relative ${l}`.trim(), children: [
+    /* @__PURE__ */ m(
+      "input",
+      {
+        id: y,
+        type: "text",
+        value: e,
+        placeholder: N,
+        role: "combobox",
+        "aria-expanded": b,
+        "aria-autocomplete": "list",
+        "aria-controls": i,
+        "aria-activedescendant": r,
+        onChange: x,
+        onFocus: () => c(!0),
+        onKeyDown: w,
+        className: "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"
+      }
+    ),
+    b && /* @__PURE__ */ m(
+      "ul",
+      {
+        id: i,
+        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: v.map((n, s) => /* @__PURE__ */ m(
+          "li",
+          {
+            id: `${i}-option-${s}`,
+            role: "option",
+            "aria-selected": s === p,
+            onMouseDown: (E) => {
+              E.preventDefault(), a(n);
+            },
+            className: `mapui:cursor-pointer mapui:px-2 mapui:py-1 mapui:text-sm ${s === p ? "mapui:bg-blue-100" : "hover:mapui:bg-gray-50"}`,
+            children: n
+          },
+          `${s}-${n}`
+        ))
+      }
+    )
+  ] });
+}
+function R({
+  startValue: e,
+  endValue: t,
+  onStartChange: u,
+  onEndChange: d,
+  className: N = "",
+  id: l
+}) {
+  const y = D(), f = l ?? y, c = `${f}-start`, p = `${f}-end`, o = "mapui:flex-1 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 /* @__PURE__ */ h("div", { className: `mapui:flex mapui:flex-col mapui:gap-1 ${N}`.trim(), children: [
+    /* @__PURE__ */ h("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      /* @__PURE__ */ m("label", { htmlFor: c, className: "mapui:text-xs mapui:text-gray-400 mapui:w-8", children: "From" }),
+      /* @__PURE__ */ m(
+        "input",
+        {
+          id: c,
+          type: "datetime-local",
+          value: e,
+          onChange: (g) => u(g.target.value),
+          "aria-label": "Start date",
+          className: o
+        }
+      )
+    ] }),
+    /* @__PURE__ */ h("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+      /* @__PURE__ */ m("label", { htmlFor: p, className: "mapui:text-xs mapui:text-gray-400 mapui:w-8", children: "To" }),
+      /* @__PURE__ */ m(
+        "input",
+        {
+          id: p,
+          type: "datetime-local",
+          value: t,
+          onChange: (g) => d(g.target.value),
+          "aria-label": "End date",
+          className: o
+        }
+      )
+    ] })
+  ] });
+}
+const k = {
+  eq: "=",
+  gt: ">",
+  lt: "<",
+  gte: ">=",
+  lte: "<=",
+  between: "between"
+}, M = ["eq", "gt", "lt", "gte", "lte", "between"];
+function O(e, t) {
+  if (e && typeof e == "object") {
+    if ("operator" in e) return e.operator;
+    if ("min" in e) return "between";
+  }
+  return t;
+}
+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", K = "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 mapui:bg-white";
+function P({ field: e, value: t, onChange: u, className: d = "", id: N }) {
+  const [l, y] = j(
+    () => O(t, e.operator)
+  );
+  I(() => {
+    y(O(t, e.operator));
+  }, [t, e.operator]);
+  const f = l === "between", c = e.inputMode === "slider" ? M.filter((a) => a !== "between") : M, p = (a) => {
+    if (y(a), a === "between")
+      u(void 0);
+    else if (f)
+      u(void 0);
+    else if (t && typeof t == "object" && "value" in t) {
+      const x = t.value;
+      u({ value: x, operator: a });
+    }
+  }, o = (a) => {
+    u(a === "" ? void 0 : { value: Number(a), operator: l });
+  }, g = (a) => {
+    const x = t && typeof t == "object" && "max" in t ? t.max : void 0;
+    u(a === "" ? x === void 0 ? void 0 : { min: e.min ?? 0, max: x } : { min: Number(a), max: x ?? e.max ?? 0 });
+  }, i = (a) => {
+    const x = t && typeof t == "object" && "min" in t ? t.min : void 0;
+    u(a === "" ? x === void 0 ? void 0 : { min: x, max: e.max ?? 0 } : { min: x ?? e.min ?? 0, max: Number(a) });
+  }, r = t && typeof t == "object" && "value" in t ? String(t.value) : "", v = t && typeof t == "object" && "min" in t ? String(t.min) : "", b = t && typeof t == "object" && "max" in t ? String(t.max) : "";
+  return /* @__PURE__ */ h("div", { className: `mapui:flex mapui:flex-col mapui:gap-1 ${d}`.trim(), children: [
+    /* @__PURE__ */ m(
+      "select",
+      {
+        value: l,
+        onChange: (a) => p(a.target.value),
+        "aria-label": `${e.label} operator`,
+        className: K,
+        children: c.map((a) => /* @__PURE__ */ m("option", { value: a, children: k[a] }, a))
+      }
+    ),
+    f ? (
+      /* Between: min + max inputs */
+      /* @__PURE__ */ h("div", { className: "mapui:flex mapui:gap-2", children: [
+        /* @__PURE__ */ m(
+          "input",
+          {
+            type: "number",
+            value: v,
+            placeholder: e.min !== void 0 ? String(e.min) : "Min",
+            min: e.min,
+            max: e.max,
+            step: e.step,
+            onChange: (a) => g(a.target.value),
+            "aria-label": `${e.label} minimum`,
+            className: `${$} mapui:w-1/2`
+          }
+        ),
+        /* @__PURE__ */ m(
+          "input",
+          {
+            type: "number",
+            value: b,
+            placeholder: e.max !== void 0 ? String(e.max) : "Max",
+            min: e.min,
+            max: e.max,
+            step: e.step,
+            onChange: (a) => i(a.target.value),
+            "aria-label": `${e.label} maximum`,
+            className: `${$} mapui:w-1/2`
+          }
+        )
+      ] })
+    ) : e.inputMode === "slider" ? (
+      /* Slider */
+      /* @__PURE__ */ h("div", { className: "mapui:flex mapui:items-center mapui:gap-2", children: [
+        /* @__PURE__ */ m(
+          "input",
+          {
+            type: "range",
+            value: r !== "" ? r : e.min ?? 0,
+            min: e.min ?? 0,
+            max: e.max ?? 100,
+            step: e.step ?? 1,
+            onChange: (a) => o(a.target.value),
+            "aria-label": e.label,
+            className: "mapui:flex-1"
+          }
+        ),
+        /* @__PURE__ */ m("span", { className: "mapui:text-xs mapui:text-gray-600 mapui:min-w-12 mapui:whitespace-nowrap mapui:text-right", children: r !== "" ? r : e.min ?? 0 })
+      ] })
+    ) : (
+      /* Number input */
+      /* @__PURE__ */ m(
+        "input",
+        {
+          id: N,
+          type: "number",
+          value: r,
+          placeholder: e.placeholder ?? "",
+          min: e.min,
+          max: e.max,
+          step: e.step,
+          onChange: (a) => o(a.target.value),
+          className: $
+        }
+      )
+    )
+  ] });
+}
+function q(e) {
+  return e === void 0 || e === "" || e === null ? !1 : typeof e == "object" && "start" in e && "end" in e ? e.start !== "" || e.end !== "" : !0;
+}
+function _({
+  layers: e,
+  activeFilters: t,
+  onFilterChange: u,
+  onClearFilters: d,
+  autocompleteSuggestions: N = {},
+  onFetchSuggestions: l,
+  className: y = "",
+  hideTitle: f
+}) {
+  const c = S(
+    () => e.filter((p) => {
+      var o;
+      return (o = p.search) == null ? void 0 : o.fields.length;
+    }),
+    [e]
+  );
+  return I(() => {
+    if (l)
+      for (const p of c)
+        for (const o of p.search.fields)
+          o.type === "select" && o.prefetch && l(p.id, o.property, "", { prefetch: !0 });
+  }, [c, l]), c.length === 0 ? /* @__PURE__ */ h("div", { className: `mapui:flex mapui:flex-col mapui:gap-1 ${y}`.trim(), children: [
+    !f && /* @__PURE__ */ m("h3", { className: "mapui:m-0 mapui:mb-2 mapui:text-sm mapui:font-semibold mapui:text-gray-700", children: "Search & Filter" }),
+    /* @__PURE__ */ m("p", { className: "mapui:m-0 mapui:text-xs mapui:text-gray-500", children: "No searchable layers configured." })
+  ] }) : /* @__PURE__ */ h("div", { className: `mapui:flex mapui:flex-col mapui:gap-3 ${y}`.trim(), children: [
+    !f && /* @__PURE__ */ m("h3", { className: "mapui:m-0 mapui:mb-2 mapui:text-sm mapui:font-semibold mapui:text-gray-700", children: "Search & Filter" }),
+    c.map((p) => {
+      const o = t[p.id] ?? {}, g = Object.values(o).some(q);
+      return /* @__PURE__ */ h("div", { className: "mapui:flex mapui:flex-col mapui:gap-2 mapui:border-b mapui:border-gray-100 mapui:pb-2 last:mapui:border-0", children: [
+        /* @__PURE__ */ h("div", { className: "mapui:flex mapui:items-center mapui:justify-between", children: [
+          /* @__PURE__ */ m("span", { className: "mapui:text-xs mapui:font-medium mapui:text-gray-600", children: p.label }),
+          g && /* @__PURE__ */ m(
+            "button",
+            {
+              type: "button",
+              onClick: () => d(p.id),
+              className: "mapui:cursor-pointer mapui:border-none mapui:bg-transparent mapui:p-0 mapui:text-xs mapui:text-blue-600 hover:mapui:text-blue-800",
+              children: "Clear"
+            }
+          )
+        ] }),
+        p.search.fields.map((i) => {
+          const r = o[i.property], v = `${p.id}:${i.property}`, b = `search-${p.id}-${i.property}`;
+          return /* @__PURE__ */ h("div", { className: "mapui:flex mapui:flex-col mapui:gap-0.5", children: [
+            /* @__PURE__ */ m("label", { htmlFor: b, className: "mapui:text-xs mapui:text-gray-500", children: i.label }),
+            i.type === "text" && i.autocomplete ? /* @__PURE__ */ m(
+              V,
+              {
+                id: b,
+                value: r ?? "",
+                onChange: (a) => u(p.id, i.property, a || void 0),
+                suggestions: [.../* @__PURE__ */ new Set([
+                  ...N[v] ?? [],
+                  ...i.options ?? []
+                ])],
+                onQueryChange: (a) => l == null ? void 0 : l(p.id, i.property, a, { prefetch: i.prefetch }),
+                placeholder: i.placeholder ?? ""
+              }
+            ) : i.type === "text" ? /* @__PURE__ */ m(
+              "input",
+              {
+                id: b,
+                type: "text",
+                value: r ?? "",
+                placeholder: i.placeholder ?? "",
+                onChange: (a) => u(p.id, i.property, a.target.value || void 0),
+                className: "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"
+              }
+            ) : i.type === "datetime" && i.range ? /* @__PURE__ */ m(
+              R,
+              {
+                id: b,
+                startValue: r && typeof r == "object" && "start" in r ? r.start : "",
+                endValue: r && typeof r == "object" && "end" in r ? r.end : "",
+                onStartChange: (a) => u(p.id, i.property, {
+                  start: a,
+                  end: r && typeof r == "object" && "end" in r ? r.end : ""
+                }),
+                onEndChange: (a) => u(p.id, i.property, {
+                  start: r && typeof r == "object" && "start" in r ? r.start : "",
+                  end: a
+                })
+              }
+            ) : i.type === "datetime" ? /* @__PURE__ */ m(
+              "input",
+              {
+                id: b,
+                type: "datetime-local",
+                value: r ?? "",
+                onChange: (a) => u(p.id, i.property, a.target.value || void 0),
+                className: "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"
+              }
+            ) : i.type === "number" ? /* @__PURE__ */ m(
+              P,
+              {
+                id: b,
+                field: i,
+                value: r,
+                onChange: (a) => u(p.id, i.property, a)
+              }
+            ) : i.type === "select" ? (() => {
+              const a = i, x = N[v] ?? [], w = a.options ?? [], n = [.../* @__PURE__ */ new Set([...x, ...w])];
+              return /* @__PURE__ */ h(
+                "select",
+                {
+                  id: b,
+                  value: r ?? "",
+                  onChange: (s) => u(p.id, i.property, s.target.value || void 0),
+                  className: "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",
+                  children: [
+                    /* @__PURE__ */ m("option", { value: "", children: i.placeholder ?? "Select..." }),
+                    n.map((s) => /* @__PURE__ */ m("option", { value: s, children: s }, s))
+                  ]
+                }
+              );
+            })() : null
+          ] }, i.property);
+        })
+      ] }, p.id);
+    })
+  ] });
+}
+export {
+  _ as S
+};

package/dist/components/BasemapEditor/BasemapEditor.d.ts

@@ -0,0 +1,7 @@
+import { BasemapConfig } from '../../types';
+export interface BasemapEditorProps {
+    value: BasemapConfig;
+    onChange: (basemap: BasemapConfig) => void;
+}
+export declare function BasemapEditor({ value, onChange }: BasemapEditorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BasemapEditor.d.ts.map

package/dist/components/BasemapEditor/BasemapEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasemapEditor.d.ts","sourceRoot":"","sources":["../../../src/components/BasemapEditor/BasemapEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGjD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;CAC5C;AAKD,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,kBAAkB,2CAqDpE"}

package/dist/components/BasemapEditor/BasemapList.d.ts

@@ -0,0 +1,7 @@
+import { BasemapConfig } from '../../types';
+export interface BasemapListProps {
+    basemaps: BasemapConfig[];
+    onChange: (basemaps: BasemapConfig[]) => void;
+}
+export declare function BasemapList({ basemaps, onChange }: BasemapListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BasemapList.d.ts.map

package/dist/components/BasemapEditor/BasemapList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasemapList.d.ts","sourceRoot":"","sources":["../../../src/components/BasemapEditor/BasemapList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAIjD,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,aAAa,EAAE,CAAC;IAC1B,QAAQ,EAAE,CAAC,QAAQ,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;CAC/C;AAID,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,gBAAgB,2CA4HnE"}

package/dist/components/BasemapEditor/index.d.ts

@@ -0,0 +1,5 @@
+export { BasemapEditor } from './BasemapEditor';
+export type { BasemapEditorProps } from './BasemapEditor';
+export { BasemapList } from './BasemapList';
+export type { BasemapListProps } from './BasemapList';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/BasemapEditor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/BasemapEditor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/CollectionBrowser/CollectionBrowser.d.ts

@@ -0,0 +1,8 @@
+export interface CollectionBrowserProps {
+    sourceUrl: string;
+    selectedCollectionIds: string[];
+    onSelect: (collectionId: string) => void;
+    onDeselect: (collectionId: string) => void;
+}
+export declare function CollectionBrowser({ sourceUrl, selectedCollectionIds, onSelect, onDeselect, }: CollectionBrowserProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CollectionBrowser.d.ts.map

package/dist/components/CollectionBrowser/CollectionBrowser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionBrowser.d.ts","sourceRoot":"","sources":["../../../src/components/CollectionBrowser/CollectionBrowser.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,qBAAqB,EAAE,MAAM,EAAE,CAAC;IAChC,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,UAAU,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,qBAAqB,EACrB,QAAQ,EACR,UAAU,GACX,EAAE,sBAAsB,2CAiExB"}