@fusedashlabs/widgets 0.3.1 → 0.4.0

package/dist/components/map-chart/render/draw.js

@@ -0,0 +1,455 @@
+import { MAP_STYLES, MAPBOX_CSS_HREF, sanitizeKey, UNMATCHED_FILL, BUBBLE_RADIUS_STEPS } from "../lib/constants.js";
+import { collectionBBox } from "../lib/domain.js";
+import { hexToRgba, darkenColor } from "../lib/format.js";
+import { getRegionIdFromFeatureProperties } from "../lib/geo-index.js";
+import { orderedLayers } from "../lib/join.js";
+import { defaultLayerSlider, featuresForYear, featuresInSliderRange } from "../lib/legend.js";
+import { choroplethPmtilesSource, toPmtilesFillLayer, toPmtilesStrokeLayer, pmtilesIdExpression } from "../lib/pmtiles.js";
+const controllers = /* @__PURE__ */ new WeakMap();
+function stopMapChart(container) {
+  var _a;
+  (_a = controllers.get(container)) == null ? void 0 : _a.destroy();
+  controllers.delete(container);
+}
+function resizeMapChart(container) {
+  const ctl = controllers.get(container);
+  if (!ctl) return false;
+  ctl.resize();
+  return true;
+}
+async function renderMapChart(container, options) {
+  stopMapChart(container);
+  container.replaceChildren();
+  injectCss(container);
+  if (!options.token) return null;
+  let mapbox;
+  try {
+    mapbox = await import("mapbox-gl");
+  } catch {
+    return null;
+  }
+  const root = document.createElement("div");
+  root.setAttribute("part", "map");
+  root.style.cssText = "width:100%;height:100%;min-height:inherit;";
+  container.append(root);
+  mapbox.default.accessToken = options.token;
+  const map = new mapbox.default.Map({
+    container: root,
+    style: options.model.terrain ? MAP_STYLES.terrain : options.mode === "dark" ? MAP_STYLES.dark : MAP_STYLES.light,
+    center: [0, 20],
+    zoom: 1.4,
+    attributionControl: true,
+    preserveDrawingBuffer: true
+  });
+  let destroyed = false;
+  const layers = orderedLayers(options.model.layers.filter((l) => l.features.length > 0));
+  const hover = options.showTooltip === false ? void 0 : options.onHover;
+  const live = [];
+  let legend = {
+    activeLayerIds: options.activeLayerIds ?? layers.map((layer) => layer.layerId),
+    sliders: options.sliders ?? {},
+    year: options.year
+  };
+  const applyLayers = () => {
+    if (destroyed) return;
+    live.length = 0;
+    for (const layer of layers) {
+      if (layer.visualisationType === "choropleth") {
+        live.push(addChoropleth(map, layer, hover, options.mode, options.pmtilesBaseUrl));
+      } else if (layer.visualisationType === "bubbles") {
+        live.push(addCircles(map, layer, "bubbles", hover));
+      } else if (layer.visualisationType === "markers") {
+        live.push(addCircles(map, layer, "markers", hover));
+      } else {
+        live.push(addSpikes(map, layer, hover));
+      }
+    }
+    applyLegendState(map, live, legend.activeLayerIds, legend.sliders, legend.year);
+    fit(map, layers);
+  };
+  map.once("load", applyLayers);
+  if (map.isStyleLoaded() && map.loaded()) applyLayers();
+  const controller = {
+    resize: () => {
+      try {
+        map.resize();
+      } catch {
+      }
+    },
+    destroy: () => {
+      destroyed = true;
+      try {
+        map.remove();
+      } catch {
+      }
+      container.replaceChildren();
+    },
+    setYear: (year) => {
+      legend = { ...legend, year };
+      if (destroyed) return;
+      try {
+        if (!map.isStyleLoaded()) return;
+        applyLegendState(map, live, legend.activeLayerIds, legend.sliders, legend.year);
+      } catch {
+      }
+    },
+    applyLegend: (activeLayerIds, sliders) => {
+      legend = { ...legend, activeLayerIds, sliders };
+      if (destroyed) return;
+      try {
+        if (!map.isStyleLoaded()) return;
+        applyLegendState(map, live, activeLayerIds, sliders, legend.year);
+      } catch {
+      }
+    }
+  };
+  controllers.set(container, controller);
+  return controller;
+}
+function injectCss(container) {
+  const root = container.getRootNode();
+  const host = root instanceof ShadowRoot ? root : document.head;
+  if (host.querySelector("#ui9000-mapbox-css")) return;
+  const link = document.createElement("link");
+  link.id = "ui9000-mapbox-css";
+  link.rel = "stylesheet";
+  link.href = MAPBOX_CSS_HREF;
+  host.append(link);
+}
+function addChoropleth(map, layer, onHover, mode, pmtilesBaseUrl) {
+  var _a, _b;
+  const queryKey = sanitizeKey(layer.layerId);
+  const sourceId = `${layer.mapType}-${queryKey}`;
+  const fillId = `${sourceId}-fill-layer`;
+  const strokeId = `${sourceId}-selected-stroke-layer`;
+  const fillColor = choroplethFillColor(layer, mode);
+  const inRangeIds = Object.keys(layer.colorById);
+  const pmtiles = choroplethPmtilesSource(layer.mapType, layer.features, pmtilesBaseUrl);
+  const fillSpec = {
+    id: fillId,
+    type: "fill",
+    source: sourceId,
+    paint: {
+      "fill-color": fillColor,
+      "fill-opacity": 1
+    }
+  };
+  const strokeSpec = {
+    id: strokeId,
+    type: "line",
+    source: sourceId,
+    paint: {
+      "line-color": "#000000",
+      "line-width": 0,
+      "line-opacity": 0
+    }
+  };
+  if (pmtiles) {
+    if (!map.getSource(sourceId)) {
+      map.addSource(sourceId, {
+        type: "vector",
+        provider: "pmtiles",
+        url: pmtiles.url
+      });
+    }
+    addLayerMaybeBefore(
+      map,
+      toPmtilesFillLayer(fillSpec, pmtiles.config, inRangeIds)
+    );
+    if (!map.getLayer(strokeId)) {
+      map.addLayer(toPmtilesStrokeLayer(strokeSpec, pmtiles.config));
+    }
+    const idExpr = pmtilesIdExpression(pmtiles.config);
+    bindHover(map, fillId, layer, onHover, (id) => {
+      map.setPaintProperty(strokeId, "line-width", ["case", ["==", idExpr, id ?? ""], 2, 0]);
+      map.setPaintProperty(strokeId, "line-opacity", ["case", ["==", idExpr, id ?? ""], 1, 0]);
+    });
+    return {
+      layerId: layer.layerId,
+      visualisationType: "choropleth",
+      sourceId,
+      paintIds: [fillId, strokeId],
+      fillId,
+      yearKey: layer.yearKey,
+      features: layer.features,
+      colorRanges: layer.colorRanges,
+      pmtilesConfig: pmtiles.config
+    };
+  }
+  const collection = {
+    type: "FeatureCollection",
+    features: layer.features
+  };
+  if (!map.getSource(sourceId)) {
+    map.addSource(sourceId, { type: "geojson", data: collection });
+  } else {
+    (_b = (_a = map.getSource(sourceId)) == null ? void 0 : _a.setData) == null ? void 0 : _b.call(_a, collection);
+  }
+  addLayerMaybeBefore(map, fillSpec);
+  if (!map.getLayer(strokeId)) {
+    map.addLayer(strokeSpec);
+  }
+  bindHover(map, fillId, layer, onHover, (id) => {
+    map.setPaintProperty(strokeId, "line-width", ["case", ["==", ["get", "id"], id ?? ""], 2, 0]);
+    map.setPaintProperty(strokeId, "line-opacity", ["case", ["==", ["get", "id"], id ?? ""], 1, 0]);
+  });
+  return {
+    layerId: layer.layerId,
+    visualisationType: "choropleth",
+    sourceId,
+    paintIds: [fillId, strokeId],
+    fillId,
+    yearKey: layer.yearKey,
+    features: layer.features,
+    colorRanges: layer.colorRanges
+  };
+}
+function choroplethFillColor(layer, mode) {
+  const fillColor = ["match", ["get", "id"]];
+  for (const [id, color] of Object.entries(layer.colorById)) {
+    fillColor.push(id, mode === "dark" ? hexToRgba(darkenColor(rgbaToHex(color), 0.3), 1) : color);
+  }
+  fillColor.push(UNMATCHED_FILL);
+  return fillColor.length > 3 ? fillColor : UNMATCHED_FILL;
+}
+function addLayerMaybeBefore(map, layer) {
+  if (map.getLayer(String(layer.id))) return;
+  try {
+    map.addLayer(layer, "road");
+  } catch {
+    map.addLayer(layer);
+  }
+}
+function addCircles(map, layer, kind, onHover) {
+  var _a, _b;
+  const queryKey = sanitizeKey(layer.layerId);
+  const sourceId = kind === "bubbles" ? `bubbles-${queryKey}` : `scatterplot-${queryKey}`;
+  const layerId = kind === "bubbles" ? `bubble-layer-${queryKey}` : `scatterplot-layer-${queryKey}`;
+  const collection = { type: "FeatureCollection", features: layer.features };
+  if (!map.getSource(sourceId)) {
+    map.addSource(sourceId, { type: "geojson", data: collection });
+  } else {
+    (_b = (_a = map.getSource(sourceId)) == null ? void 0 : _a.setData) == null ? void 0 : _b.call(_a, collection);
+  }
+  const radius = kind === "markers" ? 4 : bubbleRadiusExpression(layer);
+  if (!map.getLayer(layerId)) {
+    map.addLayer({
+      id: layerId,
+      type: "circle",
+      source: sourceId,
+      paint: {
+        "circle-radius": radius,
+        "circle-color": layer.fillColor,
+        "circle-opacity": kind === "bubbles" ? 0.6 : 0.8,
+        "circle-stroke-width": 1,
+        "circle-stroke-color": kind === "markers" ? "#fff" : layer.fillColor
+      }
+    });
+  }
+  bindHover(map, layerId, layer, onHover);
+  return {
+    layerId: layer.layerId,
+    visualisationType: kind,
+    sourceId,
+    paintIds: [layerId],
+    yearKey: layer.yearKey,
+    features: layer.features,
+    colorRanges: layer.colorRanges
+  };
+}
+function addSpikes(map, layer, onHover) {
+  var _a, _b, _c, _d;
+  const queryKey = sanitizeKey(layer.layerId);
+  const sourceId = `spikes-${queryKey}`;
+  const layerId = `svg-spikes-layer-${queryKey}`;
+  const collection = { type: "FeatureCollection", features: layer.features };
+  for (const feature of layer.features) {
+    const iconName = (_a = feature.properties) == null ? void 0 : _a.iconName;
+    const svg = (_b = feature.properties) == null ? void 0 : _b.svgContent;
+    if (typeof iconName !== "string" || typeof svg !== "string") continue;
+    void loadSpikeIcon(map, iconName, svg);
+  }
+  if (!map.getSource(sourceId)) {
+    map.addSource(sourceId, { type: "geojson", data: collection });
+  } else {
+    (_d = (_c = map.getSource(sourceId)) == null ? void 0 : _c.setData) == null ? void 0 : _d.call(_c, collection);
+  }
+  if (!map.getLayer(layerId)) {
+    map.addLayer({
+      id: layerId,
+      type: "symbol",
+      source: sourceId,
+      layout: {
+        visibility: "visible",
+        "icon-image": ["get", "iconName"],
+        "icon-size": 0.9,
+        "icon-allow-overlap": true,
+        "icon-ignore-placement": true,
+        "icon-anchor": "bottom"
+      },
+      paint: { "icon-opacity": 1 }
+    });
+  }
+  bindHover(map, layerId, layer, onHover);
+  return {
+    layerId: layer.layerId,
+    visualisationType: "spike",
+    sourceId,
+    paintIds: [layerId],
+    yearKey: layer.yearKey,
+    features: layer.features,
+    colorRanges: layer.colorRanges
+  };
+}
+function applyLegendState(map, live, activeLayerIds, sliders, year) {
+  var _a, _b;
+  const active = new Set(activeLayerIds);
+  for (const layer of live) {
+    const visible = active.has(layer.layerId);
+    for (const paintId of layer.paintIds) {
+      if (!map.getLayer(paintId)) continue;
+      try {
+        map.setLayoutProperty(paintId, "visibility", visible ? "visible" : "none");
+      } catch {
+      }
+    }
+    if (!visible) continue;
+    const slider = sliders[layer.layerId] ?? defaultLayerSlider(layer.colorRanges.length);
+    const inYear = featuresForYear(layer.features, year, layer.yearKey);
+    const filtered = featuresInSliderRange(inYear, layer.colorRanges, slider);
+    if (layer.visualisationType === "choropleth" && layer.pmtilesConfig && layer.fillId) {
+      const ids = [
+        ...new Set(
+          filtered.map((feature) => {
+            var _a2;
+            return (_a2 = feature.properties) == null ? void 0 : _a2.id;
+          }).filter((id) => typeof id === "string" && id.length > 0)
+        )
+      ];
+      const filter = ids.length > 0 ? ["in", pmtilesIdExpression(layer.pmtilesConfig), ["literal", ids]] : ["==", 1, 0];
+      try {
+        map.setFilter(layer.fillId, filter);
+      } catch {
+      }
+      continue;
+    }
+    try {
+      (_b = (_a = map.getSource(layer.sourceId)) == null ? void 0 : _a.setData) == null ? void 0 : _b.call(_a, { type: "FeatureCollection", features: filtered });
+    } catch {
+    }
+  }
+}
+function bubbleRadiusExpression(layer) {
+  const ranges = [...layer.colorRanges].sort((a, b) => a.start - b.start);
+  if (!ranges.length) return BUBBLE_RADIUS_STEPS[0];
+  const expr = [
+    "step",
+    ["coalesce", ["to-number", ["get", "value"]], ranges[0].start],
+    BUBBLE_RADIUS_STEPS[0]
+  ];
+  for (let i = 1; i < Math.min(ranges.length, BUBBLE_RADIUS_STEPS.length); i++) {
+    expr.push(ranges[i].start, BUBBLE_RADIUS_STEPS[i]);
+  }
+  return expr.length < 4 ? BUBBLE_RADIUS_STEPS[0] : expr;
+}
+function bindHover(map, layerId, layer, onHover, onId) {
+  if (!onHover) return;
+  const read = (properties) => {
+    if (!properties) return null;
+    const regionId = String(
+      getRegionIdFromFeatureProperties(properties, layer.mapType) ?? properties.id ?? properties.regionId ?? ""
+    );
+    if (!regionId) return null;
+    const feature = layer.features.find(
+      (f) => {
+        var _a, _b;
+        return String(((_a = f.properties) == null ? void 0 : _a.id) ?? ((_b = f.properties) == null ? void 0 : _b.regionId)) === regionId;
+      }
+    );
+    const props = (feature == null ? void 0 : feature.properties) ?? properties;
+    const value = Number(props.value ?? 0);
+    const regionName = String(props.regionName ?? props.name ?? regionId);
+    return {
+      regionId,
+      regionName,
+      value,
+      valueKey: layer.valueKey,
+      layerName: layer.layerName,
+      lngLat: { lng: 0, lat: 0 }
+    };
+  };
+  map.on(
+    "mousemove",
+    layerId,
+    (e) => {
+      const feature = map.queryRenderedFeatures(e.point, { layers: [layerId] })[0];
+      const entry = read(feature == null ? void 0 : feature.properties);
+      if (!entry) {
+        onId == null ? void 0 : onId(null);
+        onHover(null);
+        return;
+      }
+      if (e.lngLat) entry.lngLat = e.lngLat;
+      if (e.point) entry.point = e.point;
+      onId == null ? void 0 : onId(entry.regionId);
+      onHover(entry);
+    }
+  );
+  map.on("mouseleave", layerId, () => {
+    onId == null ? void 0 : onId(null);
+    onHover(null);
+  });
+}
+function fit(map, layers) {
+  const features = layers.flatMap((l) => l.features);
+  const box = collectionBBox(features);
+  if (!box) return;
+  try {
+    map.fitBounds(
+      [
+        [box[0], box[1]],
+        [box[2], box[3]]
+      ],
+      { padding: 64, duration: 750 }
+    );
+  } catch {
+  }
+}
+function loadSpikeIcon(map, iconName, svgContent) {
+  const svgDataUrl = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgContent)}`;
+  const img = new Image();
+  img.onload = () => {
+    const canvas = document.createElement("canvas");
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return;
+    const pixelRatio = 2;
+    canvas.width = (img.width || 30) * pixelRatio;
+    canvas.height = (img.height || 30) * pixelRatio;
+    ctx.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);
+    ctx.drawImage(img, 0, 0, img.width || 30, img.height || 30);
+    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+    if (map.hasImage(iconName)) {
+      try {
+        map.removeImage(iconName);
+      } catch {
+      }
+    }
+    try {
+      map.addImage(iconName, imageData, { pixelRatio: 2 });
+    } catch {
+    }
+  };
+  img.src = svgDataUrl;
+}
+function rgbaToHex(color) {
+  const match = color.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);
+  if (!match) return color.startsWith("#") ? color : "#473DD9";
+  const hex = (n) => Number(n).toString(16).padStart(2, "0");
+  return `#${hex(match[1])}${hex(match[2])}${hex(match[3])}`;
+}
+export {
+  renderMapChart,
+  resizeMapChart,
+  stopMapChart
+};
+//# sourceMappingURL=draw.js.map

