@mieweb/ui 0.10.0-dev.24 → 0.10.0-dev.26

package/dist/maps.cjs

@@ -0,0 +1,160 @@
+'use strict';
+
+var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
+require('./chunk-EUAMEVVI.cjs');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var OSM = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
+var OSM_ATTRIBUTION = "© OpenStreetMap contributors";
+var PointMap = React__namespace.forwardRef(
+  ({
+    points,
+    label,
+    center = [39.8, -98.6],
+    zoom = 3,
+    minZoom = 2,
+    maxZoom = 10,
+    height = 320,
+    tileUrl = OSM,
+    attribution = OSM_ATTRIBUTION,
+    outlineUrl,
+    sizeBy = "value",
+    showValues,
+    hideList,
+    className,
+    ...rest
+  }, ref) => {
+    const mapEl = React__namespace.useRef(null);
+    const [failed, setFailed] = React__namespace.useState(false);
+    const max = Math.max(1, ...points.map((p) => p.value ?? 0));
+    React__namespace.useEffect(() => {
+      const el = mapEl.current;
+      if (!el) return;
+      let map;
+      let cancelled = false;
+      import('leaflet').then(async (mod) => {
+        const leaflet = mod.default ?? mod;
+        if (cancelled) return;
+        const styles = getComputedStyle(el);
+        const colour = styles.getPropertyValue("--mieweb-primary-500").trim() || "#27aae1";
+        const line = styles.getPropertyValue("--mieweb-border").trim() || "#94a3b8";
+        map = leaflet.map(el, {
+          center,
+          zoom,
+          minZoom,
+          maxZoom,
+          scrollWheelZoom: false
+        });
+        leaflet.tileLayer(tileUrl, { attribution }).addTo(map);
+        if (outlineUrl) {
+          const data = await fetch(outlineUrl).then((r) => r.ok ? r.json() : null).catch(() => null);
+          if (data && !cancelled && map)
+            leaflet.geoJSON(data, {
+              style: { color: line, weight: 0.6, fillOpacity: 0 }
+            }).addTo(map);
+        }
+        if (cancelled || !map) return;
+        for (const p of points) {
+          const radius = sizeBy === "value" && p.value != null ? 6 + p.value / max * 22 : 6;
+          const marker = leaflet.circleMarker([p.lat, p.lng], {
+            radius,
+            color: colour,
+            weight: 2,
+            fillColor: colour,
+            fillOpacity: 0.35
+          }).addTo(map);
+          const text = [
+            p.label,
+            p.value != null ? String(p.value) : "",
+            p.detail ?? ""
+          ].filter(Boolean).join(" \xB7 ");
+          if (showValues && p.value != null)
+            marker.bindTooltip(String(p.value), {
+              permanent: true,
+              direction: "center",
+              className: "mie-map-value"
+            });
+          else marker.bindTooltip(text);
+        }
+      }).catch(() => setFailed(true));
+      return () => {
+        cancelled = true;
+        map?.remove();
+      };
+    }, [points, tileUrl, attribution, outlineUrl, sizeBy, showValues]);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-slot": "point-map",
+        className: chunkS5RVSXDV_cjs.cn("w-full", className),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              ref: mapEl,
+              role: "group",
+              "aria-roledescription": "map",
+              "aria-label": label,
+              className: "bg-muted isolate w-full overflow-hidden rounded-xl",
+              style: { height },
+              children: failed && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground flex h-full items-center justify-center p-4 text-center text-sm", children: label })
+            }
+          ),
+          !hideList && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-3 flex flex-wrap justify-center gap-x-4 gap-y-1 text-xs", children: points.map((p) => /* @__PURE__ */ jsxRuntime.jsxs(
+            "li",
+            {
+              className: "flex items-center gap-1.5",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: "bg-primary-500 size-2 rounded-full",
+                    style: {
+                      opacity: sizeBy === "value" && p.value != null ? 0.4 + p.value / max * 0.6 : 1
+                    }
+                  }
+                ),
+                p.label,
+                p.value != null && `: ${p.value}`,
+                p.detail && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "opacity-70", children: [
+                  " \xB7 ",
+                  p.detail
+                ] })
+              ]
+            },
+            `${p.label}-${p.lat}-${p.lng}`
+          )) })
+        ]
+      }
+    );
+  }
+);
+PointMap.displayName = "PointMap";
+
+exports.PointMap = PointMap;
+//# sourceMappingURL=maps.cjs.map
+//# sourceMappingURL=maps.cjs.map

