@countermeasure-platform/web-components 0.2.0

package/dist/visualization/map/index.js

@@ -0,0 +1,219 @@
+import { n as e, t } from "../../utils-Cn_W3h3f.js";
+//#region src/visualization/map/index.ts
+var n = 256, r = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", i = {
+	lat: 0,
+	lng: 0
+}, a = 2, o = 256;
+function s(e, t, n) {
+	return Math.max(t, Math.min(n, e));
+}
+function c(e, t, r) {
+	let i = 2 ** r * n, a = (t + 180) / 360 * i, o = s(Math.sin(e * Math.PI / 180), -.9999, .9999);
+	return {
+		x: a,
+		y: (.5 - Math.log((1 + o) / (1 - o)) / (4 * Math.PI)) * i
+	};
+}
+var l = class {
+	id;
+	container;
+	config;
+	tileUrl;
+	minZoom;
+	maxZoom;
+	markers;
+	regions;
+	wrapperEl = null;
+	tileLayerEl = null;
+	markerLayerEl = null;
+	popupEl = null;
+	centerLat;
+	centerLng;
+	zoom;
+	offsetX = 0;
+	offsetY = 0;
+	viewportWidth = 0;
+	viewportHeight = 0;
+	isDragging = !1;
+	dragStartX = 0;
+	dragStartY = 0;
+	dragOffsetX = 0;
+	dragOffsetY = 0;
+	boundMouseDown;
+	boundMouseMove;
+	boundMouseUp;
+	boundWheel;
+	boundResize;
+	tileCache = /* @__PURE__ */ new Map();
+	constructor(n) {
+		this.id = e("cmm-map"), this.container = t(n.container), this.config = n, this.tileUrl = n.tileUrl ?? r, this.minZoom = n.minZoom ?? 1, this.maxZoom = n.maxZoom ?? 18, this.markers = n.markers === void 0 ? [] : [...n.markers], this.regions = n.regions === void 0 ? [] : [...n.regions];
+		let o = n.center ?? i;
+		this.centerLat = o.lat, this.centerLng = o.lng, this.zoom = s(n.zoom ?? a, this.minZoom, this.maxZoom), this.boundMouseDown = this.handleMouseDown.bind(this), this.boundMouseMove = this.handleMouseMove.bind(this), this.boundMouseUp = this.handleMouseUp.bind(this), this.boundWheel = this.handleWheel.bind(this), this.boundResize = this.handleResize.bind(this), this.render(), this.computeOffset(), this.renderTiles(), this.renderMarkers(), this.attachEvents();
+	}
+	setCenter(e, t) {
+		this.centerLat = e, this.centerLng = t, this.closePopup(), this.computeOffset(), this.renderTiles(), this.renderMarkers();
+	}
+	setZoom(e) {
+		let t = s(Math.round(e), this.minZoom, this.maxZoom);
+		t !== this.zoom && (this.zoom = t, this.closePopup(), this.computeOffset(), this.renderTiles(), this.renderMarkers(), this.updateZoomButtons());
+	}
+	addMarker(e) {
+		this.markers.push(e), this.renderMarkers();
+	}
+	removeMarker(e) {
+		let t = this.markers.findIndex((t) => t.id === e);
+		t >= 0 && (this.markers.splice(t, 1), this.renderMarkers());
+	}
+	getRegions() {
+		return this.regions;
+	}
+	destroy() {
+		this.detachEvents(), this.tileCache.clear(), this.container.innerHTML = "", this.wrapperEl = null, this.tileLayerEl = null, this.markerLayerEl = null, this.popupEl = null;
+	}
+	render() {
+		this.container.innerHTML = "";
+		let e = document.createElement("div");
+		e.className = "cmm-map", e.id = this.id, this.config.className !== void 0 && e.classList.add(this.config.className);
+		let t = document.createElement("div");
+		t.className = "cmm-map__tile-layer", e.appendChild(t), this.tileLayerEl = t;
+		let n = document.createElement("div");
+		n.className = "cmm-map__marker-layer", e.appendChild(n), this.markerLayerEl = n;
+		let r = document.createElement("div");
+		r.className = "cmm-map__controls";
+		let i = document.createElement("button");
+		i.className = "cmm-map__zoom-btn", i.setAttribute("data-action", "zoom-in"), i.textContent = "+", i.setAttribute("aria-label", "Zoom in"), i.addEventListener("click", () => {
+			this.setZoom(this.zoom + 1);
+		}), r.appendChild(i);
+		let a = document.createElement("button");
+		a.className = "cmm-map__zoom-btn", a.setAttribute("data-action", "zoom-out"), a.textContent = "−", a.setAttribute("aria-label", "Zoom out"), a.addEventListener("click", () => {
+			this.setZoom(this.zoom - 1);
+		}), r.appendChild(a), e.appendChild(r);
+		let o = document.createElement("div");
+		o.className = "cmm-map__attribution", o.innerHTML = "© OpenStreetMap", e.appendChild(o), this.container.appendChild(e), this.wrapperEl = e, this.viewportWidth = e.clientWidth, this.viewportHeight = e.clientHeight;
+	}
+	computeOffset() {
+		let e = c(this.centerLat, this.centerLng, this.zoom);
+		this.offsetX = e.x - this.viewportWidth / 2, this.offsetY = e.y - this.viewportHeight / 2;
+	}
+	renderTiles() {
+		if (this.tileLayerEl === null) return;
+		this.tileLayerEl.innerHTML = "";
+		let e = 2 ** this.zoom, t = e * n, r = Math.floor(this.offsetX / n), i = Math.floor(this.offsetY / n), a = Math.ceil((this.offsetX + this.viewportWidth) / n), o = Math.ceil((this.offsetY + this.viewportHeight) / n);
+		for (let s = i; s <= o; s++) for (let i = r; i <= a; i++) {
+			let r = (i % e + e) % e;
+			if (s < 0 || s >= e) continue;
+			let a = i * n - this.offsetX, o = s * n - this.offsetY;
+			if (a + n < -n || a > this.viewportWidth + n || o + n < -n || o > this.viewportHeight + n || Math.abs(a) > t || Math.abs(o) > t) continue;
+			let c = `${String(this.zoom)}/${String(r)}/${String(s)}`, l = this.tileUrl.replace("{z}", String(this.zoom)).replace("{x}", String(r)).replace("{y}", String(s)), u = document.createElement("div");
+			u.className = "cmm-map__tile cmm-map__tile--loading", u.style.left = `${String(a)}px`, u.style.top = `${String(o)}px`;
+			let d = this.tileCache.get(c);
+			if (d !== void 0) {
+				this.tileCache.delete(c), this.tileCache.set(c, d);
+				let e = d.cloneNode(!0);
+				e.className = "cmm-map__tile", e.style.left = `${String(a)}px`, e.style.top = `${String(o)}px`, this.tileLayerEl.appendChild(e);
+			} else {
+				let e = document.createElement("img");
+				e.className = "cmm-map__tile cmm-map__tile--loading", e.style.left = `${String(a)}px`, e.style.top = `${String(o)}px`, e.draggable = !1, e.alt = "", e.src = l, e.addEventListener("load", () => {
+					e.classList.remove("cmm-map__tile--loading"), this.addToTileCache(c, e.cloneNode(!0));
+				}), e.addEventListener("error", () => {
+					e.classList.remove("cmm-map__tile--loading"), e.classList.add("cmm-map__tile--error");
+				}), this.tileLayerEl.appendChild(e);
+			}
+		}
+	}
+	renderMarkers() {
+		if (this.markerLayerEl !== null) {
+			this.markerLayerEl.innerHTML = "", this.closePopup();
+			for (let e of this.markers) {
+				let t = c(e.lat, e.lng, this.zoom), n = t.x - this.offsetX, r = t.y - this.offsetY;
+				if (n < -50 || n > this.viewportWidth + 50 || r < -50 || r > this.viewportHeight + 50) continue;
+				let i = document.createElement("div");
+				i.className = "cmm-map__marker", i.style.left = `${String(n)}px`, i.style.top = `${String(r)}px`, i.setAttribute("data-marker-id", e.id);
+				let a = document.createElement("div");
+				a.className = "cmm-map__marker-pin";
+				let o = e.color ?? "hsl(0, 70%, 55%)";
+				if (e.icon === void 0 ? a.innerHTML = `<svg viewBox="0 0 24 36" width="24" height="36" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M12 0C5.373 0 0 5.373 0 12c0 9 12 24 12 24s12-15 12-24C24 5.373 18.627 0 12 0z" fill="${o}"/>
+          <circle cx="12" cy="12" r="5" fill="white" opacity="0.8"/>
+        </svg>` : a.innerHTML = e.icon, i.appendChild(a), e.label !== void 0) {
+					let t = document.createElement("div");
+					t.className = "cmm-map__marker-label", t.textContent = e.label, i.appendChild(t);
+				}
+				i.addEventListener("click", (t) => {
+					t.stopPropagation(), this.config.onMarkerClick !== void 0 && this.config.onMarkerClick(e), e.popup !== void 0 && this.showPopup(e, n, r);
+				}), this.markerLayerEl.appendChild(i);
+			}
+		}
+	}
+	showPopup(e, t, n) {
+		if (this.closePopup(), this.wrapperEl === null) return;
+		let r = document.createElement("div");
+		r.className = "cmm-map__popup", r.style.left = `${String(t)}px`, r.style.top = `${String(n)}px`;
+		let i = document.createElement("button");
+		i.className = "cmm-map__popup-close", i.textContent = "×", i.addEventListener("click", (e) => {
+			e.stopPropagation(), this.closePopup();
+		}), r.appendChild(i);
+		let a = document.createElement("div");
+		a.textContent = e.popup ?? "", r.appendChild(a), this.wrapperEl.appendChild(r), this.popupEl = r;
+	}
+	closePopup() {
+		this.popupEl !== null && (this.popupEl.remove(), this.popupEl = null);
+	}
+	updateZoomButtons() {
+		if (this.wrapperEl === null) return;
+		let e = this.wrapperEl.querySelector("[data-action=\"zoom-in\"]"), t = this.wrapperEl.querySelector("[data-action=\"zoom-out\"]");
+		e !== null && (e.disabled = this.zoom >= this.maxZoom), t !== null && (t.disabled = this.zoom <= this.minZoom);
+	}
+	attachEvents() {
+		this.wrapperEl !== null && (this.wrapperEl.addEventListener("mousedown", this.boundMouseDown), window.addEventListener("mousemove", this.boundMouseMove), window.addEventListener("mouseup", this.boundMouseUp), this.wrapperEl.addEventListener("wheel", this.boundWheel, { passive: !1 }), window.addEventListener("resize", this.boundResize));
+	}
+	detachEvents() {
+		this.wrapperEl !== null && (this.wrapperEl.removeEventListener("mousedown", this.boundMouseDown), this.wrapperEl.removeEventListener("wheel", this.boundWheel)), window.removeEventListener("mousemove", this.boundMouseMove), window.removeEventListener("mouseup", this.boundMouseUp), window.removeEventListener("resize", this.boundResize);
+	}
+	handleMouseDown(e) {
+		let t = e.target;
+		t.closest(".cmm-map__controls") !== null || t.closest(".cmm-map__popup") !== null || t.closest(".cmm-map__marker") !== null || (this.isDragging = !0, this.dragStartX = e.clientX, this.dragStartY = e.clientY, this.dragOffsetX = this.offsetX, this.dragOffsetY = this.offsetY, this.closePopup());
+	}
+	handleMouseMove(e) {
+		if (!this.isDragging) return;
+		let t = e.clientX - this.dragStartX, r = e.clientY - this.dragStartY;
+		this.offsetX = this.dragOffsetX - t, this.offsetY = this.dragOffsetY - r;
+		let i = 2 ** this.zoom * n;
+		this.offsetY = s(this.offsetY, 0, i - this.viewportHeight), this.renderTiles(), this.renderMarkers();
+	}
+	handleMouseUp(e) {
+		this.isDragging && (this.isDragging = !1, this.updateCenterFromOffset());
+	}
+	handleWheel(e) {
+		e.preventDefault();
+		let t = e.deltaY < 0 ? 1 : -1, r = s(this.zoom + t, this.minZoom, this.maxZoom);
+		if (r === this.zoom) return;
+		let i = this.wrapperEl?.getBoundingClientRect();
+		if (i === void 0) return;
+		let a = e.clientX - i.left, o = e.clientY - i.top, c = this.offsetX + a, l = this.offsetY + o, u = 2 ** (r - this.zoom), d = c * u, f = l * u;
+		this.zoom = r, this.offsetX = d - a, this.offsetY = f - o;
+		let p = 2 ** this.zoom * n;
+		this.offsetY = s(this.offsetY, 0, p - this.viewportHeight), this.updateCenterFromOffset(), this.closePopup(), this.renderTiles(), this.renderMarkers(), this.updateZoomButtons();
+	}
+	handleResize() {
+		this.wrapperEl !== null && (this.viewportWidth = this.wrapperEl.clientWidth, this.viewportHeight = this.wrapperEl.clientHeight, this.computeOffset(), this.renderTiles(), this.renderMarkers());
+	}
+	addToTileCache(e, t) {
+		for (; this.tileCache.size >= o;) {
+			let e = this.tileCache.keys().next().value;
+			if (e !== void 0) this.tileCache.delete(e);
+			else break;
+		}
+		this.tileCache.set(e, t);
+	}
+	updateCenterFromOffset() {
+		let e = 2 ** this.zoom * n, t = this.offsetX + this.viewportWidth / 2, r = this.offsetY + this.viewportHeight / 2;
+		this.centerLng = t / e * 360 - 180;
+		let i = Math.PI - 2 * Math.PI * r / e;
+		this.centerLat = 180 / Math.PI * Math.atan(.5 * (Math.exp(i) - Math.exp(-i)));
+	}
+};
+//#endregion
+export { l as ThreatMap };
+
+//# sourceMappingURL=index.js.map