package/dist/components/map-chart/render/draw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"draw.js","sources":["../../../../src/components/map-chart/render/draw.ts"],"sourcesContent":["import {\n  BUBBLE_RADIUS_STEPS,\n  MAP_STYLES,\n  MAPBOX_CSS_HREF,\n  UNMATCHED_FILL,\n  sanitizeKey,\n  type MapVisualisation,\n} from '../lib/constants.js';\nimport { collectionBBox } from '../lib/domain.js';\nimport { darkenColor, hexToRgba } from '../lib/format.js';\nimport { getRegionIdFromFeatureProperties } from '../lib/geo-index.js';\nimport { orderedLayers } from '../lib/join.js';\nimport {\n  defaultLayerSlider,\n  featuresForYear,\n  featuresInSliderRange,\n  type LayerSlider,\n} from '../lib/legend.js';\nimport {\n  choroplethPmtilesSource,\n  pmtilesIdExpression,\n  toPmtilesFillLayer,\n  toPmtilesStrokeLayer,\n  type PmtilesLayerConfig,\n} from '../lib/pmtiles.js';\nimport type { ColorRange, GeoJsonFeature, MapHoverEntry, MapLayerModel, MapModel } from '../lib/types.js';\n\nexport type MapMode = 'light' | 'dark';\n\nexport type RenderMapChartOptions = {\n  model: MapModel;\n  token: string;\n  mode?: MapMode;\n  showTooltip?: boolean;\n  pmtilesBaseUrl?: string;\n  activeLayerIds?: string[];\n  sliders?: Record<string, LayerSlider>;\n  year?: string;\n  onHover?: (entry: MapHoverEntry | null) => void;\n};\n\nexport type MapChartController = {\n  resize: () => void;\n  destroy: () => void;\n  setYear: (year: string | undefined) => void;\n  applyLegend: (activeLayerIds: string[], sliders: Record<string, LayerSlider>) => void;\n};\n\ntype LiveMapLayer = {\n  layerId: string;\n  visualisationType: MapVisualisation;\n  sourceId: string;\n  paintIds: string[];\n  fillId?: string;\n  yearKey: string;\n  features: GeoJsonFeature[];\n  colorRanges: ColorRange[];\n  pmtilesConfig?: PmtilesLayerConfig;\n};\n\ntype MapboxMap = {\n  addSource: (id: string, source: Record<string, unknown>) => void;\n  addLayer: (layer: Record<string, unknown>, before?: string) => void;\n  addImage: (id: string, image: ImageData, options?: { pixelRatio?: number }) => void;\n  getSource: (id: string) => { setData?: (data: unknown) => void } | undefined;\n  getLayer: (id: string) => unknown;\n  hasImage: (id: string) => boolean;\n  removeImage: (id: string) => void;\n  setPaintProperty: (id: string, name: string, value: unknown) => void;\n  setLayoutProperty: (id: string, name: string, value: unknown) => void;\n  setFilter: (id: string, filter: unknown) => void;\n  fitBounds: (\n    bounds: [[number, number], [number, number]],\n    options?: { padding?: number; duration?: number },\n  ) => void;\n  resize: () => void;\n  remove: () => void;\n  loaded: () => boolean;\n  isStyleLoaded: () => boolean;\n  on: (event: string, layerOrHandler: unknown, handler?: unknown) => void;\n  off: (event: string, layerOrHandler: unknown, handler?: unknown) => void;\n  once: (event: string, handler: () => void) => void;\n  queryRenderedFeatures: (\n    point: unknown,\n    options?: { layers?: string[] },\n  ) => Array<{ properties?: Record<string, unknown>; geometry?: { coordinates?: unknown } }>;\n};\n\ntype MapboxModule = {\n  default: {\n    accessToken: string;\n    Map: new (options: Record<string, unknown>) => MapboxMap;\n  };\n};\n\nconst controllers = new WeakMap<HTMLElement, MapChartController>();\n\nexport function stopMapChart(container: HTMLElement): void {\n  controllers.get(container)?.destroy();\n  controllers.delete(container);\n}\n\nexport function resizeMapChart(container: HTMLElement): boolean {\n  const ctl = controllers.get(container);\n  if (!ctl) return false;\n  ctl.resize();\n  return true;\n}\n\nexport async function renderMapChart(\n  container: HTMLElement,\n  options: RenderMapChartOptions,\n): Promise<MapChartController | null> {\n  stopMapChart(container);\n  container.replaceChildren();\n  injectCss(container);\n\n  if (!options.token) return null;\n\n  let mapbox: MapboxModule;\n  try {\n    mapbox = (await import('mapbox-gl')) as unknown as MapboxModule;\n  } catch {\n    return null;\n  }\n\n  const root = document.createElement('div');\n  root.setAttribute('part', 'map');\n  root.style.cssText = 'width:100%;height:100%;min-height:inherit;';\n  container.append(root);\n\n  mapbox.default.accessToken = options.token;\n  const map = new mapbox.default.Map({\n    container: root,\n    style: options.model.terrain\n      ? MAP_STYLES.terrain\n      : options.mode === 'dark'\n        ? MAP_STYLES.dark\n        : MAP_STYLES.light,\n    center: [0, 20],\n    zoom: 1.4,\n    attributionControl: true,\n    preserveDrawingBuffer: true,\n  });\n\n  let destroyed = false;\n  const layers = orderedLayers(options.model.layers.filter((l) => l.features.length > 0));\n  const hover = options.showTooltip === false ? undefined : options.onHover;\n  const live: LiveMapLayer[] = [];\n  let legend = {\n    activeLayerIds: options.activeLayerIds ?? layers.map((layer) => layer.layerId),\n    sliders: options.sliders ?? {},\n    year: options.year,\n  };\n\n  const applyLayers = (): void => {\n    if (destroyed) return;\n    live.length = 0;\n    for (const layer of layers) {\n      if (layer.visualisationType === 'choropleth') {\n        live.push(addChoropleth(map, layer, hover, options.mode, options.pmtilesBaseUrl));\n      } else if (layer.visualisationType === 'bubbles') {\n        live.push(addCircles(map, layer, 'bubbles', hover));\n      } else if (layer.visualisationType === 'markers') {\n        live.push(addCircles(map, layer, 'markers', hover));\n      } else {\n        live.push(addSpikes(map, layer, hover));\n      }\n    }\n    applyLegendState(map, live, legend.activeLayerIds, legend.sliders, legend.year);\n    fit(map, layers);\n  };\n\n  map.once('load', applyLayers);\n  if (map.isStyleLoaded() && map.loaded()) applyLayers();\n\n  const controller: MapChartController = {\n    resize: () => {\n      try {\n        map.resize();\n      } catch {\n        /* map already gone */\n      }\n    },\n    destroy: () => {\n      destroyed = true;\n      try {\n        map.remove();\n      } catch {\n        /* ignore */\n      }\n      container.replaceChildren();\n    },\n    setYear: (year) => {\n      legend = { ...legend, year };\n      if (destroyed) return;\n      try {\n        if (!map.isStyleLoaded()) return;\n        applyLegendState(map, live, legend.activeLayerIds, legend.sliders, legend.year);\n      } catch {\n        /* style not ready */\n      }\n    },\n    applyLegend: (activeLayerIds, sliders) => {\n      legend = { ...legend, activeLayerIds, sliders };\n      if (destroyed) return;\n      try {\n        if (!map.isStyleLoaded()) return;\n        applyLegendState(map, live, activeLayerIds, sliders, legend.year);\n      } catch {\n        /* style not ready */\n      }\n    },\n  };\n  controllers.set(container, controller);\n  return controller;\n}\n\nfunction injectCss(container: HTMLElement): void {\n  const root = container.getRootNode();\n  const host = root instanceof ShadowRoot ? root : document.head;\n  if (host.querySelector('#ui9000-mapbox-css')) return;\n  const link = document.createElement('link');\n  link.id = 'ui9000-mapbox-css';\n  link.rel = 'stylesheet';\n  link.href = MAPBOX_CSS_HREF;\n  host.append(link);\n}\n\nfunction addChoropleth(\n  map: MapboxMap,\n  layer: MapLayerModel,\n  onHover: RenderMapChartOptions['onHover'],\n  mode?: MapMode,\n  pmtilesBaseUrl?: string,\n): LiveMapLayer {\n  const queryKey = sanitizeKey(layer.layerId);\n  const sourceId = `${layer.mapType}-${queryKey}`;\n  const fillId = `${sourceId}-fill-layer`;\n  const strokeId = `${sourceId}-selected-stroke-layer`;\n  const fillColor = choroplethFillColor(layer, mode);\n  const inRangeIds = Object.keys(layer.colorById);\n  const pmtiles = choroplethPmtilesSource(layer.mapType, layer.features, pmtilesBaseUrl);\n\n  const fillSpec: Record<string, unknown> = {\n    id: fillId,\n    type: 'fill',\n    source: sourceId,\n    paint: {\n      'fill-color': fillColor,\n      'fill-opacity': 1,\n    },\n  };\n  const strokeSpec: Record<string, unknown> = {\n    id: strokeId,\n    type: 'line',\n    source: sourceId,\n    paint: {\n      'line-color': '#000000',\n      'line-width': 0,\n      'line-opacity': 0,\n    },\n  };\n\n  if (pmtiles) {\n    if (!map.getSource(sourceId)) {\n      map.addSource(sourceId, {\n        type: 'vector',\n        provider: 'pmtiles',\n        url: pmtiles.url,\n      });\n    }\n    addLayerMaybeBefore(\n      map,\n      toPmtilesFillLayer(fillSpec, pmtiles.config, inRangeIds),\n    );\n    if (!map.getLayer(strokeId)) {\n      map.addLayer(toPmtilesStrokeLayer(strokeSpec, pmtiles.config));\n    }\n    const idExpr = pmtilesIdExpression(pmtiles.config);\n    bindHover(map, fillId, layer, onHover, (id) => {\n      map.setPaintProperty(strokeId, 'line-width', ['case', ['==', idExpr, id ?? ''], 2, 0]);\n      map.setPaintProperty(strokeId, 'line-opacity', ['case', ['==', idExpr, id ?? ''], 1, 0]);\n    });\n    return {\n      layerId: layer.layerId,\n      visualisationType: 'choropleth',\n      sourceId,\n      paintIds: [fillId, strokeId],\n      fillId,\n      yearKey: layer.yearKey,\n      features: layer.features,\n      colorRanges: layer.colorRanges,\n      pmtilesConfig: pmtiles.config,\n    };\n  }\n\n  const collection = {\n    type: 'FeatureCollection',\n    features: layer.features,\n  };\n  if (!map.getSource(sourceId)) {\n    map.addSource(sourceId, { type: 'geojson', data: collection });\n  } else {\n    map.getSource(sourceId)?.setData?.(collection);\n  }\n\n  addLayerMaybeBefore(map, fillSpec);\n  if (!map.getLayer(strokeId)) {\n    map.addLayer(strokeSpec);\n  }\n\n  bindHover(map, fillId, layer, onHover, (id) => {\n    map.setPaintProperty(strokeId, 'line-width', ['case', ['==', ['get', 'id'], id ?? ''], 2, 0]);\n    map.setPaintProperty(strokeId, 'line-opacity', ['case', ['==', ['get', 'id'], id ?? ''], 1, 0]);\n  });\n  return {\n    layerId: layer.layerId,\n    visualisationType: 'choropleth',\n    sourceId,\n    paintIds: [fillId, strokeId],\n    fillId,\n    yearKey: layer.yearKey,\n    features: layer.features,\n    colorRanges: layer.colorRanges,\n  };\n}\n\nfunction choroplethFillColor(layer: MapLayerModel, mode?: MapMode): unknown {\n  const fillColor: unknown[] = ['match', ['get', 'id']];\n  for (const [id, color] of Object.entries(layer.colorById)) {\n    fillColor.push(id, mode === 'dark' ? hexToRgba(darkenColor(rgbaToHex(color), 0.3), 1) : color);\n  }\n  fillColor.push(UNMATCHED_FILL);\n  return fillColor.length > 3 ? fillColor : UNMATCHED_FILL;\n}\n\nfunction addLayerMaybeBefore(map: MapboxMap, layer: Record<string, unknown>): void {\n  if (map.getLayer(String(layer.id))) return;\n  try {\n    map.addLayer(layer, 'road');\n  } catch {\n    map.addLayer(layer);\n  }\n}\n\nfunction addCircles(\n  map: MapboxMap,\n  layer: MapLayerModel,\n  kind: 'bubbles' | 'markers',\n  onHover: RenderMapChartOptions['onHover'],\n): LiveMapLayer {\n  const queryKey = sanitizeKey(layer.layerId);\n  const sourceId = kind === 'bubbles' ? `bubbles-${queryKey}` : `scatterplot-${queryKey}`;\n  const layerId = kind === 'bubbles' ? `bubble-layer-${queryKey}` : `scatterplot-layer-${queryKey}`;\n  const collection = { type: 'FeatureCollection', features: layer.features };\n\n  if (!map.getSource(sourceId)) {\n    map.addSource(sourceId, { type: 'geojson', data: collection });\n  } else {\n    map.getSource(sourceId)?.setData?.(collection);\n  }\n\n  const radius =\n    kind === 'markers'\n      ? 4\n      : bubbleRadiusExpression(layer);\n\n  if (!map.getLayer(layerId)) {\n    map.addLayer({\n      id: layerId,\n      type: 'circle',\n      source: sourceId,\n      paint: {\n        'circle-radius': radius,\n        'circle-color': layer.fillColor,\n        'circle-opacity': kind === 'bubbles' ? 0.6 : 0.8,\n        'circle-stroke-width': 1,\n        'circle-stroke-color': kind === 'markers' ? '#fff' : layer.fillColor,\n      },\n    });\n  }\n\n  bindHover(map, layerId, layer, onHover);\n  return {\n    layerId: layer.layerId,\n    visualisationType: kind,\n    sourceId,\n    paintIds: [layerId],\n    yearKey: layer.yearKey,\n    features: layer.features,\n    colorRanges: layer.colorRanges,\n  };\n}\n\nfunction addSpikes(\n  map: MapboxMap,\n  layer: MapLayerModel,\n  onHover: RenderMapChartOptions['onHover'],\n): LiveMapLayer {\n  const queryKey = sanitizeKey(layer.layerId);\n  const sourceId = `spikes-${queryKey}`;\n  const layerId = `svg-spikes-layer-${queryKey}`;\n  const collection = { type: 'FeatureCollection', features: layer.features };\n\n  for (const feature of layer.features) {\n    const iconName = feature.properties?.iconName;\n    const svg = feature.properties?.svgContent;\n    if (typeof iconName !== 'string' || typeof svg !== 'string') continue;\n    void loadSpikeIcon(map, iconName, svg);\n  }\n\n  if (!map.getSource(sourceId)) {\n    map.addSource(sourceId, { type: 'geojson', data: collection });\n  } else {\n    map.getSource(sourceId)?.setData?.(collection);\n  }\n\n  if (!map.getLayer(layerId)) {\n    map.addLayer({\n      id: layerId,\n      type: 'symbol',\n      source: sourceId,\n      layout: {\n        visibility: 'visible',\n        'icon-image': ['get', 'iconName'],\n        'icon-size': 0.9,\n        'icon-allow-overlap': true,\n        'icon-ignore-placement': true,\n        'icon-anchor': 'bottom',\n      },\n      paint: { 'icon-opacity': 1 },\n    });\n  }\n\n  bindHover(map, layerId, layer, onHover);\n  return {\n    layerId: layer.layerId,\n    visualisationType: 'spike',\n    sourceId,\n    paintIds: [layerId],\n    yearKey: layer.yearKey,\n    features: layer.features,\n    colorRanges: layer.colorRanges,\n  };\n}\n\nfunction applyLegendState(\n  map: MapboxMap,\n  live: LiveMapLayer[],\n  activeLayerIds: string[],\n  sliders: Record<string, LayerSlider>,\n  year?: string,\n): void {\n  const active = new Set(activeLayerIds);\n  for (const layer of live) {\n    const visible = active.has(layer.layerId);\n    for (const paintId of layer.paintIds) {\n      if (!map.getLayer(paintId)) continue;\n      try {\n        map.setLayoutProperty(paintId, 'visibility', visible ? 'visible' : 'none');\n      } catch {\n        /* layer not ready */\n      }\n    }\n    if (!visible) continue;\n    const slider = sliders[layer.layerId] ?? defaultLayerSlider(layer.colorRanges.length);\n    const inYear = featuresForYear(layer.features, year, layer.yearKey);\n    const filtered = featuresInSliderRange(inYear, layer.colorRanges, slider);\n    if (layer.visualisationType === 'choropleth' && layer.pmtilesConfig && layer.fillId) {\n      const ids = [\n        ...new Set(\n          filtered\n            .map((feature) => feature.properties?.id)\n            .filter((id): id is string => typeof id === 'string' && id.length > 0),\n        ),\n      ];\n      const filter =\n        ids.length > 0\n          ? ['in', pmtilesIdExpression(layer.pmtilesConfig), ['literal', ids]]\n          : ['==', 1, 0];\n      try {\n        map.setFilter(layer.fillId, filter);\n      } catch {\n        /* ignore */\n      }\n      continue;\n    }\n    try {\n      map.getSource(layer.sourceId)?.setData?.({ type: 'FeatureCollection', features: filtered });\n    } catch {\n      /* source gone */\n    }\n  }\n}\n\nfunction bubbleRadiusExpression(layer: MapLayerModel): unknown {\n  const ranges = [...layer.colorRanges].sort((a, b) => a.start - b.start);\n  if (!ranges.length) return BUBBLE_RADIUS_STEPS[0];\n  const expr: unknown[] = [\n    'step',\n    ['coalesce', ['to-number', ['get', 'value']], ranges[0].start],\n    BUBBLE_RADIUS_STEPS[0],\n  ];\n  for (let i = 1; i < Math.min(ranges.length, BUBBLE_RADIUS_STEPS.length); i++) {\n    expr.push(ranges[i].start, BUBBLE_RADIUS_STEPS[i]);\n  }\n  return expr.length < 4 ? BUBBLE_RADIUS_STEPS[0] : expr;\n}\n\nfunction bindHover(\n  map: MapboxMap,\n  layerId: string,\n  layer: MapLayerModel,\n  onHover: RenderMapChartOptions['onHover'],\n  onId?: (id: string | null) => void,\n): void {\n  if (!onHover) return;\n\n  const read = (properties: Record<string, unknown> | undefined): MapHoverEntry | null => {\n    if (!properties) return null;\n    const regionId = String(\n      getRegionIdFromFeatureProperties(properties, layer.mapType) ??\n        properties.id ??\n        properties.regionId ??\n        '',\n    );\n    if (!regionId) return null;\n    const feature = layer.features.find(\n      (f) => String(f.properties?.id ?? f.properties?.regionId) === regionId,\n    );\n    const props = feature?.properties ?? properties;\n    const value = Number(props.value ?? 0);\n    const regionName = String(props.regionName ?? props.name ?? regionId);\n    return {\n      regionId,\n      regionName,\n      value,\n      valueKey: layer.valueKey,\n      layerName: layer.layerName,\n      lngLat: { lng: 0, lat: 0 },\n    };\n  };\n\n  map.on(\n    'mousemove',\n    layerId,\n    (e: {\n      point?: { x: number; y: number };\n      lngLat?: { lng: number; lat: number };\n    }) => {\n      const feature = map.queryRenderedFeatures(e.point, { layers: [layerId] })[0];\n      const entry = read(feature?.properties);\n      if (!entry) {\n        onId?.(null);\n        onHover(null);\n        return;\n      }\n      if (e.lngLat) entry.lngLat = e.lngLat;\n      if (e.point) entry.point = e.point;\n      onId?.(entry.regionId);\n      onHover(entry);\n    },\n  );\n  map.on('mouseleave', layerId, () => {\n    onId?.(null);\n    onHover(null);\n  });\n}\n\nfunction fit(map: MapboxMap, layers: MapLayerModel[]): void {\n  const features = layers.flatMap((l) => l.features);\n  const box = collectionBBox(features);\n  if (!box) return;\n  try {\n    map.fitBounds(\n      [\n        [box[0], box[1]],\n        [box[2], box[3]],\n      ],\n      { padding: 64, duration: 750 },\n    );\n  } catch {\n    /* empty bounds */\n  }\n}\n\nfunction loadSpikeIcon(map: MapboxMap, iconName: string, svgContent: string): void {\n  const svgDataUrl = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgContent)}`;\n  const img = new Image();\n  img.onload = () => {\n    const canvas = document.createElement('canvas');\n    const ctx = canvas.getContext('2d');\n    if (!ctx) return;\n    const pixelRatio = 2;\n    canvas.width = (img.width || 30) * pixelRatio;\n    canvas.height = (img.height || 30) * pixelRatio;\n    ctx.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);\n    ctx.drawImage(img, 0, 0, img.width || 30, img.height || 30);\n    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\n    if (map.hasImage(iconName)) {\n      try {\n        map.removeImage(iconName);\n      } catch {\n        /* ignore */\n      }\n    }\n    try {\n      map.addImage(iconName, imageData, { pixelRatio: 2 });\n    } catch {\n      /* already exists */\n    }\n  };\n  img.src = svgDataUrl;\n}\n\nfunction rgbaToHex(color: string): string {\n  const match = color.match(/rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)/);\n  if (!match) return color.startsWith('#') ? color : '#473DD9';\n  const hex = (n: string) => Number(n).toString(16).padStart(2, '0');\n  return `#${hex(match[1])}${hex(match[2])}${hex(match[3])}`;\n}\n"],"names":["_a"],"mappings":"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"}