package/dist/maps.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/PointMap/PointMap.tsx"],"names":["React","jsxs","cn","jsx"],"mappings":"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","file":"maps.cjs","sourcesContent":["import * as React from 'react';\nimport type * as L from 'leaflet';\nimport { cn } from '../../utils/cn';\n\nexport interface MapPoint {\n  lat: number;\n  lng: number;\n  label: string;\n  /** Sizes the marker when `sizeBy=\"value\"`, and is shown on it. */\n  value?: number;\n  /** Extra line in the marker's tooltip and the list, e.g. `Austin, TX \\u00b7 Mar 2026`. */\n  detail?: string;\n}\n\nexport interface PointMapProps extends React.HTMLAttributes<HTMLDivElement> {\n  points: MapPoint[];\n  /** Accessible name of the map; the points are also listed as text beneath it. */\n  label: string;\n  center?: [number, number];\n  zoom?: number;\n  minZoom?: number;\n  maxZoom?: number;\n  /** Map height in px. */\n  height?: number;\n  /** Raster tile template. Defaults to OpenStreetMap; use a tile service you are licensed for. */\n  tileUrl?: string;\n  /** Tile attribution, as the tile provider requires. */\n  attribution?: string;\n  /** GeoJSON URL for region outlines drawn over the tiles, e.g. US states. */\n  outlineUrl?: string;\n  /** `value` scales markers by `value`; `none` draws equal dots. */\n  sizeBy?: 'value' | 'none';\n  /** Show each point's value on its marker. */\n  showValues?: boolean;\n  /** Hide the text list of points under the map. */\n  hideList?: boolean;\n}\n\nconst OSM = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';\nconst OSM_ATTRIBUTION = '&copy; OpenStreetMap contributors';\n\n/**\n * Points on a Leaflet map, sized by value, with a text list of the same points\n * for screen readers and print. Needs the optional `leaflet` peer and its CSS\n * (`import 'leaflet/dist/leaflet.css'`). Client-only.\n */\nexport const PointMap = React.forwardRef<HTMLDivElement, PointMapProps>(\n  (\n    {\n      points,\n      label,\n      center = [39.8, -98.6],\n      zoom = 3,\n      minZoom = 2,\n      maxZoom = 10,\n      height = 320,\n      tileUrl = OSM,\n      attribution = OSM_ATTRIBUTION,\n      outlineUrl,\n      sizeBy = 'value',\n      showValues,\n      hideList,\n      className,\n      ...rest\n    },\n    ref\n  ) => {\n    const mapEl = React.useRef<HTMLDivElement>(null);\n    const [failed, setFailed] = React.useState(false);\n    const max = Math.max(1, ...points.map((p) => p.value ?? 0));\n\n    React.useEffect(() => {\n      const el = mapEl.current;\n      if (!el) return;\n      let map: L.Map | undefined;\n      let cancelled = false;\n      import('leaflet')\n        .then(async (mod) => {\n          const leaflet =\n            (mod as unknown as { default?: typeof L }).default ??\n            (mod as typeof L);\n          if (cancelled) return;\n          const styles = getComputedStyle(el);\n          const colour =\n            styles.getPropertyValue('--mieweb-primary-500').trim() || '#27aae1';\n          const line =\n            styles.getPropertyValue('--mieweb-border').trim() || '#94a3b8';\n          map = leaflet.map(el, {\n            center,\n            zoom,\n            minZoom,\n            maxZoom,\n            scrollWheelZoom: false,\n          });\n          leaflet.tileLayer(tileUrl, { attribution }).addTo(map);\n          if (outlineUrl) {\n            const data = await fetch(outlineUrl)\n              .then((r) => (r.ok ? r.json() : null))\n              .catch(() => null);\n            if (data && !cancelled && map)\n              leaflet\n                .geoJSON(data, {\n                  style: { color: line, weight: 0.6, fillOpacity: 0 },\n                })\n                .addTo(map);\n          }\n          if (cancelled || !map) return;\n          for (const p of points) {\n            const radius =\n              sizeBy === 'value' && p.value != null\n                ? 6 + (p.value / max) * 22\n                : 6;\n            const marker = leaflet\n              .circleMarker([p.lat, p.lng], {\n                radius,\n                color: colour,\n                weight: 2,\n                fillColor: colour,\n                fillOpacity: 0.35,\n              })\n              .addTo(map);\n            const text = [\n              p.label,\n              p.value != null ? String(p.value) : '',\n              p.detail ?? '',\n            ]\n              .filter(Boolean)\n              .join(' \\u00b7 ');\n            if (showValues && p.value != null)\n              marker.bindTooltip(String(p.value), {\n                permanent: true,\n                direction: 'center',\n                className: 'mie-map-value',\n              });\n            else marker.bindTooltip(text);\n          }\n        })\n        .catch(() => setFailed(true));\n      return () => {\n        cancelled = true;\n        map?.remove();\n      };\n      // Rebuild when the data changes; the view props only seed the map.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [points, tileUrl, attribution, outlineUrl, sizeBy, showValues]);\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"point-map\"\n        className={cn('w-full', className)}\n        {...rest}\n      >\n        <div\n          ref={mapEl}\n          role=\"group\"\n          aria-roledescription=\"map\"\n          aria-label={label}\n          className=\"bg-muted isolate w-full overflow-hidden rounded-xl\"\n          style={{ height }}\n        >\n          {failed && (\n            <p className=\"text-muted-foreground flex h-full items-center justify-center p-4 text-center text-sm\">\n              {label}\n            </p>\n          )}\n        </div>\n        {!hideList && (\n          <ul className=\"mt-3 flex flex-wrap justify-center gap-x-4 gap-y-1 text-xs\">\n            {points.map((p) => (\n              <li\n                key={`${p.label}-${p.lat}-${p.lng}`}\n                className=\"flex items-center gap-1.5\"\n              >\n                <span\n                  aria-hidden=\"true\"\n                  className=\"bg-primary-500 size-2 rounded-full\"\n                  style={{\n                    opacity:\n                      sizeBy === 'value' && p.value != null\n                        ? 0.4 + (p.value / max) * 0.6\n                        : 1,\n                  }}\n                />\n                {p.label}\n                {p.value != null && `: ${p.value}`}\n                {p.detail && <span className=\"opacity-70\"> · {p.detail}</span>}\n              </li>\n            ))}\n          </ul>\n        )}\n      </div>\n    );\n  }\n);\nPointMap.displayName = 'PointMap';\n"]}

