@edugis-org/webmapx 0.1.8 → 0.1.10

package/dist-lib/webmapx-settings-EHSm-AGU.js

@@ -1,167 +0,0 @@
-import { c as e, d as t, l as n, r, s as i, t as a, u as o } from "./decorate-DnZTfaod.js";
-import { LitElement as s, css as c, html as l } from "lit";
-import { customElement as u, state as d } from "lit/decorators.js";
-import "@shoelace-style/shoelace/dist/components/input/input.js";
-import "@shoelace-style/shoelace/dist/components/divider/divider.js";
-import "@shoelace-style/shoelace/dist/components/select/select.js";
-import "@shoelace-style/shoelace/dist/components/option/option.js";
-import "@shoelace-style/shoelace/dist/components/switch/switch.js";
-//#region src/components/webmapx-settings.ts
-var f = class extends s {
-	constructor(...e) {
-		super(...e), this.darkMode = !1, this.apiKey = "", this.currentAdapter = o, this.availableAdapters = [];
-	}
-	static {
-		this.styles = c`
-        :host {
-            display: block;
-            padding: 1rem;
-            box-sizing: border-box;
-        }
-
-        .setting-group {
-            margin-bottom: 1.5rem;
-        }
-
-        .setting-group:last-child {
-            margin-bottom: 0;
-        }
-
-        h4 {
-            margin: 0 0 0.75rem 0;
-            font-size: 0.875rem;
-            font-weight: 600;
-            color: var(--color-text-secondary, #666);
-            text-transform: uppercase;
-            letter-spacing: 0.05em;
-        }
-
-        sl-switch {
-            --sl-toggle-size-medium: 1.25rem;
-        }
-
-        sl-input {
-            margin-top: 0.5rem;
-        }
-
-        sl-select {
-            margin-top: 0.5rem;
-        }
-
-        sl-select::part(combobox) {
-            min-height: 2.5rem;
-        }
-    `;
-	}
-	connectedCallback() {
-		super.connectedCallback(), this.loadSettings();
-	}
-	loadSettings() {
-		let e = localStorage.getItem("webmapx-theme");
-		e ? this.darkMode = e === "dark" : this.darkMode = window.matchMedia("(prefers-color-scheme: dark)").matches, this.applyTheme(), this.apiKey = localStorage.getItem("webmapx-api-key") || "", this.availableAdapters = t().filter((e) => ![
-			"ol",
-			"l",
-			"c"
-		].includes(e)), this.currentAdapter = this.detectCurrentAdapter();
-	}
-	getMapStorageKey(e, t) {
-		return i(e.id, t);
-	}
-	detectCurrentAdapter() {
-		let e = r(this);
-		if (!e) return o;
-		let t = this.getMapStorageKey(e, "adapter"), i = n({
-			explicitAdapter: e.getAttribute("adapter") ?? e.getAttribute("type"),
-			savedAdapter: t ? localStorage.getItem(t) : null,
-			configuredAdapter: e.mapConfig?.type ?? null,
-			defaultAdapter: o
-		});
-		return this.availableAdapters.includes(i) ? i : o;
-	}
-	applyTheme() {
-		let e = document.documentElement;
-		this.darkMode ? (e.setAttribute("data-theme", "dark"), e.classList.add("sl-theme-dark")) : (e.removeAttribute("data-theme"), e.classList.remove("sl-theme-dark")), localStorage.setItem("webmapx-theme", this.darkMode ? "dark" : "light");
-	}
-	handleThemeChange(e) {
-		let t = e.target;
-		this.darkMode = t.checked, this.applyTheme(), this.dispatchEvent(new CustomEvent("theme-change", {
-			detail: { theme: this.darkMode ? "dark" : "light" },
-			bubbles: !0,
-			composed: !0
-		}));
-	}
-	handleApiKeyChange(e) {
-		let t = e.target;
-		this.apiKey = t.value, localStorage.setItem("webmapx-api-key", this.apiKey), this.dispatchEvent(new CustomEvent("apikey-change", {
-			detail: { apiKey: this.apiKey },
-			bubbles: !0,
-			composed: !0
-		}));
-	}
-	handleAdapterChange(t) {
-		let n = t.target, i = e(n.value);
-		if (!i || i === this.currentAdapter) return;
-		let a = r(this);
-		if (!a) {
-			console.error("[webmapx-settings] No <webmapx-map> found for adapter switching.");
-			return;
-		}
-		let o = this.getMapStorageKey(a, "adapter");
-		a.saveState?.(), o && localStorage.setItem(o, i), window.location.reload();
-	}
-	formatAdapterName(e) {
-		return {
-			maplibre: "MapLibre GL",
-			openlayers: "OpenLayers",
-			leaflet: "Leaflet",
-			cesium: "Cesium"
-		}[e] || e;
-	}
-	render() {
-		return l`
-            <div class="setting-group">
-                <h4>Map Engine</h4>
-                <sl-select
-                    label="Adapter"
-                    value=${this.currentAdapter}
-                    @sl-change=${this.handleAdapterChange}
-                >
-                    ${this.availableAdapters.map((e) => l`
-                        <sl-option value=${e}>
-                            ${this.formatAdapterName(e)}
-                        </sl-option>
-                    `)}
-                </sl-select>
-            </div>
-
-            <sl-divider></sl-divider>
-
-            <div class="setting-group">
-                <h4>Appearance</h4>
-                <sl-switch
-                    ?checked=${this.darkMode}
-                    @sl-change=${this.handleThemeChange}
-                >
-                    Dark Mode
-                </sl-switch>
-            </div>
-
-            <sl-divider></sl-divider>
-
-            <div class="setting-group">
-                <h4>API Configuration</h4>
-                <sl-input
-                    label="API Key"
-                    type="password"
-                    password-toggle
-                    value=${this.apiKey}
-                    @sl-input=${this.handleApiKeyChange}
-                    placeholder="Enter your API key"
-                ></sl-input>
-            </div>
-        `;
-	}
-};
-a([d()], f.prototype, "darkMode", void 0), a([d()], f.prototype, "apiKey", void 0), a([d()], f.prototype, "currentAdapter", void 0), a([d()], f.prototype, "availableAdapters", void 0), f = a([u("webmapx-settings")], f);
-//#endregion
-export { f as WebmapxSettings };