package/dist/components/map-chart/render/index.d.ts

@@ -0,0 +1,2 @@
+export { renderMapChart, resizeMapChart, stopMapChart, type MapChartController, type MapMode, type RenderMapChartOptions, } from './draw.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/map-chart/render/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/map-chart/render/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,cAAc,EACd,YAAY,EACZ,KAAK,kBAAkB,EACvB,KAAK,OAAO,EACZ,KAAK,qBAAqB,GAC3B,MAAM,WAAW,CAAC"}

package/dist/components/matrix-chart/element/styles.d.ts

@@ -0,0 +1,2 @@
+export declare const matrixStyles: import('lit').CSSResult;
+//# sourceMappingURL=styles.d.ts.map

package/dist/components/matrix-chart/element/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/matrix-chart/element/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,yBA2FxB,CAAC"}

package/dist/components/matrix-chart/element/styles.js

@@ -0,0 +1,97 @@
+import { css } from "lit";
+const matrixStyles = css`
+  :host {
+    display: block;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    min-height: 320px;
+    color: var(--ui9000-color-text, #111827);
+    font-family: var(--ui9000-font-family, system-ui, sans-serif);
+    box-sizing: border-box;
+  }
+  .chart-body {
+    flex: 1;
+    min-height: 0;
+    display: flex;
+    flex-direction: column;
+  }
+  .chart-top-axis {
+    flex-shrink: 0;
+    width: 100%;
+    overflow: hidden;
+  }
+  .chart-scroll {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+    overflow-x: hidden;
+    position: relative;
+  }
+  .chart-root {
+    width: 100%;
+    min-height: inherit;
+  }
+  .chart-root svg .matrix-cell {
+    cursor: default;
+  }
+  .chart-root[data-hoverable] svg .matrix-cell:hover {
+    stroke: var(--ui9000-color-text, #111827);
+    stroke-width: 1.5px;
+  }
+  .palette-legend {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-shrink: 0;
+    padding: 8px 0 12px;
+    font-size: 12px;
+    line-height: 1.2;
+    color: var(--ui9000-color-text-muted, #6c7584);
+  }
+  .palette-swatches {
+    display: flex;
+    align-items: center;
+  }
+  .palette-swatch {
+    width: 14px;
+    height: 8px;
+  }
+  .palette-swatch:first-child {
+    border-top-left-radius: 8px;
+    border-bottom-left-radius: 8px;
+  }
+  .palette-swatch:last-child {
+    border-top-right-radius: 8px;
+    border-bottom-right-radius: 8px;
+  }
+  .tooltip {
+    position: absolute;
+    pointer-events: none;
+    z-index: 2;
+    padding: 6px 10px;
+    border-radius: 6px;
+    font-size: 12px;
+    line-height: 1.35;
+    background: var(--ui9000-color-text, #111827);
+    color: #fff;
+    box-shadow: 0 4px 12px rgb(0 0 0 / 18%);
+    transform: translate(-50%, calc(-100% - 10px));
+    white-space: nowrap;
+  }
+  .tooltip .name {
+    font-weight: 600;
+  }
+  .empty {
+    display: grid;
+    place-items: center;
+    height: 100%;
+    min-height: inherit;
+    color: var(--ui9000-color-text-muted, #6b7280);
+    font-size: 0.875rem;
+  }
+`;
+export {
+  matrixStyles
+};
+//# sourceMappingURL=styles.js.map