package/dist/maps.d.cts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+
+interface MapPoint {
+    lat: number;
+    lng: number;
+    label: string;
+    /** Sizes the marker when `sizeBy="value"`, and is shown on it. */
+    value?: number;
+    /** Extra line in the marker's tooltip and the list, e.g. `Austin, TX \u00b7 Mar 2026`. */
+    detail?: string;
+}
+interface PointMapProps extends React.HTMLAttributes<HTMLDivElement> {
+    points: MapPoint[];
+    /** Accessible name of the map; the points are also listed as text beneath it. */
+    label: string;
+    center?: [number, number];
+    zoom?: number;
+    minZoom?: number;
+    maxZoom?: number;
+    /** Map height in px. */
+    height?: number;
+    /** Raster tile template. Defaults to OpenStreetMap; use a tile service you are licensed for. */
+    tileUrl?: string;
+    /** Tile attribution, as the tile provider requires. */
+    attribution?: string;
+    /** GeoJSON URL for region outlines drawn over the tiles, e.g. US states. */
+    outlineUrl?: string;
+    /** `value` scales markers by `value`; `none` draws equal dots. */
+    sizeBy?: 'value' | 'none';
+    /** Show each point's value on its marker. */
+    showValues?: boolean;
+    /** Hide the text list of points under the map. */
+    hideList?: boolean;
+}
+/**
+ * Points on a Leaflet map, sized by value, with a text list of the same points
+ * for screen readers and print. Needs the optional `leaflet` peer and its CSS
+ * (`import 'leaflet/dist/leaflet.css'`). Client-only.
+ */
+declare const PointMap: React.ForwardRefExoticComponent<PointMapProps & React.RefAttributes<HTMLDivElement>>;
+
+export { type MapPoint, PointMap, type PointMapProps };

