@ktnpm_devops/react-component 0.16.0 → 0.18.0

package/dist/index29.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index29.cjs","sources":["../src/composites/FilterDropdown/FilterDropdown.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { Chip } from '../../primitives/Chip';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport type { FilterDropdownProps } from './FilterDropdown.types';\nimport styles from './FilterDropdown.module.css';\n\nexport const FilterDropdown = ({\n  label,\n  mode,\n  options = [],\n  selected,\n  onToggle,\n  onClear,\n  value = '',\n  onChange,\n  placeholder,\n  clearLabel = 'Limpiar',\n  className,\n}: FilterDropdownProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  // Text mode keeps a draft that is only committed on Enter / blur / close.\n  const [draft, setDraft] = useState(value);\n  const lastCommitted = useRef(value);\n  useEffect(() => {\n    if (isOpen) {\n      setDraft(value);\n      lastCommitted.current = value;\n    }\n  }, [isOpen, value]);\n\n  const commitDraft = useCallback(() => {\n    if (draft !== lastCommitted.current) {\n      lastCommitted.current = draft;\n      onChange?.(draft);\n    }\n  }, [draft, onChange]);\n\n  const close = useCallback(() => {\n    if (mode === 'text') commitDraft();\n    setIsOpen(false);\n  }, [mode, commitDraft]);\n\n  const cancel = useCallback(() => {\n    setDraft(lastCommitted.current);\n    setIsOpen(false);\n  }, []);\n\n  useClickOutside(containerRef, close);\n  useEscapeKey(cancel, isOpen);\n\n  const selectedSet = useMemo(\n    () => (selected instanceof Set ? selected : new Set(selected ?? [])),\n    [selected],\n  );\n\n  const count = mode === 'multi' ? selectedSet.size : value ? 1 : 0;\n  const hasSelection = count > 0;\n\n  const clearText = () => {\n    setDraft('');\n    lastCommitted.current = '';\n    (onClear ?? (() => onChange?.('')))();\n  };\n  const clearHandler = mode === 'multi' ? onClear : clearText;\n\n  return (\n    <div ref={containerRef} className={clsx(styles.root, className)}>\n      <button\n        type=\"button\"\n        className={styles.trigger}\n        aria-haspopup=\"true\"\n        aria-expanded={isOpen}\n        onClick={() => setIsOpen((open) => !open)}\n      >\n        <div className={styles.triggerContent}>\n          <svg\n            className={clsx(styles.chevron, isOpen && styles.chevronOpen)}\n            width={ICON_SIZE.MD}\n            height={ICON_SIZE.MD}\n            viewBox={SVG_VIEWBOX}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={SVG_STROKE_WIDTH}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"6 9 12 15 18 9\" />\n          </svg>\n          {label}\n          {count > 0 && <span className={styles.badge}>{count}</span>}\n        </div>\n      </button>\n\n      {isOpen && (\n        <div className={styles.pop}>\n          {mode === 'multi' ? (\n            <div className={styles.chips}>\n              {options.map((option) => (\n                <Chip\n                  key={option.value}\n                  value={option.value}\n                  size=\"sm\"\n                  selected={selectedSet.has(option.value)}\n                  onToggle={onToggle}\n                >\n                  {option.label}\n                </Chip>\n              ))}\n            </div>\n          ) : (\n            <input\n              type=\"text\"\n              className={styles.input}\n              value={draft}\n              placeholder={placeholder}\n              aria-label={label}\n              onChange={(event) => setDraft(event.target.value)}\n              onKeyDown={(event) => {\n                if (event.key === 'Enter') {\n                  event.preventDefault();\n                  close();\n                }\n              }}\n              onBlur={(event) => {\n                if (!containerRef.current?.contains(event.relatedTarget as Node)) commitDraft();\n              }}\n            />\n          )}\n          {hasSelection && clearHandler && (\n            <button type=\"button\" className={styles.clear} onClick={clearHandler}>\n              {clearLabel} {label.toLowerCase()}\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n\nFilterDropdown.displayName = 'FilterDropdown';\n"],"names":["useState","useRef","useEffect","useCallback","useClickOutside","useEscapeKey","useMemo","jsxs","clsx","styles","jsx","ICON_SIZE","SVG_VIEWBOX","SVG_STROKE_WIDTH","Chip"],"mappings":"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"}
+{"version":3,"file":"index29.cjs","sources":["../src/composites/FilterDropdown/FilterDropdown.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { Chip } from '../../primitives/Chip';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { usePanelPlacement } from '../../hooks/usePanelPlacement';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport type { FilterDropdownProps } from './FilterDropdown.types';\nimport styles from './FilterDropdown.module.css';\n\nexport const FilterDropdown = ({\n  label,\n  mode,\n  options = [],\n  selected,\n  onToggle,\n  onClear,\n  value = '',\n  onChange,\n  placeholder,\n  clearLabel = 'Limpiar',\n  className,\n}: FilterDropdownProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const placement = usePanelPlacement(containerRef, panelRef, isOpen);\n\n  // Text mode keeps a draft that is only committed on Enter / blur / close.\n  const [draft, setDraft] = useState(value);\n  const lastCommitted = useRef(value);\n  useEffect(() => {\n    if (isOpen) {\n      setDraft(value);\n      lastCommitted.current = value;\n    }\n  }, [isOpen, value]);\n\n  const commitDraft = useCallback(() => {\n    if (draft !== lastCommitted.current) {\n      lastCommitted.current = draft;\n      onChange?.(draft);\n    }\n  }, [draft, onChange]);\n\n  const close = useCallback(() => {\n    if (mode === 'text') commitDraft();\n    setIsOpen(false);\n  }, [mode, commitDraft]);\n\n  const cancel = useCallback(() => {\n    setDraft(lastCommitted.current);\n    setIsOpen(false);\n  }, []);\n\n  useClickOutside(containerRef, close);\n  useEscapeKey(cancel, isOpen);\n\n  const selectedSet = useMemo(\n    () => (selected instanceof Set ? selected : new Set(selected ?? [])),\n    [selected],\n  );\n\n  const count = mode === 'multi' ? selectedSet.size : value ? 1 : 0;\n  const hasSelection = count > 0;\n\n  const clearText = () => {\n    setDraft('');\n    lastCommitted.current = '';\n    (onClear ?? (() => onChange?.('')))();\n  };\n  const clearHandler = mode === 'multi' ? onClear : clearText;\n\n  return (\n    <div ref={containerRef} className={clsx(styles.root, className)}>\n      <button\n        type=\"button\"\n        className={styles.trigger}\n        aria-haspopup=\"true\"\n        aria-expanded={isOpen}\n        onClick={() => setIsOpen((open) => !open)}\n      >\n        <div className={styles.triggerContent}>\n          <svg\n            className={clsx(styles.chevron, isOpen && styles.chevronOpen)}\n            width={ICON_SIZE.MD}\n            height={ICON_SIZE.MD}\n            viewBox={SVG_VIEWBOX}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={SVG_STROKE_WIDTH}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"6 9 12 15 18 9\" />\n          </svg>\n          {label}\n          {count > 0 && <span className={styles.badge}>{count}</span>}\n        </div>\n      </button>\n\n      {isOpen && (\n        <div\n          ref={panelRef}\n          className={styles.pop}\n          data-align={placement.align}\n          style={placement.style}\n        >\n          {mode === 'multi' ? (\n            <div className={styles.chips}>\n              {options.map((option) => (\n                <Chip\n                  key={option.value}\n                  value={option.value}\n                  size=\"sm\"\n                  selected={selectedSet.has(option.value)}\n                  onToggle={onToggle}\n                >\n                  {option.label}\n                </Chip>\n              ))}\n            </div>\n          ) : (\n            <input\n              type=\"text\"\n              className={styles.input}\n              value={draft}\n              placeholder={placeholder}\n              aria-label={label}\n              onChange={(event) => setDraft(event.target.value)}\n              onKeyDown={(event) => {\n                if (event.key === 'Enter') {\n                  event.preventDefault();\n                  close();\n                }\n              }}\n              onBlur={(event) => {\n                if (!containerRef.current?.contains(event.relatedTarget as Node)) commitDraft();\n              }}\n            />\n          )}\n          {hasSelection && clearHandler && (\n            <button type=\"button\" className={styles.clear} onClick={clearHandler}>\n              {clearLabel} {label.toLowerCase()}\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n\nFilterDropdown.displayName = 'FilterDropdown';\n"],"names":["useState","useRef","usePanelPlacement","useEffect","useCallback","useClickOutside","useEscapeKey","useMemo","jsxs","clsx","styles","jsx","ICON_SIZE","SVG_VIEWBOX","SVG_STROKE_WIDTH","Chip"],"mappings":"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"}

package/dist/index29.js

@@ -2,9 +2,10 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { useState, useRef, useEffect, useCallback, useMemo } from "react";
 import { clsx } from "./index59.js";
 import { useClickOutside } from "./index4.js";
+import { usePanelPlacement } from "./index76.js";
 import { useEscapeKey } from "./index5.js";
-import { SVG_STROKE_WIDTH, SVG_VIEWBOX, ICON_SIZE } from "./index63.js";
-import styles from "./index69.js";
+import { SVG_STROKE_WIDTH, SVG_VIEWBOX, ICON_SIZE } from "./index62.js";
+import styles from "./index77.js";
 import { Chip } from "./index19.js";
 const FilterDropdown = ({
   label,
@@ -21,6 +22,8 @@ const FilterDropdown = ({
 }) => {
   const [isOpen, setIsOpen] = useState(false);
   const containerRef = useRef(null);
+  const panelRef = useRef(null);
+  const placement = usePanelPlacement(containerRef, panelRef, isOpen);
   const [draft, setDraft] = useState(value);
   const lastCommitted = useRef(value);
   useEffect(() => {
@@ -88,44 +91,53 @@ const FilterDropdown = ({
         ] })
       }
     ),
-    isOpen && /* @__PURE__ */ jsxs("div", { className: styles.pop, children: [
-      mode === "multi" ? /* @__PURE__ */ jsx("div", { className: styles.chips, children: options.map((option) => /* @__PURE__ */ jsx(
-        Chip,
-        {
-          value: option.value,
-          size: "sm",
-          selected: selectedSet.has(option.value),
-          onToggle,
-          children: option.label
-        },
-        option.value
-      )) }) : /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: "text",
-          className: styles.input,
-          value: draft,
-          placeholder,
-          "aria-label": label,
-          onChange: (event) => setDraft(event.target.value),
-          onKeyDown: (event) => {
-            if (event.key === "Enter") {
-              event.preventDefault();
-              close();
+    isOpen && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: panelRef,
+        className: styles.pop,
+        "data-align": placement.align,
+        style: placement.style,
+        children: [
+          mode === "multi" ? /* @__PURE__ */ jsx("div", { className: styles.chips, children: options.map((option) => /* @__PURE__ */ jsx(
+            Chip,
+            {
+              value: option.value,
+              size: "sm",
+              selected: selectedSet.has(option.value),
+              onToggle,
+              children: option.label
+            },
+            option.value
+          )) }) : /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "text",
+              className: styles.input,
+              value: draft,
+              placeholder,
+              "aria-label": label,
+              onChange: (event) => setDraft(event.target.value),
+              onKeyDown: (event) => {
+                if (event.key === "Enter") {
+                  event.preventDefault();
+                  close();
+                }
+              },
+              onBlur: (event) => {
+                var _a;
+                if (!((_a = containerRef.current) == null ? void 0 : _a.contains(event.relatedTarget))) commitDraft();
+              }
             }
-          },
-          onBlur: (event) => {
-            var _a;
-            if (!((_a = containerRef.current) == null ? void 0 : _a.contains(event.relatedTarget))) commitDraft();
-          }
-        }
-      ),
-      hasSelection && clearHandler && /* @__PURE__ */ jsxs("button", { type: "button", className: styles.clear, onClick: clearHandler, children: [
-        clearLabel,
-        " ",
-        label.toLowerCase()
-      ] })
-    ] })
+          ),
+          hasSelection && clearHandler && /* @__PURE__ */ jsxs("button", { type: "button", className: styles.clear, onClick: clearHandler, children: [
+            clearLabel,
+            " ",
+            label.toLowerCase()
+          ] })
+        ]
+      }
+    )
   ] });
 };
 FilterDropdown.displayName = "FilterDropdown";

