@edugis-org/webmapx 0.1.0

package/dist-lib/webmapx-measure-tool-BXhMJFC6.js

@@ -0,0 +1,590 @@
+import { t as e } from "./decorate-CWgUV1hU.js";
+import { a as t, i as n, o as r } from "./decorators-B35AgiCU.js";
+import "./icon-CEOgWlro.js";
+import "./button-DFdGkRPQ.js";
+import { i, n as a, r as o, t as s } from "./geo-calculations-DbFJAUoI.js";
+import { t as c } from "./throttle-BeneRNYK.js";
+import { t as l } from "./webmapx-modal-tool-eF6Naluv.js";
+import { css as u, html as d, nothing as f } from "lit";
+//#region src/components/webmapx-measure-tool.ts
+var p = "webmapx-measure-static-source", m = "webmapx-measure-points", h = "webmapx-measure-lines", g = "webmapx-measure-polygon", _ = "webmapx-measure-segment-labels", v = "webmapx-measure-rubberband-source", y = "webmapx-measure-rubberband-layer", b = class extends l {
+	constructor(...e) {
+		super(...e), this.toolId = "measure", this.closeThreshold = 10, this.finishThreshold = 10, this.points = [], this.segments = [], this.totalDistanceCm = 0, this.cursorPosition = null, this.isClosed = !1, this.areaM2 = 0, this.finished = !1, this.touchMQ = window.matchMedia("(pointer: coarse)"), this.isTouchDevice = this.touchMQ.matches, this.onTouchMQChange = (e) => {
+			this.isTouchDevice = e.matches;
+		}, this.layersCreated = !1, this.throttledUpdateVisualization = c(() => {
+			this.doUpdateRubberbandVisualization();
+		}, 50), this.unsubClick = null, this.unsubDblClick = null, this.unsubPointerMove = null, this.unsubContextMenu = null, this.keydownHandler = null;
+	}
+	get isFinished() {
+		return this.finished || this.isClosed;
+	}
+	static {
+		this.styles = u`
+        :host {
+            display: block;
+            pointer-events: auto;
+        }
+
+        :host(:not([active])) .measure-content {
+            display: none;
+        }
+
+        .measure-container {
+            display: flex;
+            flex-direction: column;
+            gap: 0.5rem;
+            padding: var(--webmapx-tool-padding, 0);
+            font-size: var(--font-size-small, 0.875rem);
+        }
+
+        .segment-list {
+            /* max-height is removed to allow the panel to grow */
+        }
+
+        .segment {
+            display: flex;
+            justify-content: space-between;
+            padding: 0.25rem 0;
+            border-bottom: 1px solid var(--color-border-light, #eee);
+        }
+
+        .segment:last-child {
+            border-bottom: none;
+        }
+
+        .segment-label {
+            color: var(--color-text-secondary, #666);
+        }
+
+        .segment-value {
+            font-weight: 600;
+            font-variant-numeric: tabular-nums;
+        }
+
+        .total-row {
+            display: flex;
+            justify-content: space-between;
+            padding-top: 0.5rem;
+            border-top: 2px solid var(--color-border, #ccc);
+            font-weight: 600;
+        }
+
+        .area-row {
+            display: flex;
+            justify-content: space-between;
+            padding-top: 0.25rem;
+            color: var(--color-primary, #0f62fe);
+            font-weight: 600;
+        }
+
+        .instructions {
+            color: var(--color-text-secondary, #666);
+            font-size: 0.75rem;
+            font-style: italic;
+            margin: 0;
+        }
+
+        .actions {
+            display: flex;
+            gap: 0.5rem;
+            margin-top: 0.5rem;
+        }
+    `;
+	}
+	onMapAttached(e) {
+		super.onMapAttached(e), this.setupMapEventListeners(e), this.loadConfigDefaults();
+	}
+	onMapDetached() {
+		this.cleanupEventListeners(), this.cleanupMapLayers(), super.onMapDetached();
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.touchMQ.addEventListener("change", this.onTouchMQChange);
+	}
+	disconnectedCallback() {
+		this.touchMQ.removeEventListener("change", this.onTouchMQChange), this.cleanupEventListeners(), super.disconnectedCallback();
+	}
+	async updated(e) {
+		e.has("segments") && (await this.updateComplete, this.dispatchEvent(new CustomEvent("webmapx-content-updated", {
+			bubbles: !0,
+			composed: !0
+		})));
+	}
+	loadConfigDefaults() {
+		let e = this.toolsConfig?.measure;
+		e && (this.closeThreshold = e.closeThreshold ?? 10, this.finishThreshold = e.finishThreshold ?? 10);
+	}
+	setupMapEventListeners(e) {
+		this.unsubClick = e.events.on("click", this.handleClick.bind(this)), this.unsubDblClick = e.events.on("dblclick", this.handleDblClick.bind(this)), this.unsubPointerMove = e.events.on("pointer-move", this.handlePointerMove.bind(this)), this.unsubContextMenu = e.events.on("contextmenu", this.handleContextMenu.bind(this)), this.keydownHandler = this.handleKeydown.bind(this), document.addEventListener("keydown", this.keydownHandler);
+	}
+	cleanupEventListeners() {
+		this.unsubClick?.(), this.unsubDblClick?.(), this.unsubPointerMove?.(), this.unsubContextMenu?.(), this.keydownHandler &&= (document.removeEventListener("keydown", this.keydownHandler), null);
+	}
+	createMeasureLayers() {
+		this.layersCreated ||= (this.dispatchEvent(new CustomEvent("webmapx-add-source", {
+			detail: {
+				id: p,
+				config: {
+					type: "geojson",
+					data: this.buildStaticGeoJSON()
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-add-source", {
+			detail: {
+				id: v,
+				config: {
+					type: "geojson",
+					data: this.buildRubberbandGeoJSON()
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-add-layer", {
+			detail: {
+				id: g,
+				type: "fill",
+				source: p,
+				metadata: {
+					hideFromLegend: !0,
+					label: "Measure polygon"
+				},
+				filter: [
+					"==",
+					["geometry-type"],
+					"Polygon"
+				],
+				paint: {
+					"fill-color": "#0f62fe",
+					"fill-opacity": .1
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-add-layer", {
+			detail: {
+				id: h,
+				type: "line",
+				source: p,
+				metadata: {
+					hideFromLegend: !0,
+					label: "Measure lines"
+				},
+				filter: [
+					"==",
+					["get", "type"],
+					"line"
+				],
+				paint: {
+					"line-color": "#0f62fe",
+					"line-width": 2
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-add-layer", {
+			detail: {
+				id: y,
+				type: "line",
+				source: v,
+				metadata: {
+					hideFromLegend: !0,
+					label: "Measure rubberband"
+				},
+				paint: {
+					"line-color": "#0f62fe",
+					"line-width": 2,
+					"line-dasharray": [4, 4]
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-add-layer", {
+			detail: {
+				id: _,
+				type: "symbol",
+				source: p,
+				metadata: {
+					isToolLayer: !0,
+					hideFromLegend: !0,
+					label: "Measure segment labels"
+				},
+				filter: [
+					"==",
+					["get", "type"],
+					"segment-label"
+				],
+				layout: {
+					"text-field": ["get", "label"],
+					"text-font": ["Noto Sans Regular"],
+					"text-size": 12,
+					"text-anchor": "center",
+					"text-allow-overlap": !0,
+					"text-ignore-placement": !0
+				},
+				paint: {
+					"text-color": "#0f62fe",
+					"text-halo-color": "#fff",
+					"text-halo-width": 1.5
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-add-layer", {
+			detail: {
+				id: m,
+				type: "circle",
+				source: p,
+				metadata: {
+					isToolLayer: !0,
+					hideFromLegend: !0,
+					label: "Measure points"
+				},
+				filter: [
+					"==",
+					["get", "type"],
+					"point"
+				],
+				paint: {
+					"circle-radius": 5,
+					"circle-color": "#fff",
+					"circle-opacity": 1,
+					"circle-stroke-color": "#0f62fe",
+					"circle-stroke-width": 2
+				}
+			},
+			bubbles: !0,
+			composed: !0
+		})), !0);
+	}
+	cleanupMapLayers() {
+		this.removeMeasureLayers();
+	}
+	removeMeasureLayers() {
+		this.layersCreated &&= (this.dispatchEvent(new CustomEvent("webmapx-remove-layer", {
+			detail: m,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-remove-layer", {
+			detail: _,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-remove-layer", {
+			detail: h,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-remove-layer", {
+			detail: g,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-remove-layer", {
+			detail: y,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-remove-source", {
+			detail: p,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-remove-source", {
+			detail: v,
+			bubbles: !0,
+			composed: !0
+		})), !1);
+	}
+	updateMapVisualization() {
+		this.doUpdateStaticVisualization();
+	}
+	doUpdateStaticVisualization() {
+		if (!this.layersCreated) return;
+		let e = this.buildStaticGeoJSON();
+		this.dispatchEvent(new CustomEvent("webmapx-set-source-data", {
+			detail: {
+				id: p,
+				data: e
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	doUpdateRubberbandVisualization() {
+		if (!this.layersCreated) return;
+		let e = this.buildRubberbandGeoJSON();
+		this.dispatchEvent(new CustomEvent("webmapx-set-source-data", {
+			detail: {
+				id: v,
+				data: e
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	buildStaticGeoJSON() {
+		let e = [];
+		if (this.points.forEach((t, n) => {
+			e.push({
+				type: "Feature",
+				properties: {
+					index: n,
+					type: "point",
+					isFirst: n === 0,
+					isLast: n === this.points.length - 1
+				},
+				geometry: {
+					type: "Point",
+					coordinates: t
+				}
+			});
+		}), this.points.length >= 2) {
+			let t = this.buildLineCoordinates(this.points, this.isClosed);
+			e.push({
+				type: "Feature",
+				properties: { type: "line" },
+				geometry: {
+					type: "LineString",
+					coordinates: t
+				}
+			});
+		}
+		if (this.segments.forEach((t, n) => {
+			e.push({
+				type: "Feature",
+				properties: {
+					type: "segment-label",
+					label: String(n + 1)
+				},
+				geometry: {
+					type: "Point",
+					coordinates: [(t.from[0] + t.to[0]) / 2, (t.from[1] + t.to[1]) / 2]
+				}
+			});
+		}), this.isClosed && this.points.length >= 3) {
+			let t = this.buildLineCoordinates(this.points, !0);
+			e.push({
+				type: "Feature",
+				properties: { type: "polygon" },
+				geometry: {
+					type: "Polygon",
+					coordinates: [t]
+				}
+			});
+		}
+		return {
+			type: "FeatureCollection",
+			features: e
+		};
+	}
+	buildRubberbandGeoJSON() {
+		let e = [];
+		if (!this.isClosed && this.points.length > 0 && this.cursorPosition && this.active) {
+			let t = this.buildSegmentCoordinates(this.points[this.points.length - 1], this.cursorPosition);
+			e.push({
+				type: "Feature",
+				properties: { type: "rubberband" },
+				geometry: {
+					type: "LineString",
+					coordinates: t
+				}
+			});
+		}
+		return {
+			type: "FeatureCollection",
+			features: e
+		};
+	}
+	handleClick(e) {
+		if (!this.active) return;
+		let t = e.coords, n = e.pixel;
+		if (this.isFinished) {
+			if (this.isTouchDevice) return;
+			this.clearMeasurement(), this.addPoint(t);
+			return;
+		}
+		if (this.points.length >= 3 && this.isWithinThreshold(n, this.points[0], this.closeThreshold)) {
+			this.closePolygon();
+			return;
+		}
+		if (this.points.length >= 1) {
+			let e = this.points[this.points.length - 1];
+			if (this.isWithinThreshold(n, e, this.finishThreshold)) {
+				this.finishMeasurement();
+				return;
+			}
+		}
+		this.addPoint(t);
+	}
+	handleDblClick(e) {
+		!this.active || this.isFinished || this.finishMeasurement();
+	}
+	handlePointerMove(e) {
+		!this.active || this.isFinished || this.points.length !== 0 && (this.cursorPosition = e.coords, this.throttledUpdateVisualization());
+	}
+	handleContextMenu(e) {
+		!this.active || this.isFinished || this.finishMeasurement();
+	}
+	handleKeydown(e) {
+		!this.active || this.isFinished || e.key === "Escape" && this.finishMeasurement();
+	}
+	isWithinThreshold(e, t, n) {
+		let r = this.adapter?.project(t);
+		if (!r) return !1;
+		let i = e[0] - r[0], a = e[1] - r[1];
+		return Math.sqrt(i * i + a * a) <= n;
+	}
+	buildSegmentCoordinates(e, t) {
+		let n = Math.abs(t[1] - e[1]), r = Math.abs(this.normalizeLongitudeDeltaDegrees(t[0] - e[0]));
+		if (!(n > 1 || r > 1)) return [e, t];
+		let i = this.computeAngularDistanceRad(e, t);
+		if (i === 0) return [e];
+		let a = i * 180 / Math.PI, o = Math.max(1, Math.ceil(a)), s = [];
+		for (let n = 0; n <= o; n++) {
+			let r = n / o;
+			s.push(this.interpolateGreatCirclePoint(e, t, r, i));
+		}
+		return s;
+	}
+	buildLineCoordinates(e, t) {
+		if (e.length < 2) return e;
+		let n = t ? [...e, e[0]] : e, r = [];
+		for (let e = 1; e < n.length; e++) {
+			let t = this.buildSegmentCoordinates(n[e - 1], n[e]);
+			r.length === 0 ? r.push(...t) : r.push(...t.slice(1));
+		}
+		return r;
+	}
+	computeAngularDistanceRad(e, t) {
+		let n = this.toRadians(e[1]), r = this.toRadians(t[1]), i = r - n, a = this.normalizeLongitudeDeltaRadians(this.toRadians(t[0] - e[0])), o = Math.sin(i / 2) ** 2 + Math.cos(n) * Math.cos(r) * Math.sin(a / 2) ** 2;
+		return 2 * Math.atan2(Math.sqrt(o), Math.sqrt(1 - o));
+	}
+	interpolateGreatCirclePoint(e, t, n, r) {
+		let i = this.toRadians(e[1]), a = this.toRadians(e[0]), o = this.toRadians(t[1]), s = this.toRadians(t[0]), c = Math.sin(r);
+		if (c === 0) return e;
+		let l = Math.sin((1 - n) * r) / c, u = Math.sin(n * r) / c, d = l * Math.cos(i) * Math.cos(a) + u * Math.cos(o) * Math.cos(s), f = l * Math.cos(i) * Math.sin(a) + u * Math.cos(o) * Math.sin(s), p = l * Math.sin(i) + u * Math.sin(o), m = Math.atan2(p, Math.sqrt(d * d + f * f)), h = Math.atan2(f, d);
+		return [this.toDegrees(h), this.toDegrees(m)];
+	}
+	toRadians(e) {
+		return e * Math.PI / 180;
+	}
+	toDegrees(e) {
+		return e * 180 / Math.PI;
+	}
+	normalizeLongitudeDeltaDegrees(e) {
+		return (e + 540) % 360 - 180;
+	}
+	normalizeLongitudeDeltaRadians(e) {
+		return (e + 3 * Math.PI) % (2 * Math.PI) - Math.PI;
+	}
+	addPoint(e) {
+		let t = [...this.points, e];
+		if (t.length >= 2) {
+			let e = t[t.length - 2], n = t[t.length - 1], r = i(e, n), a = {
+				from: e,
+				to: n,
+				distanceCm: r
+			};
+			this.segments = [...this.segments, a], this.totalDistanceCm += r;
+		}
+		this.points = t, this.updateMapVisualization();
+	}
+	closePolygon() {
+		if (this.points.length < 3) return;
+		let e = this.points[this.points.length - 1], t = this.points[0], n = i(e, t), r = {
+			from: e,
+			to: t,
+			distanceCm: n
+		};
+		this.segments = [...this.segments, r], this.totalDistanceCm += n, this.areaM2 = o(this.points), this.isClosed = !0, this.cursorPosition = null, this.updateMapVisualization(), this.doUpdateRubberbandVisualization();
+	}
+	finishMeasurement() {
+		this.finished = !0, this.cursorPosition = null, this.doUpdateRubberbandVisualization();
+	}
+	clearMeasurement() {
+		this.points = [], this.segments = [], this.totalDistanceCm = 0, this.cursorPosition = null, this.isClosed = !1, this.finished = !1, this.areaM2 = 0, this.doUpdateStaticVisualization(), this.doUpdateRubberbandVisualization();
+	}
+	onActivate() {
+		this.clearMeasurement(), this.layersCreated || this.createMeasureLayers(), this.dispatchEvent(new CustomEvent("webmapx-suppress-busy-for-source", {
+			detail: v,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-suppress-busy-for-source", {
+			detail: p,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-measure-activate", {
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	onDeactivate() {
+		this.clearMeasurement(), this.removeMeasureLayers(), this.dispatchEvent(new CustomEvent("webmapx-unsuppress-busy-for-source", {
+			detail: v,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-unsuppress-busy-for-source", {
+			detail: p,
+			bubbles: !0,
+			composed: !0
+		})), this.dispatchEvent(new CustomEvent("webmapx-measure-deactivate", {
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	renderSegments() {
+		return this.segments.length === 0 ? f : d`
+            <div class="segment-list">
+                ${this.segments.map((e, t) => d`
+                    <div class="segment">
+                        <span class="segment-label">Segment ${t + 1}</span>
+                        <span class="segment-value">${a(e.distanceCm)}</span>
+                    </div>
+                `)}
+            </div>
+        `;
+	}
+	renderTotal() {
+		return this.segments.length === 0 ? f : d`
+            <div class="total-row">
+                <span>Total</span>
+                <span>${a(this.totalDistanceCm)}</span>
+            </div>
+        `;
+	}
+	renderArea() {
+		return !this.isClosed || this.areaM2 === 0 ? f : d`
+            <div class="area-row">
+                <span>Area</span>
+                <span>${s(this.areaM2)}</span>
+            </div>
+        `;
+	}
+	renderInstructions() {
+		return this.isFinished ? this.isTouchDevice ? d`<p class="instructions">Measurement finished. Tap Clear to start a new measurement.</p>` : d`<p class="instructions">Measurement finished. Click Clear, or click the map to start a new measurement.</p>` : this.points.length === 0 ? d`<p class="instructions">Click on the map to start measuring.</p>` : this.points.length < 3 ? d`<p class="instructions">Click to add points. Double-click, right-click or ESC to finish.</p>` : d`<p class="instructions">Click near first point to close polygon, or double-click/right-click/ESC to finish.</p>`;
+	}
+	render() {
+		return d`
+            <div class="tool-content measure-container">
+                <div class="measure-content">
+                    ${this.renderInstructions()}
+                    ${this.renderSegments()}
+                    ${this.renderTotal()}
+                    ${this.renderArea()}
+
+                    <div class="actions">
+                        <sl-button size="small" @click=${this.clearMeasurement}>
+                            <sl-icon name="trash" slot="prefix"></sl-icon>
+                            Clear
+                        </sl-button>
+                    </div>
+                </div>
+            </div>
+        `;
+	}
+};
+e([t({
+	type: Number,
+	attribute: "close-threshold"
+})], b.prototype, "closeThreshold", void 0), e([t({
+	type: Number,
+	attribute: "finish-threshold"
+})], b.prototype, "finishThreshold", void 0), e([n()], b.prototype, "points", void 0), e([n()], b.prototype, "segments", void 0), e([n()], b.prototype, "totalDistanceCm", void 0), e([n()], b.prototype, "cursorPosition", void 0), e([n()], b.prototype, "isClosed", void 0), e([n()], b.prototype, "areaM2", void 0), e([n()], b.prototype, "finished", void 0), e([n()], b.prototype, "isTouchDevice", void 0), b = e([r("webmapx-measure-tool")], b);
+//#endregion
+export { b as WebmapxMeasureTool };

package/dist-lib/webmapx-modal-tool-eF6Naluv.js

@@ -0,0 +1,84 @@
+import { r as e, t } from "./decorate-CWgUV1hU.js";
+import { t as n } from "./webmapx-base-tool-Dm9NAWLD.js";
+import { a as r } from "./decorators-B35AgiCU.js";
+//#region src/components/webmapx-modal-tool.ts
+var i = class extends n {
+	constructor(...e) {
+		super(...e), this.isModal = !0, this._active = !1, this.registerWithToolManager = !0, this.portalContainer = null, this.toolManager = null;
+	}
+	get active() {
+		return this._active;
+	}
+	set active(e) {
+		let t = this._active;
+		e !== t && (this._active = e, e ? this.onActivate() : this.onDeactivate(), this.requestUpdate("active", t));
+	}
+	onMapAttached(t) {
+		super.onMapAttached(t);
+		let n = e(this);
+		this.registerWithToolManager && n?.toolManager && (this.toolManager = n.toolManager, this.toolManager.register(this));
+	}
+	onMapDetached() {
+		this.toolManager &&= (this.toolManager.unregister(this.toolId), null), super.onMapDetached();
+	}
+	onStateChanged(e) {}
+	updated(e) {
+		super.updated(e), (e.has("renderTarget") || e.has("active")) && this.updatePortal();
+	}
+	activate() {
+		if (!this._active) {
+			if (this.registerWithToolManager && this.toolManager && this.toolManager.activeToolId !== this.toolId) {
+				this.toolManager.activate(this.toolId);
+				return;
+			}
+			this.active = !0;
+		}
+	}
+	deactivate() {
+		if (this._active) {
+			if (this.registerWithToolManager && this.toolManager && this.toolManager.activeToolId === this.toolId) {
+				this.toolManager.deactivate(this.toolId);
+				return;
+			}
+			this.active = !1;
+		}
+	}
+	toggle() {
+		this.registerWithToolManager && this.toolManager ? this.toolManager.toggle(this.toolId) : this._active ? this.deactivate() : this.activate();
+	}
+	onActivate() {}
+	onDeactivate() {}
+	updatePortal() {
+		if (!this.renderTarget) {
+			this.restoreContent();
+			return;
+		}
+		let e = document.querySelector(this.renderTarget);
+		if (!e) {
+			console.warn(`[${this.toolId}] Render target "${this.renderTarget}" not found`);
+			return;
+		}
+		if (this.active) {
+			let t = this.shadowRoot?.querySelector(".tool-content");
+			t && (e.innerHTML = "", e.appendChild(t), this.portalContainer = e);
+		} else this.portalContainer && (this.portalContainer.innerHTML = "");
+	}
+	restoreContent() {
+		if (this.portalContainer) {
+			let e = this.portalContainer.querySelector(".tool-content");
+			e && this.shadowRoot && this.shadowRoot.appendChild(e), this.portalContainer.innerHTML = "", this.portalContainer = null;
+		}
+	}
+};
+t([r({ type: String })], i.prototype, "label", void 0), t([r({ attribute: !1 })], i.prototype, "icon", void 0), t([r({
+	type: Boolean,
+	reflect: !0
+})], i.prototype, "active", null), t([r({
+	type: String,
+	attribute: "render-target"
+})], i.prototype, "renderTarget", void 0), t([r({
+	type: Boolean,
+	attribute: "register-with-toolmanager"
+})], i.prototype, "registerWithToolManager", void 0);
+//#endregion
+export { i as t };