package/dist/maps.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+
+interface MapPoint {
+    lat: number;
+    lng: number;
+    label: string;
+    /** Sizes the marker when `sizeBy="value"`, and is shown on it. */
+    value?: number;
+    /** Extra line in the marker's tooltip and the list, e.g. `Austin, TX \u00b7 Mar 2026`. */
+    detail?: string;
+}
+interface PointMapProps extends React.HTMLAttributes<HTMLDivElement> {
+    points: MapPoint[];
+    /** Accessible name of the map; the points are also listed as text beneath it. */
+    label: string;
+    center?: [number, number];
+    zoom?: number;
+    minZoom?: number;
+    maxZoom?: number;
+    /** Map height in px. */
+    height?: number;
+    /** Raster tile template. Defaults to OpenStreetMap; use a tile service you are licensed for. */
+    tileUrl?: string;
+    /** Tile attribution, as the tile provider requires. */
+    attribution?: string;
+    /** GeoJSON URL for region outlines drawn over the tiles, e.g. US states. */
+    outlineUrl?: string;
+    /** `value` scales markers by `value`; `none` draws equal dots. */
+    sizeBy?: 'value' | 'none';
+    /** Show each point's value on its marker. */
+    showValues?: boolean;
+    /** Hide the text list of points under the map. */
+    hideList?: boolean;
+}
+/**
+ * Points on a Leaflet map, sized by value, with a text list of the same points
+ * for screen readers and print. Needs the optional `leaflet` peer and its CSS
+ * (`import 'leaflet/dist/leaflet.css'`). Client-only.
+ */
+declare const PointMap: React.ForwardRefExoticComponent<PointMapProps & React.RefAttributes<HTMLDivElement>>;
+
+export { type MapPoint, PointMap, type PointMapProps };

package/dist/maps.js

@@ -0,0 +1,138 @@
+import { cn } from './chunk-TQONQSJO.js';
+import './chunk-PX6F3LHL.js';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var OSM = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
+var OSM_ATTRIBUTION = "© OpenStreetMap contributors";
+var PointMap = React.forwardRef(
+  ({
+    points,
+    label,
+    center = [39.8, -98.6],
+    zoom = 3,
+    minZoom = 2,
+    maxZoom = 10,
+    height = 320,
+    tileUrl = OSM,
+    attribution = OSM_ATTRIBUTION,
+    outlineUrl,
+    sizeBy = "value",
+    showValues,
+    hideList,
+    className,
+    ...rest
+  }, ref) => {
+    const mapEl = React.useRef(null);
+    const [failed, setFailed] = React.useState(false);
+    const max = Math.max(1, ...points.map((p) => p.value ?? 0));
+    React.useEffect(() => {
+      const el = mapEl.current;
+      if (!el) return;
+      let map;
+      let cancelled = false;
+      import('leaflet').then(async (mod) => {
+        const leaflet = mod.default ?? mod;
+        if (cancelled) return;
+        const styles = getComputedStyle(el);
+        const colour = styles.getPropertyValue("--mieweb-primary-500").trim() || "#27aae1";
+        const line = styles.getPropertyValue("--mieweb-border").trim() || "#94a3b8";
+        map = leaflet.map(el, {
+          center,
+          zoom,
+          minZoom,
+          maxZoom,
+          scrollWheelZoom: false
+        });
+        leaflet.tileLayer(tileUrl, { attribution }).addTo(map);
+        if (outlineUrl) {
+          const data = await fetch(outlineUrl).then((r) => r.ok ? r.json() : null).catch(() => null);
+          if (data && !cancelled && map)
+            leaflet.geoJSON(data, {
+              style: { color: line, weight: 0.6, fillOpacity: 0 }
+            }).addTo(map);
+        }
+        if (cancelled || !map) return;
+        for (const p of points) {
+          const radius = sizeBy === "value" && p.value != null ? 6 + p.value / max * 22 : 6;
+          const marker = leaflet.circleMarker([p.lat, p.lng], {
+            radius,
+            color: colour,
+            weight: 2,
+            fillColor: colour,
+            fillOpacity: 0.35
+          }).addTo(map);
+          const text = [
+            p.label,
+            p.value != null ? String(p.value) : "",
+            p.detail ?? ""
+          ].filter(Boolean).join(" \xB7 ");
+          if (showValues && p.value != null)
+            marker.bindTooltip(String(p.value), {
+              permanent: true,
+              direction: "center",
+              className: "mie-map-value"
+            });
+          else marker.bindTooltip(text);
+        }
+      }).catch(() => setFailed(true));
+      return () => {
+        cancelled = true;
+        map?.remove();
+      };
+    }, [points, tileUrl, attribution, outlineUrl, sizeBy, showValues]);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-slot": "point-map",
+        className: cn("w-full", className),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: mapEl,
+              role: "group",
+              "aria-roledescription": "map",
+              "aria-label": label,
+              className: "bg-muted isolate w-full overflow-hidden rounded-xl",
+              style: { height },
+              children: failed && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground flex h-full items-center justify-center p-4 text-center text-sm", children: label })
+            }
+          ),
+          !hideList && /* @__PURE__ */ jsx("ul", { className: "mt-3 flex flex-wrap justify-center gap-x-4 gap-y-1 text-xs", children: points.map((p) => /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: "flex items-center gap-1.5",
+              children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: "bg-primary-500 size-2 rounded-full",
+                    style: {
+                      opacity: sizeBy === "value" && p.value != null ? 0.4 + p.value / max * 0.6 : 1
+                    }
+                  }
+                ),
+                p.label,
+                p.value != null && `: ${p.value}`,
+                p.detail && /* @__PURE__ */ jsxs("span", { className: "opacity-70", children: [
+                  " \xB7 ",
+                  p.detail
+                ] })
+              ]
+            },
+            `${p.label}-${p.lat}-${p.lng}`
+          )) })
+        ]
+      }
+    );
+  }
+);
+PointMap.displayName = "PointMap";
+
+export { PointMap };
+//# sourceMappingURL=maps.js.map
+//# sourceMappingURL=maps.js.map