package/dist/index29.js.map

@@ -1 +1 @@
-{"version":3,"file":"index29.js","sources":["../src/composites/FilterDropdown/FilterDropdown.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { Chip } from '../../primitives/Chip';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport type { FilterDropdownProps } from './FilterDropdown.types';\nimport styles from './FilterDropdown.module.css';\n\nexport const FilterDropdown = ({\n  label,\n  mode,\n  options = [],\n  selected,\n  onToggle,\n  onClear,\n  value = '',\n  onChange,\n  placeholder,\n  clearLabel = 'Limpiar',\n  className,\n}: FilterDropdownProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  // Text mode keeps a draft that is only committed on Enter / blur / close.\n  const [draft, setDraft] = useState(value);\n  const lastCommitted = useRef(value);\n  useEffect(() => {\n    if (isOpen) {\n      setDraft(value);\n      lastCommitted.current = value;\n    }\n  }, [isOpen, value]);\n\n  const commitDraft = useCallback(() => {\n    if (draft !== lastCommitted.current) {\n      lastCommitted.current = draft;\n      onChange?.(draft);\n    }\n  }, [draft, onChange]);\n\n  const close = useCallback(() => {\n    if (mode === 'text') commitDraft();\n    setIsOpen(false);\n  }, [mode, commitDraft]);\n\n  const cancel = useCallback(() => {\n    setDraft(lastCommitted.current);\n    setIsOpen(false);\n  }, []);\n\n  useClickOutside(containerRef, close);\n  useEscapeKey(cancel, isOpen);\n\n  const selectedSet = useMemo(\n    () => (selected instanceof Set ? selected : new Set(selected ?? [])),\n    [selected],\n  );\n\n  const count = mode === 'multi' ? selectedSet.size : value ? 1 : 0;\n  const hasSelection = count > 0;\n\n  const clearText = () => {\n    setDraft('');\n    lastCommitted.current = '';\n    (onClear ?? (() => onChange?.('')))();\n  };\n  const clearHandler = mode === 'multi' ? onClear : clearText;\n\n  return (\n    <div ref={containerRef} className={clsx(styles.root, className)}>\n      <button\n        type=\"button\"\n        className={styles.trigger}\n        aria-haspopup=\"true\"\n        aria-expanded={isOpen}\n        onClick={() => setIsOpen((open) => !open)}\n      >\n        <div className={styles.triggerContent}>\n          <svg\n            className={clsx(styles.chevron, isOpen && styles.chevronOpen)}\n            width={ICON_SIZE.MD}\n            height={ICON_SIZE.MD}\n            viewBox={SVG_VIEWBOX}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={SVG_STROKE_WIDTH}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"6 9 12 15 18 9\" />\n          </svg>\n          {label}\n          {count > 0 && <span className={styles.badge}>{count}</span>}\n        </div>\n      </button>\n\n      {isOpen && (\n        <div className={styles.pop}>\n          {mode === 'multi' ? (\n            <div className={styles.chips}>\n              {options.map((option) => (\n                <Chip\n                  key={option.value}\n                  value={option.value}\n                  size=\"sm\"\n                  selected={selectedSet.has(option.value)}\n                  onToggle={onToggle}\n                >\n                  {option.label}\n                </Chip>\n              ))}\n            </div>\n          ) : (\n            <input\n              type=\"text\"\n              className={styles.input}\n              value={draft}\n              placeholder={placeholder}\n              aria-label={label}\n              onChange={(event) => setDraft(event.target.value)}\n              onKeyDown={(event) => {\n                if (event.key === 'Enter') {\n                  event.preventDefault();\n                  close();\n                }\n              }}\n              onBlur={(event) => {\n                if (!containerRef.current?.contains(event.relatedTarget as Node)) commitDraft();\n              }}\n            />\n          )}\n          {hasSelection && clearHandler && (\n            <button type=\"button\" className={styles.clear} onClick={clearHandler}>\n              {clearLabel} {label.toLowerCase()}\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n\nFilterDropdown.displayName = 'FilterDropdown';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index29.js","sources":["../src/composites/FilterDropdown/FilterDropdown.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { Chip } from '../../primitives/Chip';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { usePanelPlacement } from '../../hooks/usePanelPlacement';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport type { FilterDropdownProps } from './FilterDropdown.types';\nimport styles from './FilterDropdown.module.css';\n\nexport const FilterDropdown = ({\n  label,\n  mode,\n  options = [],\n  selected,\n  onToggle,\n  onClear,\n  value = '',\n  onChange,\n  placeholder,\n  clearLabel = 'Limpiar',\n  className,\n}: FilterDropdownProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const placement = usePanelPlacement(containerRef, panelRef, isOpen);\n\n  // Text mode keeps a draft that is only committed on Enter / blur / close.\n  const [draft, setDraft] = useState(value);\n  const lastCommitted = useRef(value);\n  useEffect(() => {\n    if (isOpen) {\n      setDraft(value);\n      lastCommitted.current = value;\n    }\n  }, [isOpen, value]);\n\n  const commitDraft = useCallback(() => {\n    if (draft !== lastCommitted.current) {\n      lastCommitted.current = draft;\n      onChange?.(draft);\n    }\n  }, [draft, onChange]);\n\n  const close = useCallback(() => {\n    if (mode === 'text') commitDraft();\n    setIsOpen(false);\n  }, [mode, commitDraft]);\n\n  const cancel = useCallback(() => {\n    setDraft(lastCommitted.current);\n    setIsOpen(false);\n  }, []);\n\n  useClickOutside(containerRef, close);\n  useEscapeKey(cancel, isOpen);\n\n  const selectedSet = useMemo(\n    () => (selected instanceof Set ? selected : new Set(selected ?? [])),\n    [selected],\n  );\n\n  const count = mode === 'multi' ? selectedSet.size : value ? 1 : 0;\n  const hasSelection = count > 0;\n\n  const clearText = () => {\n    setDraft('');\n    lastCommitted.current = '';\n    (onClear ?? (() => onChange?.('')))();\n  };\n  const clearHandler = mode === 'multi' ? onClear : clearText;\n\n  return (\n    <div ref={containerRef} className={clsx(styles.root, className)}>\n      <button\n        type=\"button\"\n        className={styles.trigger}\n        aria-haspopup=\"true\"\n        aria-expanded={isOpen}\n        onClick={() => setIsOpen((open) => !open)}\n      >\n        <div className={styles.triggerContent}>\n          <svg\n            className={clsx(styles.chevron, isOpen && styles.chevronOpen)}\n            width={ICON_SIZE.MD}\n            height={ICON_SIZE.MD}\n            viewBox={SVG_VIEWBOX}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={SVG_STROKE_WIDTH}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"6 9 12 15 18 9\" />\n          </svg>\n          {label}\n          {count > 0 && <span className={styles.badge}>{count}</span>}\n        </div>\n      </button>\n\n      {isOpen && (\n        <div\n          ref={panelRef}\n          className={styles.pop}\n          data-align={placement.align}\n          style={placement.style}\n        >\n          {mode === 'multi' ? (\n            <div className={styles.chips}>\n              {options.map((option) => (\n                <Chip\n                  key={option.value}\n                  value={option.value}\n                  size=\"sm\"\n                  selected={selectedSet.has(option.value)}\n                  onToggle={onToggle}\n                >\n                  {option.label}\n                </Chip>\n              ))}\n            </div>\n          ) : (\n            <input\n              type=\"text\"\n              className={styles.input}\n              value={draft}\n              placeholder={placeholder}\n              aria-label={label}\n              onChange={(event) => setDraft(event.target.value)}\n              onKeyDown={(event) => {\n                if (event.key === 'Enter') {\n                  event.preventDefault();\n                  close();\n                }\n              }}\n              onBlur={(event) => {\n                if (!containerRef.current?.contains(event.relatedTarget as Node)) commitDraft();\n              }}\n            />\n          )}\n          {hasSelection && clearHandler && (\n            <button type=\"button\" className={styles.clear} onClick={clearHandler}>\n              {clearLabel} {label.toLowerCase()}\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n\nFilterDropdown.displayName = 'FilterDropdown';\n"],"names":[],"mappings":"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"}

package/dist/index30.cjs

@@ -5,22 +5,18 @@ const react = require("react");
 const reactLeaflet = require("react-leaflet");
 const clsx = require("./index59.cjs");
 const useThemeMode = require("./index7.cjs");
-const constants = require("./index63.cjs");
-const normalizePoints = require("./index109.cjs");
-const buildMarkerStyle = require("./index110.cjs");
-const MapViewport = require("./index111.cjs");
-const MapLegend = require("./index112.cjs");
-const PointListing = require("./index113.cjs");
-const GeoMapCard_module = require("./index114.cjs");
+const constants = require("./index62.cjs");
+const normalizePoints = require("./index102.cjs");
+const buildMarkerStyle = require("./index103.cjs");
+const MapViewport = require("./index104.cjs");
+const ViewportReporter = require("./index105.cjs");
+const MapStatusBars = require("./index106.cjs");
+const describePoints = require("./index107.cjs");
+const MapLegend = require("./index108.cjs");
+const PointListing = require("./index109.cjs");
+const resolveTiles = require("./index110.cjs");
+const GeoMapCard_module = require("./index111.cjs");
 const EmptyState = require("./index28.cjs");
-const buildNotice = (info, maxPoints) => {
-  const reasons = [];
-  if (info.skipped > 0) reasons.push(`${info.skipped} without usable coordinates`);
-  if (info.dropped > 0) reasons.push(`${info.dropped} over the ${maxPoints} marker cap`);
-  if (reasons.length === 0) return null;
-  return `Showing ${info.drawn} of ${info.total} points (${reasons.join(", ")}).`;
-};
-const describePoint = (point, categoryLabel) => [point.label, point.category != null ? `${categoryLabel}: ${point.category}` : null, point.detail].filter((part) => part != null && part !== "").join(" — ");
 const GeoMapCard = ({
   title,
   points,
@@ -35,7 +31,11 @@ const GeoMapCard = ({
   center,
   zoom,
   scrollWheelZoom = false,
+  onViewportChange,
+  isRefreshing = false,
+  refreshingLabel = "Updating…",
   basemap = "auto",
+  basemapKey,
   tileLayer,
   compact = false,
   toolbar,
@@ -68,36 +68,43 @@ const GeoMapCard = ({
         sourceIndex,
         selected,
         style: buildMarkerStyle.buildMarkerStyle(point, { categoryColors, weightScale, selected, theme }),
-        description: describePoint(point, categoryLabel)
+        description: describePoints.describePoint(point, categoryLabel)
       };
     });
   }, [drawn, points, selectedIds, categoryColors, theme, categoryLabel]);
-  const tiles = tileLayer ?? {
-    url: constants.BASEMAP_TILES[basemap === "auto" ? theme : basemap],
-    attribution: constants.BASEMAP_TILES.attribution
-  };
-  const shouldFitBounds = fitBounds && center == null && zoom == null;
+  const tiles = resolveTiles.resolveTiles(tileLayer, basemap, theme, basemapKey);
+  const viewportMode = onViewportChange != null;
+  const shouldFitBounds = fitBounds && center == null && zoom == null && !viewportMode;
   const showLegend = !hideLegend && legendItems.length > 0;
-  const notice = buildNotice(info, maxPoints);
-  const hasMap = !isLoading && error == null && info.drawn > 0;
+  const notice = describePoints.buildNotice(info, maxPoints);
+  const isBlocked = isLoading || error != null;
+  const hasMap = !isBlocked && (info.drawn > 0 || viewportMode);
+  const showEmptyState = !isBlocked && info.drawn === 0 && !viewportMode;
   react.useEffect(() => {
     onRender == null ? void 0 : onRender(info);
   }, [onRender, info]);
   react.useEffect(() => {
-  }, [hasMap]);
+    return;
+  }, [hasMap, tileLayer, basemapKey]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(GeoMapCard_module.default.root, compact && GeoMapCard_module.default.compact, className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("header", { className: GeoMapCard_module.default.header, children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: GeoMapCard_module.default.title, children: title }),
-      actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: GeoMapCard_module.default.headerActions, children: actions })
+      (isRefreshing || actions) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: GeoMapCard_module.default.headerActions, children: [
+        isRefreshing && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: GeoMapCard_module.default.refreshing, role: "status", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: GeoMapCard_module.default.refreshingDot, "aria-hidden": "true" }),
+          refreshingLabel
+        ] }),
+        actions
+      ] })
     ] }),
     toolbar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: GeoMapCard_module.default.toolbar, children: toolbar }),