package/dist/components/matrix-chart/element/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../src/components/matrix-chart/element/styles.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const matrixStyles = css`\n  :host {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n    min-height: 320px;\n    color: var(--ui9000-color-text, #111827);\n    font-family: var(--ui9000-font-family, system-ui, sans-serif);\n    box-sizing: border-box;\n  }\n  .chart-body {\n    flex: 1;\n    min-height: 0;\n    display: flex;\n    flex-direction: column;\n  }\n  .chart-top-axis {\n    flex-shrink: 0;\n    width: 100%;\n    overflow: hidden;\n  }\n  .chart-scroll {\n    flex: 1;\n    min-height: 0;\n    overflow-y: auto;\n    overflow-x: hidden;\n    position: relative;\n  }\n  .chart-root {\n    width: 100%;\n    min-height: inherit;\n  }\n  .chart-root svg .matrix-cell {\n    cursor: default;\n  }\n  .chart-root[data-hoverable] svg .matrix-cell:hover {\n    stroke: var(--ui9000-color-text, #111827);\n    stroke-width: 1.5px;\n  }\n  .palette-legend {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex-shrink: 0;\n    padding: 8px 0 12px;\n    font-size: 12px;\n    line-height: 1.2;\n    color: var(--ui9000-color-text-muted, #6c7584);\n  }\n  .palette-swatches {\n    display: flex;\n    align-items: center;\n  }\n  .palette-swatch {\n    width: 14px;\n    height: 8px;\n  }\n  .palette-swatch:first-child {\n    border-top-left-radius: 8px;\n    border-bottom-left-radius: 8px;\n  }\n  .palette-swatch:last-child {\n    border-top-right-radius: 8px;\n    border-bottom-right-radius: 8px;\n  }\n  .tooltip {\n    position: absolute;\n    pointer-events: none;\n    z-index: 2;\n    padding: 6px 10px;\n    border-radius: 6px;\n    font-size: 12px;\n    line-height: 1.35;\n    background: var(--ui9000-color-text, #111827);\n    color: #fff;\n    box-shadow: 0 4px 12px rgb(0 0 0 / 18%);\n    transform: translate(-50%, calc(-100% - 10px));\n    white-space: nowrap;\n  }\n  .tooltip .name {\n    font-weight: 600;\n  }\n  .empty {\n    display: grid;\n    place-items: center;\n    height: 100%;\n    min-height: inherit;\n    color: var(--ui9000-color-text-muted, #6b7280);\n    font-size: 0.875rem;\n  }\n`;\n"],"names":[],"mappings":";AAEO,MAAM,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/matrix-chart/element/ui9000-matrix-chart.d.ts