package/dist/maps.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/PointMap/PointMap.tsx"],"names":[],"mappings":"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","file":"maps.js","sourcesContent":["import * as React from 'react';\nimport type * as L from 'leaflet';\nimport { cn } from '../../utils/cn';\n\nexport interface MapPoint {\n  lat: number;\n  lng: number;\n  label: string;\n  /** Sizes the marker when `sizeBy=\"value\"`, and is shown on it. */\n  value?: number;\n  /** Extra line in the marker's tooltip and the list, e.g. `Austin, TX \\u00b7 Mar 2026`. */\n  detail?: string;\n}\n\nexport interface PointMapProps extends React.HTMLAttributes<HTMLDivElement> {\n  points: MapPoint[];\n  /** Accessible name of the map; the points are also listed as text beneath it. */\n  label: string;\n  center?: [number, number];\n  zoom?: number;\n  minZoom?: number;\n  maxZoom?: number;\n  /** Map height in px. */\n  height?: number;\n  /** Raster tile template. Defaults to OpenStreetMap; use a tile service you are licensed for. */\n  tileUrl?: string;\n  /** Tile attribution, as the tile provider requires. */\n  attribution?: string;\n  /** GeoJSON URL for region outlines drawn over the tiles, e.g. US states. */\n  outlineUrl?: string;\n  /** `value` scales markers by `value`; `none` draws equal dots. */\n  sizeBy?: 'value' | 'none';\n  /** Show each point's value on its marker. */\n  showValues?: boolean;\n  /** Hide the text list of points under the map. */\n  hideList?: boolean;\n}\n\nconst OSM = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';\nconst OSM_ATTRIBUTION = '&copy; OpenStreetMap contributors';\n\n/**\n * Points on a Leaflet map, sized by value, with a text list of the same points\n * for screen readers and print. Needs the optional `leaflet` peer and its CSS\n * (`import 'leaflet/dist/leaflet.css'`). Client-only.\n */\nexport const PointMap = React.forwardRef<HTMLDivElement, PointMapProps>(\n  (\n    {\n      points,\n      label,\n      center = [39.8, -98.6],\n      zoom = 3,\n      minZoom = 2,\n      maxZoom = 10,\n      height = 320,\n      tileUrl = OSM,\n      attribution = OSM_ATTRIBUTION,\n      outlineUrl,\n      sizeBy = 'value',\n      showValues,\n      hideList,\n      className,\n      ...rest\n    },\n    ref\n  ) => {\n    const mapEl = React.useRef<HTMLDivElement>(null);\n    const [failed, setFailed] = React.useState(false);\n    const max = Math.max(1, ...points.map((p) => p.value ?? 0));\n\n    React.useEffect(() => {\n      const el = mapEl.current;\n      if (!el) return;\n      let map: L.Map | undefined;\n      let cancelled = false;\n      import('leaflet')\n        .then(async (mod) => {\n          const leaflet =\n            (mod as unknown as { default?: typeof L }).default ??\n            (mod as typeof L);\n          if (cancelled) return;\n          const styles = getComputedStyle(el);\n          const colour =\n            styles.getPropertyValue('--mieweb-primary-500').trim() || '#27aae1';\n          const line =\n            styles.getPropertyValue('--mieweb-border').trim() || '#94a3b8';\n          map = leaflet.map(el, {\n            center,\n            zoom,\n            minZoom,\n            maxZoom,\n            scrollWheelZoom: false,\n          });\n          leaflet.tileLayer(tileUrl, { attribution }).addTo(map);\n          if (outlineUrl) {\n            const data = await fetch(outlineUrl)\n              .then((r) => (r.ok ? r.json() : null))\n              .catch(() => null);\n            if (data && !cancelled && map)\n              leaflet\n                .geoJSON(data, {\n                  style: { color: line, weight: 0.6, fillOpacity: 0 },\n                })\n                .addTo(map);\n          }\n          if (cancelled || !map) return;\n          for (const p of points) {\n            const radius =\n              sizeBy === 'value' && p.value != null\n                ? 6 + (p.value / max) * 22\n                : 6;\n            const marker = leaflet\n              .circleMarker([p.lat, p.lng], {\n                radius,\n                color: colour,\n                weight: 2,\n                fillColor: colour,\n                fillOpacity: 0.35,\n              })\n              .addTo(map);\n            const text = [\n              p.label,\n              p.value != null ? String(p.value) : '',\n              p.detail ?? '',\n            ]\n              .filter(Boolean)\n              .join(' \\u00b7 ');\n            if (showValues && p.value != null)\n              marker.bindTooltip(String(p.value), {\n                permanent: true,\n                direction: 'center',\n                className: 'mie-map-value',\n              });\n            else marker.bindTooltip(text);\n          }\n        })\n        .catch(() => setFailed(true));\n      return () => {\n        cancelled = true;\n        map?.remove();\n      };\n      // Rebuild when the data changes; the view props only seed the map.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [points, tileUrl, attribution, outlineUrl, sizeBy, showValues]);\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"point-map\"\n        className={cn('w-full', className)}\n        {...rest}\n      >\n        <div\n          ref={mapEl}\n          role=\"group\"\n          aria-roledescription=\"map\"\n          aria-label={label}\n          className=\"bg-muted isolate w-full overflow-hidden rounded-xl\"\n          style={{ height }}\n        >\n          {failed && (\n            <p className=\"text-muted-foreground flex h-full items-center justify-center p-4 text-center text-sm\">\n              {label}\n            </p>\n          )}\n        </div>\n        {!hideList && (\n          <ul className=\"mt-3 flex flex-wrap justify-center gap-x-4 gap-y-1 text-xs\">\n            {points.map((p) => (\n              <li\n                key={`${p.label}-${p.lat}-${p.lng}`}\n                className=\"flex items-center gap-1.5\"\n              >\n                <span\n                  aria-hidden=\"true\"\n                  className=\"bg-primary-500 size-2 rounded-full\"\n                  style={{\n                    opacity:\n                      sizeBy === 'value' && p.value != null\n                        ? 0.4 + (p.value / max) * 0.6\n                        : 1,\n                  }}\n                />\n                {p.label}\n                {p.value != null && `: ${p.value}`}\n                {p.detail && <span className=\"opacity-70\"> · {p.detail}</span>}\n              </li>\n            ))}\n          </ul>\n        )}\n      </div>\n    );\n  }\n);\nPointMap.displayName = 'PointMap';\n"]}