-    hasMap && notice && /* @__PURE__ */ jsxRuntime.jsx("div", { className: GeoMapCard_module.default.warning, role: "status", children: notice }),
+    hasMap && /* @__PURE__ */ jsxRuntime.jsx(MapStatusBars.MapStatusBars, { notice, emptyMessage: info.drawn === 0 ? emptyTitle : null }),
     isLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: GeoMapCard_module.default.loading, children: loadingLabel }),
     !isLoading && error != null && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: GeoMapCard_module.default.error, children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: error }),
       onRetry && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: GeoMapCard_module.default.retryButton, onClick: onRetry, children: retryLabel })
     ] }),
-    !isLoading && error == null && info.drawn === 0 && /* @__PURE__ */ jsxRuntime.jsx(
+    showEmptyState && /* @__PURE__ */ jsxRuntime.jsx(
       EmptyState.EmptyState,
       {
         className: GeoMapCard_module.default.empty,
@@ -113,6 +120,7 @@ const GeoMapCard = ({
         className: GeoMapCard_module.default.mapContainer,
         role: "figure",
         "aria-label": `${title}: map of ${info.drawn} points`,
+        "aria-busy": isRefreshing || void 0,
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs(
             reactLeaflet.MapContainer,
@@ -124,6 +132,7 @@ const GeoMapCard = ({
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx(reactLeaflet.TileLayer, { url: tiles.url, attribution: tiles.attribution }, tiles.url),
                 /* @__PURE__ */ jsxRuntime.jsx(MapViewport.MapViewport, { bounds, fitBounds: shouldFitBounds }),
+                onViewportChange && /* @__PURE__ */ jsxRuntime.jsx(ViewportReporter.ViewportReporter, { onViewportChange }),
                 markers.map(({ point, sourceIndex, style, description }) => /* @__PURE__ */ jsxRuntime.jsx(
                   reactLeaflet.CircleMarker,
                   {
@@ -139,14 +148,7 @@ const GeoMapCard = ({
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            PointListing.PointListing,
-            {
-              markers,
-              label: pointListLabel,
-              onSelectPoint
-            }
-          )
+          /* @__PURE__ */ jsxRuntime.jsx(PointListing.PointListing, { markers, label: pointListLabel, onSelectPoint })
         ]
       }
     )

package/dist/index30.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index30.cjs","sources":["../src/geo/GeoMapCard/GeoMapCard.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { CircleMarker, MapContainer, TileLayer, Tooltip } from 'react-leaflet';\nimport clsx from 'clsx';\nimport { EmptyState } from '../../primitives/EmptyState';\nimport { useThemeMode } from '../../hooks/useThemeMode';\nimport { BASEMAP_TILES, GEO_MAP } from '../../constants';\nimport type { GeoPoint, GeoRenderInfo } from '../../types/geo.types';\nimport type { GeoMapCardProps, MarkerDescriptor } from './GeoMapCard.types';\nimport { normalizePoints } from './normalizePoints';\nimport { buildCategoryColors, buildLegendItems, buildMarkerStyle, buildWeightScale } from './buildMarkerStyle';\nimport { MapViewport } from './MapViewport';\nimport { MapLegend } from './MapLegend';\nimport { PointListing } from './PointListing';\nimport { warnMissingLeafletStylesheet } from './warnMissingLeafletStylesheet';\nimport styles from './GeoMapCard.module.css';\n\n/** States what was left out, so a truncated map never passes for a complete one. */\nconst buildNotice = (info: GeoRenderInfo, maxPoints: number): string | null => {\n  const reasons: string[] = [];\n\n  if (info.skipped > 0) reasons.push(`${info.skipped} without usable coordinates`);\n  if (info.dropped > 0) reasons.push(`${info.dropped} over the ${maxPoints} marker cap`);\n\n  if (reasons.length === 0) return null;\n\n  return `Showing ${info.drawn} of ${info.total} points (${reasons.join(', ')}).`;\n};\n\n/** One line carrying everything the tooltip shows, for the screen reader too. */\nconst describePoint = (point: GeoPoint, categoryLabel: string): string =>\n  [point.label, point.category != null ? `${categoryLabel}: ${point.category}` : null, point.detail]\n    .filter((part): part is string => part != null && part !== '')\n    .join(' — ');\n\nexport const GeoMapCard = ({\n  title,\n  points,\n  selectedIds,\n  onSelectPoint,\n  categoryLabel = 'Category',\n  legendTitle = 'Legend',\n  hideLegend = false,\n  maxPoints = GEO_MAP.MAX_POINTS,\n  onRender,\n  fitBounds = true,\n  center,\n  zoom,\n  scrollWheelZoom = false,\n  basemap = 'auto',\n  tileLayer,\n  compact = false,\n  toolbar,\n  actions,\n  isLoading = false,\n  error = null,\n  onRetry,\n  emptyTitle = 'No mappable points',\n  emptyDescription = 'None of the points received carry usable coordinates.',\n  retryLabel = 'Retry',\n  loadingLabel = 'Loading map...',\n  pointListLabel = 'Map points',\n  className,\n}: GeoMapCardProps) => {\n  const theme = useThemeMode();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const { drawn, bounds, info } = useMemo(\n    () => normalizePoints(points, maxPoints),\n    [points, maxPoints],\n  );\n\n  const categoryColors = useMemo(() => buildCategoryColors(points), [points]);\n  const legendItems = useMemo(() => buildLegendItems(categoryColors), [categoryColors]);\n\n  const markers = useMemo<MarkerDescriptor[]>(() => {\n    const weightScale = buildWeightScale(points);\n    const selection = new Set(selectedIds ?? []);\n\n    return drawn.map(({ point, sourceIndex }) => {\n      const selected = selection.has(point.id);\n\n      return {\n        point,\n        sourceIndex,\n        selected,\n        style: buildMarkerStyle(point, { categoryColors, weightScale, selected, theme }),\n        description: describePoint(point, categoryLabel),\n      };\n    });\n  }, [drawn, points, selectedIds, categoryColors, theme, categoryLabel]);\n\n  const tiles = tileLayer ?? {\n    url: BASEMAP_TILES[basemap === 'auto' ? theme : basemap],\n    attribution: BASEMAP_TILES.attribution,\n  };\n\n  // Manual framing and automatic framing would fight over the viewport.\n  const shouldFitBounds = fitBounds && center == null && zoom == null;\n  const showLegend = !hideLegend && legendItems.length > 0;\n  const notice = buildNotice(info, maxPoints);\n  const hasMap = !isLoading && error == null && info.drawn > 0;\n\n  useEffect(() => {\n    onRender?.(info);\n  }, [onRender, info]);\n\n  useEffect(() => {\n    if (import.meta.env.DEV && hasMap) warnMissingLeafletStylesheet(containerRef.current);\n  }, [hasMap]);\n\n  return (\n    <div className={clsx(styles.root, compact && styles.compact, className)}>\n      <header className={styles.header}>\n        <h3 className={styles.title}>{title}</h3>\n        {actions && <div className={styles.headerActions}>{actions}</div>}\n      </header>\n\n      {toolbar && <div className={styles.toolbar}>{toolbar}</div>}\n\n      {hasMap && notice && (\n        <div className={styles.warning} role=\"status\">\n          {notice}\n        </div>\n      )}\n\n      {isLoading && <div className={styles.loading}>{loadingLabel}</div>}\n\n      {!isLoading && error != null && (\n        <div className={styles.error}>\n          <span>{error}</span>\n          {onRetry && (\n            <button type=\"button\" className={styles.retryButton} onClick={onRetry}>\n              {retryLabel}\n            </button>\n          )}\n        </div>\n      )}\n\n      {!isLoading && error == null && info.drawn === 0 && (\n        <EmptyState\n          className={styles.empty}\n          variant=\"plain\"\n          title={emptyTitle}\n          description={emptyDescription}\n        />\n      )}\n\n      {hasMap && (\n        <div\n          ref={containerRef}\n          className={styles.mapContainer}\n          role=\"figure\"\n          aria-label={`${title}: map of ${info.drawn} points`}\n        >\n          <MapContainer\n            className={styles.map}\n            center={center ?? [...GEO_MAP.DEFAULT_CENTER]}\n            zoom={zoom ?? GEO_MAP.DEFAULT_ZOOM}\n            scrollWheelZoom={scrollWheelZoom}\n          >\n            <TileLayer key={tiles.url} url={tiles.url} attribution={tiles.attribution} />\n            <MapViewport bounds={bounds} fitBounds={shouldFitBounds} />\n\n            {markers.map(({ point, sourceIndex, style, description }) => (\n              <CircleMarker\n                key={point.id}\n                center={[point.latitude, point.longitude]}\n                radius={style.radius}\n                pathOptions={style}\n                eventHandlers={\n                  onSelectPoint ? { click: () => onSelectPoint({ point, index: sourceIndex }) } : {}\n                }\n              >\n                <Tooltip>{description}</Tooltip>\n              </CircleMarker>\n            ))}\n\n            {showLegend && <MapLegend items={legendItems} title={legendTitle} />}\n          </MapContainer>\n\n          <PointListing\n            markers={markers}\n            label={pointListLabel}\n            onSelectPoint={onSelectPoint}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nGeoMapCard.displayName = 'GeoMapCard';\n"],"names":["GEO_MAP","useThemeMode","useRef","useMemo","normalizePoints","buildCategoryColors","buildLegendItems","buildWeightScale","buildMarkerStyle","BASEMAP_TILES","useEffect","jsxs","clsx","styles","jsx","EmptyState","MapContainer","TileLayer","MapViewport","CircleMarker","Tooltip","MapLegend","PointListing"],"mappings":"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"}
+{"version":3,"file":"index30.cjs","sources":["../src/geo/GeoMapCard/GeoMapCard.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { CircleMarker, MapContainer, TileLayer, Tooltip } from 'react-leaflet';\nimport clsx from 'clsx';\nimport { EmptyState } from '../../primitives/EmptyState';\nimport { useThemeMode } from '../../hooks/useThemeMode';\nimport { GEO_MAP } from '../../constants';\nimport type { GeoMapCardProps, MarkerDescriptor } from './GeoMapCard.types';\nimport { normalizePoints } from './normalizePoints';\nimport {\n  buildCategoryColors,\n  buildLegendItems,\n  buildMarkerStyle,\n  buildWeightScale,\n} from './buildMarkerStyle';\nimport { MapViewport } from './MapViewport';\nimport { ViewportReporter } from './ViewportReporter';\nimport { MapStatusBars } from './MapStatusBars';\nimport { buildNotice, describePoint } from './describePoints';\nimport { MapLegend } from './MapLegend';\nimport { PointListing } from './PointListing';\nimport { warnMissingLeafletStylesheet } from './warnMissingLeafletStylesheet';\nimport { warnMissingBasemapKey } from './warnMissingBasemapKey';\nimport { resolveTiles } from './resolveTiles';\nimport styles from './GeoMapCard.module.css';\n\nexport const GeoMapCard = ({\n  title,\n  points,\n  selectedIds,\n  onSelectPoint,\n  categoryLabel = 'Category',\n  legendTitle = 'Legend',\n  hideLegend = false,\n  maxPoints = GEO_MAP.MAX_POINTS,\n  onRender,\n  fitBounds = true,\n  center,\n  zoom,\n  scrollWheelZoom = false,\n  onViewportChange,\n  isRefreshing = false,\n  refreshingLabel = 'Updating…',\n  basemap = 'auto',\n  basemapKey,\n  tileLayer,\n  compact = false,\n  toolbar,\n  actions,\n  isLoading = false,\n  error = null,\n  onRetry,\n  emptyTitle = 'No mappable points',\n  emptyDescription = 'None of the points received carry usable coordinates.',\n  retryLabel = 'Retry',\n  loadingLabel = 'Loading map...',\n  pointListLabel = 'Map points',\n  className,\n}: GeoMapCardProps) => {\n  const theme = useThemeMode();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const { drawn, bounds, info } = useMemo(\n    () => normalizePoints(points, maxPoints),\n    [points, maxPoints],\n  );\n\n  const categoryColors = useMemo(() => buildCategoryColors(points), [points]);\n  const legendItems = useMemo(() => buildLegendItems(categoryColors), [categoryColors]);\n\n  const markers = useMemo<MarkerDescriptor[]>(() => {\n    const weightScale = buildWeightScale(points);\n    const selection = new Set(selectedIds ?? []);\n\n    return drawn.map(({ point, sourceIndex }) => {\n      const selected = selection.has(point.id);\n\n      return {\n        point,\n        sourceIndex,\n        selected,\n        style: buildMarkerStyle(point, { categoryColors, weightScale, selected, theme }),\n        description: describePoint(point, categoryLabel),\n      };\n    });\n  }, [drawn, points, selectedIds, categoryColors, theme, categoryLabel]);\n\n  const tiles = resolveTiles(tileLayer, basemap, theme, basemapKey);\n\n  // Viewport mode: the view drives the points, so the map must outlive an empty\n  // area, and the points must never move the view (that would be a fetch loop).\n  const viewportMode = onViewportChange != null;\n  // Manual framing and automatic framing would fight over the viewport.\n  const shouldFitBounds = fitBounds && center == null && zoom == null && !viewportMode;\n  const showLegend = !hideLegend && legendItems.length > 0;\n  const notice = buildNotice(info, maxPoints);\n  const isBlocked = isLoading || error != null;\n  const hasMap = !isBlocked && (info.drawn > 0 || viewportMode);\n  const showEmptyState = !isBlocked && info.drawn === 0 && !viewportMode;\n\n  useEffect(() => {\n    onRender?.(info);\n  }, [onRender, info]);\n\n  useEffect(() => {\n    if (!import.meta.env.DEV || !hasMap) return;\n\n    warnMissingLeafletStylesheet(containerRef.current);\n    if (tileLayer == null && !basemapKey) warnMissingBasemapKey();\n  }, [hasMap, tileLayer, basemapKey]);\n\n  return (\n    <div className={clsx(styles.root, compact && styles.compact, className)}>\n      <header className={styles.header}>\n        <h3 className={styles.title}>{title}</h3>\n        {(isRefreshing || actions) && (\n          <div className={styles.headerActions}>\n            {isRefreshing && (\n              <span className={styles.refreshing} role=\"status\">\n                <span className={styles.refreshingDot} aria-hidden=\"true\" />\n                {refreshingLabel}\n              </span>\n            )}\n            {actions}\n          </div>\n        )}\n      </header>\n\n      {toolbar && <div className={styles.toolbar}>{toolbar}</div>}\n\n      {hasMap && (\n        <MapStatusBars notice={notice} emptyMessage={info.drawn === 0 ? emptyTitle : null} />\n      )}\n\n      {isLoading && <div className={styles.loading}>{loadingLabel}</div>}\n\n      {!isLoading && error != null && (\n        <div className={styles.error}>\n          <span>{error}</span>\n          {onRetry && (\n            <button type=\"button\" className={styles.retryButton} onClick={onRetry}>\n              {retryLabel}\n            </button>\n          )}\n        </div>\n      )}\n\n      {showEmptyState && (\n        <EmptyState\n          className={styles.empty}\n          variant=\"plain\"\n          title={emptyTitle}\n          description={emptyDescription}\n        />\n      )}\n\n      {hasMap && (\n        <div\n          ref={containerRef}\n          className={styles.mapContainer}\n          role=\"figure\"\n          aria-label={`${title}: map of ${info.drawn} points`}\n          aria-busy={isRefreshing || undefined}\n        >\n          <MapContainer\n            className={styles.map}\n            center={center ?? [...GEO_MAP.DEFAULT_CENTER]}\n            zoom={zoom ?? GEO_MAP.DEFAULT_ZOOM}\n            scrollWheelZoom={scrollWheelZoom}\n          >\n            <TileLayer key={tiles.url} url={tiles.url} attribution={tiles.attribution} />\n            <MapViewport bounds={bounds} fitBounds={shouldFitBounds} />\n            {onViewportChange && <ViewportReporter onViewportChange={onViewportChange} />}\n\n            {markers.map(({ point, sourceIndex, style, description }) => (\n              <CircleMarker\n                key={point.id}\n                center={[point.latitude, point.longitude]}\n                radius={style.radius}\n                pathOptions={style}\n                eventHandlers={\n                  onSelectPoint ? { click: () => onSelectPoint({ point, index: sourceIndex }) } : {}\n                }\n              >\n                <Tooltip>{description}</Tooltip>\n              </CircleMarker>\n            ))}\n\n            {showLegend && <MapLegend items={legendItems} title={legendTitle} />}\n          </MapContainer>\n\n          <PointListing markers={markers} label={pointListLabel} onSelectPoint={onSelectPoint} />\n        </div>\n      )}\n    </div>\n  );\n};\n\nGeoMapCard.displayName = 'GeoMapCard';\n"],"names":["GEO_MAP","useThemeMode","useRef","useMemo","normalizePoints","buildCategoryColors","buildLegendItems","buildWeightScale","buildMarkerStyle","describePoint","resolveTiles","buildNotice","useEffect","jsxs","clsx","styles","jsx","MapStatusBars","EmptyState","MapContainer","TileLayer","MapViewport","ViewportReporter","CircleMarker","Tooltip","MapLegend","PointListing"],"mappings":"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"}

package/dist/index30.js

@@ -3,22 +3,18 @@ import { useRef, useMemo, useEffect } from "react";
 import { MapContainer, TileLayer, CircleMarker, Tooltip } from "react-leaflet";
 import { clsx } from "./index59.js";
 import { useThemeMode } from "./index7.js";
-import { GEO_MAP, BASEMAP_TILES } from "./index63.js";
-import { normalizePoints } from "./index109.js";
-import { buildCategoryColors, buildLegendItems, buildWeightScale, buildMarkerStyle } from "./index110.js";
-import { MapViewport } from "./index111.js";
-import { MapLegend } from "./index112.js";
-import { PointListing } from "./index113.js";
-import styles from "./index114.js";
+import { GEO_MAP } from "./index62.js";
+import { normalizePoints } from "./index102.js";
+import { buildCategoryColors, buildLegendItems, buildWeightScale, buildMarkerStyle } from "./index103.js";
+import { MapViewport } from "./index104.js";
+import { ViewportReporter } from "./index105.js";
+import { MapStatusBars } from "./index106.js";
+import { describePoint, buildNotice } from "./index107.js";
+import { MapLegend } from "./index108.js";
+import { PointListing } from "./index109.js";
+import { resolveTiles } from "./index110.js";
+import styles from "./index111.js";
 import { EmptyState } from "./index28.js";
-const buildNotice = (info, maxPoints) => {
-  const reasons = [];
-  if (info.skipped > 0) reasons.push(`${info.skipped} without usable coordinates`);
-  if (info.dropped > 0) reasons.push(`${info.dropped} over the ${maxPoints} marker cap`);
-  if (reasons.length === 0) return null;
-  return `Showing ${info.drawn} of ${info.total} points (${reasons.join(", ")}).`;
-};
-const describePoint = (point, categoryLabel) => [point.label, point.category != null ? `${categoryLabel}: ${point.category}` : null, point.detail].filter((part) => part != null && part !== "").join(" — ");
 const GeoMapCard = ({
   title,
   points,
@@ -33,7 +29,11 @@ const GeoMapCard = ({
   center,
   zoom,
   scrollWheelZoom = false,
+  onViewportChange,
+  isRefreshing = false,
+  refreshingLabel = "Updating…",
   basemap = "auto",
+  basemapKey,
   tileLayer,
   compact = false,
   toolbar,
@@ -70,32 +70,39 @@ const GeoMapCard = ({
       };
     });
   }, [drawn, points, selectedIds, categoryColors, theme, categoryLabel]);
-  const tiles = tileLayer ?? {
-    url: BASEMAP_TILES[basemap === "auto" ? theme : basemap],
-    attribution: BASEMAP_TILES.attribution
-  };
-  const shouldFitBounds = fitBounds && center == null && zoom == null;
+  const tiles = resolveTiles(tileLayer, basemap, theme, basemapKey);
+  const viewportMode = onViewportChange != null;
+  const shouldFitBounds = fitBounds && center == null && zoom == null && !viewportMode;
   const showLegend = !hideLegend && legendItems.length > 0;
   const notice = buildNotice(info, maxPoints);
-  const hasMap = !isLoading && error == null && info.drawn > 0;
+  const isBlocked = isLoading || error != null;
+  const hasMap = !isBlocked && (info.drawn > 0 || viewportMode);
+  const showEmptyState = !isBlocked && info.drawn === 0 && !viewportMode;
   useEffect(() => {
     onRender == null ? void 0 : onRender(info);
   }, [onRender, info]);
   useEffect(() => {
-  }, [hasMap]);
+    return;
+  }, [hasMap, tileLayer, basemapKey]);
   return /* @__PURE__ */ jsxs("div", { className: clsx(styles.root, compact && styles.compact, className), children: [
     /* @__PURE__ */ jsxs("header", { className: styles.header, children: [
       /* @__PURE__ */ jsx("h3", { className: styles.title, children: title }),
-      actions && /* @__PURE__ */ jsx("div", { className: styles.headerActions, children: actions })
+      (isRefreshing || actions) && /* @__PURE__ */ jsxs("div", { className: styles.headerActions, children: [
+        isRefreshing && /* @__PURE__ */ jsxs("span", { className: styles.refreshing, role: "status", children: [
+          /* @__PURE__ */ jsx("span", { className: styles.refreshingDot, "aria-hidden": "true" }),
+          refreshingLabel
+        ] }),
+        actions
+      ] })
     ] }),
     toolbar && /* @__PURE__ */ jsx("div", { className: styles.toolbar, children: toolbar }),
-    hasMap && notice && /* @__PURE__ */ jsx("div", { className: styles.warning, role: "status", children: notice }),
+    hasMap && /* @__PURE__ */ jsx(MapStatusBars, { notice, emptyMessage: info.drawn === 0 ? emptyTitle : null }),
     isLoading && /* @__PURE__ */ jsx("div", { className: styles.loading, children: loadingLabel }),
     !isLoading && error != null && /* @__PURE__ */ jsxs("div", { className: styles.error, children: [
       /* @__PURE__ */ jsx("span", { children: error }),
       onRetry && /* @__PURE__ */ jsx("button", { type: "button", className: styles.retryButton, onClick: onRetry, children: retryLabel })
     ] }),
-    !isLoading && error == null && info.drawn === 0 && /* @__PURE__ */ jsx(
+    showEmptyState && /* @__PURE__ */ jsx(
       EmptyState,
       {
         className: styles.empty,
@@ -111,6 +118,7 @@ const GeoMapCard = ({
         className: styles.mapContainer,
         role: "figure",
         "aria-label": `${title}: map of ${info.drawn} points`,
+        "aria-busy": isRefreshing || void 0,
         children: [
           /* @__PURE__ */ jsxs(
             MapContainer,
@@ -122,6 +130,7 @@ const GeoMapCard = ({
               children: [
                 /* @__PURE__ */ jsx(TileLayer, { url: tiles.url, attribution: tiles.attribution }, tiles.url),
                 /* @__PURE__ */ jsx(MapViewport, { bounds, fitBounds: shouldFitBounds }),
+                onViewportChange && /* @__PURE__ */ jsx(ViewportReporter, { onViewportChange }),
                 markers.map(({ point, sourceIndex, style, description }) => /* @__PURE__ */ jsx(
                   CircleMarker,
                   {
@@ -137,14 +146,7 @@ const GeoMapCard = ({
               ]
             }
           ),
-          /* @__PURE__ */ jsx(
-            PointListing,
-            {
-              markers,
-              label: pointListLabel,
-              onSelectPoint
-            }
-          )
+          /* @__PURE__ */ jsx(PointListing, { markers, label: pointListLabel, onSelectPoint })
         ]
       }
     )

package/dist/index30.js.map

@@ -1 +1 @@
-{"version":3,"file":"index30.js","sources":["../src/geo/GeoMapCard/GeoMapCard.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { CircleMarker, MapContainer, TileLayer, Tooltip } from 'react-leaflet';\nimport clsx from 'clsx';\nimport { EmptyState } from '../../primitives/EmptyState';\nimport { useThemeMode } from '../../hooks/useThemeMode';\nimport { BASEMAP_TILES, GEO_MAP } from '../../constants';\nimport type { GeoPoint, GeoRenderInfo } from '../../types/geo.types';\nimport type { GeoMapCardProps, MarkerDescriptor } from './GeoMapCard.types';\nimport { normalizePoints } from './normalizePoints';\nimport { buildCategoryColors, buildLegendItems, buildMarkerStyle, buildWeightScale } from './buildMarkerStyle';\nimport { MapViewport } from './MapViewport';\nimport { MapLegend } from './MapLegend';\nimport { PointListing } from './PointListing';\nimport { warnMissingLeafletStylesheet } from './warnMissingLeafletStylesheet';\nimport styles from './GeoMapCard.module.css';\n\n/** States what was left out, so a truncated map never passes for a complete one. */\nconst buildNotice = (info: GeoRenderInfo, maxPoints: number): string | null => {\n  const reasons: string[] = [];\n\n  if (info.skipped > 0) reasons.push(`${info.skipped} without usable coordinates`);\n  if (info.dropped > 0) reasons.push(`${info.dropped} over the ${maxPoints} marker cap`);\n\n  if (reasons.length === 0) return null;\n\n  return `Showing ${info.drawn} of ${info.total} points (${reasons.join(', ')}).`;\n};\n\n/** One line carrying everything the tooltip shows, for the screen reader too. */\nconst describePoint = (point: GeoPoint, categoryLabel: string): string =>\n  [point.label, point.category != null ? `${categoryLabel}: ${point.category}` : null, point.detail]\n    .filter((part): part is string => part != null && part !== '')\n    .join(' — ');\n\nexport const GeoMapCard = ({\n  title,\n  points,\n  selectedIds,\n  onSelectPoint,\n  categoryLabel = 'Category',\n  legendTitle = 'Legend',\n  hideLegend = false,\n  maxPoints = GEO_MAP.MAX_POINTS,\n  onRender,\n  fitBounds = true,\n  center,\n  zoom,\n  scrollWheelZoom = false,\n  basemap = 'auto',\n  tileLayer,\n  compact = false,\n  toolbar,\n  actions,\n  isLoading = false,\n  error = null,\n  onRetry,\n  emptyTitle = 'No mappable points',\n  emptyDescription = 'None of the points received carry usable coordinates.',\n  retryLabel = 'Retry',\n  loadingLabel = 'Loading map...',\n  pointListLabel = 'Map points',\n  className,\n}: GeoMapCardProps) => {\n  const theme = useThemeMode();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const { drawn, bounds, info } = useMemo(\n    () => normalizePoints(points, maxPoints),\n    [points, maxPoints],\n  );\n\n  const categoryColors = useMemo(() => buildCategoryColors(points), [points]);\n  const legendItems = useMemo(() => buildLegendItems(categoryColors), [categoryColors]);\n\n  const markers = useMemo<MarkerDescriptor[]>(() => {\n    const weightScale = buildWeightScale(points);\n    const selection = new Set(selectedIds ?? []);\n\n    return drawn.map(({ point, sourceIndex }) => {\n      const selected = selection.has(point.id);\n\n      return {\n        point,\n        sourceIndex,\n        selected,\n        style: buildMarkerStyle(point, { categoryColors, weightScale, selected, theme }),\n        description: describePoint(point, categoryLabel),\n      };\n    });\n  }, [drawn, points, selectedIds, categoryColors, theme, categoryLabel]);\n\n  const tiles = tileLayer ?? {\n    url: BASEMAP_TILES[basemap === 'auto' ? theme : basemap],\n    attribution: BASEMAP_TILES.attribution,\n  };\n\n  // Manual framing and automatic framing would fight over the viewport.\n  const shouldFitBounds = fitBounds && center == null && zoom == null;\n  const showLegend = !hideLegend && legendItems.length > 0;\n  const notice = buildNotice(info, maxPoints);\n  const hasMap = !isLoading && error == null && info.drawn > 0;\n\n  useEffect(() => {\n    onRender?.(info);\n  }, [onRender, info]);\n\n  useEffect(() => {\n    if (import.meta.env.DEV && hasMap) warnMissingLeafletStylesheet(containerRef.current);\n  }, [hasMap]);\n\n  return (\n    <div className={clsx(styles.root, compact && styles.compact, className)}>\n      <header className={styles.header}>\n        <h3 className={styles.title}>{title}</h3>\n        {actions && <div className={styles.headerActions}>{actions}</div>}\n      </header>\n\n      {toolbar && <div className={styles.toolbar}>{toolbar}</div>}\n\n      {hasMap && notice && (\n        <div className={styles.warning} role=\"status\">\n          {notice}\n        </div>\n      )}\n\n      {isLoading && <div className={styles.loading}>{loadingLabel}</div>}\n\n      {!isLoading && error != null && (\n        <div className={styles.error}>\n          <span>{error}</span>\n          {onRetry && (\n            <button type=\"button\" className={styles.retryButton} onClick={onRetry}>\n              {retryLabel}\n            </button>\n          )}\n        </div>\n      )}\n\n      {!isLoading && error == null && info.drawn === 0 && (\n        <EmptyState\n          className={styles.empty}\n          variant=\"plain\"\n          title={emptyTitle}\n          description={emptyDescription}\n        />\n      )}\n\n      {hasMap && (\n        <div\n          ref={containerRef}\n          className={styles.mapContainer}\n          role=\"figure\"\n          aria-label={`${title}: map of ${info.drawn} points`}\n        >\n          <MapContainer\n            className={styles.map}\n            center={center ?? [...GEO_MAP.DEFAULT_CENTER]}\n            zoom={zoom ?? GEO_MAP.DEFAULT_ZOOM}\n            scrollWheelZoom={scrollWheelZoom}\n          >\n            <TileLayer key={tiles.url} url={tiles.url} attribution={tiles.attribution} />\n            <MapViewport bounds={bounds} fitBounds={shouldFitBounds} />\n\n            {markers.map(({ point, sourceIndex, style, description }) => (\n              <CircleMarker\n                key={point.id}\n                center={[point.latitude, point.longitude]}\n                radius={style.radius}\n                pathOptions={style}\n                eventHandlers={\n                  onSelectPoint ? { click: () => onSelectPoint({ point, index: sourceIndex }) } : {}\n                }\n              >\n                <Tooltip>{description}</Tooltip>\n              </CircleMarker>\n            ))}\n\n            {showLegend && <MapLegend items={legendItems} title={legendTitle} />}\n          </MapContainer>\n\n          <PointListing\n            markers={markers}\n            label={pointListLabel}\n            onSelectPoint={onSelectPoint}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nGeoMapCard.displayName = 'GeoMapCard';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index30.js","sources":["../src/geo/GeoMapCard/GeoMapCard.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { CircleMarker, MapContainer, TileLayer, Tooltip } from 'react-leaflet';\nimport clsx from 'clsx';\nimport { EmptyState } from '../../primitives/EmptyState';\nimport { useThemeMode } from '../../hooks/useThemeMode';\nimport { GEO_MAP } from '../../constants';\nimport type { GeoMapCardProps, MarkerDescriptor } from './GeoMapCard.types';\nimport { normalizePoints } from './normalizePoints';\nimport {\n  buildCategoryColors,\n  buildLegendItems,\n  buildMarkerStyle,\n  buildWeightScale,\n} from './buildMarkerStyle';\nimport { MapViewport } from './MapViewport';\nimport { ViewportReporter } from './ViewportReporter';\nimport { MapStatusBars } from './MapStatusBars';\nimport { buildNotice, describePoint } from './describePoints';\nimport { MapLegend } from './MapLegend';\nimport { PointListing } from './PointListing';\nimport { warnMissingLeafletStylesheet } from './warnMissingLeafletStylesheet';\nimport { warnMissingBasemapKey } from './warnMissingBasemapKey';\nimport { resolveTiles } from './resolveTiles';\nimport styles from './GeoMapCard.module.css';\n\nexport const GeoMapCard = ({\n  title,\n  points,\n  selectedIds,\n  onSelectPoint,\n  categoryLabel = 'Category',\n  legendTitle = 'Legend',\n  hideLegend = false,\n  maxPoints = GEO_MAP.MAX_POINTS,\n  onRender,\n  fitBounds = true,\n  center,\n  zoom,\n  scrollWheelZoom = false,\n  onViewportChange,\n  isRefreshing = false,\n  refreshingLabel = 'Updating…',\n  basemap = 'auto',\n  basemapKey,\n  tileLayer,\n  compact = false,\n  toolbar,\n  actions,\n  isLoading = false,\n  error = null,\n  onRetry,\n  emptyTitle = 'No mappable points',\n  emptyDescription = 'None of the points received carry usable coordinates.',\n  retryLabel = 'Retry',\n  loadingLabel = 'Loading map...',\n  pointListLabel = 'Map points',\n  className,\n}: GeoMapCardProps) => {\n  const theme = useThemeMode();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const { drawn, bounds, info } = useMemo(\n    () => normalizePoints(points, maxPoints),\n    [points, maxPoints],\n  );\n\n  const categoryColors = useMemo(() => buildCategoryColors(points), [points]);\n  const legendItems = useMemo(() => buildLegendItems(categoryColors), [categoryColors]);\n\n  const markers = useMemo<MarkerDescriptor[]>(() => {\n    const weightScale = buildWeightScale(points);\n    const selection = new Set(selectedIds ?? []);\n\n    return drawn.map(({ point, sourceIndex }) => {\n      const selected = selection.has(point.id);\n\n      return {\n        point,\n        sourceIndex,\n        selected,\n        style: buildMarkerStyle(point, { categoryColors, weightScale, selected, theme }),\n        description: describePoint(point, categoryLabel),\n      };\n    });\n  }, [drawn, points, selectedIds, categoryColors, theme, categoryLabel]);\n\n  const tiles = resolveTiles(tileLayer, basemap, theme, basemapKey);\n\n  // Viewport mode: the view drives the points, so the map must outlive an empty\n  // area, and the points must never move the view (that would be a fetch loop).\n  const viewportMode = onViewportChange != null;\n  // Manual framing and automatic framing would fight over the viewport.\n  const shouldFitBounds = fitBounds && center == null && zoom == null && !viewportMode;\n  const showLegend = !hideLegend && legendItems.length > 0;\n  const notice = buildNotice(info, maxPoints);\n  const isBlocked = isLoading || error != null;\n  const hasMap = !isBlocked && (info.drawn > 0 || viewportMode);\n  const showEmptyState = !isBlocked && info.drawn === 0 && !viewportMode;\n\n  useEffect(() => {\n    onRender?.(info);\n  }, [onRender, info]);\n\n  useEffect(() => {\n    if (!import.meta.env.DEV || !hasMap) return;\n\n    warnMissingLeafletStylesheet(containerRef.current);\n    if (tileLayer == null && !basemapKey) warnMissingBasemapKey();\n  }, [hasMap, tileLayer, basemapKey]);\n\n  return (\n    <div className={clsx(styles.root, compact && styles.compact, className)}>\n      <header className={styles.header}>\n        <h3 className={styles.title}>{title}</h3>\n        {(isRefreshing || actions) && (\n          <div className={styles.headerActions}>\n            {isRefreshing && (\n              <span className={styles.refreshing} role=\"status\">\n                <span className={styles.refreshingDot} aria-hidden=\"true\" />\n                {refreshingLabel}\n              </span>\n            )}\n            {actions}\n          </div>\n        )}\n      </header>\n\n      {toolbar && <div className={styles.toolbar}>{toolbar}</div>}\n\n      {hasMap && (\n        <MapStatusBars notice={notice} emptyMessage={info.drawn === 0 ? emptyTitle : null} />\n      )}\n\n      {isLoading && <div className={styles.loading}>{loadingLabel}</div>}\n\n      {!isLoading && error != null && (\n        <div className={styles.error}>\n          <span>{error}</span>\n          {onRetry && (\n            <button type=\"button\" className={styles.retryButton} onClick={onRetry}>\n              {retryLabel}\n            </button>\n          )}\n        </div>\n      )}\n\n      {showEmptyState && (\n        <EmptyState\n          className={styles.empty}\n          variant=\"plain\"\n          title={emptyTitle}\n          description={emptyDescription}\n        />\n      )}\n\n      {hasMap && (\n        <div\n          ref={containerRef}\n          className={styles.mapContainer}\n          role=\"figure\"\n          aria-label={`${title}: map of ${info.drawn} points`}\n          aria-busy={isRefreshing || undefined}\n        >\n          <MapContainer\n            className={styles.map}\n            center={center ?? [...GEO_MAP.DEFAULT_CENTER]}\n            zoom={zoom ?? GEO_MAP.DEFAULT_ZOOM}\n            scrollWheelZoom={scrollWheelZoom}\n          >\n            <TileLayer key={tiles.url} url={tiles.url} attribution={tiles.attribution} />\n            <MapViewport bounds={bounds} fitBounds={shouldFitBounds} />\n            {onViewportChange && <ViewportReporter onViewportChange={onViewportChange} />}\n\n            {markers.map(({ point, sourceIndex, style, description }) => (\n              <CircleMarker\n                key={point.id}\n                center={[point.latitude, point.longitude]}\n                radius={style.radius}\n                pathOptions={style}\n                eventHandlers={\n                  onSelectPoint ? { click: () => onSelectPoint({ point, index: sourceIndex }) } : {}\n                }\n              >\n                <Tooltip>{description}</Tooltip>\n              </CircleMarker>\n            ))}\n\n            {showLegend && <MapLegend items={legendItems} title={legendTitle} />}\n          </MapContainer>\n\n          <PointListing markers={markers} label={pointListLabel} onSelectPoint={onSelectPoint} />\n        </div>\n      )}\n    </div>\n  );\n};\n\nGeoMapCard.displayName = 'GeoMapCard';\n"],"names":[],"mappings":"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"}

package/dist/index31.cjs

@@ -4,10 +4,10 @@ const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const ReactECharts = require("echarts-for-react");
 const clsx = require("./index59.cjs");
-const pivotGroupedBars = require("./index97.cjs");
-const buildGroupedBarOption = require("./index98.cjs");
-const defaultLabels = require("./index99.cjs");
-const GroupedBarChartCard_module = require("./index100.cjs");
+const pivotGroupedBars = require("./index118.cjs");
+const buildGroupedBarOption = require("./index119.cjs");
+const defaultLabels = require("./index120.cjs");
+const GroupedBarChartCard_module = require("./index121.cjs");
 const buildAriaLabel = (title, valueLabel) => valueLabel ? `${title}: grouped bar chart of ${valueLabel}` : `${title}: grouped bar chart`;
 const GroupedBarChartCard = ({
   title,

package/dist/index31.js

@@ -2,10 +2,10 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { useMemo, useCallback } from "react";
 import ReactECharts from "echarts-for-react";
 import { clsx } from "./index59.js";
-import { pivotGroupedBars } from "./index97.js";
-import { buildGroupedBarOption } from "./index98.js";
-import { DEFAULT_LABELS } from "./index99.js";
-import styles from "./index100.js";
+import { pivotGroupedBars } from "./index118.js";
+import { buildGroupedBarOption } from "./index119.js";
+import { DEFAULT_LABELS } from "./index120.js";
+import styles from "./index121.js";
 const buildAriaLabel = (title, valueLabel) => valueLabel ? `${title}: grouped bar chart of ${valueLabel}` : `${title}: grouped bar chart`;
 const GroupedBarChartCard = ({
   title,

package/dist/index32.cjs

@@ -3,9 +3,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const clsx = require("./index59.cjs");
-const HeatmapMatrixHeader = require("./index120.cjs");
-const getColumnRuns = require("./index121.cjs");
-const HeatmapMatrix_module = require("./index122.cjs");
+const HeatmapMatrixHeader = require("./index115.cjs");
+const getColumnRuns = require("./index116.cjs");
+const HeatmapMatrix_module = require("./index117.cjs");
 function activateOnKey(event, action) {
   if (event.key === "Enter" || event.key === " ") {
     event.preventDefault();