package/dist/visualization/map/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/visualization/map/index.ts"],"sourcesContent":["/**\n * ThreatMap - Simplified tile-based map with markers and pan/zoom\n * @countermeasure/web-components/visualization/map\n */\n\nimport { resolveContainer, uniqueId } from '../../primitives/utils'\nimport type { MapConfig, MapMarker, MapRegion } from './types'\n\nexport type { MapConfig, MapMarker, MapRegion } from './types'\n\n/** Tile size in pixels (standard for web maps) */\nconst TILE_SIZE = 256\n\n/** Default OpenStreetMap tile URL template */\nconst DEFAULT_TILE_URL = 'https://tile.openstreetmap.org/{z}/{x}/{y}.png'\n\n/** Default map center (0, 0) */\nconst DEFAULT_CENTER = { lat: 0, lng: 0 }\n\n/** Default zoom level */\nconst DEFAULT_ZOOM = 2\n\n/** Maximum number of tiles to cache (LRU eviction) */\nconst MAX_TILE_CACHE_SIZE = 256\n\n/** Clamp a number between min and max */\nfunction clampValue(value: number, min: number, max: number): number {\n  return Math.max(min, Math.min(max, value))\n}\n\n/** Convert lat/lng to pixel coordinates at a given zoom level */\nfunction latLngToPixel(lat: number, lng: number, zoom: number): { x: number; y: number } {\n  const scale = Math.pow(2, zoom) * TILE_SIZE\n  const x = ((lng + 180) / 360) * scale\n  const sinLat = Math.sin((lat * Math.PI) / 180)\n  const clampedSin = clampValue(sinLat, -0.9999, 0.9999)\n  const y = (0.5 - Math.log((1 + clampedSin) / (1 - clampedSin)) / (4 * Math.PI)) * scale\n  return { x, y }\n}\n\nexport class ThreatMap {\n  private readonly id: string\n  private readonly container: HTMLElement\n  private readonly config: MapConfig\n  private readonly tileUrl: string\n  private readonly minZoom: number\n  private readonly maxZoom: number\n  private readonly markers: MapMarker[]\n  private readonly regions: MapRegion[]\n\n  private wrapperEl: HTMLElement | null = null\n  private tileLayerEl: HTMLElement | null = null\n  private markerLayerEl: HTMLElement | null = null\n  private popupEl: HTMLElement | null = null\n\n  private centerLat: number\n  private centerLng: number\n  private zoom: number\n\n  /** Pixel offset of the center relative to the world origin */\n  private offsetX = 0\n  private offsetY = 0\n\n  /** Viewport dimensions */\n  private viewportWidth = 0\n  private viewportHeight = 0\n\n  /** Pan state */\n  private isDragging = false\n  private dragStartX = 0\n  private dragStartY = 0\n  private dragOffsetX = 0\n  private dragOffsetY = 0\n\n  /** Bound event handlers for cleanup */\n  private readonly boundMouseDown: (e: MouseEvent) => void\n  private readonly boundMouseMove: (e: MouseEvent) => void\n  private readonly boundMouseUp: (e: MouseEvent) => void\n  private readonly boundWheel: (e: WheelEvent) => void\n  private readonly boundResize: () => void\n\n  /** Cache for loaded tile images */\n  private readonly tileCache = new Map<string, HTMLImageElement>()\n\n  constructor(config: MapConfig) {\n    this.id = uniqueId('cmm-map')\n    this.container = resolveContainer(config.container)\n    this.config = config\n    this.tileUrl = config.tileUrl ?? DEFAULT_TILE_URL\n    this.minZoom = config.minZoom ?? 1\n    this.maxZoom = config.maxZoom ?? 18\n    this.markers = config.markers !== undefined ? [...config.markers] : []\n    this.regions = config.regions !== undefined ? [...config.regions] : []\n\n    const center = config.center ?? DEFAULT_CENTER\n    this.centerLat = center.lat\n    this.centerLng = center.lng\n    this.zoom = clampValue(config.zoom ?? DEFAULT_ZOOM, this.minZoom, this.maxZoom)\n\n    this.boundMouseDown = this.handleMouseDown.bind(this)\n    this.boundMouseMove = this.handleMouseMove.bind(this)\n    this.boundMouseUp = this.handleMouseUp.bind(this)\n    this.boundWheel = this.handleWheel.bind(this)\n    this.boundResize = this.handleResize.bind(this)\n\n    this.render()\n    this.computeOffset()\n    this.renderTiles()\n    this.renderMarkers()\n    this.attachEvents()\n  }\n\n  /** Set map center and re-render */\n  setCenter(lat: number, lng: number): void {\n    this.centerLat = lat\n    this.centerLng = lng\n    this.closePopup()\n    this.computeOffset()\n    this.renderTiles()\n    this.renderMarkers()\n  }\n\n  /** Set zoom level and re-render */\n  setZoom(zoom: number): void {\n    const newZoom = clampValue(Math.round(zoom), this.minZoom, this.maxZoom)\n    if (newZoom === this.zoom) {\n      return\n    }\n    this.zoom = newZoom\n    this.closePopup()\n    this.computeOffset()\n    this.renderTiles()\n    this.renderMarkers()\n    this.updateZoomButtons()\n  }\n\n  /** Add a marker to the map */\n  addMarker(marker: MapMarker): void {\n    this.markers.push(marker)\n    this.renderMarkers()\n  }\n\n  /** Remove a marker by id */\n  removeMarker(id: string): void {\n    const idx = this.markers.findIndex(m => m.id === id)\n    if (idx >= 0) {\n      this.markers.splice(idx, 1)\n      this.renderMarkers()\n    }\n  }\n\n  /** Get all stored regions (regions are data-only, not visually rendered) */\n  getRegions(): readonly MapRegion[] {\n    return this.regions\n  }\n\n  /** Clean up the component and remove from DOM */\n  destroy(): void {\n    this.detachEvents()\n    this.tileCache.clear()\n    this.container.innerHTML = ''\n    this.wrapperEl = null\n    this.tileLayerEl = null\n    this.markerLayerEl = null\n    this.popupEl = null\n  }\n\n  // ---------------------------------------------------------------------------\n  // Rendering\n  // ---------------------------------------------------------------------------\n\n  /** Create the main DOM structure */\n  private render(): void {\n    this.container.innerHTML = ''\n\n    const wrapper = document.createElement('div')\n    wrapper.className = 'cmm-map'\n    wrapper.id = this.id\n\n    if (this.config.className !== undefined) {\n      wrapper.classList.add(this.config.className)\n    }\n\n    // Tile layer\n    const tileLayer = document.createElement('div')\n    tileLayer.className = 'cmm-map__tile-layer'\n    wrapper.appendChild(tileLayer)\n    this.tileLayerEl = tileLayer\n\n    // Marker layer\n    const markerLayer = document.createElement('div')\n    markerLayer.className = 'cmm-map__marker-layer'\n    wrapper.appendChild(markerLayer)\n    this.markerLayerEl = markerLayer\n\n    // Zoom controls\n    const controls = document.createElement('div')\n    controls.className = 'cmm-map__controls'\n\n    const zoomIn = document.createElement('button')\n    zoomIn.className = 'cmm-map__zoom-btn'\n    zoomIn.setAttribute('data-action', 'zoom-in')\n    zoomIn.textContent = '+'\n    zoomIn.setAttribute('aria-label', 'Zoom in')\n    zoomIn.addEventListener('click', () => {\n      this.setZoom(this.zoom + 1)\n    })\n    controls.appendChild(zoomIn)\n\n    const zoomOut = document.createElement('button')\n    zoomOut.className = 'cmm-map__zoom-btn'\n    zoomOut.setAttribute('data-action', 'zoom-out')\n    zoomOut.textContent = '\\u2212'\n    zoomOut.setAttribute('aria-label', 'Zoom out')\n    zoomOut.addEventListener('click', () => {\n      this.setZoom(this.zoom - 1)\n    })\n    controls.appendChild(zoomOut)\n\n    wrapper.appendChild(controls)\n\n    // Attribution\n    const attribution = document.createElement('div')\n    attribution.className = 'cmm-map__attribution'\n    attribution.innerHTML = '&copy; OpenStreetMap'\n    wrapper.appendChild(attribution)\n\n    this.container.appendChild(wrapper)\n    this.wrapperEl = wrapper\n\n    // Measure viewport\n    this.viewportWidth = wrapper.clientWidth\n    this.viewportHeight = wrapper.clientHeight\n  }\n\n  /** Compute the pixel offset of the current center */\n  private computeOffset(): void {\n    const center = latLngToPixel(this.centerLat, this.centerLng, this.zoom)\n    this.offsetX = center.x - this.viewportWidth / 2\n    this.offsetY = center.y - this.viewportHeight / 2\n  }\n\n  /** Render visible tiles for the current viewport and zoom */\n  private renderTiles(): void {\n    if (this.tileLayerEl === null) {\n      return\n    }\n\n    this.tileLayerEl.innerHTML = ''\n\n    const tileCount = Math.pow(2, this.zoom)\n    const maxPixel = tileCount * TILE_SIZE\n\n    // Compute which tiles are visible\n    const startTileX = Math.floor(this.offsetX / TILE_SIZE)\n    const startTileY = Math.floor(this.offsetY / TILE_SIZE)\n    const endTileX = Math.ceil((this.offsetX + this.viewportWidth) / TILE_SIZE)\n    const endTileY = Math.ceil((this.offsetY + this.viewportHeight) / TILE_SIZE)\n\n    for (let ty = startTileY; ty <= endTileY; ty++) {\n      for (let tx = startTileX; tx <= endTileX; tx++) {\n        // Wrap tile X to handle world wrapping\n        const wrappedTx = ((tx % tileCount) + tileCount) % tileCount\n\n        // Skip tiles outside Y bounds\n        if (ty < 0 || ty >= tileCount) {\n          continue\n        }\n\n        const pixelX = tx * TILE_SIZE - this.offsetX\n        const pixelY = ty * TILE_SIZE - this.offsetY\n\n        // Skip tiles that are completely off-screen (with a small buffer)\n        if (\n          pixelX + TILE_SIZE < -TILE_SIZE ||\n          pixelX > this.viewportWidth + TILE_SIZE ||\n          pixelY + TILE_SIZE < -TILE_SIZE ||\n          pixelY > this.viewportHeight + TILE_SIZE\n        ) {\n          continue\n        }\n\n        // Clamp pixel position to prevent extreme offsets\n        if (Math.abs(pixelX) > maxPixel || Math.abs(pixelY) > maxPixel) {\n          continue\n        }\n\n        const tileKey = `${String(this.zoom)}/${String(wrappedTx)}/${String(ty)}`\n        const tileUrl = this.tileUrl\n          .replace('{z}', String(this.zoom))\n          .replace('{x}', String(wrappedTx))\n          .replace('{y}', String(ty))\n\n        const tileDiv = document.createElement('div')\n        tileDiv.className = 'cmm-map__tile cmm-map__tile--loading'\n        tileDiv.style.left = `${String(pixelX)}px`\n        tileDiv.style.top = `${String(pixelY)}px`\n\n        // Check cache first (LRU: move to end on access)\n        const cached = this.tileCache.get(tileKey)\n        if (cached !== undefined) {\n          // Move to end for LRU tracking\n          this.tileCache.delete(tileKey)\n          this.tileCache.set(tileKey, cached)\n\n          const clone = cached.cloneNode(true) as HTMLImageElement\n          clone.className = 'cmm-map__tile'\n          clone.style.left = `${String(pixelX)}px`\n          clone.style.top = `${String(pixelY)}px`\n          this.tileLayerEl.appendChild(clone)\n        } else {\n          const img = document.createElement('img')\n          img.className = 'cmm-map__tile cmm-map__tile--loading'\n          img.style.left = `${String(pixelX)}px`\n          img.style.top = `${String(pixelY)}px`\n          img.draggable = false\n          img.alt = ''\n          img.src = tileUrl\n\n          img.addEventListener('load', () => {\n            img.classList.remove('cmm-map__tile--loading')\n            // Store in cache with LRU eviction\n            this.addToTileCache(tileKey, img.cloneNode(true) as HTMLImageElement)\n          })\n\n          img.addEventListener('error', () => {\n            img.classList.remove('cmm-map__tile--loading')\n            img.classList.add('cmm-map__tile--error')\n          })\n\n          this.tileLayerEl.appendChild(img)\n        }\n      }\n    }\n  }\n\n  /** Render markers over the tile layer */\n  private renderMarkers(): void {\n    if (this.markerLayerEl === null) {\n      return\n    }\n\n    this.markerLayerEl.innerHTML = ''\n\n    // Also remove any popup\n    this.closePopup()\n\n    for (const marker of this.markers) {\n      const pixel = latLngToPixel(marker.lat, marker.lng, this.zoom)\n      const screenX = pixel.x - this.offsetX\n      const screenY = pixel.y - this.offsetY\n\n      // Skip markers off-screen\n      if (\n        screenX < -50 ||\n        screenX > this.viewportWidth + 50 ||\n        screenY < -50 ||\n        screenY > this.viewportHeight + 50\n      ) {\n        continue\n      }\n\n      const markerEl = document.createElement('div')\n      markerEl.className = 'cmm-map__marker'\n      markerEl.style.left = `${String(screenX)}px`\n      markerEl.style.top = `${String(screenY)}px`\n      markerEl.setAttribute('data-marker-id', marker.id)\n\n      // Pin SVG\n      const pin = document.createElement('div')\n      pin.className = 'cmm-map__marker-pin'\n      const pinColor = marker.color ?? 'hsl(0, 70%, 55%)'\n\n      if (marker.icon !== undefined) {\n        pin.innerHTML = marker.icon\n      } else {\n        pin.innerHTML = `<svg viewBox=\"0 0 24 36\" width=\"24\" height=\"36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M12 0C5.373 0 0 5.373 0 12c0 9 12 24 12 24s12-15 12-24C24 5.373 18.627 0 12 0z\" fill=\"${pinColor}\"/>\n          <circle cx=\"12\" cy=\"12\" r=\"5\" fill=\"white\" opacity=\"0.8\"/>\n        </svg>`\n      }\n      markerEl.appendChild(pin)\n\n      // Label\n      if (marker.label !== undefined) {\n        const label = document.createElement('div')\n        label.className = 'cmm-map__marker-label'\n        label.textContent = marker.label\n        markerEl.appendChild(label)\n      }\n\n      // Click handler\n      markerEl.addEventListener('click', (e: MouseEvent) => {\n        e.stopPropagation()\n        if (this.config.onMarkerClick !== undefined) {\n          this.config.onMarkerClick(marker)\n        }\n        if (marker.popup !== undefined) {\n          this.showPopup(marker, screenX, screenY)\n        }\n      })\n\n      this.markerLayerEl.appendChild(markerEl)\n    }\n  }\n\n  /** Display a popup for a marker */\n  private showPopup(marker: MapMarker, x: number, y: number): void {\n    this.closePopup()\n\n    if (this.wrapperEl === null) {\n      return\n    }\n\n    const popup = document.createElement('div')\n    popup.className = 'cmm-map__popup'\n    popup.style.left = `${String(x)}px`\n    popup.style.top = `${String(y)}px`\n\n    const closeBtn = document.createElement('button')\n    closeBtn.className = 'cmm-map__popup-close'\n    closeBtn.textContent = '\\u00d7'\n    closeBtn.addEventListener('click', (e: MouseEvent) => {\n      e.stopPropagation()\n      this.closePopup()\n    })\n    popup.appendChild(closeBtn)\n\n    const content = document.createElement('div')\n    content.textContent = marker.popup ?? ''\n    popup.appendChild(content)\n\n    this.wrapperEl.appendChild(popup)\n    this.popupEl = popup\n  }\n\n  /** Close any open popup */\n  private closePopup(): void {\n    if (this.popupEl !== null) {\n      this.popupEl.remove()\n      this.popupEl = null\n    }\n  }\n\n  /** Update zoom button disabled state */\n  private updateZoomButtons(): void {\n    if (this.wrapperEl === null) {\n      return\n    }\n\n    const zoomInBtn = this.wrapperEl.querySelector<HTMLButtonElement>('[data-action=\"zoom-in\"]')\n    const zoomOutBtn = this.wrapperEl.querySelector<HTMLButtonElement>('[data-action=\"zoom-out\"]')\n\n    if (zoomInBtn !== null) {\n      zoomInBtn.disabled = this.zoom >= this.maxZoom\n    }\n    if (zoomOutBtn !== null) {\n      zoomOutBtn.disabled = this.zoom <= this.minZoom\n    }\n  }\n\n  // ---------------------------------------------------------------------------\n  // Event handling\n  // ---------------------------------------------------------------------------\n\n  /** Attach mouse/wheel events for pan and zoom */\n  private attachEvents(): void {\n    if (this.wrapperEl === null) {\n      return\n    }\n\n    this.wrapperEl.addEventListener('mousedown', this.boundMouseDown)\n    window.addEventListener('mousemove', this.boundMouseMove)\n    window.addEventListener('mouseup', this.boundMouseUp)\n    this.wrapperEl.addEventListener('wheel', this.boundWheel, { passive: false })\n    window.addEventListener('resize', this.boundResize)\n  }\n\n  /** Detach all events */\n  private detachEvents(): void {\n    if (this.wrapperEl !== null) {\n      this.wrapperEl.removeEventListener('mousedown', this.boundMouseDown)\n      this.wrapperEl.removeEventListener('wheel', this.boundWheel)\n    }\n    window.removeEventListener('mousemove', this.boundMouseMove)\n    window.removeEventListener('mouseup', this.boundMouseUp)\n    window.removeEventListener('resize', this.boundResize)\n  }\n\n  /** Handle mousedown to start panning */\n  private handleMouseDown(e: MouseEvent): void {\n    // Ignore clicks on controls or popups\n    const target = e.target as HTMLElement\n    if (\n      target.closest('.cmm-map__controls') !== null ||\n      target.closest('.cmm-map__popup') !== null ||\n      target.closest('.cmm-map__marker') !== null\n    ) {\n      return\n    }\n\n    this.isDragging = true\n    this.dragStartX = e.clientX\n    this.dragStartY = e.clientY\n    this.dragOffsetX = this.offsetX\n    this.dragOffsetY = this.offsetY\n    this.closePopup()\n  }\n\n  /** Handle mousemove for panning */\n  private handleMouseMove(e: MouseEvent): void {\n    if (!this.isDragging) {\n      return\n    }\n\n    const dx = e.clientX - this.dragStartX\n    const dy = e.clientY - this.dragStartY\n\n    this.offsetX = this.dragOffsetX - dx\n    this.offsetY = this.dragOffsetY - dy\n\n    // Clamp Y offset\n    const maxPixel = Math.pow(2, this.zoom) * TILE_SIZE\n    this.offsetY = clampValue(this.offsetY, 0, maxPixel - this.viewportHeight)\n\n    this.renderTiles()\n    this.renderMarkers()\n  }\n\n  /** Handle mouseup to stop panning */\n  private handleMouseUp(_e: MouseEvent): void {\n    if (this.isDragging) {\n      this.isDragging = false\n      // Update center lat/lng from new offset\n      this.updateCenterFromOffset()\n    }\n  }\n\n  /** Handle wheel for zoom */\n  private handleWheel(e: WheelEvent): void {\n    e.preventDefault()\n\n    const direction = e.deltaY < 0 ? 1 : -1\n    const newZoom = clampValue(this.zoom + direction, this.minZoom, this.maxZoom)\n\n    if (newZoom === this.zoom) {\n      return\n    }\n\n    // Zoom towards mouse position\n    const rect = this.wrapperEl?.getBoundingClientRect()\n    if (rect === undefined) {\n      return\n    }\n\n    const mouseX = e.clientX - rect.left\n    const mouseY = e.clientY - rect.top\n\n    // World coordinates under the mouse at current zoom\n    const worldX = this.offsetX + mouseX\n    const worldY = this.offsetY + mouseY\n\n    // Scale factor\n    const scaleFactor = Math.pow(2, newZoom - this.zoom)\n\n    // New world coordinates under mouse at new zoom\n    const newWorldX = worldX * scaleFactor\n    const newWorldY = worldY * scaleFactor\n\n    this.zoom = newZoom\n    this.offsetX = newWorldX - mouseX\n    this.offsetY = newWorldY - mouseY\n\n    // Clamp Y offset\n    const maxPixel = Math.pow(2, this.zoom) * TILE_SIZE\n    this.offsetY = clampValue(this.offsetY, 0, maxPixel - this.viewportHeight)\n\n    this.updateCenterFromOffset()\n    this.closePopup()\n    this.renderTiles()\n    this.renderMarkers()\n    this.updateZoomButtons()\n  }\n\n  /** Handle viewport resize */\n  private handleResize(): void {\n    if (this.wrapperEl === null) {\n      return\n    }\n\n    this.viewportWidth = this.wrapperEl.clientWidth\n    this.viewportHeight = this.wrapperEl.clientHeight\n    this.computeOffset()\n    this.renderTiles()\n    this.renderMarkers()\n  }\n\n  /** Add a tile to the cache with LRU eviction */\n  private addToTileCache(key: string, img: HTMLImageElement): void {\n    // Evict oldest entries if cache is full\n    while (this.tileCache.size >= MAX_TILE_CACHE_SIZE) {\n      const oldestKey = this.tileCache.keys().next().value\n      if (oldestKey !== undefined) {\n        this.tileCache.delete(oldestKey)\n      } else {\n        break\n      }\n    }\n    this.tileCache.set(key, img)\n  }\n\n  /** Derive center lat/lng from the current pixel offset */\n  private updateCenterFromOffset(): void {\n    const scale = Math.pow(2, this.zoom) * TILE_SIZE\n    const centerPixelX = this.offsetX + this.viewportWidth / 2\n    const centerPixelY = this.offsetY + this.viewportHeight / 2\n\n    this.centerLng = (centerPixelX / scale) * 360 - 180\n\n    const n = Math.PI - (2 * Math.PI * centerPixelY) / scale\n    this.centerLat = (180 / Math.PI) * Math.atan(0.5 * (Math.exp(n) - Math.exp(-n)))\n  }\n}\n"],"mappings":"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"}

package/dist/visualization/map/types.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Map type definitions
+ * @countermeasure/web-components/visualization/map
+ */
+export interface MapMarker {
+    id: string;
+    lat: number;
+    lng: number;
+    label?: string;
+    icon?: string;
+    color?: string;
+    popup?: string;
+    data?: Record<string, string>;
+}
+export interface MapRegion {
+    id: string;
+    name: string;
+    color?: string;
+    opacity?: number;
+    data?: Record<string, string>;
+}
+export interface MapConfig {
+    container: HTMLElement | string;
+    center?: {
+        lat: number;
+        lng: number;
+    };
+    zoom?: number;
+    markers?: MapMarker[];
+    regions?: MapRegion[];
+    tileUrl?: string;
+    minZoom?: number;
+    maxZoom?: number;
+    onMarkerClick?: (marker: MapMarker) => void;
+    onRegionClick?: (region: MapRegion) => void;
+    className?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/visualization/map/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/visualization/map/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAA;IACV,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAC9B;AAED,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAC9B;AAED,MAAM,WAAW,SAAS;IACxB,SAAS,EAAE,WAAW,GAAG,MAAM,CAAA;IAC/B,MAAM,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAA;IACrC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,SAAS,EAAE,CAAA;IACrB,OAAO,CAAC,EAAE,SAAS,EAAE,CAAA;IACrB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,KAAK,IAAI,CAAA;IAC3C,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,KAAK,IAAI,CAAA;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB"}

package/dist/visualization/mermaid-diagram/index.d.ts

@@ -0,0 +1,45 @@
+import { MermaidDiagramConfig, MermaidTheme } from './types';
+export type { MermaidDiagramConfig, MermaidDiagramType, MermaidTheme } from './types';
+export declare class MermaidDiagram {
+    readonly el: HTMLDivElement;
+    private readonly diagramId;
+    private readonly theme;
+    private readonly onRenderStart;
+    private readonly onRenderComplete;
+    private readonly onRenderError;
+    private content;
+    private svgElement;
+    private destroyed;
+    constructor(config: MermaidDiagramConfig);
+    /**
+     * Update the diagram content and re-render
+     */
+    update(content: string): Promise<void>;
+    /**
+     * Remove the diagram from DOM and clean up
+     */
+    destroy(): void;
+    /**
+     * Get the current SVG element (if rendered)
+     */
+    getSvg(): SVGElement | null;
+    /**
+     * Export the diagram as SVG string
+     */
+    toSvgString(): string | null;
+    /**
+     * Export the diagram as a data URL (for download)
+     */
+    toDataUrl(): string | null;
+    private render;
+    private showLoading;
+    private showError;
+    private escapeHtml;
+    private buildClassName;
+    private isDestroyed;
+}
+/**
+ * Render Mermaid content and return the SVG string (utility function)
+ */
+export declare function renderMermaidToString(content: string, theme?: MermaidTheme): Promise<string>;
+//# sourceMappingURL=index.d.ts.map

package/dist/visualization/mermaid-diagram/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/visualization/mermaid-diagram/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,KAAK,EAAE,oBAAoB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAGjE,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAkLrF,qBAAa,cAAc;IACzB,SAAgB,EAAE,EAAE,cAAc,CAAA;IAElC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAQ;IAClC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAc;IACpC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA0B;IACxD,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAyC;IAC1E,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAsC;IACpE,OAAO,CAAC,OAAO,CAAQ;IACvB,OAAO,CAAC,UAAU,CAA0B;IAC5C,OAAO,CAAC,SAAS,CAAQ;gBAEb,MAAM,EAAE,oBAAoB;IAyBxC;;OAEG;IACG,MAAM,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAQ5C;;OAEG;IACH,OAAO,IAAI,IAAI;IAMf;;OAEG;IACH,MAAM,IAAI,UAAU,GAAG,IAAI;IAI3B;;OAEG;IACH,WAAW,IAAI,MAAM,GAAG,IAAI;IAK5B;;OAEG;IACH,SAAS,IAAI,MAAM,GAAG,IAAI;YAQZ,MAAM;IAuDpB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,SAAS;IAkBjB,OAAO,CAAC,UAAU;IASlB,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,WAAW;CAGpB;AAED;;GAEG;AACH,wBAAsB,qBAAqB,CACzC,OAAO,EAAE,MAAM,EACf,KAAK,GAAE,YAAqB,GAC3B,OAAO,CAAC,MAAM,CAAC,CAkBjB"}

package/dist/visualization/mermaid-diagram/index.js

@@ -0,0 +1,236 @@
+import { n as e, t } from "../../utils-Cn_W3h3f.js";
+//#region src/visualization/mermaid-diagram/index.ts
+var n = null, r = 0;
+async function i() {
+	return n === null && (n = import("../../mermaid.core-DwgIyYMX.js").then((e) => (e.default.initialize({
+		startOnLoad: !1,
+		securityLevel: "strict",
+		theme: "base",
+		fontFamily: "inherit",
+		logLevel: "error"
+	}), e))), n;
+}
+function a(e) {
+	let t = e === "dark" || e === "auto" && document.documentElement.classList.contains("dark"), n = e === "auto" ? getComputedStyle(document.documentElement) : null, r = (e, t) => {
+		if (n !== null) {
+			let t = n.getPropertyValue(e).trim();
+			if (t !== "") return `hsl(${t})`;
+		}
+		return t;
+	};
+	return t ? {
+		primaryColor: r("--primary", "#0ea5e9"),
+		primaryTextColor: r("--primary-foreground", "#ffffff"),
+		primaryBorderColor: r("--border", "#374151"),
+		secondaryColor: r("--secondary", "#1f2937"),
+		secondaryTextColor: r("--secondary-foreground", "#f3f4f6"),
+		secondaryBorderColor: r("--border", "#374151"),
+		tertiaryColor: r("--muted", "#374151"),
+		tertiaryTextColor: r("--muted-foreground", "#9ca3af"),
+		tertiaryBorderColor: r("--border", "#374151"),
+		lineColor: r("--border", "#374151"),
+		textColor: r("--foreground", "#f9fafb"),
+		mainBkg: r("--background", "#111827"),
+		nodeBkg: r("--card", "#1f2937"),
+		nodeBorder: r("--border", "#374151"),
+		clusterBkg: r("--muted", "#1f2937"),
+		clusterBorder: r("--border", "#374151"),
+		defaultLinkColor: r("--primary", "#0ea5e9"),
+		titleColor: r("--foreground", "#f9fafb"),
+		edgeLabelBackground: r("--background", "#111827"),
+		actorBkg: r("--card", "#1f2937"),
+		actorBorder: r("--border", "#374151"),
+		actorTextColor: r("--foreground", "#f9fafb"),
+		actorLineColor: r("--border", "#374151"),
+		signalColor: r("--foreground", "#f9fafb"),
+		signalTextColor: r("--foreground", "#f9fafb"),
+		labelBoxBkgColor: r("--card", "#1f2937"),
+		labelBoxBorderColor: r("--border", "#374151"),
+		labelTextColor: r("--foreground", "#f9fafb"),
+		loopTextColor: r("--foreground", "#f9fafb"),
+		noteBorderColor: r("--border", "#374151"),
+		noteBkgColor: r("--muted", "#374151"),
+		noteTextColor: r("--muted-foreground", "#9ca3af"),
+		activationBorderColor: r("--primary", "#0ea5e9"),
+		activationBkgColor: r("--primary", "#0ea5e9"),
+		sequenceNumberColor: r("--primary-foreground", "#ffffff"),
+		sectionBkgColor: r("--muted", "#1f2937"),
+		altSectionBkgColor: r("--card", "#1f2937"),
+		sectionBkgColor2: r("--muted", "#374151"),
+		taskBorderColor: r("--primary", "#0ea5e9"),
+		taskBkgColor: r("--primary", "#0ea5e9"),
+		taskTextColor: r("--primary-foreground", "#ffffff"),
+		taskTextLightColor: r("--primary-foreground", "#ffffff"),
+		taskTextOutsideColor: r("--foreground", "#f9fafb"),
+		taskTextClickableColor: r("--primary", "#0ea5e9"),
+		activeTaskBorderColor: r("--primary", "#0ea5e9"),
+		activeTaskBkgColor: r("--primary", "#0ea5e9"),
+		gridColor: r("--border", "#374151"),
+		doneTaskBkgColor: r("--muted", "#374151"),
+		doneTaskBorderColor: r("--border", "#374151"),
+		critBorderColor: r("--destructive", "#ef4444"),
+		critBkgColor: r("--destructive", "#ef4444"),
+		todayLineColor: r("--primary", "#0ea5e9"),
+		personBorder: r("--border", "#374151"),
+		personBkg: r("--card", "#1f2937")
+	} : {
+		primaryColor: r("--primary", "#0ea5e9"),
+		primaryTextColor: r("--foreground", "#1e293b"),
+		primaryBorderColor: r("--border", "#cbd5e1"),
+		secondaryColor: r("--secondary", "#f1f5f9"),
+		secondaryTextColor: r("--secondary-foreground", "#1e293b"),
+		secondaryBorderColor: r("--border", "#cbd5e1"),
+		tertiaryColor: r("--muted", "#f8fafc"),
+		tertiaryTextColor: r("--muted-foreground", "#64748b"),
+		tertiaryBorderColor: r("--border", "#cbd5e1"),
+		lineColor: r("--border", "#94a3b8"),
+		textColor: r("--foreground", "#1e293b"),
+		mainBkg: r("--background", "#ffffff"),
+		nodeBkg: r("--card", "#f8fafc"),
+		nodeBorder: r("--border", "#cbd5e1"),
+		clusterBkg: r("--muted", "#f9fafb"),
+		clusterBorder: r("--border", "#e5e7eb"),
+		defaultLinkColor: r("--primary", "#0ea5e9"),
+		titleColor: r("--foreground", "#111827"),
+		edgeLabelBackground: r("--background", "#ffffff"),
+		actorBkg: r("--card", "#ffffff"),
+		actorBorder: r("--border", "#e5e7eb"),
+		actorTextColor: r("--foreground", "#111827"),
+		actorLineColor: r("--border", "#e5e7eb"),
+		signalColor: r("--foreground", "#111827"),
+		signalTextColor: r("--foreground", "#111827"),
+		labelBoxBkgColor: r("--card", "#ffffff"),
+		labelBoxBorderColor: r("--border", "#e5e7eb"),
+		labelTextColor: r("--foreground", "#111827"),
+		loopTextColor: r("--foreground", "#111827"),
+		noteBorderColor: r("--border", "#e5e7eb"),
+		noteBkgColor: r("--muted", "#f9fafb"),
+		noteTextColor: r("--muted-foreground", "#6b7280"),
+		activationBorderColor: r("--primary", "#0ea5e9"),
+		activationBkgColor: r("--primary", "#0ea5e9"),
+		sequenceNumberColor: r("--primary-foreground", "#ffffff"),
+		sectionBkgColor: r("--muted", "#f9fafb"),
+		altSectionBkgColor: r("--card", "#ffffff"),
+		sectionBkgColor2: r("--muted", "#f3f4f6"),
+		taskBorderColor: r("--primary", "#0ea5e9"),
+		taskBkgColor: r("--primary", "#0ea5e9"),
+		taskTextColor: r("--primary-foreground", "#ffffff"),
+		taskTextLightColor: r("--primary-foreground", "#ffffff"),
+		taskTextOutsideColor: r("--foreground", "#111827"),
+		taskTextClickableColor: r("--primary", "#0ea5e9"),
+		activeTaskBorderColor: r("--primary", "#0ea5e9"),
+		activeTaskBkgColor: r("--primary", "#0ea5e9"),
+		gridColor: r("--border", "#e5e7eb"),
+		doneTaskBkgColor: r("--muted", "#f3f4f6"),
+		doneTaskBorderColor: r("--border", "#e5e7eb"),
+		critBorderColor: r("--destructive", "#ef4444"),
+		critBkgColor: r("--destructive", "#ef4444"),
+		todayLineColor: r("--primary", "#0ea5e9"),
+		personBorder: r("--border", "#e5e7eb"),
+		personBkg: r("--card", "#ffffff")
+	};
+}
+var o = class {
+	el;
+	diagramId;
+	theme;
+	onRenderStart;
+	onRenderComplete;
+	onRenderError;
+	content;
+	svgElement = null;
+	destroyed = !1;
+	constructor(n) {
+		r += 1, this.diagramId = e(`cmm-mermaid-${String(r)}`), this.content = n.content, this.theme = n.theme ?? "auto", this.onRenderStart = n.onRenderStart, this.onRenderComplete = n.onRenderComplete, this.onRenderError = n.onRenderError, this.el = document.createElement("div"), this.el.id = this.diagramId, this.el.className = this.buildClassName(n.className), this.showLoading(), t(n.container).appendChild(this.el), this.render();
+	}
+	async update(e) {
+		this.isDestroyed() || (this.content = e, this.showLoading(), await this.render());
+	}
+	destroy() {
+		this.destroyed = !0, this.svgElement = null, this.el.remove();
+	}
+	getSvg() {
+		return this.svgElement;
+	}
+	toSvgString() {
+		return this.svgElement === null ? null : this.svgElement.outerHTML;
+	}
+	toDataUrl() {
+		let e = this.toSvgString();
+		return e === null ? null : `data:image/svg+xml;charset=utf-8,${encodeURIComponent(e)}`;
+	}
+	async render() {
+		if (!this.isDestroyed()) {
+			this.onRenderStart?.();
+			try {
+				let e = await i();
+				if (this.isDestroyed()) return;
+				let t = a(this.theme);
+				e.default.initialize({
+					startOnLoad: !1,
+					securityLevel: "strict",
+					theme: "base",
+					themeVariables: t,
+					fontFamily: "inherit",
+					logLevel: "error"
+				});
+				let n = `${this.diagramId}-svg`, { svg: r } = await e.default.render(n, this.content);
+				if (this.isDestroyed()) return;
+				this.el.innerHTML = "", this.el.innerHTML = r;
+				let o = this.el.querySelector("svg");
+				o !== null && (this.svgElement = o, o.classList.add("cmm-mermaid-diagram__svg"), o.removeAttribute("height"), o.style.maxWidth = "100%", o.style.height = "auto", this.onRenderComplete?.(o));
+			} catch (e) {
+				if (this.isDestroyed()) return;
+				let t = e instanceof Error ? e : Error(String(e));
+				this.showError(t), this.onRenderError?.(t);
+			}
+		}
+	}
+	showLoading() {
+		this.el.innerHTML = "\n      <div class=\"cmm-mermaid-diagram__loading\">\n        <div class=\"cmm-mermaid-diagram__spinner\"></div>\n        <span class=\"cmm-mermaid-diagram__loading-text\">Rendering diagram...</span>\n      </div>\n    ";
+	}
+	showError(e) {
+		let t = this.escapeHtml(e.message);
+		this.el.innerHTML = `
+      <div class="cmm-mermaid-diagram__error">
+        <div class="cmm-mermaid-diagram__error-icon">
+          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="12" cy="12" r="10"/>
+            <line x1="12" y1="8" x2="12" y2="12"/>
+            <line x1="12" y1="16" x2="12.01" y2="16"/>
+          </svg>
+        </div>
+        <div class="cmm-mermaid-diagram__error-title">Failed to render diagram</div>
+        <div class="cmm-mermaid-diagram__error-message">${t}</div>
+        <pre class="cmm-mermaid-diagram__error-source">${this.escapeHtml(this.content)}</pre>
+      </div>
+    `;
+	}
+	escapeHtml(e) {
+		return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+	}
+	buildClassName(e) {
+		let t = ["cmm-mermaid-diagram"];
+		return e !== void 0 && t.push(e), t.join(" ");
+	}
+	isDestroyed() {
+		return this.destroyed;
+	}
+};
+async function s(e, t = "auto") {
+	let n = await i(), o = a(t);
+	n.default.initialize({
+		startOnLoad: !1,
+		securityLevel: "strict",
+		theme: "base",
+		themeVariables: o,
+		fontFamily: "inherit",
+		logLevel: "error"
+	}), r += 1;
+	let s = `cmm-mermaid-render-${String(r)}`, { svg: c } = await n.default.render(s, e);
+	return c;
+}
+//#endregion
+export { o as MermaidDiagram, s as renderMermaidToString };
+
+//# sourceMappingURL=index.js.map