@@ -0,0 +1,39 @@
+import { PropertyValues } from 'lit';
+import { Ui9000ChartElement } from '../../../element/ui9000-chart-base.js';
+export declare class Ui9000MatrixChart extends Ui9000ChartElement {
+    static styles: import('lit').CSSResult[];
+    showLegend: boolean;
+    showTooltip: boolean;
+    private _tooltip;
+    private _empty;
+    private _pinnedTopAxis;
+    private _resizeObserver?;
+    private _raf;
+    private _drawnSignature;
+    private _drawnModel;
+    private _modelJson;
+    private _model;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    firstUpdated(): void;
+    updated(changed: PropertyValues): void;
+    private scheduleDraw;
+    /** Normalizing a dense grid is not free — only redo it when `data` changes. */
+    private parseData;
+    private draw;
+    /**
+     * Client tooltip: the row field and its value, then the measure — each
+     * carrying the unit declared for that field in `axisDetails`.
+     */
+    private tooltipRows;
+    /** FuseDash `ChartLegend legendType="palette"` — Low → High swatch ramp. */
+    private renderPaletteLegend;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ui9000-matrix-chart': Ui9000MatrixChart;
+    }
+}
+export declare function registerMatrixChart(): void;
+//# sourceMappingURL=ui9000-matrix-chart.d.ts.map