package/dist/styles/effects.css

@@ -159,3 +159,103 @@
     display: none;
   }
 }
+
+/* ── Deck (@mieweb/ui/deck) ──────────────────────────────────────────── */
+/* Content fades up the first time its slide is seen. Hidden only once the
+   deck has mounted (`data-ready`), so server HTML and no-JS stay readable. */
+.mie-deck[data-ready] .mie-deck-slide:not([data-seen]) .mie-deck-reveal {
+  opacity: 0;
+  transform: translateY(1.5rem);
+}
+.mie-deck-reveal {
+  transition:
+    opacity 0.6s cubic-bezier(0.21, 0.47, 0.32, 0.98),
+    transform 0.6s cubic-bezier(0.21, 0.47, 0.32, 0.98);
+  transition-delay: calc(var(--mie-reveal-i, 0) * 80ms);
+}
+/* Chart bars grow from the baseline. */
+.mie-deck-grow {
+  transform-origin: bottom;
+  transition: transform 0.8s cubic-bezier(0.21, 0.47, 0.32, 0.98);
+  transition-delay: calc(var(--mie-reveal-i, 0) * 60ms + 200ms);
+}
+.mie-deck[data-ready] .mie-deck-slide:not([data-seen]) .mie-deck-grow {
+  transform: scaleY(0);
+}
+@keyframes mie-deck-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+.mie-deck-spin {
+  animation: mie-deck-spin 60s linear infinite;
+}
+/* A dot travelling along a diagram edge. */
+@keyframes mie-deck-flow {
+  from {
+    left: var(--mie-from-x);
+    top: var(--mie-from-y);
+  }
+  to {
+    left: var(--mie-to-x);
+    top: var(--mie-to-y);
+  }
+}
+.mie-deck-flow {
+  left: var(--mie-from-x);
+  top: var(--mie-from-y);
+  animation: mie-deck-flow 2.6s linear infinite;
+}
+@media (prefers-reduced-motion: reduce) {
+  .mie-deck-reveal,
+  .mie-deck-grow {
+    transition: none;
+  }
+  .mie-deck[data-ready] .mie-deck-slide:not([data-seen]) .mie-deck-reveal,
+  .mie-deck[data-ready] .mie-deck-slide:not([data-seen]) .mie-deck-grow {
+    opacity: 1;
+    transform: none;
+  }
+  .mie-deck-spin,
+  .mie-deck-flow {
+    animation: none;
+  }
+}
+/* PointMap (@mieweb/ui/maps): permanent value labels sit on their markers. */
+.leaflet-tooltip.mie-map-value {
+  background: transparent;
+  border: 0;
+  box-shadow: none;
+  font-weight: 700;
+  color: var(--mieweb-foreground, #171717);
+}
+.leaflet-tooltip.mie-map-value::before {
+  display: none;
+}
+
+/* Print: one slide per page, every slide's content visible. */
+@media print {
+  .mie-deck {
+    height: auto;
+    overflow: visible;
+  }
+  .mie-deck-scroll {
+    height: auto;
+    overflow: visible;
+  }
+  .mie-deck-slide {
+    min-height: 100vh;
+    break-after: page;
+    print-color-adjust: exact;
+    -webkit-print-color-adjust: exact;
+  }
+  /* Match the data-ready hide rules' specificity so never-seen slides
+     still print their reveal/grow content (equal specificity, later wins). */
+  .mie-deck .mie-deck-slide .mie-deck-reveal,
+  .mie-deck .mie-deck-slide .mie-deck-grow,
+  .mie-deck[data-ready] .mie-deck-slide:not([data-seen]) .mie-deck-reveal,
+  .mie-deck[data-ready] .mie-deck-slide:not([data-seen]) .mie-deck-grow {
+    opacity: 1;
+    transform: none;
+  }
+}

package/dist/styles/init.css

@@ -50,6 +50,9 @@
   --color-ozwell: var(--mieweb-ozwell, #0ba0e0);
   --color-ozwell-foreground: var(--mieweb-ozwell-foreground, #ffffff);
 
+  /* ── Accent — a brand's highlight colour (EH and BlueHive gold); falls back to primary ── */
+  --color-accent: var(--mieweb-accent, var(--mieweb-primary-400));
+
   /* ── Secondary Color Scale ─────────────────────────────────────────── */
   --color-secondary: var(--mieweb-secondary-500, #6366f1);
   --color-secondary-50: var(--mieweb-secondary-50, #eef2ff);