@element-editor/ui 0.0.0-stage → 0.2.0

package/dist/SettingsModal-DTP0Xx_Z.js

@@ -0,0 +1,237 @@
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import { useRef as G, useState as X, useCallback as J } from "react";
+import { u as P, i as S, W as Z, s as K } from "./index-CtZterPc.js";
+import { u as V } from "./useAccentStyle-CPo2XqAn.js";
+import { readStorage as q, writeStorage as Q } from "@element-editor/core";
+import { Sun as ee, Moon as re, Desktop as te, Monitor as se, GlobeHemisphereWest as ae } from "@phosphor-icons/react";
+import { u as s, f as M, d as oe } from "./useAdapterControls-DVjkwRZ_.js";
+import { u as le, a as ne, C as ie } from "./useWindowFocus-DGAWA1au.js";
+const E = "elm_settings_win_size", D = 320, C = 320, $ = { w: 384, h: 560 };
+function xe() {
+  const i = s((e) => e.settingsModalOpen), x = s((e) => e.setSettingsModalOpen), a = M((e) => e.geometryMode), p = M((e) => e.setGeometryMode), W = s((e) => e.setShowMeasurements), c = s((e) => e.showMeasurements), d = s((e) => e.showFeatureNameOnHover), H = s((e) => e.setShowFeatureNameOnHover), m = s((e) => e.topoEditEnabled), _ = s((e) => e.setTopoEditEnabled), h = s((e) => e.autoExitAfterDraw), z = s((e) => e.setAutoExitAfterDraw), u = s((e) => e.snapEnabled), T = s((e) => e.setSnapEnabled), v = s((e) => e.userTheme), I = s((e) => e.setUserTheme), A = oe(), { pos: y, onHandleMouseDown: O } = le("elm_settings_win", { x: 80, y: 80 }), g = V(), { zIndex: w, focus: j } = ne(i), b = G(null);
+  P(b, i, () => x(!1), w);
+  const [n, L] = X(() => {
+    try {
+      const e = q(E, g);
+      return e ? JSON.parse(e) : $;
+    } catch {
+      return $;
+    }
+  }), F = J((e, l) => {
+    Q(E, JSON.stringify({ w: e, h: l }), g);
+  }, [g]);
+  function R(e) {
+    e.preventDefault(), e.stopPropagation();
+    const l = e.clientX, f = e.clientY, U = n.w, B = n.h, Y = K("se-resize");
+    function k(o) {
+      L({
+        w: Math.max(D, Math.min(window.innerWidth * 0.9, U + o.clientX - l)),
+        h: Math.max(C, Math.min(window.innerHeight * 0.85, B + o.clientY - f))
+      });
+    }
+    function N() {
+      Y(), document.removeEventListener("mousemove", k), document.removeEventListener("mouseup", N);
+      const o = b.current;
+      o && F(o.offsetWidth, o.offsetHeight);
+    }
+    document.addEventListener("mousemove", k), document.addEventListener("mouseup", N);
+  }
+  return i ? /* @__PURE__ */ t(
+    "div",
+    {
+      ref: b,
+      [Z]: "",
+      role: "dialog",
+      "aria-label": "Settings",
+      onMouseDownCapture: j,
+      className: "fixed flex flex-col bg-elm-surface/95 backdrop-blur-md border border-elm-border/80 shadow-elm-raised rounded-elm-window overflow-hidden",
+      "data-elm-theme": A,
+      style: {
+        left: y.x,
+        top: y.y,
+        zIndex: w,
+        minWidth: D,
+        minHeight: C,
+        width: n.w,
+        height: n.h,
+        maxWidth: "90vw",
+        maxHeight: "85vh"
+      },
+      children: [
+        /* @__PURE__ */ t(
+          "div",
+          {
+            onMouseDown: O,
+            className: "flex items-center justify-between px-4 py-3 border-b border-elm-border flex-shrink-0 select-none",
+            style: { cursor: "grab" },
+            children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-900)) dark:text-(--elm-text,var(--color-gray-100))", children: "Settings" }),
+              /* @__PURE__ */ r(ie, { onClick: () => x(!1), label: "Close settings" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ t("div", { className: "flex-1 overflow-y-auto p-5 space-y-6 min-h-0", children: [
+          /* @__PURE__ */ t("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ r("h3", { className: "text-sm font-medium text-elm-text-secondary", children: "Appearance" }),
+            /* @__PURE__ */ r("div", { className: "flex rounded-elm border border-elm-border overflow-hidden", children: [
+              { value: "light", label: "Light", Icon: ee },
+              { value: "dark", label: "Dark", Icon: re },
+              { value: "system", label: "Auto", Icon: te }
+            ].map(({ value: e, label: l, Icon: f }) => /* @__PURE__ */ t(
+              "button",
+              {
+                onClick: () => I(e),
+                className: `flex-1 flex items-center justify-center gap-1.5 py-2 text-xs font-medium transition-colors ${v === e ? "bg-primary-500 hover:bg-primary-600 text-white" : "text-elm-text-muted hover:bg-elm-surface-hover hover:text-(--elm-text-secondary,var(--color-gray-700)) dark:hover:text-(--elm-text-secondary,var(--color-gray-200))"}`,
+                children: [
+                  /* @__PURE__ */ r(f, { size: 14, weight: v === e ? "fill" : "regular" }),
+                  l
+                ]
+              },
+              e
+            )) })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ r("h3", { className: "text-sm font-medium text-elm-text-secondary", children: "Drawing mode" }),
+            /* @__PURE__ */ t("div", { className: "grid grid-cols-2 gap-2", children: [
+              /* @__PURE__ */ t(
+                "button",
+                {
+                  onClick: () => p("visual"),
+                  className: `p-3 text-center rounded-elm border text-sm transition-colors ${a === "visual" ? "border-primary-500 bg-primary-50 dark:bg-white/5 hover:bg-primary-100 dark:hover:bg-white/10 ring-1 ring-primary-500/20" : "border-(--elm-border,var(--color-gray-200)) dark:border-(--elm-border,var(--color-gray-600)) bg-elm-surface-raised hover:border-(--elm-border-strong,var(--color-gray-300)) dark:hover:border-(--elm-border-strong,var(--color-gray-500)) hover:bg-(--elm-surface-hover,var(--color-gray-50)) dark:hover:bg-(--elm-surface-hover,color-mix(in_oklab,var(--color-gray-700)_50%,transparent))"}`,
+                  children: [
+                    /* @__PURE__ */ r(se, { size: 32, weight: a === "visual" ? "fill" : "regular", className: `mx-auto mb-2 ${a === "visual" ? "text-primary-600" : "text-elm-text-muted"}` }),
+                    /* @__PURE__ */ r("span", { className: `block mb-1 font-semibold ${a === "visual" ? "text-primary-800 dark:text-primary-300" : "text-(--elm-text-secondary,var(--color-gray-700)) dark:text-(--elm-text-secondary,var(--color-gray-200))"}`, children: "Visual" }),
+                    /* @__PURE__ */ r("p", { className: "text-xs leading-relaxed text-elm-text-muted", children: "Shapes keep their proportions on screen. Best for sketching and layouts." })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ t(
+                "button",
+                {
+                  onClick: () => p("spatial"),
+                  className: `p-3 text-center rounded-elm border text-sm transition-colors ${a === "spatial" ? "border-primary-500 bg-primary-50 dark:bg-white/5 hover:bg-primary-100 dark:hover:bg-white/10 ring-1 ring-primary-500/20" : "border-(--elm-border,var(--color-gray-200)) dark:border-(--elm-border,var(--color-gray-600)) bg-elm-surface-raised hover:border-(--elm-border-strong,var(--color-gray-300)) dark:hover:border-(--elm-border-strong,var(--color-gray-500)) hover:bg-(--elm-surface-hover,var(--color-gray-50)) dark:hover:bg-(--elm-surface-hover,color-mix(in_oklab,var(--color-gray-700)_50%,transparent))"}`,
+                  children: [
+                    /* @__PURE__ */ r(ae, { size: 32, weight: a === "spatial" ? "fill" : "regular", className: `mx-auto mb-2 ${a === "spatial" ? "text-primary-600" : "text-elm-text-muted"}` }),
+                    /* @__PURE__ */ r("span", { className: `block mb-1 font-semibold ${a === "spatial" ? "text-primary-800 dark:text-primary-300" : "text-(--elm-text-secondary,var(--color-gray-700)) dark:text-(--elm-text-secondary,var(--color-gray-200))"}`, children: "Spatial" }),
+                    /* @__PURE__ */ r("p", { className: "text-xs leading-relaxed text-elm-text-muted", children: "Shapes keep their true size on the ground. Best for exact areas and distances." })
+                  ]
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ r("div", { className: "pt-4 border-t border-elm-border-subtle", children: /* @__PURE__ */ t("label", { className: "flex items-center justify-between cursor-pointer group", children: [
+            /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5 pr-4", children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-800)) dark:text-(--elm-text,var(--color-gray-100))", children: "Show measurements" }),
+              /* @__PURE__ */ r("span", { className: "text-xs text-elm-text-muted", children: "Display live dimensions and coordinates at the cursor while drawing shapes." })
+            ] }),
+            /* @__PURE__ */ t("div", { className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-elm-focus-ring has-[:focus-visible]:ring-offset-2 has-[:focus-visible]:ring-offset-elm-surface ${c ? "bg-primary-500" : "bg-(--elm-border-strong,var(--color-gray-200)) dark:bg-(--elm-border-strong,var(--color-gray-600))"}`, children: [
+              /* @__PURE__ */ r("span", { className: `${c ? "translate-x-6" : "translate-x-1"} inline-block h-4 w-4 transform rounded-full bg-white transition-transform` }),
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  type: "checkbox",
+                  className: "sr-only",
+                  checked: c,
+                  onChange: (e) => W(e.target.checked)
+                }
+              )
+            ] })
+          ] }) }),
+          /* @__PURE__ */ r("div", { className: "pt-4 border-t border-elm-border-subtle", children: /* @__PURE__ */ t("label", { className: "flex items-center justify-between cursor-pointer group", children: [
+            /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5 pr-4", children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-800)) dark:text-(--elm-text,var(--color-gray-100))", children: "Show name on hover" }),
+              /* @__PURE__ */ r("span", { className: "text-xs text-elm-text-muted", children: "Display the feature name when hovering over shapes on the map." })
+            ] }),
+            /* @__PURE__ */ t("div", { className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-elm-focus-ring has-[:focus-visible]:ring-offset-2 has-[:focus-visible]:ring-offset-elm-surface ${d ? "bg-primary-500" : "bg-(--elm-border-strong,var(--color-gray-200)) dark:bg-(--elm-border-strong,var(--color-gray-600))"}`, children: [
+              /* @__PURE__ */ r("span", { className: `${d ? "translate-x-6" : "translate-x-1"} inline-block h-4 w-4 transform rounded-full bg-white transition-transform` }),
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  type: "checkbox",
+                  className: "sr-only",
+                  checked: d,
+                  onChange: (e) => H(e.target.checked)
+                }
+              )
+            ] })
+          ] }) }),
+          /* @__PURE__ */ r("div", { className: "pt-4 border-t border-elm-border-subtle", children: /* @__PURE__ */ t("label", { className: "flex items-center justify-between cursor-pointer group", children: [
+            /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5 pr-4", children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-800)) dark:text-(--elm-text,var(--color-gray-100))", children: "Topological editing" }),
+              /* @__PURE__ */ t("span", { className: "text-xs text-elm-text-muted", children: [
+                "When editing points, shared borders between areas update together. Hold ",
+                S() ? "⌘ Cmd" : "Ctrl",
+                " to temporarily disable."
+              ] })
+            ] }),
+            /* @__PURE__ */ t("div", { className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-elm-focus-ring has-[:focus-visible]:ring-offset-2 has-[:focus-visible]:ring-offset-elm-surface ${m ? "bg-primary-500" : "bg-(--elm-border-strong,var(--color-gray-200)) dark:bg-(--elm-border-strong,var(--color-gray-600))"}`, children: [
+              /* @__PURE__ */ r("span", { className: `${m ? "translate-x-6" : "translate-x-1"} inline-block h-4 w-4 transform rounded-full bg-white transition-transform` }),
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  type: "checkbox",
+                  className: "sr-only",
+                  checked: m,
+                  onChange: (e) => _(e.target.checked)
+                }
+              )
+            ] })
+          ] }) }),
+          /* @__PURE__ */ r("div", { className: "pt-4 border-t border-elm-border-subtle", children: /* @__PURE__ */ t("label", { className: "flex items-center justify-between cursor-pointer group", children: [
+            /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5 pr-4", children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-800)) dark:text-(--elm-text,var(--color-gray-100))", children: "Snapping" }),
+              /* @__PURE__ */ t("span", { className: "text-xs text-elm-text-muted", children: [
+                "Snap to nearby points and edges while drawing. Hold ",
+                S() ? "⌘ Cmd" : "Ctrl",
+                " to temporarily disable."
+              ] })
+            ] }),
+            /* @__PURE__ */ t("div", { className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-elm-focus-ring has-[:focus-visible]:ring-offset-2 has-[:focus-visible]:ring-offset-elm-surface ${u ? "bg-primary-500" : "bg-(--elm-border-strong,var(--color-gray-200)) dark:bg-(--elm-border-strong,var(--color-gray-600))"}`, children: [
+              /* @__PURE__ */ r("span", { className: `${u ? "translate-x-6" : "translate-x-1"} inline-block h-4 w-4 transform rounded-full bg-white transition-transform` }),
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  type: "checkbox",
+                  className: "sr-only",
+                  checked: u,
+                  onChange: (e) => T(e.target.checked)
+                }
+              )
+            ] })
+          ] }) }),
+          /* @__PURE__ */ r("div", { className: "pt-4 border-t border-elm-border-subtle", children: /* @__PURE__ */ t("label", { className: "flex items-center justify-between cursor-pointer group", children: [
+            /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5 pr-4", children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-800)) dark:text-(--elm-text,var(--color-gray-100))", children: "Return to select after each shape" }),
+              /* @__PURE__ */ r("span", { className: "text-xs text-elm-text-muted", children: "Drawing tools deactivate after every shape, so you go back to selection. Turn off to keep the tool active and draw multiple shapes in a row." })
+            ] }),
+            /* @__PURE__ */ t("div", { className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-elm-focus-ring has-[:focus-visible]:ring-offset-2 has-[:focus-visible]:ring-offset-elm-surface ${h ? "bg-primary-500" : "bg-(--elm-border-strong,var(--color-gray-200)) dark:bg-(--elm-border-strong,var(--color-gray-600))"}`, children: [
+              /* @__PURE__ */ r("span", { className: `${h ? "translate-x-6" : "translate-x-1"} inline-block h-4 w-4 transform rounded-full bg-white transition-transform` }),
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  type: "checkbox",
+                  className: "sr-only",
+                  checked: h,
+                  onChange: (e) => z(e.target.checked)
+                }
+              )
+            ] })
+          ] }) })
+        ] }),
+        /* @__PURE__ */ r(
+          "div",
+          {
+            onMouseDown: R,
+            className: "absolute bottom-0 right-0 w-4 h-4 cursor-se-resize select-none",
+            style: { zIndex: 10 },
+            "aria-hidden": !0,
+            children: /* @__PURE__ */ r("svg", { width: "10", height: "10", viewBox: "0 0 10 10", className: "absolute bottom-1 right-1 text-elm-text-disabled", children: /* @__PURE__ */ r("path", { d: "M9 1L1 9M9 5L5 9", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
+          }
+        )
+      ]
+    }
+  ) : null;
+}
+export {
+  xe as default
+};

package/dist/ShortcutsModal-CdyQlrqK.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),d=require("react"),v=require("./index-BKdDZ4Y9.cjs"),$=require("@phosphor-icons/react"),S=require("./useAdapterControls-BBObhzVX.cjs"),J=require("./useAccentStyle-hsGvyHZc.cjs"),b=require("@element-editor/core"),m=require("@element-editor/core/internal"),de=require("./EditToolbarBtn-dpCmKnzk.cjs"),D=require("./useWindowFocus-D-_yEm_V.cjs"),ue={"place-point":"point","draw-line":"line","draw-polygon":"polygon","draw-route":"route","draw-circle":"circle","draw-rect":"rectangle","draw-freehand":"freehand",picker:"picker"};function me({current:n,onCapture:s,onCancel:i}){const a=d.useRef(null);return d.useEffect(()=>{var r,l;(r=a.current)==null||r.focus(),(l=a.current)==null||l.select()},[]),t.jsx("input",{ref:a,readOnly:!0,value:n.toUpperCase(),size:1,onFocus:r=>r.currentTarget.select(),onKeyDown:r=>{if(r.preventDefault(),r.stopPropagation(),r.key==="Escape"){i();return}r.key.length===1&&!r.metaKey&&!r.ctrlKey&&!r.altKey&&r.key!==" "&&s(r.key.toLowerCase())},onBlur:i,"aria-label":"Press a key to rebind",className:"inline-block w-6 h-5 text-[11px] font-medium font-elm rounded-elm-chip border border-primary-400 bg-primary-50 text-primary-700 text-center p-0 outline-none caret-transparent selection:bg-primary-500 selection:text-white"})}function he(){const n=S.useUIStore(e=>e.shortcutsModalOpen),s=S.useUIStore(e=>e.closeShortcutsModal),i=S.useUIStore(e=>e.readonly),a=S.useUIStore(e=>e.unavailableTools),{tools:r,ui:l,toolbar:j}=J.useElementEditorConfig(),k=j.direction==="vertical",x=r==="all"?null:new Set(r);function p(e){if(e==="toggle-table")return l.dataTable;if(e==="toggle-geojson")return l.geojsonEditor;if(e==="toggle-schema")return l.schemaEditor;if(e==="toggle-sidebar")return l.layerList;if(e==="set-zoom")return l.zoomIndicator;const o=ue[e];return o&&a.includes(o)?!1:o&&x?x.has(o):!0}const{custom:g,getKey:G,setKey:Q,resetKey:ee,resetAll:te}=v.useShortcutConfig(),[E,T]=d.useState(null),[c,u]=d.useState(null),{pos:L,onHandleMouseDown:re}=D.useDragWindow("elm_shortcuts_win",{x:24,y:120}),N=J.useElementEditorConfig(),{zIndex:z,focus:oe}=D.useWindowFocus(n),H="elm_shortcuts_win_size",K=250,F=260,M=d.useRef(null);v.useWindowEscape(M,n,s,z);const[y,ne]=d.useState(()=>{try{const e=b.readStorage(H,N);return e?JSON.parse(e):{w:440,h:560}}catch{return{w:440,h:560}}}),se=d.useCallback((e,o)=>{b.writeStorage(H,JSON.stringify({w:e,h:o}),N)},[N]);function le(e){e.preventDefault(),e.stopPropagation();const o=e.clientX,f=e.clientY,w=y.w,O=y.h,R=v.startDragShield("se-resize");function V(h){ne({w:Math.max(K,Math.min(window.innerWidth*.9,w+h.clientX-o)),h:Math.max(F,Math.min(window.innerHeight*.85,O+h.clientY-f))})}function Y(){R(),document.removeEventListener("mousemove",V),document.removeEventListener("mouseup",Y);const h=M.current;h&&se(h.offsetWidth,h.offsetHeight)}document.addEventListener("mousemove",V),document.addEventListener("mouseup",Y)}if(d.useEffect(()=>{if(!n||E===null)return;function e(o){o.key==="Escape"&&(W(),o.stopPropagation())}return window.addEventListener("keydown",e,{capture:!0}),()=>window.removeEventListener("keydown",e,{capture:!0})},[n,E]),!n)return null;function ie(e,o){var w;const f=Q(e,o);if(f){const O=((w=m.CUSTOMIZABLE_SHORTCUTS.find(R=>R.id===f))==null?void 0:w.label)??f;u({id:e,msg:`"${o.toUpperCase()}" is already used by "${O}"`,attemptedKey:o});return}u(null),T(null)}function W(){T(null),u(null)}function ae(e){T(e),u(null)}function _(e){return{label:e.label,isChanged:g[e.id]!==void 0,isCapturing:E===e.id,keyDisplay:G(e.id),onStartCapture:()=>ae(e.id),onCapture:o=>ie(e.id,o),onCancelCapture:W,onReset:()=>{ee(e.id),u(null)},conflictMsg:(c==null?void 0:c.id)===e.id?c.msg:void 0,onDismissConflict:()=>u(null),captureDisplay:(c==null?void 0:c.id)===e.id?c.attemptedKey:void 0}}const A=m.CUSTOMIZABLE_SHORTCUTS.filter(e=>e.category==="drawing"&&!i&&p(e.id)),q=m.CUSTOMIZABLE_SHORTCUTS.filter(e=>e.category==="view"&&p(e.id)),B=m.CUSTOMIZABLE_SHORTCUTS.filter(e=>e.category==="editing"&&!i&&p(e.id)),P=m.FIXED_SHORTCUTS.filter(e=>e.category==="view"&&!(k&&e.label==="Search places")),X=i?[]:m.FIXED_SHORTCUTS.filter(e=>e.category==="editing"),Z=i?[]:m.FIXED_SHORTCUTS.filter(e=>e.category==="drawing"),ce=Object.keys(g).length>0;return t.jsxs("div",{ref:M,[v.WINDOW_ATTR]:"",role:"dialog","aria-label":"Keyboard shortcuts",onMouseDownCapture:oe,className:"fixed flex flex-col bg-elm-surface/95 backdrop-blur-md border border-elm-border/80 shadow-elm-raised rounded-elm-window overflow-hidden",style:{left:L.x,top:L.y,zIndex:z,minWidth:K,minHeight:F,width:y.w,height:y.h,maxWidth:"90vw",maxHeight:"85vh"},children:[t.jsxs("div",{onMouseDown:re,className:"flex items-center justify-between px-4 py-3 border-b border-elm-border flex-shrink-0 select-none",style:{cursor:"grab"},children:[t.jsx("span",{className:"text-sm font-semibold text-(--elm-text,var(--color-gray-900)) dark:text-(--elm-text,var(--color-gray-100))",children:"Keyboard shortcuts"}),t.jsx(D.CloseButton,{onClick:s,label:"Close keyboard shortcuts"})]}),t.jsxs("div",{className:"flex-1 overflow-y-auto px-4 pt-3 pb-2 space-y-4 min-h-0",children:[A.length>0&&t.jsx(C,{title:"Drawing tools",children:A.map(e=>t.jsx(U,{..._(e)},e.id))}),(q.length>0||P.length>0)&&t.jsxs(C,{title:"View",children:[q.map(e=>t.jsx(U,{..._(e)},e.id)),P.map(e=>t.jsx(I,{label:e.label,display:b.getFixedShortcutFullDisplay(e.id)},e.id))]}),(B.length>0||X.length>0)&&t.jsxs(C,{title:"Editing",children:[B.map(e=>t.jsx(U,{..._(e)},e.id)),X.map(e=>t.jsx(I,{label:e.label,display:b.getFixedShortcutFullDisplay(e.id)},e.id))]}),Z.length>0&&t.jsx(C,{title:"While drawing",children:Z.map(e=>t.jsx(I,{label:e.label,display:b.getFixedShortcutFullDisplay(e.id)},e.id))})]}),t.jsxs("div",{className:"flex-shrink-0 border-t border-elm-border-subtle px-6 py-2.5 flex items-center justify-between gap-3",children:[t.jsx("p",{className:"text-xs text-elm-text-subtle flex-1",children:"Click a key badge to rebind it"}),ce&&t.jsxs("button",{onClick:()=>{te(),u(null)},className:"flex items-center gap-1 text-xs text-elm-text-subtle hover:text-(--elm-text-secondary,var(--color-gray-700)) dark:hover:text-(--elm-text-secondary,var(--color-gray-300)) hover:bg-elm-surface-hover rounded-elm-chip px-1.5 py-0.5 -mr-1.5 transition-colors flex-shrink-0",children:[t.jsx($.ArrowCounterClockwise,{size:11}),"Reset all"]})]}),t.jsx("div",{onMouseDown:le,className:"absolute bottom-0 right-0 w-4 h-4 cursor-se-resize select-none",style:{zIndex:10},"aria-hidden":!0,children:t.jsx("svg",{width:"10",height:"10",viewBox:"0 0 10 10",className:"absolute bottom-1 right-1 text-elm-text-disabled",children:t.jsx("path",{d:"M9 1L1 9M9 5L5 9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})})})]})}function C({title:n,children:s}){return t.jsxs("section",{children:[t.jsx("h3",{className:"text-[10px] font-semibold text-elm-text-subtle uppercase tracking-wider mb-1.5 px-2",children:n}),t.jsx("div",{className:"space-y-0.5",children:s})]})}function U({label:n,isChanged:s,isCapturing:i,keyDisplay:a,onStartCapture:r,onCapture:l,onCancelCapture:j,onReset:k,conflictMsg:x,onDismissConflict:p,captureDisplay:g}){return t.jsxs("div",{className:"flex items-center justify-between py-1 px-2 rounded-elm-card hover:bg-(--elm-surface-hover,var(--color-gray-50)) dark:hover:bg-(--elm-surface-hover,var(--color-gray-800)) group",children:[t.jsx("span",{className:"text-sm text-elm-text-secondary",children:n}),t.jsxs("div",{className:"flex items-center gap-1.5 relative",children:[x&&t.jsxs("button",{type:"button",onClick:p,className:"absolute right-full mr-2 top-1/2 -translate-y-1/2 whitespace-nowrap bg-rose-500/95 text-white text-xs px-2.5 py-1.5 rounded-elm-card shadow-elm backdrop-blur-sm hover:bg-rose-600/95 transition-colors","aria-label":"Dismiss conflict message",children:[x,t.jsx("span",{"aria-hidden":!0,className:"absolute left-full top-1/2 -translate-y-1/2 border-4 border-transparent border-l-rose-500/95"})]}),s&&t.jsx("button",{onClick:k,className:"p-0.5 rounded-elm-chip text-elm-text hover:bg-(--elm-surface-hover,var(--color-gray-200)) dark:hover:bg-(--elm-surface-hover,var(--color-gray-700)) transition-colors","aria-label":"Reset to default",title:"Reset to default",children:t.jsx($.ArrowCounterClockwise,{size:14,weight:"bold"})}),i?t.jsx(me,{current:g??a,onCapture:l,onCancel:j},g??a):t.jsx("button",{onClick:r,title:"Click to rebind",className:"inline-flex items-center justify-center min-w-[1.5rem] h-5 px-1.5 text-[11px] font-medium font-elm rounded-elm-chip transition-colors border border-elm-border-strong bg-(--elm-surface-hover,var(--color-gray-100)) dark:bg-(--elm-surface-hover,var(--color-gray-700)) text-elm-text-muted shadow-[0_1px_0_0_rgba(0,0,0,0.15)] hover:bg-(--elm-control-hover,var(--color-gray-200)) dark:hover:bg-(--elm-control-hover,var(--color-gray-600)) hover:border-(--elm-border-strong,var(--color-gray-400)) dark:hover:border-(--elm-border-strong,var(--color-gray-500))",children:a.toUpperCase()})]})]})}function I({label:n,display:s}){return t.jsxs("div",{className:"flex items-center justify-between py-1 px-2 rounded-elm-card",children:[t.jsx("span",{className:"text-sm text-elm-text-secondary",children:n}),t.jsx(de.Kbd,{children:s})]})}exports.ShortcutsModal=he;

package/dist/ShortcutsModal-DwxZu71W.js

@@ -0,0 +1,299 @@
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import { useState as z, useRef as q, useCallback as me, useEffect as G } from "react";
+import { b as he, u as pe, W as fe, s as ge } from "./index-CtZterPc.js";
+import { ArrowCounterClockwise as Q } from "@phosphor-icons/react";
+import { u as y } from "./useAdapterControls-DVjkwRZ_.js";
+import { u as $ } from "./useAccentStyle-CPo2XqAn.js";
+import { readStorage as be, writeStorage as xe, getFixedShortcutFullDisplay as T } from "@element-editor/core";
+import { CUSTOMIZABLE_SHORTCUTS as w, FIXED_SHORTCUTS as W } from "@element-editor/core/internal";
+import { K as ye } from "./EditToolbarBtn-SZIsnIn3.js";
+import { u as we, a as ve, C as Ce } from "./useWindowFocus-DGAWA1au.js";
+const ke = {
+  "place-point": "point",
+  "draw-line": "line",
+  "draw-polygon": "polygon",
+  "draw-route": "route",
+  "draw-circle": "circle",
+  "draw-rect": "rectangle",
+  "draw-freehand": "freehand",
+  picker: "picker"
+};
+function Se({
+  current: n,
+  onCapture: a,
+  onCancel: s
+}) {
+  const c = q(null);
+  return G(() => {
+    var r, i;
+    (r = c.current) == null || r.focus(), (i = c.current) == null || i.select();
+  }, []), /* @__PURE__ */ t(
+    "input",
+    {
+      ref: c,
+      readOnly: !0,
+      value: n.toUpperCase(),
+      size: 1,
+      onFocus: (r) => r.currentTarget.select(),
+      onKeyDown: (r) => {
+        if (r.preventDefault(), r.stopPropagation(), r.key === "Escape") {
+          s();
+          return;
+        }
+        r.key.length === 1 && !r.metaKey && !r.ctrlKey && !r.altKey && r.key !== " " && a(r.key.toLowerCase());
+      },
+      onBlur: s,
+      "aria-label": "Press a key to rebind",
+      className: "inline-block w-6 h-5 text-[11px] font-medium font-elm rounded-elm-chip border border-primary-400 bg-primary-50 text-primary-700 text-center p-0 outline-none caret-transparent selection:bg-primary-500 selection:text-white"
+    }
+  );
+}
+function Re() {
+  const n = y((e) => e.shortcutsModalOpen), a = y((e) => e.closeShortcutsModal), s = y((e) => e.readonly), c = y((e) => e.unavailableTools), { tools: r, ui: i, toolbar: C } = $(), k = C.direction === "vertical", h = r === "all" ? null : new Set(r);
+  function p(e) {
+    if (e === "toggle-table") return i.dataTable;
+    if (e === "toggle-geojson") return i.geojsonEditor;
+    if (e === "toggle-schema") return i.schemaEditor;
+    if (e === "toggle-sidebar") return i.layerList;
+    if (e === "set-zoom") return i.zoomIndicator;
+    const o = ke[e];
+    return o && c.includes(o) ? !1 : o && h ? h.has(o) : !0;
+  }
+  const { custom: f, getKey: ee, setKey: te, resetKey: re, resetAll: oe } = he(), [S, N] = z(null), [d, u] = z(null), { pos: O, onHandleMouseDown: ne } = we("elm_shortcuts_win", { x: 24, y: 120 }), E = $(), { zIndex: I, focus: le } = ve(n), j = "elm_shortcuts_win_size", H = 250, U = 260, M = q(null);
+  pe(M, n, a, I);
+  const [b, ae] = z(() => {
+    try {
+      const e = be(j, E);
+      return e ? JSON.parse(e) : { w: 440, h: 560 };
+    } catch {
+      return { w: 440, h: 560 };
+    }
+  }), ie = me((e, o) => {
+    xe(j, JSON.stringify({ w: e, h: o }), E);
+  }, [E]);
+  function se(e) {
+    e.preventDefault(), e.stopPropagation();
+    const o = e.clientX, g = e.clientY, x = b.w, D = b.h, K = ge("se-resize");
+    function J(m) {
+      ae({
+        w: Math.max(H, Math.min(window.innerWidth * 0.9, x + m.clientX - o)),
+        h: Math.max(U, Math.min(window.innerHeight * 0.85, D + m.clientY - g))
+      });
+    }
+    function Z() {
+      K(), document.removeEventListener("mousemove", J), document.removeEventListener("mouseup", Z);
+      const m = M.current;
+      m && ie(m.offsetWidth, m.offsetHeight);
+    }
+    document.addEventListener("mousemove", J), document.addEventListener("mouseup", Z);
+  }
+  if (G(() => {
+    if (!n || S === null) return;
+    function e(o) {
+      o.key === "Escape" && (F(), o.stopPropagation());
+    }
+    return window.addEventListener("keydown", e, { capture: !0 }), () => window.removeEventListener("keydown", e, { capture: !0 });
+  }, [n, S]), !n) return null;
+  function ce(e, o) {
+    var x;
+    const g = te(e, o);
+    if (g) {
+      const D = ((x = w.find((K) => K.id === g)) == null ? void 0 : x.label) ?? g;
+      u({ id: e, msg: `"${o.toUpperCase()}" is already used by "${D}"`, attemptedKey: o });
+      return;
+    }
+    u(null), N(null);
+  }
+  function F() {
+    N(null), u(null);
+  }
+  function de(e) {
+    N(e), u(null);
+  }
+  function _(e) {
+    return {
+      label: e.label,
+      isChanged: f[e.id] !== void 0,
+      isCapturing: S === e.id,
+      keyDisplay: ee(e.id),
+      onStartCapture: () => de(e.id),
+      onCapture: (o) => ce(e.id, o),
+      onCancelCapture: F,
+      onReset: () => {
+        re(e.id), u(null);
+      },
+      conflictMsg: (d == null ? void 0 : d.id) === e.id ? d.msg : void 0,
+      onDismissConflict: () => u(null),
+      captureDisplay: (d == null ? void 0 : d.id) === e.id ? d.attemptedKey : void 0
+    };
+  }
+  const P = w.filter((e) => e.category === "drawing" && !s && p(e.id)), A = w.filter((e) => e.category === "view" && p(e.id)), B = w.filter((e) => e.category === "editing" && !s && p(e.id)), V = W.filter((e) => e.category === "view" && !(k && e.label === "Search places")), X = s ? [] : W.filter((e) => e.category === "editing"), Y = s ? [] : W.filter((e) => e.category === "drawing"), ue = Object.keys(f).length > 0;
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      ref: M,
+      [fe]: "",
+      role: "dialog",
+      "aria-label": "Keyboard shortcuts",
+      onMouseDownCapture: le,
+      className: "fixed flex flex-col bg-elm-surface/95 backdrop-blur-md border border-elm-border/80 shadow-elm-raised rounded-elm-window overflow-hidden",
+      style: {
+        left: O.x,
+        top: O.y,
+        zIndex: I,
+        minWidth: H,
+        minHeight: U,
+        width: b.w,
+        height: b.h,
+        maxWidth: "90vw",
+        maxHeight: "85vh"
+      },
+      children: [
+        /* @__PURE__ */ l(
+          "div",
+          {
+            onMouseDown: ne,
+            className: "flex items-center justify-between px-4 py-3 border-b border-elm-border flex-shrink-0 select-none",
+            style: { cursor: "grab" },
+            children: [
+              /* @__PURE__ */ t("span", { className: "text-sm font-semibold text-(--elm-text,var(--color-gray-900)) dark:text-(--elm-text,var(--color-gray-100))", children: "Keyboard shortcuts" }),
+              /* @__PURE__ */ t(Ce, { onClick: a, label: "Close keyboard shortcuts" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ l("div", { className: "flex-1 overflow-y-auto px-4 pt-3 pb-2 space-y-4 min-h-0", children: [
+          P.length > 0 && /* @__PURE__ */ t(v, { title: "Drawing tools", children: P.map((e) => /* @__PURE__ */ t(L, { ..._(e) }, e.id)) }),
+          (A.length > 0 || V.length > 0) && /* @__PURE__ */ l(v, { title: "View", children: [
+            A.map((e) => /* @__PURE__ */ t(L, { ..._(e) }, e.id)),
+            V.map((e) => /* @__PURE__ */ t(R, { label: e.label, display: T(e.id) }, e.id))
+          ] }),
+          (B.length > 0 || X.length > 0) && /* @__PURE__ */ l(v, { title: "Editing", children: [
+            B.map((e) => /* @__PURE__ */ t(L, { ..._(e) }, e.id)),
+            X.map((e) => /* @__PURE__ */ t(R, { label: e.label, display: T(e.id) }, e.id))
+          ] }),
+          Y.length > 0 && /* @__PURE__ */ t(v, { title: "While drawing", children: Y.map((e) => /* @__PURE__ */ t(R, { label: e.label, display: T(e.id) }, e.id)) })
+        ] }),
+        /* @__PURE__ */ l("div", { className: "flex-shrink-0 border-t border-elm-border-subtle px-6 py-2.5 flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ t("p", { className: "text-xs text-elm-text-subtle flex-1", children: "Click a key badge to rebind it" }),
+          ue && /* @__PURE__ */ l(
+            "button",
+            {
+              onClick: () => {
+                oe(), u(null);
+              },
+              className: "flex items-center gap-1 text-xs text-elm-text-subtle hover:text-(--elm-text-secondary,var(--color-gray-700)) dark:hover:text-(--elm-text-secondary,var(--color-gray-300)) hover:bg-elm-surface-hover rounded-elm-chip px-1.5 py-0.5 -mr-1.5 transition-colors flex-shrink-0",
+              children: [
+                /* @__PURE__ */ t(Q, { size: 11 }),
+                "Reset all"
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ t(
+          "div",
+          {
+            onMouseDown: se,
+            className: "absolute bottom-0 right-0 w-4 h-4 cursor-se-resize select-none",
+            style: { zIndex: 10 },
+            "aria-hidden": !0,
+            children: /* @__PURE__ */ t("svg", { width: "10", height: "10", viewBox: "0 0 10 10", className: "absolute bottom-1 right-1 text-elm-text-disabled", children: /* @__PURE__ */ t("path", { d: "M9 1L1 9M9 5L5 9", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
+          }
+        )
+      ]
+    }
+  );
+}
+function v({ title: n, children: a }) {
+  return /* @__PURE__ */ l("section", { children: [
+    /* @__PURE__ */ t("h3", { className: "text-[10px] font-semibold text-elm-text-subtle uppercase tracking-wider mb-1.5 px-2", children: n }),
+    /* @__PURE__ */ t("div", { className: "space-y-0.5", children: a })
+  ] });
+}
+function L({
+  label: n,
+  isChanged: a,
+  isCapturing: s,
+  keyDisplay: c,
+  onStartCapture: r,
+  onCapture: i,
+  onCancelCapture: C,
+  onReset: k,
+  conflictMsg: h,
+  onDismissConflict: p,
+  captureDisplay: f
+}) {
+  return /* @__PURE__ */ l("div", { className: "flex items-center justify-between py-1 px-2 rounded-elm-card hover:bg-(--elm-surface-hover,var(--color-gray-50)) dark:hover:bg-(--elm-surface-hover,var(--color-gray-800)) group", children: [
+    /* @__PURE__ */ t("span", { className: "text-sm text-elm-text-secondary", children: n }),
+    /* @__PURE__ */ l("div", { className: "flex items-center gap-1.5 relative", children: [
+      h && // Inline conflict popover — mirrors the project Tooltip's shape
+      // (px-2.5 py-1.5, rounded-lg, shadow-xl, backdrop-blur, 4px arrow)
+      // but in rose so it reads as an error. Click to dismiss.
+      /* @__PURE__ */ l(
+        "button",
+        {
+          type: "button",
+          onClick: p,
+          className: "absolute right-full mr-2 top-1/2 -translate-y-1/2 whitespace-nowrap bg-rose-500/95 text-white text-xs px-2.5 py-1.5 rounded-elm-card shadow-elm backdrop-blur-sm hover:bg-rose-600/95 transition-colors",
+          "aria-label": "Dismiss conflict message",
+          children: [
+            h,
+            /* @__PURE__ */ t(
+              "span",
+              {
+                "aria-hidden": !0,
+                className: "absolute left-full top-1/2 -translate-y-1/2 border-4 border-transparent border-l-rose-500/95"
+              }
+            )
+          ]
+        }
+      ),
+      a && // Always visible when the binding has been customized — used to live
+      // behind a hover gate, which made it discoverable only after pointing
+      // at the row. The customized state is now communicated by the
+      // presence of this icon alone (the key badge keeps its default
+      // styling) so the reset affordance can't be missed.
+      /* @__PURE__ */ t(
+        "button",
+        {
+          onClick: k,
+          className: "p-0.5 rounded-elm-chip text-elm-text hover:bg-(--elm-surface-hover,var(--color-gray-200)) dark:hover:bg-(--elm-surface-hover,var(--color-gray-700)) transition-colors",
+          "aria-label": "Reset to default",
+          title: "Reset to default",
+          children: /* @__PURE__ */ t(Q, { size: 14, weight: "bold" })
+        }
+      ),
+      s ? (
+        // `key` forces a remount (fresh focus+select useEffect) whenever
+        // the displayed value flips between the stored key and a failed
+        // attempt — without it the selection wouldn't re-happen after a
+        // conflict and the user would see an unselected caret.
+        /* @__PURE__ */ t(
+          Se,
+          {
+            current: f ?? c,
+            onCapture: i,
+            onCancel: C
+          },
+          f ?? c
+        )
+      ) : /* @__PURE__ */ t(
+        "button",
+        {
+          onClick: r,
+          title: "Click to rebind",
+          className: "inline-flex items-center justify-center min-w-[1.5rem] h-5 px-1.5 text-[11px] font-medium font-elm rounded-elm-chip transition-colors border border-elm-border-strong bg-(--elm-surface-hover,var(--color-gray-100)) dark:bg-(--elm-surface-hover,var(--color-gray-700)) text-elm-text-muted shadow-[0_1px_0_0_rgba(0,0,0,0.15)] hover:bg-(--elm-control-hover,var(--color-gray-200)) dark:hover:bg-(--elm-control-hover,var(--color-gray-600)) hover:border-(--elm-border-strong,var(--color-gray-400)) dark:hover:border-(--elm-border-strong,var(--color-gray-500))",
+          children: c.toUpperCase()
+        }
+      )
+    ] })
+  ] });
+}
+function R({ label: n, display: a }) {
+  return /* @__PURE__ */ l("div", { className: "flex items-center justify-between py-1 px-2 rounded-elm-card", children: [
+    /* @__PURE__ */ t("span", { className: "text-sm text-elm-text-secondary", children: n }),
+    /* @__PURE__ */ t(ye, { children: a })
+  ] });
+}
+export {
+  Re as ShortcutsModal
+};

package/dist/components/ActiveDrawingToolbar.d.cts

@@ -0,0 +1 @@
+export default function ActiveDrawingToolbar(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ActiveDrawingToolbar.d.ts

@@ -0,0 +1 @@
+export default function ActiveDrawingToolbar(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/BasemapPicker.d.cts

@@ -0,0 +1,26 @@
+import { IconButtonSize } from './ui/IconButton.cjs';
+import { TooltipSide } from './ui/Tooltip.cjs';
+export interface BasemapPickerOption {
+    id: string;
+    label: string;
+    /** Image URL, or two (shown side by side, e.g. light + dark for a theme-following option). */
+    thumbnail?: string | [string, string];
+}
+export interface BasemapPickerProps {
+    options: BasemapPickerOption[];
+    value: string;
+    onChange: (id: string) => void;
+    /** Button label and the panel's accessible name. Default: 'Basemap'. */
+    label?: string;
+    size?: IconButtonSize;
+    tooltipSide?: TooltipSide;
+}
+/**
+ * Basemap switcher: an icon button that opens a panel of thumbnail tiles.
+ * Engine-neutral: it applies nothing, the host reacts to `onChange`.
+ * The panel opens away from the screen edge the button sits on and stays open until the user
+ * closes it (the button again, or Escape); picking a basemap or using the map keeps it open.
+ * Opening focuses the active tile (the panel is portalled to the end of <body>); Escape
+ * returns focus to the button.
+ */
+export declare function BasemapPicker({ options, value, onChange, label, size, tooltipSide }: BasemapPickerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/BasemapPicker.d.ts

@@ -0,0 +1,26 @@
+import { IconButtonSize } from './ui/IconButton.js';
+import { TooltipSide } from './ui/Tooltip.js';
+export interface BasemapPickerOption {
+    id: string;
+    label: string;
+    /** Image URL, or two (shown side by side, e.g. light + dark for a theme-following option). */
+    thumbnail?: string | [string, string];
+}
+export interface BasemapPickerProps {
+    options: BasemapPickerOption[];
+    value: string;
+    onChange: (id: string) => void;
+    /** Button label and the panel's accessible name. Default: 'Basemap'. */
+    label?: string;
+    size?: IconButtonSize;
+    tooltipSide?: TooltipSide;
+}
+/**
+ * Basemap switcher: an icon button that opens a panel of thumbnail tiles.
+ * Engine-neutral: it applies nothing, the host reacts to `onChange`.
+ * The panel opens away from the screen edge the button sits on and stays open until the user
+ * closes it (the button again, or Escape); picking a basemap or using the map keeps it open.
+ * Opening focuses the active tile (the panel is portalled to the end of <body>); Escape
+ * returns focus to the button.
+ */
+export declare function BasemapPicker({ options, value, onChange, label, size, tooltipSide }: BasemapPickerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/BooleanOperations.d.cts

@@ -0,0 +1 @@
+export default function BooleanOperations(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/BooleanOperations.d.ts

@@ -0,0 +1 @@
+export default function BooleanOperations(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/BufferPanel.d.cts

@@ -0,0 +1 @@
+export default function BufferPanel(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/BufferPanel.d.ts

@@ -0,0 +1 @@
+export default function BufferPanel(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/DataTable.d.cts

@@ -0,0 +1,9 @@
+interface Props {
+    schemaFilter: string;
+    focusRowId?: string | null;
+    onFocusRowHandled?: () => void;
+    selectedRows: ReadonlySet<string>;
+    onSelectedRowsChange: (ids: ReadonlySet<string>) => void;
+}
+export default function DataTable({ schemaFilter, focusRowId, onFocusRowHandled, selectedRows, onSelectedRowsChange }: Props): import("react/jsx-runtime").JSX.Element;
+export {};