@ktnpm_devops/react-component 0.12.1 → 0.13.0

package/dist/index99.cjs

@@ -1,60 +1,46 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "krc-root--s1oD";
-const trigger = "krc-trigger-WMlNa";
-const active = "krc-active-O65lj";
-const triggerContent = "krc-triggerContent-JipmE";
-const chevron = "krc-chevron-J2Zsy";
-const label = "krc-label-lZlV-";
-const value = "krc-value-HsQrC";
-const clear = "krc-clear-bsi5j";
-const panel = "krc-panel--0odx";
-const searchContainer = "krc-searchContainer-WRS-U";
-const search = "krc-search-Dh3pY";
-const list = "krc-list-1RUtr";
-const noResults = "krc-noResults-Hin1U";
-const option = "krc-option-0mFGi";
-const focused = "krc-focused-0-7tE";
-const selected = "krc-selected-1zIqI";
-const optionLabel = "krc-optionLabel-pj-hL";
-const optionCount = "krc-optionCount-rVlCP";
-const styles = {
-  root,
-  trigger,
-  active,
-  triggerContent,
-  chevron,
-  label,
-  value,
-  clear,
-  panel,
-  searchContainer,
-  search,
-  list,
-  noResults,
-  option,
-  focused,
-  selected,
-  optionLabel,
-  optionCount
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const constants = require("./index67.cjs");
+const tokens = require("./index3.cjs");
+const SELECTION_RING = {
+  light: tokens.orbitTokens.purple.base,
+  dark: "#FFFFFF"
 };
-exports.active = active;
-exports.chevron = chevron;
-exports.clear = clear;
-exports.default = styles;
-exports.focused = focused;
-exports.label = label;
-exports.list = list;
-exports.noResults = noResults;
-exports.option = option;
-exports.optionCount = optionCount;
-exports.optionLabel = optionLabel;
-exports.panel = panel;
-exports.root = root;
-exports.search = search;
-exports.searchContainer = searchContainer;
-exports.selected = selected;
-exports.trigger = trigger;
-exports.triggerContent = triggerContent;
-exports.value = value;
+const UNCATEGORISED_COLOR = tokens.orbitTokens.brand.orange;
+const buildCategoryColors = (points) => {
+  const categories = [...new Set(points.map((p) => p.category).filter((c) => c != null))];
+  categories.sort((a, b) => a.localeCompare(b));
+  return new Map(categories.map((category, i) => [category, constants.CHART_COLORS[i % constants.CHART_COLORS.length]]));
+};
+const buildWeightScale = (points) => {
+  const weights = points.map((p) => p.weight).filter((w) => w != null && Number.isFinite(w));
+  if (weights.length === 0) return null;
+  const min = Math.min(...weights);
+  const max = Math.max(...weights);
+  return min === max ? null : { min, max };
+};
+const radiusFor = (weight, scale) => {
+  if (scale == null || weight == null || !Number.isFinite(weight)) return constants.GEO_MAP.BASE_MARKER_RADIUS;
+  const ratio = (weight - scale.min) / (scale.max - scale.min);
+  const clamped = Math.min(Math.max(ratio, 0), 1);
+  const minArea = constants.GEO_MAP.MIN_MARKER_RADIUS ** 2;
+  const maxArea = constants.GEO_MAP.MAX_MARKER_RADIUS ** 2;
+  return Math.sqrt(minArea + clamped * (maxArea - minArea));
+};
+const buildMarkerStyle = (point, { categoryColors, weightScale, selected, theme }) => {
+  const fillColor = (point.category != null ? categoryColors.get(point.category) : void 0) ?? UNCATEGORISED_COLOR;
+  const radius = radiusFor(point.weight, weightScale);
+  return {
+    radius: selected ? radius + constants.GEO_MAP.SELECTED_RADIUS_BOOST : radius,
+    color: selected ? SELECTION_RING[theme] : fillColor,
+    weight: selected ? constants.GEO_MAP.SELECTED_STROKE_WIDTH : constants.GEO_MAP.MARKER_STROKE_WIDTH,
+    fillColor,
+    fillOpacity: selected ? 1 : constants.GEO_MAP.MARKER_FILL_OPACITY
+  };
+};
+const buildLegendItems = (categoryColors) => [...categoryColors].map(([label, color]) => ({ label, color }));
+exports.buildCategoryColors = buildCategoryColors;
+exports.buildLegendItems = buildLegendItems;
+exports.buildMarkerStyle = buildMarkerStyle;
+exports.buildWeightScale = buildWeightScale;
 //# sourceMappingURL=index99.cjs.map

package/dist/index99.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index99.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index99.cjs","sources":["../src/geo/GeoMapCard/buildMarkerStyle.ts"],"sourcesContent":["import { CHART_COLORS, GEO_MAP } from '../../constants';\nimport { orbitTokens } from '../../tokens/tokens';\nimport type { ThemeMode } from '../../hooks/useThemeMode';\nimport type { GeoLegendItem, GeoPoint } from '../../types/geo.types';\n\n/**\n * Leaflet draws its markers as SVG paths, out of reach of the CSS custom\n * properties, so colours are resolved here as hex — the same exception the\n * ECharts family makes. Everything styled with CSS still uses the tokens.\n */\nexport interface MarkerStyle {\n  radius: number;\n  /** Stroke colour. */\n  color: string;\n  /** Stroke width. */\n  weight: number;\n  fillColor: string;\n  fillOpacity: number;\n}\n\n/** Weight range actually present in the data, or `null` when it carries none. */\nexport interface WeightScale {\n  min: number;\n  max: number;\n}\n\nexport interface MarkerStyleOptions {\n  categoryColors: Map<string, string>;\n  weightScale: WeightScale | null;\n  selected: boolean;\n  theme: ThemeMode;\n}\n\n/** Ring drawn around a selected marker: maximum contrast against the basemap. */\nconst SELECTION_RING: Record<ThemeMode, string> = {\n  light: orbitTokens.purple.base,\n  dark: '#FFFFFF',\n};\n\n/** Colour used when no point carries a category. */\nconst UNCATEGORISED_COLOR = orbitTokens.brand.orange;\n\n/**\n * Categories are sorted before being indexed into the palette, so a colour\n * belongs to a category and not to the order the rows happened to arrive in.\n */\nexport const buildCategoryColors = (points: GeoPoint[]): Map<string, string> => {\n  const categories = [...new Set(points.map((p) => p.category).filter((c): c is string => c != null))];\n\n  categories.sort((a, b) => a.localeCompare(b));\n\n  return new Map(categories.map((category, i) => [category, CHART_COLORS[i % CHART_COLORS.length]]));\n};\n\n/**\n * Null when nothing carries a weight, and also when every weight is equal:\n * a dataset with no size information should render at the base radius rather\n * than paint every marker at the maximum.\n */\nexport const buildWeightScale = (points: GeoPoint[]): WeightScale | null => {\n  const weights = points\n    .map((p) => p.weight)\n    .filter((w): w is number => w != null && Number.isFinite(w));\n\n  if (weights.length === 0) return null;\n\n  const min = Math.min(...weights);\n  const max = Math.max(...weights);\n\n  return min === max ? null : { min, max };\n};\n\n/**\n * Interpolate on the *area*, which is what a reader actually compares, and take\n * the square root to get back to a radius.\n */\nconst radiusFor = (weight: number | null | undefined, scale: WeightScale | null): number => {\n  if (scale == null || weight == null || !Number.isFinite(weight)) return GEO_MAP.BASE_MARKER_RADIUS;\n\n  const ratio = (weight - scale.min) / (scale.max - scale.min);\n  const clamped = Math.min(Math.max(ratio, 0), 1);\n  const minArea = GEO_MAP.MIN_MARKER_RADIUS ** 2;\n  const maxArea = GEO_MAP.MAX_MARKER_RADIUS ** 2;\n\n  return Math.sqrt(minArea + clamped * (maxArea - minArea));\n};\n\n/**\n * Selection changes the radius and the stroke as well as the colour, because\n * colour is never allowed to be the only indicator of a state.\n */\nexport const buildMarkerStyle = (\n  point: GeoPoint,\n  { categoryColors, weightScale, selected, theme }: MarkerStyleOptions,\n): MarkerStyle => {\n  const fillColor =\n    (point.category != null ? categoryColors.get(point.category) : undefined) ?? UNCATEGORISED_COLOR;\n  const radius = radiusFor(point.weight, weightScale);\n\n  return {\n    radius: selected ? radius + GEO_MAP.SELECTED_RADIUS_BOOST : radius,\n    color: selected ? SELECTION_RING[theme] : fillColor,\n    weight: selected ? GEO_MAP.SELECTED_STROKE_WIDTH : GEO_MAP.MARKER_STROKE_WIDTH,\n    fillColor,\n    fillOpacity: selected ? 1 : GEO_MAP.MARKER_FILL_OPACITY,\n  };\n};\n\n/** Legend swatches, in the same order the palette was handed out. */\nexport const buildLegendItems = (categoryColors: Map<string, string>): GeoLegendItem[] =>\n  [...categoryColors].map(([label, color]) => ({ label, color }));\n"],"names":["orbitTokens","CHART_COLORS","GEO_MAP"],"mappings":";;;;AAkCA,MAAM,iBAA4C;AAAA,EAChD,OAAOA,OAAAA,YAAY,OAAO;AAAA,EAC1B,MAAM;AACR;AAGA,MAAM,sBAAsBA,OAAAA,YAAY,MAAM;AAMvC,MAAM,sBAAsB,CAAC,WAA4C;AAC9E,QAAM,aAAa,CAAC,GAAG,IAAI,IAAI,OAAO,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,MAAmB,KAAK,IAAI,CAAC,CAAC;AAEnG,aAAW,KAAK,CAAC,GAAG,MAAM,EAAE,cAAc,CAAC,CAAC;AAE5C,SAAO,IAAI,IAAI,WAAW,IAAI,CAAC,UAAU,MAAM,CAAC,UAAUC,UAAAA,aAAa,IAAIA,UAAAA,aAAa,MAAM,CAAC,CAAC,CAAC;AACnG;AAOO,MAAM,mBAAmB,CAAC,WAA2C;AAC1E,QAAM,UAAU,OACb,IAAI,CAAC,MAAM,EAAE,MAAM,EACnB,OAAO,CAAC,MAAmB,KAAK,QAAQ,OAAO,SAAS,CAAC,CAAC;AAE7D,MAAI,QAAQ,WAAW,EAAG,QAAO;AAEjC,QAAM,MAAM,KAAK,IAAI,GAAG,OAAO;AAC/B,QAAM,MAAM,KAAK,IAAI,GAAG,OAAO;AAE/B,SAAO,QAAQ,MAAM,OAAO,EAAE,KAAK,IAAA;AACrC;AAMA,MAAM,YAAY,CAAC,QAAmC,UAAsC;AAC1F,MAAI,SAAS,QAAQ,UAAU,QAAQ,CAAC,OAAO,SAAS,MAAM,EAAG,QAAOC,UAAAA,QAAQ;AAEhF,QAAM,SAAS,SAAS,MAAM,QAAQ,MAAM,MAAM,MAAM;AACxD,QAAM,UAAU,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,CAAC;AAC9C,QAAM,UAAUA,kBAAQ,qBAAqB;AAC7C,QAAM,UAAUA,kBAAQ,qBAAqB;AAE7C,SAAO,KAAK,KAAK,UAAU,WAAW,UAAU,QAAQ;AAC1D;AAMO,MAAM,mBAAmB,CAC9B,OACA,EAAE,gBAAgB,aAAa,UAAU,YACzB;AAChB,QAAM,aACH,MAAM,YAAY,OAAO,eAAe,IAAI,MAAM,QAAQ,IAAI,WAAc;AAC/E,QAAM,SAAS,UAAU,MAAM,QAAQ,WAAW;AAElD,SAAO;AAAA,IACL,QAAQ,WAAW,SAASA,UAAAA,QAAQ,wBAAwB;AAAA,IAC5D,OAAO,WAAW,eAAe,KAAK,IAAI;AAAA,IAC1C,QAAQ,WAAWA,UAAAA,QAAQ,wBAAwBA,UAAAA,QAAQ;AAAA,IAC3D;AAAA,IACA,aAAa,WAAW,IAAIA,kBAAQ;AAAA,EAAA;AAExC;AAGO,MAAM,mBAAmB,CAAC,mBAC/B,CAAC,GAAG,cAAc,EAAE,IAAI,CAAC,CAAC,OAAO,KAAK,OAAO,EAAE,OAAO,QAAQ;;;;;"}

package/dist/index99.js

@@ -1,60 +1,46 @@
-const root = "krc-root--s1oD";
-const trigger = "krc-trigger-WMlNa";
-const active = "krc-active-O65lj";
-const triggerContent = "krc-triggerContent-JipmE";
-const chevron = "krc-chevron-J2Zsy";
-const label = "krc-label-lZlV-";
-const value = "krc-value-HsQrC";
-const clear = "krc-clear-bsi5j";
-const panel = "krc-panel--0odx";
-const searchContainer = "krc-searchContainer-WRS-U";
-const search = "krc-search-Dh3pY";
-const list = "krc-list-1RUtr";
-const noResults = "krc-noResults-Hin1U";
-const option = "krc-option-0mFGi";
-const focused = "krc-focused-0-7tE";
-const selected = "krc-selected-1zIqI";
-const optionLabel = "krc-optionLabel-pj-hL";
-const optionCount = "krc-optionCount-rVlCP";
-const styles = {
-  root,
-  trigger,
-  active,
-  triggerContent,
-  chevron,
-  label,
-  value,
-  clear,
-  panel,
-  searchContainer,
-  search,
-  list,
-  noResults,
-  option,
-  focused,
-  selected,
-  optionLabel,
-  optionCount
+import { CHART_COLORS, GEO_MAP } from "./index67.js";
+import { orbitTokens } from "./index3.js";
+const SELECTION_RING = {
+  light: orbitTokens.purple.base,
+  dark: "#FFFFFF"
 };
+const UNCATEGORISED_COLOR = orbitTokens.brand.orange;
+const buildCategoryColors = (points) => {
+  const categories = [...new Set(points.map((p) => p.category).filter((c) => c != null))];
+  categories.sort((a, b) => a.localeCompare(b));
+  return new Map(categories.map((category, i) => [category, CHART_COLORS[i % CHART_COLORS.length]]));
+};
+const buildWeightScale = (points) => {
+  const weights = points.map((p) => p.weight).filter((w) => w != null && Number.isFinite(w));
+  if (weights.length === 0) return null;
+  const min = Math.min(...weights);
+  const max = Math.max(...weights);
+  return min === max ? null : { min, max };
+};
+const radiusFor = (weight, scale) => {
+  if (scale == null || weight == null || !Number.isFinite(weight)) return GEO_MAP.BASE_MARKER_RADIUS;
+  const ratio = (weight - scale.min) / (scale.max - scale.min);
+  const clamped = Math.min(Math.max(ratio, 0), 1);
+  const minArea = GEO_MAP.MIN_MARKER_RADIUS ** 2;
+  const maxArea = GEO_MAP.MAX_MARKER_RADIUS ** 2;
+  return Math.sqrt(minArea + clamped * (maxArea - minArea));
+};
+const buildMarkerStyle = (point, { categoryColors, weightScale, selected, theme }) => {
+  const fillColor = (point.category != null ? categoryColors.get(point.category) : void 0) ?? UNCATEGORISED_COLOR;
+  const radius = radiusFor(point.weight, weightScale);
+  return {
+    radius: selected ? radius + GEO_MAP.SELECTED_RADIUS_BOOST : radius,
+    color: selected ? SELECTION_RING[theme] : fillColor,
+    weight: selected ? GEO_MAP.SELECTED_STROKE_WIDTH : GEO_MAP.MARKER_STROKE_WIDTH,
+    fillColor,
+    fillOpacity: selected ? 1 : GEO_MAP.MARKER_FILL_OPACITY
+  };
+};
+const buildLegendItems = (categoryColors) => [...categoryColors].map(([label, color]) => ({ label, color }));
 export {
-  active,
-  chevron,
-  clear,
-  styles as default,
-  focused,
-  label,
-  list,
-  noResults,
-  option,
-  optionCount,
-  optionLabel,
-  panel,
-  root,
-  search,
-  searchContainer,
-  selected,
-  trigger,
-  triggerContent,
-  value
+  buildCategoryColors,
+  buildLegendItems,
+  buildMarkerStyle,
+  buildWeightScale
 };
 //# sourceMappingURL=index99.js.map

package/dist/index99.js.map

@@ -1 +1 @@
-{"version":3,"file":"index99.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index99.js","sources":["../src/geo/GeoMapCard/buildMarkerStyle.ts"],"sourcesContent":["import { CHART_COLORS, GEO_MAP } from '../../constants';\nimport { orbitTokens } from '../../tokens/tokens';\nimport type { ThemeMode } from '../../hooks/useThemeMode';\nimport type { GeoLegendItem, GeoPoint } from '../../types/geo.types';\n\n/**\n * Leaflet draws its markers as SVG paths, out of reach of the CSS custom\n * properties, so colours are resolved here as hex — the same exception the\n * ECharts family makes. Everything styled with CSS still uses the tokens.\n */\nexport interface MarkerStyle {\n  radius: number;\n  /** Stroke colour. */\n  color: string;\n  /** Stroke width. */\n  weight: number;\n  fillColor: string;\n  fillOpacity: number;\n}\n\n/** Weight range actually present in the data, or `null` when it carries none. */\nexport interface WeightScale {\n  min: number;\n  max: number;\n}\n\nexport interface MarkerStyleOptions {\n  categoryColors: Map<string, string>;\n  weightScale: WeightScale | null;\n  selected: boolean;\n  theme: ThemeMode;\n}\n\n/** Ring drawn around a selected marker: maximum contrast against the basemap. */\nconst SELECTION_RING: Record<ThemeMode, string> = {\n  light: orbitTokens.purple.base,\n  dark: '#FFFFFF',\n};\n\n/** Colour used when no point carries a category. */\nconst UNCATEGORISED_COLOR = orbitTokens.brand.orange;\n\n/**\n * Categories are sorted before being indexed into the palette, so a colour\n * belongs to a category and not to the order the rows happened to arrive in.\n */\nexport const buildCategoryColors = (points: GeoPoint[]): Map<string, string> => {\n  const categories = [...new Set(points.map((p) => p.category).filter((c): c is string => c != null))];\n\n  categories.sort((a, b) => a.localeCompare(b));\n\n  return new Map(categories.map((category, i) => [category, CHART_COLORS[i % CHART_COLORS.length]]));\n};\n\n/**\n * Null when nothing carries a weight, and also when every weight is equal:\n * a dataset with no size information should render at the base radius rather\n * than paint every marker at the maximum.\n */\nexport const buildWeightScale = (points: GeoPoint[]): WeightScale | null => {\n  const weights = points\n    .map((p) => p.weight)\n    .filter((w): w is number => w != null && Number.isFinite(w));\n\n  if (weights.length === 0) return null;\n\n  const min = Math.min(...weights);\n  const max = Math.max(...weights);\n\n  return min === max ? null : { min, max };\n};\n\n/**\n * Interpolate on the *area*, which is what a reader actually compares, and take\n * the square root to get back to a radius.\n */\nconst radiusFor = (weight: number | null | undefined, scale: WeightScale | null): number => {\n  if (scale == null || weight == null || !Number.isFinite(weight)) return GEO_MAP.BASE_MARKER_RADIUS;\n\n  const ratio = (weight - scale.min) / (scale.max - scale.min);\n  const clamped = Math.min(Math.max(ratio, 0), 1);\n  const minArea = GEO_MAP.MIN_MARKER_RADIUS ** 2;\n  const maxArea = GEO_MAP.MAX_MARKER_RADIUS ** 2;\n\n  return Math.sqrt(minArea + clamped * (maxArea - minArea));\n};\n\n/**\n * Selection changes the radius and the stroke as well as the colour, because\n * colour is never allowed to be the only indicator of a state.\n */\nexport const buildMarkerStyle = (\n  point: GeoPoint,\n  { categoryColors, weightScale, selected, theme }: MarkerStyleOptions,\n): MarkerStyle => {\n  const fillColor =\n    (point.category != null ? categoryColors.get(point.category) : undefined) ?? UNCATEGORISED_COLOR;\n  const radius = radiusFor(point.weight, weightScale);\n\n  return {\n    radius: selected ? radius + GEO_MAP.SELECTED_RADIUS_BOOST : radius,\n    color: selected ? SELECTION_RING[theme] : fillColor,\n    weight: selected ? GEO_MAP.SELECTED_STROKE_WIDTH : GEO_MAP.MARKER_STROKE_WIDTH,\n    fillColor,\n    fillOpacity: selected ? 1 : GEO_MAP.MARKER_FILL_OPACITY,\n  };\n};\n\n/** Legend swatches, in the same order the palette was handed out. */\nexport const buildLegendItems = (categoryColors: Map<string, string>): GeoLegendItem[] =>\n  [...categoryColors].map(([label, color]) => ({ label, color }));\n"],"names":[],"mappings":";;AAkCA,MAAM,iBAA4C;AAAA,EAChD,OAAO,YAAY,OAAO;AAAA,EAC1B,MAAM;AACR;AAGA,MAAM,sBAAsB,YAAY,MAAM;AAMvC,MAAM,sBAAsB,CAAC,WAA4C;AAC9E,QAAM,aAAa,CAAC,GAAG,IAAI,IAAI,OAAO,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,MAAmB,KAAK,IAAI,CAAC,CAAC;AAEnG,aAAW,KAAK,CAAC,GAAG,MAAM,EAAE,cAAc,CAAC,CAAC;AAE5C,SAAO,IAAI,IAAI,WAAW,IAAI,CAAC,UAAU,MAAM,CAAC,UAAU,aAAa,IAAI,aAAa,MAAM,CAAC,CAAC,CAAC;AACnG;AAOO,MAAM,mBAAmB,CAAC,WAA2C;AAC1E,QAAM,UAAU,OACb,IAAI,CAAC,MAAM,EAAE,MAAM,EACnB,OAAO,CAAC,MAAmB,KAAK,QAAQ,OAAO,SAAS,CAAC,CAAC;AAE7D,MAAI,QAAQ,WAAW,EAAG,QAAO;AAEjC,QAAM,MAAM,KAAK,IAAI,GAAG,OAAO;AAC/B,QAAM,MAAM,KAAK,IAAI,GAAG,OAAO;AAE/B,SAAO,QAAQ,MAAM,OAAO,EAAE,KAAK,IAAA;AACrC;AAMA,MAAM,YAAY,CAAC,QAAmC,UAAsC;AAC1F,MAAI,SAAS,QAAQ,UAAU,QAAQ,CAAC,OAAO,SAAS,MAAM,EAAG,QAAO,QAAQ;AAEhF,QAAM,SAAS,SAAS,MAAM,QAAQ,MAAM,MAAM,MAAM;AACxD,QAAM,UAAU,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,CAAC;AAC9C,QAAM,UAAU,QAAQ,qBAAqB;AAC7C,QAAM,UAAU,QAAQ,qBAAqB;AAE7C,SAAO,KAAK,KAAK,UAAU,WAAW,UAAU,QAAQ;AAC1D;AAMO,MAAM,mBAAmB,CAC9B,OACA,EAAE,gBAAgB,aAAa,UAAU,YACzB;AAChB,QAAM,aACH,MAAM,YAAY,OAAO,eAAe,IAAI,MAAM,QAAQ,IAAI,WAAc;AAC/E,QAAM,SAAS,UAAU,MAAM,QAAQ,WAAW;AAElD,SAAO;AAAA,IACL,QAAQ,WAAW,SAAS,QAAQ,wBAAwB;AAAA,IAC5D,OAAO,WAAW,eAAe,KAAK,IAAI;AAAA,IAC1C,QAAQ,WAAW,QAAQ,wBAAwB,QAAQ;AAAA,IAC3D;AAAA,IACA,aAAa,WAAW,IAAI,QAAQ;AAAA,EAAA;AAExC;AAGO,MAAM,mBAAmB,CAAC,mBAC/B,CAAC,GAAG,cAAc,EAAE,IAAI,CAAC,CAAC,OAAO,KAAK,OAAO,EAAE,OAAO,QAAQ;"}

package/dist/style.css

@@ -1580,6 +1580,213 @@
 .krc-input--QI2U:focus {
   border-color: var(--accent-color);
 }
+/* Column flex so the map takes the height the card is given: the container grows
+   when the consumer sizes the card, and falls back to its own height when the
+   card is left to size itself. */
+.krc-root-m-WU1 {
+  display: flex;
+  flex-direction: column;
+  background: var(--surface-color);
+  border: var(--border-width) solid var(--border-color);
+  border-radius: var(--radius-lg);
+  box-shadow: var(--shadow-subtle);
+  overflow: hidden;
+}
+
+.krc-header-j8Yft {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: space-between;
+  padding: var(--spacing-sm) var(--spacing-md);
+  border-bottom: var(--border-width) solid var(--border-color);
+}
+
+.krc-title-10Tak {
+  margin: 0;
+  font-size: var(--font-size-md);
+  font-weight: 600;
+  color: var(--text-primary);
+}
+
+.krc-headerActions-rh6MO {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+}
+
+.krc-toolbar-6bfl- {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  gap: var(--spacing-md);
+  padding: var(--spacing-xs) var(--spacing-md);
+  border-bottom: var(--border-width) solid var(--border-color);
+}
+
+.krc-warning-dISP1 {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  gap: var(--spacing-xs);
+  padding: var(--spacing-xs) var(--spacing-md);
+  font-size: var(--font-size-xs);
+  color: var(--warning-color);
+  background: var(--warning-color-soft);
+  border-bottom: var(--border-width) solid var(--border-color);
+}
+
+/* An explicit height (not just a minimum) is what lets Leaflet resolve its own
+   `height: 100%`; `flex: 1` then lets it take any extra space the card was given. */
+.krc-mapContainer-MKTII {
+  position: relative;
+  flex: 1 1 auto;
+  box-sizing: border-box;
+  height: 21.25rem;
+  min-height: 21.25rem;
+}
+
+.krc-map-o-Ldd {
+  width: 100%;
+  height: 100%;
+}
+
+.krc-loading-LE2tH,
+.krc-empty-JAoUd {
+  display: flex;
+  flex: 1 1 auto;
+  align-items: center;
+  justify-content: center;
+  min-height: 21.25rem;
+  color: var(--text-secondary);
+  font-size: var(--font-size-sm);
+}
+
+.krc-error-FkrvS {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacing-sm);
+  min-height: 21.25rem;
+  color: var(--danger-color);
+  font-size: var(--font-size-sm);
+}
+
+.krc-retryButton-BKn73 {
+  padding: var(--spacing-xs) var(--spacing-md);
+  font-size: var(--font-size-sm);
+  color: var(--accent-color-contrast);
+  background: var(--accent-color);
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: background-color 0.15s ease;
+}
+
+.krc-retryButton-BKn73:hover {
+  background: var(--accent-color-strong);
+}
+
+.krc-retryButton-BKn73:focus-visible {
+  outline: none;
+  box-shadow: var(--focus-ring-shadow);
+}
+
+/* The legend sits inside Leaflet's control pane (see MapLegend), so it inherits
+   that stacking context and needs no z-index of its own. */
+.krc-legend-c-RjE {
+  padding: var(--spacing-xs) var(--spacing-sm);
+  background: var(--surface-color);
+  border: var(--border-width) solid var(--border-color);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-soft);
+}
+
+.krc-legendTitle-j4e4- {
+  margin: 0 0 var(--spacing-2xs);
+  font-size: var(--font-size-2xs);
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--text-tertiary);
+}
+
+.krc-legendList-jRukT {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2xs);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.krc-legendItem-X2jYA {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  font-size: var(--font-size-xs);
+  color: var(--text-secondary);
+}
+
+.krc-legendSwatch-OTMwM {
+  flex: 0 0 auto;
+  width: 0.625rem;
+  height: 0.625rem;
+  border-radius: var(--radius-pill);
+}
+
+/* Narrow containers (a chat dock is 20–47.5rem wide): the map must not push the
+   surrounding content out of view. */
+.krc-compact-Ha6w2 .krc-mapContainer-MKTII,
+.krc-compact-Ha6w2 .krc-loading-LE2tH,
+.krc-compact-Ha6w2 .krc-empty-JAoUd,
+.krc-compact-Ha6w2 .krc-error-FkrvS {
+  min-height: 13.75rem;
+}
+
+.krc-compact-Ha6w2 .krc-mapContainer-MKTII {
+  height: 13.75rem;
+}
+
+.krc-compact-Ha6w2 .krc-header-j8Yft {
+  padding: var(--spacing-xs) var(--spacing-sm);
+}
+
+.krc-compact-Ha6w2 .krc-title-10Tak {
+  font-size: var(--font-size-sm);
+}
+
+/* Leaflet paints its own light-grey backdrop and near-black attribution text,
+   which read as a hole in a dark surface while the tiles load. Scoped to this
+   component and limited to colour — no layout of Leaflet's is touched. */
+.krc-root-m-WU1 .leaflet-container {
+  background: var(--surface-alt);
+  font-family: inherit;
+}
+
+.krc-root-m-WU1 .leaflet-control-attribution {
+  color: var(--text-tertiary);
+  background: var(--surface-color);
+  font-size: var(--font-size-2xs);
+}
+
+.krc-root-m-WU1 .leaflet-control-attribution a {
+  color: var(--text-secondary);
+}
+
+.krc-srOnly-KDwnO {
+  position: absolute;
+  width: var(--border-width);
+  height: var(--border-width);
+  margin: calc(-1 * var(--border-width));
+  padding: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  border: 0;
+  clip-path: inset(50%);
+}
 .krc-wrap-JRsc1 {
   overflow: auto;
   border: var(--border-width) solid var(--border-color);

package/dist/types/geo.types.d.ts

@@ -0,0 +1,45 @@
+/** A single plottable point on a map. The geographic mirror of `ScatterPoint`. */
+export interface GeoPoint {
+    /** Stable identity: React key and selection value. */
+    id: string;
+    latitude: number;
+    longitude: number;
+    /** Tooltip text and accessible-listing label — what makes a point actionable. */
+    label: string;
+    /** Colour and legend dimension (zone, band, operator). */
+    category?: string | null;
+    /** Relative weight mapped to the marker radius (area ∝ weight). */
+    weight?: number | null;
+    /** Second tooltip line. */
+    detail?: string | null;
+}
+/** Point selection payload for map interaction callbacks. */
+export interface GeoPointSelection {
+    point: GeoPoint;
+    /** Index in the original `points` array, not in the normalised one. */
+    index: number;
+}
+/** What the map declares about what it actually drew. */
+export interface GeoRenderInfo {
+    /** Points received in `points`. */
+    total: number;
+    /** Markers drawn. */
+    drawn: number;
+    /** Points discarded for missing or out-of-range coordinates. */
+    skipped: number;
+    /** Points discarded by the `maxPoints` cap. */
+    dropped: number;
+}
+/** Basemap choice; `auto` follows the document theme. */
+export type GeoBasemap = 'light' | 'dark' | 'auto';
+/** A caller-supplied tile source, replacing the built-in basemaps. */
+export interface GeoTileLayer {
+    url: string;
+    attribution: string;
+}
+/** One swatch of the map legend. */
+export interface GeoLegendItem {
+    label: string;
+    color: string;
+}
+//# sourceMappingURL=geo.types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"geo.types.d.ts","sourceRoot":"","sources":["../../src/types/geo.types.ts"],"names":[],"mappings":"AAAA,kFAAkF;AAClF,MAAM,WAAW,QAAQ;IACvB,sDAAsD;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,iFAAiF;IACjF,KAAK,EAAE,MAAM,CAAC;IACd,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,mEAAmE;IACnE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,2BAA2B;IAC3B,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACxB;AAED,6DAA6D;AAC7D,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,QAAQ,CAAC;IAChB,uEAAuE;IACvE,KAAK,EAAE,MAAM,CAAC;CACf;AAED,yDAAyD;AACzD,MAAM,WAAW,aAAa;IAC5B,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,gEAAgE;IAChE,OAAO,EAAE,MAAM,CAAC;IAChB,+CAA+C;IAC/C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,yDAAyD;AACzD,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAEnD,sEAAsE;AACtE,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,oCAAoC;AACpC,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf"}

package/dist/types/index.d.ts

@@ -50,5 +50,6 @@ export interface TemporalTrendPoint {
     series: Record<string, number>;
 }
 export type { TimeRangeOption, ChartSeriesPoint, SankeyFlowRow as SankeyFlowRowV2, CounterTimeseriesPoint as CounterTimeseriesPointV2, DistinctCounterRow, ChartAnnotation as ChartAnnotationV2, ReferenceLine, EChartsInstance, ChartCategorySelection, SankeyColorMetric, SankeyWidthMetric, ChartSelectOption, ChartCardBaseProps, ScatterPoint, ScatterPointSelection, ScatterRenderInfo, } from './chart.types';
+export type { GeoPoint, GeoPointSelection, GeoRenderInfo, GeoBasemap, GeoTileLayer, GeoLegendItem, } from './geo.types';
 export type { NavItemConfig, SidebarSectionConfig, } from './layout.types';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,yDAAyD;AACzD,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,MAAM;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,CAAC,CAAC;CACV;AAED,gDAAgD;AAChD,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACb;AAED,gCAAgC;AAChC,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,0DAA0D;AAC1D,MAAM,WAAW,aAAa;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,0CAA0C;AAC1C,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,qCAAqC;AACrC,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,4CAA4C;AAC5C,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,iCAAiC;AACjC,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAChC;AAED,iCAAiC;AACjC,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAChC;AAGD,YAAY,EACV,eAAe,EACf,gBAAgB,EAChB,aAAa,IAAI,eAAe,EAChC,sBAAsB,IAAI,wBAAwB,EAClD,kBAAkB,EAClB,eAAe,IAAI,iBAAiB,EACpC,aAAa,EACb,eAAe,EACf,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,YAAY,EACZ,qBAAqB,EACrB,iBAAiB,GAClB,MAAM,eAAe,CAAC;AAGvB,YAAY,EACV,aAAa,EACb,oBAAoB,GACrB,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,yDAAyD;AACzD,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,MAAM;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,CAAC,CAAC;CACV;AAED,gDAAgD;AAChD,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACb;AAED,gCAAgC;AAChC,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,0DAA0D;AAC1D,MAAM,WAAW,aAAa;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,0CAA0C;AAC1C,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,qCAAqC;AACrC,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,4CAA4C;AAC5C,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,iCAAiC;AACjC,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAChC;AAED,iCAAiC;AACjC,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAChC;AAGD,YAAY,EACV,eAAe,EACf,gBAAgB,EAChB,aAAa,IAAI,eAAe,EAChC,sBAAsB,IAAI,wBAAwB,EAClD,kBAAkB,EAClB,eAAe,IAAI,iBAAiB,EACpC,aAAa,EACb,eAAe,EACf,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,YAAY,EACZ,qBAAqB,EACrB,iBAAiB,GAClB,MAAM,eAAe,CAAC;AAGvB,YAAY,EACV,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,YAAY,EACZ,aAAa,GACd,MAAM,aAAa,CAAC;AAGrB,YAAY,EACV,aAAa,EACb,oBAAoB,GACrB,MAAM,gBAAgB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ktnpm_devops/react-component",
-  "version": "0.12.1",
+  "version": "0.13.0",
   "description": "Kenmei Technologies React Component Library",
   "type": "module",
   "license": "MIT",
@@ -37,8 +37,10 @@
     "LICENSE"
   ],
   "peerDependencies": {
+    "leaflet": "^1.9.0",
     "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0"
+    "react-dom": "^18.0.0 || ^19.0.0",
+    "react-leaflet": "^4.0.0 || ^5.0.0"
   },
   "peerDependenciesMeta": {
     "echarts": {
@@ -50,8 +52,14 @@
     "@tanstack/react-table": {
       "optional": true
     },
+    "leaflet": {
+      "optional": true
+    },
     "lucide-react": {
       "optional": true
+    },
+    "react-leaflet": {
+      "optional": true
     }
   },
   "dependencies": {
@@ -68,6 +76,7 @@
     "@testing-library/jest-dom": "^6.4.0",
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.0",
+    "@types/leaflet": "^1.9.22",
     "@types/react": "^19.2.18",
     "@types/react-dom": "^19.2.4",
     "@typescript-eslint/eslint-plugin": "^7.0.0",
@@ -81,10 +90,12 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-storybook": "^0.8.0",
     "happy-dom": "^14.0.0",
+    "leaflet": "^1.9.4",
     "lucide-react": "^0.441.0",
     "prettier": "^3.2.0",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
+    "react-leaflet": "^5.0.0",
     "storybook": "^8.4.0",
     "typescript": "^5.4.4",
     "vite": "^5.2.8",