@mcp-b/geo-openlayers 0.2.21 → 0.3.0

package/dist/control-CTiiOtzM.js

@@ -1,59 +0,0 @@
-import { t as __decorate } from "./decorate-DcF3lt7P.js";
-import { LitElement, css, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import Control from "ol/control/Control.js";
-//#region src/components/control/control.styles.ts
-var control_styles_default = css`
-  :host {
-    display: none;
-  }
-`;
-//#endregion
-//#region src/components/control/control.ts
-const POSITION_CSS = {
-	"top-left": "top: 0.5em; left: 0.5em;",
-	"top-right": "top: 0.5em; right: 0.5em;",
-	"bottom-left": "bottom: 0.5em; left: 0.5em;",
-	"bottom-right": "bottom: 0.5em; right: 0.5em;"
-};
-let SigveloOlControl = class SigveloOlControl extends LitElement {
-	constructor(..._args) {
-		super(..._args);
-		this.position = "bottom-left";
-		this._control = null;
-		this._mapEl = null;
-	}
-	static {
-		this.styles = [control_styles_default];
-	}
-	async connectedCallback() {
-		super.connectedCallback();
-		this._mapEl = this.closest("sigvelo-ol-map");
-		if (this._mapEl) {
-			await this._mapEl.mapReady;
-			this._addControl();
-		}
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		if (this._control && this._mapEl?.map) this._mapEl.map.removeControl(this._control);
-		this._control = null;
-	}
-	/** @internal */
-	_addControl() {
-		if (!this._mapEl?.map) return;
-		const container = document.createElement("div");
-		container.className = "ol-control sigvelo-ol-custom-control";
-		container.style.cssText = `position: absolute; ${POSITION_CSS[this.position]} pointer-events: auto;`;
-		for (const child of Array.from(this.children)) container.appendChild(child);
-		this._control = new Control({ element: container });
-		this._mapEl.map.addControl(this._control);
-	}
-	render() {
-		return html` <slot></slot> `;
-	}
-};
-__decorate([property()], SigveloOlControl.prototype, "position", void 0);
-SigveloOlControl = __decorate([customElement("sigvelo-ol-control")], SigveloOlControl);
-//#endregion
-export { SigveloOlControl as t };

package/dist/geojson-BU-tOeyz.js

@@ -1,184 +0,0 @@
-import { t as __decorate } from "./decorate-DcF3lt7P.js";
-import { LitElement, css, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { SigveloFeatureClickEvent } from "@mcp-b/geo-support/events";
-import { toLonLat } from "ol/proj.js";
-import { subscribeClassify } from "@mcp-b/geo-support/classification";
-import VectorLayer from "ol/layer/Vector.js";
-import VectorSource from "ol/source/Vector.js";
-import GeoJSON from "ol/format/GeoJSON.js";
-import { Circle, Fill, Stroke, Style } from "ol/style.js";
-//#region src/components/geojson/geojson.styles.ts
-var geojson_styles_default = css`
-  :host {
-    display: none;
-  }
-`;
-//#endregion
-//#region src/components/geojson/geojson.ts
-let SigveloOlGeojson = class SigveloOlGeojson extends LitElement {
-	constructor(..._args) {
-		super(..._args);
-		this.data = null;
-		this.styleFunction = null;
-		this.fillColor = "#3388ff";
-		this.fillOpacity = .2;
-		this.strokeColor = "#3388ff";
-		this.strokeWidth = 2;
-		this.circleRadius = 6;
-		this.interactive = true;
-		this.channel = "";
-		this._layer = null;
-		this._mapEl = null;
-		this._unsubscribeChannel = null;
-	}
-	static {
-		this.styles = [geojson_styles_default];
-	}
-	async connectedCallback() {
-		super.connectedCallback();
-		this._subscribeChannel();
-		this._mapEl = this.closest("sigvelo-ol-map");
-		if (this._mapEl) {
-			await this._mapEl.mapReady;
-			this._addLayer();
-			this._bindClickHandler();
-		}
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		this._unsubscribeChannel?.();
-		this._unsubscribeChannel = null;
-		this._removeLayer();
-	}
-	/** @internal */
-	_subscribeChannel() {
-		this._unsubscribeChannel?.();
-		if (!this.channel) return;
-		this._unsubscribeChannel = subscribeClassify(this.channel, (detail) => {
-			this.styleFunction = detail.styleFunction;
-		});
-	}
-	/** @internal Convert an OL Feature to a GeoJsonFeature for the styleFunction. */
-	_toGeoJsonFeature(olFeature) {
-		const { geometry: _g, ...rest } = olFeature.getProperties();
-		return {
-			type: "Feature",
-			geometry: {
-				type: olFeature.getGeometry()?.getType() ?? "Point",
-				coordinates: null
-			},
-			properties: rest,
-			id: olFeature.getId()
-		};
-	}
-	/** @internal */
-	_addLayer() {
-		if (!this._mapEl?.map || !this.data) return;
-		const source = new VectorSource({ features: new GeoJSON().readFeatures(this.data, { featureProjection: "EPSG:3857" }) });
-		const defaultStyle = new Style({
-			fill: new Fill({ color: this._hexToRgba(this.fillColor, this.fillOpacity) }),
-			stroke: new Stroke({
-				color: this.strokeColor,
-				width: this.strokeWidth
-			}),
-			image: new Circle({
-				radius: this.circleRadius,
-				fill: new Fill({ color: this.fillColor }),
-				stroke: new Stroke({
-					color: this.strokeColor,
-					width: this.strokeWidth
-				})
-			})
-		});
-		const styleFn = this.styleFunction;
-		const olStyleFn = styleFn ? (olFeature) => {
-			const s = styleFn(this._toGeoJsonFeature(olFeature));
-			if (!s) return defaultStyle;
-			return new Style({
-				fill: new Fill({ color: this._hexToRgba(s.fillColor ?? this.fillColor, s.fillOpacity ?? this.fillOpacity) }),
-				stroke: new Stroke({
-					color: s.strokeColor ?? this.strokeColor,
-					width: s.strokeWidth ?? this.strokeWidth
-				}),
-				image: new Circle({
-					radius: this.circleRadius,
-					fill: new Fill({ color: this._hexToRgba(s.fillColor ?? this.fillColor, s.fillOpacity ?? this.fillOpacity) }),
-					stroke: new Stroke({
-						color: s.strokeColor ?? this.strokeColor,
-						width: s.strokeWidth ?? this.strokeWidth
-					})
-				})
-			});
-		} : defaultStyle;
-		this._layer = new VectorLayer({
-			source,
-			style: olStyleFn
-		});
-		this._mapEl.map.addLayer(this._layer);
-	}
-	/** @internal */
-	_removeLayer() {
-		if (this._layer && this._mapEl?.map) this._mapEl.map.removeLayer(this._layer);
-		this._layer = null;
-	}
-	/** @internal */
-	_bindClickHandler() {
-		if (!this.interactive || !this._mapEl?.map) return;
-		this._mapEl.map.on("click", (e) => {
-			if (!this._mapEl?.map) return;
-			this._mapEl.map.forEachFeatureAtPixel(e.pixel, (feature) => {
-				const geom = feature.getGeometry();
-				if (!geom) return;
-				const [lng, lat] = toLonLat(e.coordinate);
-				const { geometry: _geom, ...rest } = feature.getProperties();
-				this.dispatchEvent(new SigveloFeatureClickEvent({
-					type: "Feature",
-					geometry: {
-						type: geom.getType(),
-						coordinates: null
-					},
-					properties: rest,
-					id: feature.getId()
-				}, {
-					lat,
-					lng
-				}));
-			}, { layerFilter: (l) => l === this._layer });
-		});
-	}
-	/** @internal */
-	_hexToRgba(hex, opacity) {
-		return `rgba(${parseInt(hex.slice(1, 3), 16)}, ${parseInt(hex.slice(3, 5), 16)}, ${parseInt(hex.slice(5, 7), 16)}, ${opacity})`;
-	}
-	updated(changed) {
-		if (changed.has("data") || changed.has("styleFunction") || changed.has("fillColor") || changed.has("fillOpacity") || changed.has("strokeColor") || changed.has("strokeWidth") || changed.has("circleRadius")) {
-			this._removeLayer();
-			this._addLayer();
-		}
-	}
-	render() {
-		return html``;
-	}
-};
-__decorate([property({ attribute: false })], SigveloOlGeojson.prototype, "data", void 0);
-__decorate([property({ attribute: false })], SigveloOlGeojson.prototype, "styleFunction", void 0);
-__decorate([property({ attribute: "fill-color" })], SigveloOlGeojson.prototype, "fillColor", void 0);
-__decorate([property({
-	attribute: "fill-opacity",
-	type: Number
-})], SigveloOlGeojson.prototype, "fillOpacity", void 0);
-__decorate([property({ attribute: "stroke-color" })], SigveloOlGeojson.prototype, "strokeColor", void 0);
-__decorate([property({
-	attribute: "stroke-width",
-	type: Number
-})], SigveloOlGeojson.prototype, "strokeWidth", void 0);
-__decorate([property({
-	attribute: "circle-radius",
-	type: Number
-})], SigveloOlGeojson.prototype, "circleRadius", void 0);
-__decorate([property({ type: Boolean })], SigveloOlGeojson.prototype, "interactive", void 0);
-__decorate([property()], SigveloOlGeojson.prototype, "channel", void 0);
-SigveloOlGeojson = __decorate([customElement("sigvelo-ol-geojson")], SigveloOlGeojson);
-//#endregion
-export { SigveloOlGeojson as t };

package/dist/map-eGQh7n8O.js

@@ -1,146 +0,0 @@
-import { t as __decorate } from "./decorate-DcF3lt7P.js";
-import { css, unsafeCSS } from "lit";
-import { customElement } from "lit/decorators.js";
-import { GeoMapElement } from "@mcp-b/geo-support/base/geo-map-element";
-import { SigveloMapClickEvent, SigveloMapLoadEvent, SigveloMapMoveEndEvent, SigveloMapMoveEvent, SigveloMapZoomEndEvent, SigveloMapZoomEvent } from "@mcp-b/geo-support/events";
-import OlMap from "ol/Map.js";
-import View from "ol/View.js";
-import { fromLonLat, toLonLat } from "ol/proj.js";
-import olCss from "ol/ol.css?raw";
-//#region src/components/map/map.styles.ts
-var map_styles_default = css`
-  :host {
-    display: block;
-    position: relative;
-    min-height: 300px;
-  }
-`;
-//#endregion
-//#region src/components/map/map.ts
-let SigveloOlMap = class SigveloOlMap extends GeoMapElement {
-	constructor(..._args) {
-		super(..._args);
-		this._map = null;
-		this._view = null;
-	}
-	static {
-		this.styles = [
-			...GeoMapElement.styles,
-			unsafeCSS(olCss),
-			map_styles_default
-		];
-	}
-	/** Access the underlying OpenLayers map instance (after mapReady resolves). */
-	get map() {
-		return this._map;
-	}
-	/** Access the underlying OpenLayers view instance. */
-	get view() {
-		return this._view;
-	}
-	createMap(container) {
-		this._view = new View({
-			center: fromLonLat([this.longitude, this.latitude]),
-			zoom: this.zoom,
-			minZoom: this.minZoom,
-			maxZoom: this.maxZoom,
-			rotation: this.bearing * Math.PI / 180
-		});
-		this._map = new OlMap({
-			target: container,
-			view: this._view
-		});
-		this._map.on("click", (e) => {
-			const [lng, lat] = toLonLat(e.coordinate);
-			this.dispatchEvent(new SigveloMapClickEvent({
-				lat,
-				lng
-			}, e.originalEvent));
-		});
-		this._view.on("change:center", () => {
-			if (!this._view) return;
-			const center = this._view.getCenter();
-			if (!center) return;
-			const [lng, lat] = toLonLat(center);
-			this._suppressExternalUpdate = true;
-			this.latitude = lat;
-			this.longitude = lng;
-			this._suppressExternalUpdate = false;
-			this.dispatchEvent(new SigveloMapMoveEvent({
-				lat,
-				lng
-			}));
-		});
-		this._view.on("change:resolution", () => {
-			if (!this._view) return;
-			const zoom = this._view.getZoom() ?? this.zoom;
-			this._suppressExternalUpdate = true;
-			this.zoom = zoom;
-			this._suppressExternalUpdate = false;
-			this.dispatchEvent(new SigveloMapZoomEvent(zoom));
-		});
-		this._map.on("moveend", () => {
-			if (!this._view) return;
-			const center = this._view.getCenter();
-			if (!center) return;
-			const [lng, lat] = toLonLat(center);
-			const zoom = this._view.getZoom() ?? this.zoom;
-			this.dispatchEvent(new SigveloMapMoveEndEvent({
-				lat,
-				lng
-			}));
-			this.dispatchEvent(new SigveloMapZoomEndEvent(zoom));
-		});
-		this._map.once("rendercomplete", () => {
-			this._resolveMapReady();
-			this.dispatchEvent(new SigveloMapLoadEvent());
-		});
-	}
-	destroyMap() {
-		this._map?.setTarget(void 0);
-		this._map = null;
-		this._view = null;
-	}
-	updateView(changed) {
-		if (!this._view) return;
-		if (changed.has("latitude") || changed.has("longitude")) this._view.setCenter(fromLonLat([this.longitude, this.latitude]));
-		if (changed.has("zoom")) this._view.setZoom(this.zoom);
-		if (changed.has("bearing")) this._view.setRotation(this.bearing * Math.PI / 180);
-		if (changed.has("minZoom")) this._view.setMinZoom(this.minZoom);
-		if (changed.has("maxZoom")) this._view.setMaxZoom(this.maxZoom);
-	}
-	invalidateSize() {
-		this._map?.updateSize();
-	}
-	flyTo(options) {
-		this._view?.animate({
-			center: fromLonLat([options.center.lng, options.center.lat]),
-			zoom: options.zoom,
-			rotation: options.bearing ? options.bearing * Math.PI / 180 : void 0,
-			duration: options.duration ?? 1e3
-		});
-	}
-	fitBounds(options) {
-		if (!this._view || !this._map) return;
-		const sw = fromLonLat([options.bounds.west, options.bounds.south]);
-		const ne = fromLonLat([options.bounds.east, options.bounds.north]);
-		this._view.fit([
-			sw[0],
-			sw[1],
-			ne[0],
-			ne[1]
-		], {
-			padding: options.padding ? [
-				options.padding,
-				options.padding,
-				options.padding,
-				options.padding
-			] : void 0,
-			maxZoom: options.maxZoom,
-			duration: options.duration ?? 1e3
-		});
-	}
-};
-SigveloOlMap = __decorate([customElement("sigvelo-ol-map")], SigveloOlMap);
-//#endregion
-export { SigveloOlMap as t };

package/dist/marker-DEG_oTfJ.js

@@ -1,124 +0,0 @@
-import { t as __decorate } from "./decorate-DcF3lt7P.js";
-import { LitElement, css, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { fromLonLat } from "ol/proj.js";
-import Overlay from "ol/Overlay.js";
-//#region src/components/marker/marker.styles.ts
-var marker_styles_default = css`
-  :host {
-    display: none;
-  }
-
-  .marker-icon {
-    width: 25px;
-    height: 41px;
-    cursor: pointer;
-    transform: translate(-50%, -100%);
-  }
-
-  .marker-icon--default {
-    width: 25px;
-    height: 41px;
-    position: relative;
-  }
-
-  .marker-icon--default svg {
-    width: 100%;
-    height: 100%;
-    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
-  }
-`;
-//#endregion
-//#region src/components/marker/marker.ts
-let SigveloOlMarker = class SigveloOlMarker extends LitElement {
-	constructor(..._args) {
-		super(..._args);
-		this.latitude = 0;
-		this.longitude = 0;
-		this.color = "#3fb1ce";
-		this.title = "";
-		this._overlay = null;
-		this._markerEl = null;
-		this._mapEl = null;
-		this._popupOverlay = null;
-	}
-	static {
-		this.styles = [marker_styles_default];
-	}
-	async connectedCallback() {
-		super.connectedCallback();
-		this._mapEl = this.closest("sigvelo-ol-map");
-		if (this._mapEl) {
-			await this._mapEl.mapReady;
-			this._addMarker();
-		}
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		if (this._overlay && this._mapEl?.map) this._mapEl.map.removeOverlay(this._overlay);
-		this._overlay = null;
-		this._markerEl = null;
-	}
-	/** @internal */
-	_addMarker() {
-		if (!this._mapEl?.map) return;
-		this._markerEl = document.createElement("div");
-		if (this.title) this._markerEl.title = this.title;
-		this._markerEl.style.cursor = "pointer";
-		this._markerEl.innerHTML = `
-      <svg viewBox="0 0 27 43" xmlns="http://www.w3.org/2000/svg"
-           width="25" height="41"
-           style="filter: drop-shadow(0 1px 3px rgba(0,0,0,0.3));">
-        <path d="M13.5 0C6 0 0 6 0 13.5C0 25 13.5 43 13.5 43S27 25 27 13.5C27 6 21 0 13.5 0Z"
-              fill="${this.color}" stroke="white" stroke-width="1.5"/>
-        <circle cx="13.5" cy="13.5" r="5" fill="white"/>
-      </svg>
-    `;
-		const popupEl = this.querySelector("sigvelo-ol-popup");
-		if (popupEl) {
-			this._markerEl.style.cursor = "pointer";
-			this._markerEl.addEventListener("click", () => {
-				this._showPopup(popupEl);
-			});
-		}
-		this._overlay = new Overlay({
-			position: fromLonLat([this.longitude, this.latitude]),
-			positioning: "bottom-center",
-			element: this._markerEl,
-			stopEvent: false
-		});
-		this._mapEl.map.addOverlay(this._overlay);
-	}
-	/** @internal */
-	_showPopup(popupEl) {
-		if (!this._mapEl?.map) return;
-		if (this._popupOverlay) this._mapEl.map.removeOverlay(this._popupOverlay);
-		const content = document.createElement("div");
-		content.style.background = "white";
-		content.style.padding = "8px 12px";
-		content.style.borderRadius = "4px";
-		content.style.boxShadow = "0 2px 8px rgba(0,0,0,0.2)";
-		content.style.transform = "translate(-50%, -8px)";
-		for (const node of Array.from(popupEl.childNodes)) content.appendChild(node.cloneNode(true));
-		this._popupOverlay = new Overlay({
-			position: fromLonLat([this.longitude, this.latitude]),
-			positioning: "bottom-center",
-			element: content,
-			offset: [0, -45]
-		});
-		this._mapEl.map.addOverlay(this._popupOverlay);
-	}
-	updated() {
-		if (this._overlay) this._overlay.setPosition(fromLonLat([this.longitude, this.latitude]));
-	}
-	render() {
-		return html` <slot></slot> `;
-	}
-};
-__decorate([property({ type: Number })], SigveloOlMarker.prototype, "latitude", void 0);
-__decorate([property({ type: Number })], SigveloOlMarker.prototype, "longitude", void 0);
-__decorate([property()], SigveloOlMarker.prototype, "color", void 0);
-__decorate([property()], SigveloOlMarker.prototype, "title", void 0);
-SigveloOlMarker = __decorate([customElement("sigvelo-ol-marker")], SigveloOlMarker);
-//#endregion
-export { SigveloOlMarker as t };

package/dist/overlay-BFXjnhLj.js

@@ -1,65 +0,0 @@
-import { t as __decorate } from "./decorate-DcF3lt7P.js";
-import { LitElement, css, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { fromLonLat } from "ol/proj.js";
-import Overlay from "ol/Overlay.js";
-//#region src/components/overlay/overlay.styles.ts
-var overlay_styles_default = css`
-  :host {
-    display: none;
-  }
-`;
-//#endregion
-//#region src/components/overlay/overlay.ts
-let SigveloOlOverlay = class SigveloOlOverlay extends LitElement {
-	constructor(..._args) {
-		super(..._args);
-		this.latitude = 0;
-		this.longitude = 0;
-		this.positioning = "bottom-center";
-		this._overlay = null;
-		this._contentEl = null;
-		this._mapEl = null;
-	}
-	static {
-		this.styles = [overlay_styles_default];
-	}
-	async connectedCallback() {
-		super.connectedCallback();
-		this._mapEl = this.closest("sigvelo-ol-map");
-		if (this._mapEl) {
-			await this._mapEl.mapReady;
-			this._addOverlay();
-		}
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		if (this._overlay && this._mapEl?.map) this._mapEl.map.removeOverlay(this._overlay);
-		this._overlay = null;
-	}
-	/** @internal */
-	_addOverlay() {
-		if (!this._mapEl?.map) return;
-		this._contentEl = document.createElement("div");
-		for (const node of Array.from(this.childNodes)) this._contentEl.appendChild(node.cloneNode(true));
-		this._overlay = new Overlay({
-			position: fromLonLat([this.longitude, this.latitude]),
-			positioning: this.positioning,
-			element: this._contentEl,
-			stopEvent: false
-		});
-		this._mapEl.map.addOverlay(this._overlay);
-	}
-	updated() {
-		if (this._overlay) this._overlay.setPosition(fromLonLat([this.longitude, this.latitude]));
-	}
-	render() {
-		return html` <slot></slot> `;
-	}
-};
-__decorate([property({ type: Number })], SigveloOlOverlay.prototype, "latitude", void 0);
-__decorate([property({ type: Number })], SigveloOlOverlay.prototype, "longitude", void 0);
-__decorate([property()], SigveloOlOverlay.prototype, "positioning", void 0);
-SigveloOlOverlay = __decorate([customElement("sigvelo-ol-overlay")], SigveloOlOverlay);
-//#endregion
-export { SigveloOlOverlay as t };

package/dist/polygon-BaKBzEHK.js

@@ -1,105 +0,0 @@
-import { t as __decorate } from "./decorate-DcF3lt7P.js";
-import { LitElement, css, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { fromLonLat } from "ol/proj.js";
-import VectorLayer from "ol/layer/Vector.js";
-import VectorSource from "ol/source/Vector.js";
-import { Fill, Stroke, Style } from "ol/style.js";
-import Feature from "ol/Feature.js";
-import Polygon from "ol/geom/Polygon.js";
-//#region src/components/polygon/polygon.styles.ts
-var polygon_styles_default = css`
-  :host {
-    display: none;
-  }
-`;
-//#endregion
-//#region src/components/polygon/polygon.ts
-let SigveloOlPolygon = class SigveloOlPolygon extends LitElement {
-	constructor(..._args) {
-		super(..._args);
-		this.positions = [];
-		this.fillColor = "#3388ff";
-		this.fillOpacity = .2;
-		this.strokeColor = "#3388ff";
-		this.strokeWidth = 2;
-		this._layer = null;
-		this._feature = null;
-		this._mapEl = null;
-	}
-	static {
-		this.styles = [polygon_styles_default];
-	}
-	async connectedCallback() {
-		super.connectedCallback();
-		this._mapEl = this.closest("sigvelo-ol-map");
-		if (this._mapEl) {
-			await this._mapEl.mapReady;
-			this._addPolygon();
-		}
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-		if (this._layer && this._mapEl?.map) this._mapEl.map.removeLayer(this._layer);
-		this._layer = null;
-		this._feature = null;
-	}
-	/** @internal */
-	_toCoords() {
-		const ring = this.positions.map(([lat, lng]) => fromLonLat([lng, lat]));
-		if (ring.length > 0) {
-			const first = ring[0];
-			const last = ring[ring.length - 1];
-			if (first[0] !== last[0] || first[1] !== last[1]) ring.push([...first]);
-		}
-		return [ring];
-	}
-	/** @internal */
-	_hexToRgba(hex, opacity) {
-		return `rgba(${parseInt(hex.slice(1, 3), 16)}, ${parseInt(hex.slice(3, 5), 16)}, ${parseInt(hex.slice(5, 7), 16)}, ${opacity})`;
-	}
-	/** @internal */
-	_addPolygon() {
-		if (!this._mapEl?.map || this.positions.length < 3) return;
-		this._feature = new Feature({ geometry: new Polygon(this._toCoords()) });
-		this._layer = new VectorLayer({
-			source: new VectorSource({ features: [this._feature] }),
-			style: new Style({
-				fill: new Fill({ color: this._hexToRgba(this.fillColor, this.fillOpacity) }),
-				stroke: new Stroke({
-					color: this.strokeColor,
-					width: this.strokeWidth
-				})
-			})
-		});
-		this._mapEl.map.addLayer(this._layer);
-	}
-	updated(changed) {
-		if (!this._feature || !this._layer) return;
-		if (changed.has("positions")) this._feature.getGeometry().setCoordinates(this._toCoords());
-		if (changed.has("fillColor") || changed.has("fillOpacity") || changed.has("strokeColor") || changed.has("strokeWidth")) this._layer.setStyle(new Style({
-			fill: new Fill({ color: this._hexToRgba(this.fillColor, this.fillOpacity) }),
-			stroke: new Stroke({
-				color: this.strokeColor,
-				width: this.strokeWidth
-			})
-		}));
-	}
-	render() {
-		return html``;
-	}
-};
-__decorate([property({ attribute: false })], SigveloOlPolygon.prototype, "positions", void 0);
-__decorate([property({ attribute: "fill-color" })], SigveloOlPolygon.prototype, "fillColor", void 0);
-__decorate([property({
-	attribute: "fill-opacity",
-	type: Number
-})], SigveloOlPolygon.prototype, "fillOpacity", void 0);
-__decorate([property({ attribute: "stroke-color" })], SigveloOlPolygon.prototype, "strokeColor", void 0);
-__decorate([property({
-	attribute: "stroke-width",
-	type: Number
-})], SigveloOlPolygon.prototype, "strokeWidth", void 0);
-SigveloOlPolygon = __decorate([customElement("sigvelo-ol-polygon")], SigveloOlPolygon);
-//#endregion
-export { SigveloOlPolygon as t };