@burdenoff/microfe-bigconsole 2026.805.3 → 2026.812.2

package/dist/bigconsole/components/widgets/list/ListItem.js

@@ -4,7 +4,7 @@ import { jsx as t, jsxs as n } from "react/jsx-runtime";
 function r(e) {
 	switch (e?.color) {
 		case "success": return "bg-status-success-bg/10 text-status-success-text";
-		case "warning": return "bg-status-warning-bg/10 text-status-warning-text";
+		case "warning": return "bg-status-warning-bg/10 text-[var(--color-status-warning-text)]";
 		case "error": return "bg-status-error-bg/10 text-status-error-text";
 		case "info": return "bg-action-primary-bg/10 text-action-primary-bg";
 		default: return "bg-bg-sunken text-text-secondary";

package/dist/bigconsole/components/widgets/list/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/list/ListItem.tsx"],"sourcesContent":["/**\n * ListItem Component\n *\n * Individual item in a list widget.\n */\n\nimport { type FC, memo, type ReactNode } from 'react';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ListItemData {\n  /** Unique identifier */\n  id: string;\n  /** Primary text */\n  title: string;\n  /** Secondary text */\n  subtitle?: string;\n  /** Additional metadata lines */\n  metadata?: Array<{\n    label: string;\n    value: string | number;\n  }>;\n  /** Badge/tag to display */\n  badge?: {\n    text: string;\n    color?: 'default' | 'success' | 'warning' | 'error' | 'info';\n  };\n  /** Icon or avatar */\n  icon?: ReactNode;\n  /** Value to display on the right */\n  value?: string | number;\n  /** Whether item is disabled */\n  disabled?: boolean;\n}\n\nexport interface ListItemProps {\n  /** Item data */\n  item: ListItemData;\n  /** Whether the item is clickable */\n  clickable?: boolean;\n  /** Click handler */\n  onClick?: () => void;\n  /** Whether to show divider */\n  showDivider?: boolean;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction getBadgeColor(badge: ListItemData['badge']): string {\n  const color = badge?.color;\n  switch (color) {\n    case 'success':\n      return 'bg-status-success-bg/10 text-status-success-text';\n    case 'warning':\n      return 'bg-status-warning-bg/10 text-status-warning-text';\n    case 'error':\n      return 'bg-status-error-bg/10 text-status-error-text';\n    case 'info':\n      return 'bg-action-primary-bg/10 text-action-primary-bg';\n    case 'default':\n    default:\n      return 'bg-bg-sunken text-text-secondary';\n  }\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ListItem: FC<ListItemProps> = memo(function ListItem({\n  item,\n  clickable = false,\n  onClick,\n  showDivider = true,\n}) {\n  const isClickable = clickable && !item.disabled;\n\n  return (\n    <div\n      className={`\n        flex items-start gap-3 p-3\n        ${showDivider ? 'border-b border-border-default' : ''}\n        ${isClickable ? 'cursor-pointer hover:bg-bg-sunken/50 transition-colors' : ''}\n        ${item.disabled ? 'opacity-50' : ''}\n      `}\n      onClick={() => {\n        if (isClickable && onClick) {\n          onClick();\n        }\n      }}\n      role={isClickable ? 'button' : undefined}\n      tabIndex={isClickable ? 0 : undefined}\n      onKeyDown={(e) => {\n        if (isClickable && onClick && (e.key === 'Enter' || e.key === ' ')) {\n          e.preventDefault();\n          onClick();\n        }\n      }}\n    >\n      {/* Icon/Avatar */}\n      {item.icon && (\n        <div className=\"flex-shrink-0 w-10 h-10 flex items-center justify-center rounded-full bg-bg-sunken text-text-secondary\">\n          {item.icon}\n        </div>\n      )}\n\n      {/* Content */}\n      <div className=\"flex-1 min-w-0\">\n        {/* Title row */}\n        <div className=\"flex items-start justify-between gap-2\">\n          <div className=\"flex-1 min-w-0\">\n            <h4 className=\"text-sm font-medium text-text-primary truncate\">{item.title}</h4>\n            {item.subtitle && <p className=\"text-xs text-text-secondary mt-0.5 line-clamp-2\">{item.subtitle}</p>}\n          </div>\n\n          {/* Value */}\n          {item.value !== undefined && (\n            <span className=\"flex-shrink-0 text-sm font-medium text-text-primary\">\n              {typeof item.value === 'number' ? new Intl.NumberFormat('en-US').format(item.value) : item.value}\n            </span>\n          )}\n        </div>\n\n        {/* Metadata */}\n        {item.metadata && item.metadata.length > 0 && (\n          <div className=\"flex flex-wrap gap-x-4 gap-y-1 mt-2\">\n            {item.metadata.map((meta, index) => (\n              <span key={index} className=\"text-xs text-text-secondary\">\n                <span className=\"text-text-secondary/70\">{meta.label}: </span>\n                <span className=\"font-medium\">{meta.value}</span>\n              </span>\n            ))}\n          </div>\n        )}\n\n        {/* Badge */}\n        {item.badge && (\n          <div className=\"mt-2\">\n            <span\n              className={`\n                inline-flex items-center\n                px-2 py-0.5\n                text-xs font-medium\n                rounded-full\n                ${getBadgeColor(item.badge)}\n              `}\n            >\n              {item.badge.text}\n            </span>\n          </div>\n        )}\n      </div>\n\n      {/* Chevron for clickable items */}\n      {isClickable && (\n        <div className=\"flex-shrink-0 self-center\">\n          <svg className=\"w-4 h-4 text-text-secondary\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n          </svg>\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default ListItem;\n"],"mappings":";;;AAoDA,SAAS,EAAc,GAAsC;AAE3D,SADc,GAAO,OACrB;EACE,KAAK,UACH,QAAO;EACT,KAAK,UACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,KAAK,OACH,QAAO;EAET,QACE,QAAO;;;AAQb,IAAa,IAA8B,EAAK,SAAkB,EAChE,SACA,eAAY,IACZ,YACA,iBAAc,MACb;CACD,IAAM,IAAc,KAAa,CAAC,EAAK;AAEvC,QACE,kBAAC,OAAD;EACE,WAAW;;UAEP,IAAc,mCAAmC,GAAG;UACpD,IAAc,2DAA2D,GAAG;UAC5E,EAAK,WAAW,eAAe,GAAG;;EAEtC,eAAe;AACb,GAAI,KAAe,KACjB,GAAS;;EAGb,MAAM,IAAc,WAAW,KAAA;EAC/B,UAAU,IAAc,IAAI,KAAA;EAC5B,YAAY,MAAM;AAChB,GAAI,KAAe,MAAY,EAAE,QAAQ,WAAW,EAAE,QAAQ,SAC5D,EAAE,gBAAgB,EAClB,GAAS;;YAjBf;GAsBG,EAAK,QACJ,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAK;IACF,CAAA;GAIR,kBAAC,OAAD;IAAK,WAAU;cAAf;KAEE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,MAAD;QAAI,WAAU;kBAAkD,EAAK;QAAW,CAAA,EAC/E,EAAK,YAAY,kBAAC,KAAD;QAAG,WAAU;kBAAmD,EAAK;QAAa,CAAA,CAChG;UAGL,EAAK,UAAU,KAAA,KACd,kBAAC,QAAD;OAAM,WAAU;iBACb,OAAO,EAAK,SAAU,WAAW,IAAI,KAAK,aAAa,QAAQ,CAAC,OAAO,EAAK,MAAM,GAAG,EAAK;OACtF,CAAA,CAEL;;KAGL,EAAK,YAAY,EAAK,SAAS,SAAS,KACvC,kBAAC,OAAD;MAAK,WAAU;gBACZ,EAAK,SAAS,KAAK,GAAM,MACxB,kBAAC,QAAD;OAAkB,WAAU;iBAA5B,CACE,kBAAC,QAAD;QAAM,WAAU;kBAAhB,CAA0C,EAAK,OAAM,KAAS;WAC9D,kBAAC,QAAD;QAAM,WAAU;kBAAe,EAAK;QAAa,CAAA,CAC5C;SAHI,EAGJ,CACP;MACE,CAAA;KAIP,EAAK,SACJ,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,QAAD;OACE,WAAW;;;;;kBAKP,EAAc,EAAK,MAAM,CAAC;;iBAG7B,EAAK,MAAM;OACP,CAAA;MACH,CAAA;KAEJ;;GAGL,KACC,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,OAAD;KAAK,WAAU;KAA8B,MAAK;KAAO,QAAO;KAAe,SAAQ;eACrF,kBAAC,QAAD;MAAM,eAAc;MAAQ,gBAAe;MAAQ,aAAa;MAAG,GAAE;MAAiB,CAAA;KAClF,CAAA;IACF,CAAA;GAEJ;;EAER"}
+{"version":3,"file":"ListItem.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/list/ListItem.tsx"],"sourcesContent":["/**\n * ListItem Component\n *\n * Individual item in a list widget.\n */\n\nimport { type FC, memo, type ReactNode } from 'react';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ListItemData {\n  /** Unique identifier */\n  id: string;\n  /** Primary text */\n  title: string;\n  /** Secondary text */\n  subtitle?: string;\n  /** Additional metadata lines */\n  metadata?: Array<{\n    label: string;\n    value: string | number;\n  }>;\n  /** Badge/tag to display */\n  badge?: {\n    text: string;\n    color?: 'default' | 'success' | 'warning' | 'error' | 'info';\n  };\n  /** Icon or avatar */\n  icon?: ReactNode;\n  /** Value to display on the right */\n  value?: string | number;\n  /** Whether item is disabled */\n  disabled?: boolean;\n}\n\nexport interface ListItemProps {\n  /** Item data */\n  item: ListItemData;\n  /** Whether the item is clickable */\n  clickable?: boolean;\n  /** Click handler */\n  onClick?: () => void;\n  /** Whether to show divider */\n  showDivider?: boolean;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction getBadgeColor(badge: ListItemData['badge']): string {\n  const color = badge?.color;\n  switch (color) {\n    case 'success':\n      return 'bg-status-success-bg/10 text-status-success-text';\n    case 'warning':\n      return 'bg-status-warning-bg/10 text-[var(--color-status-warning-text)]';\n    case 'error':\n      return 'bg-status-error-bg/10 text-status-error-text';\n    case 'info':\n      return 'bg-action-primary-bg/10 text-action-primary-bg';\n    case 'default':\n    default:\n      return 'bg-bg-sunken text-text-secondary';\n  }\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ListItem: FC<ListItemProps> = memo(function ListItem({\n  item,\n  clickable = false,\n  onClick,\n  showDivider = true,\n}) {\n  const isClickable = clickable && !item.disabled;\n\n  return (\n    <div\n      className={`\n        flex items-start gap-3 p-3\n        ${showDivider ? 'border-b border-border-default' : ''}\n        ${isClickable ? 'cursor-pointer hover:bg-bg-sunken/50 transition-colors' : ''}\n        ${item.disabled ? 'opacity-50' : ''}\n      `}\n      onClick={() => {\n        if (isClickable && onClick) {\n          onClick();\n        }\n      }}\n      role={isClickable ? 'button' : undefined}\n      tabIndex={isClickable ? 0 : undefined}\n      onKeyDown={(e) => {\n        if (isClickable && onClick && (e.key === 'Enter' || e.key === ' ')) {\n          e.preventDefault();\n          onClick();\n        }\n      }}\n    >\n      {/* Icon/Avatar */}\n      {item.icon && (\n        <div className=\"flex-shrink-0 w-10 h-10 flex items-center justify-center rounded-full bg-bg-sunken text-text-secondary\">\n          {item.icon}\n        </div>\n      )}\n\n      {/* Content */}\n      <div className=\"flex-1 min-w-0\">\n        {/* Title row */}\n        <div className=\"flex items-start justify-between gap-2\">\n          <div className=\"flex-1 min-w-0\">\n            <h4 className=\"text-sm font-medium text-text-primary truncate\">{item.title}</h4>\n            {item.subtitle && <p className=\"text-xs text-text-secondary mt-0.5 line-clamp-2\">{item.subtitle}</p>}\n          </div>\n\n          {/* Value */}\n          {item.value !== undefined && (\n            <span className=\"flex-shrink-0 text-sm font-medium text-text-primary\">\n              {typeof item.value === 'number' ? new Intl.NumberFormat('en-US').format(item.value) : item.value}\n            </span>\n          )}\n        </div>\n\n        {/* Metadata */}\n        {item.metadata && item.metadata.length > 0 && (\n          <div className=\"flex flex-wrap gap-x-4 gap-y-1 mt-2\">\n            {item.metadata.map((meta, index) => (\n              <span key={index} className=\"text-xs text-text-secondary\">\n                <span className=\"text-text-secondary/70\">{meta.label}: </span>\n                <span className=\"font-medium\">{meta.value}</span>\n              </span>\n            ))}\n          </div>\n        )}\n\n        {/* Badge */}\n        {item.badge && (\n          <div className=\"mt-2\">\n            <span\n              className={`\n                inline-flex items-center\n                px-2 py-0.5\n                text-xs font-medium\n                rounded-full\n                ${getBadgeColor(item.badge)}\n              `}\n            >\n              {item.badge.text}\n            </span>\n          </div>\n        )}\n      </div>\n\n      {/* Chevron for clickable items */}\n      {isClickable && (\n        <div className=\"flex-shrink-0 self-center\">\n          <svg className=\"w-4 h-4 text-text-secondary\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n          </svg>\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default ListItem;\n"],"mappings":";;;AAoDA,SAAS,EAAc,GAAsC;AAE3D,SADc,GAAO,OACrB;EACE,KAAK,UACH,QAAO;EACT,KAAK,UACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,KAAK,OACH,QAAO;EAET,QACE,QAAO;;;AAQb,IAAa,IAA8B,EAAK,SAAkB,EAChE,SACA,eAAY,IACZ,YACA,iBAAc,MACb;CACD,IAAM,IAAc,KAAa,CAAC,EAAK;AAEvC,QACE,kBAAC,OAAD;EACE,WAAW;;UAEP,IAAc,mCAAmC,GAAG;UACpD,IAAc,2DAA2D,GAAG;UAC5E,EAAK,WAAW,eAAe,GAAG;;EAEtC,eAAe;AACb,GAAI,KAAe,KACjB,GAAS;;EAGb,MAAM,IAAc,WAAW,KAAA;EAC/B,UAAU,IAAc,IAAI,KAAA;EAC5B,YAAY,MAAM;AAChB,GAAI,KAAe,MAAY,EAAE,QAAQ,WAAW,EAAE,QAAQ,SAC5D,EAAE,gBAAgB,EAClB,GAAS;;YAjBf;GAsBG,EAAK,QACJ,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAK;IACF,CAAA;GAIR,kBAAC,OAAD;IAAK,WAAU;cAAf;KAEE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,MAAD;QAAI,WAAU;kBAAkD,EAAK;QAAW,CAAA,EAC/E,EAAK,YAAY,kBAAC,KAAD;QAAG,WAAU;kBAAmD,EAAK;QAAa,CAAA,CAChG;UAGL,EAAK,UAAU,KAAA,KACd,kBAAC,QAAD;OAAM,WAAU;iBACb,OAAO,EAAK,SAAU,WAAW,IAAI,KAAK,aAAa,QAAQ,CAAC,OAAO,EAAK,MAAM,GAAG,EAAK;OACtF,CAAA,CAEL;;KAGL,EAAK,YAAY,EAAK,SAAS,SAAS,KACvC,kBAAC,OAAD;MAAK,WAAU;gBACZ,EAAK,SAAS,KAAK,GAAM,MACxB,kBAAC,QAAD;OAAkB,WAAU;iBAA5B,CACE,kBAAC,QAAD;QAAM,WAAU;kBAAhB,CAA0C,EAAK,OAAM,KAAS;WAC9D,kBAAC,QAAD;QAAM,WAAU;kBAAe,EAAK;QAAa,CAAA,CAC5C;SAHI,EAGJ,CACP;MACE,CAAA;KAIP,EAAK,SACJ,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,QAAD;OACE,WAAW;;;;;kBAKP,EAAc,EAAK,MAAM,CAAC;;iBAG7B,EAAK,MAAM;OACP,CAAA;MACH,CAAA;KAEJ;;GAGL,KACC,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,OAAD;KAAK,WAAU;KAA8B,MAAK;KAAO,QAAO;KAAe,SAAQ;eACrF,kBAAC,QAAD;MAAM,eAAc;MAAQ,gBAAe;MAAQ,aAAa;MAAG,GAAE;MAAiB,CAAA;KAClF,CAAA;IACF,CAAA;GAEJ;;EAER"}

package/dist/bigconsole/components/widgets/map-widget/MapWidget.js

@@ -210,7 +210,7 @@ var y = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 				children: /* @__PURE__ */ o("div", {
 					className: "text-center",
 					children: [/* @__PURE__ */ o("svg", {
-						className: "mx-auto mb-2 h-12 w-12 text-text-tertiary",
+						className: "mx-auto mb-2 h-12 w-12 text-text-muted",
 						fill: "none",
 						stroke: "currentColor",
 						viewBox: "0 0 24 24",

package/dist/bigconsole/components/widgets/map-widget/MapWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/map-widget/MapWidget.tsx"],"sourcesContent":["/**\n * MapWidget Component\n *\n * Interactive geographic map (Leaflet + OpenStreetMap tiles) with data-bound\n * markers. Leaflet's stylesheet is loaded from a CDN at runtime (with SRI) because\n * the build-time MFE library bundle does not ship a component's CSS to the host\n * shell — consistent with the map being an inherently online feature (tiles).\n */\n\nimport { type FC, memo, useEffect, useMemo, useRef, useState } from 'react';\nimport L from 'leaflet';\nimport type { Widget } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface MapWidgetProps {\n  widget: Widget;\n  data?: MapData;\n  onClick?: (marker: MapMarker) => void;\n  /** Drilldown handler - receives selected marker data */\n  onDrilldown?: (selectedData: Record<string, unknown>) => void;\n}\n\nexport interface MapMarker {\n  name: string;\n  lat: number;\n  lng: number;\n  value?: number;\n  popup?: string;\n  color?: string;\n}\n\n/** Minimal GeoJSON FeatureCollection shape (we only read geometry + properties). */\nexport interface GeoJsonFeatureCollection {\n  type: 'FeatureCollection';\n  features: Array<{\n    type: 'Feature';\n    id?: string | number;\n    properties?: Record<string, unknown> | null;\n    geometry: unknown;\n  }>;\n}\n\n/** A region value used to shade a choropleth (joined to a GeoJSON feature). */\nexport interface MapRegionValue {\n  /** Join key — matched against the feature's id field. */\n  id: string;\n  /** Numeric value driving the fill intensity. */\n  value: number;\n  /** Optional display name for the popup. */\n  name?: string;\n}\n\nexport interface MapData {\n  center?: { lat: number; lng: number };\n  zoom?: number;\n  markers?: MapMarker[];\n  /** GeoJSON regions for choropleth mode. */\n  geoJson?: GeoJsonFeatureCollection;\n  /** Per-region values joined to GeoJSON features for choropleth shading. */\n  regions?: MapRegionValue[];\n}\n\n// ============================================================================\n// Leaflet CSS (runtime CDN injection)\n// ============================================================================\n\nconst LEAFLET_CSS = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';\n// SRI for leaflet@1.9.4/dist/leaflet.css (immutable versioned URL) — guards against a CDN compromise.\nconst LEAFLET_CSS_SRI = 'sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=';\n\nlet leafletCssRequested = false;\n\nfunction ensureLeafletCss(): void {\n  // Module-level guard in addition to the DOM check so two MapWidgets mounting in\n  // the same tick can't both append the <link> before either lands in the DOM.\n  if (leafletCssRequested || document.getElementById('leaflet-css')) return;\n  leafletCssRequested = true;\n  const link = document.createElement('link');\n  link.id = 'leaflet-css';\n  link.rel = 'stylesheet';\n  link.href = LEAFLET_CSS;\n  link.integrity = LEAFLET_CSS_SRI;\n  link.crossOrigin = 'anonymous';\n  // Don't leak the current path (workspace/dashboard IDs) to the CDN.\n  link.referrerPolicy = 'no-referrer';\n  // Leaflet needs its stylesheet for correct tile/marker positioning. If the CDN\n  // is unreachable or the SRI check fails the load is otherwise silent, so warn and\n  // clear the guard/element to allow a later mount to retry.\n  link.onerror = () => {\n    console.warn('[bigconsole] Leaflet CSS failed to load; map styling may be broken.');\n    leafletCssRequested = false;\n    link.remove();\n  };\n  document.head.appendChild(link);\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nconst DEFAULT_MARKER_COLOR = 'var(--color-chart-1, #3b82f6)';\n\n/**\n * Marker colours come from widget data and are interpolated into an inline\n * `style` attribute, so restrict them to a safe character set (hex / rgb() /\n * hsl() / css var() / named colours). Anything outside that — or containing\n * style-breaking characters — falls back to the default token colour.\n */\nfunction safeColor(color: unknown): string {\n  // Marker data is untrusted: a parser can emit a non-string colour (e.g. a numeric\n  // status code) that slips past the lat/lng filter, so guard the type before trim().\n  if (typeof color !== 'string') return DEFAULT_MARKER_COLOR;\n  const trimmed = color.trim();\n  if (trimmed.length > 64) return DEFAULT_MARKER_COLOR;\n  if (/[;{}<>\"'\\\\]/.test(trimmed)) return DEFAULT_MARKER_COLOR;\n  // Block `url()` so a marker colour can't smuggle an exfiltration beacon\n  // (e.g. `url(//evil.com/pixel)`) through the otherwise-permissive char set.\n  if (/\\burl\\s*\\(/i.test(trimmed)) return DEFAULT_MARKER_COLOR;\n  // Allow `_` (custom-property names) and `/` (modern `rgb(r g b / a)` syntax);\n  // the dangerous-char guard above still blocks anything that could break out of\n  // the inline style.\n  if (!/^[#a-zA-Z0-9(),.%/_\\s-]+$/.test(trimmed)) return DEFAULT_MARKER_COLOR;\n  return trimmed;\n}\n\nfunction isFiniteNumber(v: unknown): v is number {\n  return typeof v === 'number' && Number.isFinite(v);\n}\n\n/**\n * Theme-safe cold→hot ramp for the heat-point layer: normalized intensity\n * (0–1) → info → warning → error status tokens, returned as `var()` refs.\n *\n * We deliberately pass the `var()` reference (not a resolved color): the map\n * uses Leaflet's default SVG renderer, where `fill` participates in the CSS\n * cascade, so the tokens resolve correctly AND stay live across theme toggles\n * (a resolved concrete color would go stale until the next data refresh). This\n * also matches the choropleth layer and avoids any per-marker `getComputedStyle`\n * lookup. (If the map ever opts into `preferCanvas`, pre-resolve these instead.)\n */\nfunction heatColor(norm: number): string {\n  if (norm >= 0.66) return 'var(--color-status-error)';\n  if (norm >= 0.33) return 'var(--color-status-warning)';\n  return 'var(--color-status-info)';\n}\n\n/**\n * Build a marker/region popup as DOM (a bold title + optional formatted value).\n * Uses textContent — never an HTML string — so marker-supplied text can't be\n * interpreted as markup. Shared by the pin and heat-point branches.\n */\nfunction buildMarkerPopup(marker: MapMarker): HTMLDivElement {\n  const popupEl = document.createElement('div');\n  const title = document.createElement('div');\n  title.style.fontWeight = '600';\n  title.textContent = marker.popup || marker.name || 'Location';\n  popupEl.appendChild(title);\n  if (isFiniteNumber(marker.value)) {\n    const val = document.createElement('div');\n    val.textContent = marker.value.toLocaleString();\n    popupEl.appendChild(val);\n  }\n  return popupEl;\n}\n\n/**\n * Normalize the bound widget data into markers + optional center/zoom. Accepts\n * the documented `{ markers, center, zoom }` shape, or a bare array of markers\n * (parser output), and drops any entry without valid coordinates.\n */\ninterface NormalizedMapData {\n  markers: MapMarker[];\n  /** Center explicitly supplied by the data payload — wins over markers. */\n  center?: { lat: number; lng: number };\n  /** Zoom explicitly supplied by the data payload. */\n  zoom?: number;\n  /** Center from widget config — a static fallback used only when there are no markers. */\n  fallbackCenter?: { lat: number; lng: number };\n  /** Zoom from widget config — fallback for the no-marker case. */\n  fallbackZoom?: number;\n  /** GeoJSON for choropleth mode. */\n  geoJson?: GeoJsonFeatureCollection;\n  /** region id → { value, name } map for choropleth shading. */\n  regionValues: Map<string, { value: number; name?: string }>;\n}\n\nfunction asLatLng(v: unknown): { lat: number; lng: number } | undefined {\n  const c = v as { lat?: unknown; lng?: unknown } | undefined;\n  return c && isFiniteNumber(c.lat) && isFiniteNumber(c.lng) ? { lat: c.lat, lng: c.lng } : undefined;\n}\n\nfunction normalizeMapData(data: MapData | MapMarker[] | undefined, config: Record<string, unknown>): NormalizedMapData {\n  // The widget may be handed either the documented { markers, center, zoom } shape\n  // or a bare marker array (parser output); narrow once so the rest is type-safe.\n  const payload: MapData | undefined = Array.isArray(data) ? undefined : data;\n  const rawMarkers: unknown = Array.isArray(data) ? data : data?.markers;\n  const markers: MapMarker[] = Array.isArray(rawMarkers)\n    ? (rawMarkers as MapMarker[]).filter((m) => m && isFiniteNumber(m.lat) && isFiniteNumber(m.lng))\n    : [];\n\n  // Choropleth inputs: GeoJSON (from data payload or config) + a region→value join.\n  const geoJson = (payload?.geoJson ?? (config.geoJson as GeoJsonFeatureCollection | undefined)) || undefined;\n  const regionIdField = (config.regionIdField as string) || 'id';\n  const regionValues = new Map<string, { value: number; name?: string }>();\n  const rawRegions: unknown = payload?.regions ?? config.regions;\n  if (Array.isArray(rawRegions)) {\n    for (const r of rawRegions as Array<Record<string, unknown>>) {\n      if (!r) continue;\n      const id = r[regionIdField] ?? r.id ?? r.region ?? r.code;\n      const value = r.value ?? r.count ?? r.total;\n      if (id != null && isFiniteNumber(value)) {\n        regionValues.set(String(id), { value, name: typeof r.name === 'string' ? r.name : undefined });\n      }\n    }\n  }\n\n  // Data-payload center/zoom are an explicit intent and win over markers. Config\n  // center/zoom (e.g. the WidgetRegistry default of {0,0}/2) are only a static\n  // fallback for marker-less maps — otherwise that default would pin every marker\n  // dataset to the world view instead of framing the markers.\n  return {\n    markers,\n    center: asLatLng(payload?.center),\n    zoom: isFiniteNumber(payload?.zoom) ? payload?.zoom : undefined,\n    fallbackCenter: asLatLng(config.center),\n    fallbackZoom: isFiniteNumber(config.zoom) ? (config.zoom as number) : undefined,\n    geoJson: geoJson && Array.isArray(geoJson.features) ? geoJson : undefined,\n    regionValues,\n  };\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const MapWidget: FC<MapWidgetProps> = memo(function MapWidget({ widget, data, onClick, onDrilldown }) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const mapRef = useRef<L.Map | null>(null);\n  // Signature of the last view we auto-framed to; lets us re-render markers on\n  // every data change without snapping the viewport back when the framing\n  // inputs (coords/center/zoom) are unchanged — e.g. a refetch of identical data.\n  const lastFrameSigRef = useRef<string | null>(null);\n  const [status, setStatus] = useState<'loading' | 'ready' | 'error'>('loading');\n\n  const config = useMemo(() => (widget?.config ?? {}) as Record<string, unknown>, [widget?.config]);\n  const showMarkers = config.showMarkers !== false;\n  // Heat-point density mode: render weighted, translucent circles whose overlap\n  // accumulates into a heat-like surface (dependency-free — no leaflet.heat).\n  const heatMode = config.mapMode === 'heat';\n  const regionIdField = (config.regionIdField as string) || 'id';\n  const { markers, center, zoom, fallbackCenter, fallbackZoom, geoJson, regionValues } = useMemo(\n    () => normalizeMapData(data, config),\n    [data, config]\n  );\n  const hasChoropleth = Boolean(geoJson && regionValues.size > 0);\n\n  // Keep the latest click handler in a ref so marker bindings don't need rebinding.\n  // Assign in an effect (not during render) per the React 19 useRef guidance.\n  const clickRef = useRef<(marker: MapMarker) => void>(() => undefined);\n  useEffect(() => {\n    clickRef.current = (marker: MapMarker) => {\n      if (onDrilldown) onDrilldown(marker as unknown as Record<string, unknown>);\n      else if (onClick) onClick(marker);\n    };\n  }, [onClick, onDrilldown]);\n\n  // Initialise the map once.\n  useEffect(() => {\n    const el = containerRef.current;\n    if (!el) return undefined;\n    ensureLeafletCss();\n\n    let map: L.Map;\n    try {\n      map = L.map(el, { center: [20, 0], zoom: 2, scrollWheelZoom: true, attributionControl: true });\n      const tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {\n        attribution: '© OpenStreetMap contributors',\n        maxZoom: 18,\n      });\n      // Leaflet reports tile failures asynchronously, so addTo() won't throw when\n      // tiles are blocked/offline. Surface the error overlay only if a tile errors\n      // before any tile has loaded (true offline/blocked), tolerating the odd\n      // transient miss once the base map is up.\n      let anyTileLoaded = false;\n      tiles.on('tileload', () => {\n        anyTileLoaded = true;\n        // Recover if an early tile miss had shown the offline overlay — a flaky\n        // connection that later succeeds shouldn't stay hidden behind it.\n        setStatus((s) => (s === 'error' ? 'ready' : s));\n      });\n      tiles.on('tileerror', () => {\n        if (!anyTileLoaded) setStatus('error');\n      });\n      tiles.addTo(map);\n      mapRef.current = map;\n      // Fresh map ⇒ force the next marker effect to (re)frame it. Without this the\n      // frame-signature ref would survive a remount (e.g. React StrictMode's\n      // double-invoke) and the new map would stay stuck at this init view.\n      lastFrameSigRef.current = null;\n      setStatus('ready');\n    } catch {\n      setStatus('error');\n      return undefined;\n    }\n\n    // Widgets live in a resizable grid; keep tiles correct as the box changes.\n    const ro =\n      typeof ResizeObserver !== 'undefined' ? new ResizeObserver(() => mapRef.current?.invalidateSize()) : undefined;\n    ro?.observe(el);\n    const t = window.setTimeout(() => map.invalidateSize(), 80);\n\n    return () => {\n      window.clearTimeout(t);\n      ro?.disconnect();\n      map.remove();\n      mapRef.current = null;\n    };\n  }, []);\n\n  // Render markers + frame the view whenever the data changes.\n  useEffect(() => {\n    const map = mapRef.current;\n    if (!map) return undefined;\n\n    const layer = L.layerGroup();\n\n    // Choropleth: shade GeoJSON regions by a single-hue intensity ramp (the\n    // semantic `info` token at varying opacity) joined on the region id field.\n    let geoLayer: L.GeoJSON | null = null;\n    if (geoJson && regionValues.size > 0) {\n      const vals = Array.from(regionValues.values()).map((v) => v.value);\n      const min = Math.min(...vals);\n      const max = Math.max(...vals);\n      const span = max - min || 1;\n      const FILL = 'var(--color-status-info, #3b82f6)';\n\n      const lookup = (feature: { id?: string | number; properties?: Record<string, unknown> | null }) => {\n        const props = feature.properties ?? {};\n        const joinId = feature.id ?? props[regionIdField] ?? props.id ?? props.code;\n        return joinId != null ? regionValues.get(String(joinId)) : undefined;\n      };\n\n      geoLayer = L.geoJSON(geoJson as unknown as Parameters<typeof L.geoJSON>[0], {\n        style: (feature) => {\n          const hit = feature ? lookup(feature) : undefined;\n          const norm = hit ? (hit.value - min) / span : 0;\n          return {\n            fillColor: FILL,\n            fillOpacity: hit ? 0.2 + norm * 0.65 : 0.05,\n            color: 'var(--color-border-default, #cbd5e1)',\n            weight: 1,\n          };\n        },\n        onEachFeature: (feature, lyr) => {\n          const hit = lookup(feature);\n          const name =\n            hit?.name ??\n            (typeof feature.properties?.name === 'string' ? (feature.properties.name as string) : undefined) ??\n            String(feature.id ?? '');\n          const popupEl = document.createElement('div');\n          const title = document.createElement('div');\n          title.style.fontWeight = '600';\n          title.textContent = name || 'Region';\n          popupEl.appendChild(title);\n          if (hit) {\n            const val = document.createElement('div');\n            val.textContent = hit.value.toLocaleString();\n            popupEl.appendChild(val);\n          }\n          lyr.bindPopup(popupEl);\n          lyr.on('click', () => clickRef.current({ name, lat: NaN, lng: NaN, value: hit?.value } as MapMarker));\n        },\n      });\n      geoLayer.addTo(layer);\n    }\n\n    if (showMarkers && heatMode) {\n      // Heat-point layer: translucent weighted circles, sized + colored by value.\n      const weights = markers.map((mk) => (isFiniteNumber(mk.value) ? mk.value : 1));\n      // reduce, not Math.min(...spread) — spreading a large array as args can\n      // blow the call-stack (RangeError) for big datasets.\n      const minW = weights.reduce((a, b) => Math.min(a, b), Infinity);\n      const maxW = weights.reduce((a, b) => Math.max(a, b), -Infinity);\n      const spanW = maxW - minW || 1;\n      markers.forEach((marker, i) => {\n        const norm = (weights[i] - minW) / spanW;\n        const circle = L.circleMarker([marker.lat, marker.lng], {\n          radius: 10 + norm * 22,\n          fillColor: heatColor(norm),\n          // Both radius and opacity ramp with intensity for a truer density look.\n          fillOpacity: 0.25 + norm * 0.35,\n          stroke: false,\n        }).addTo(layer);\n        circle.bindPopup(buildMarkerPopup(marker));\n        circle.on('click', () => clickRef.current(marker));\n      });\n    } else if (showMarkers) {\n      for (const marker of markers) {\n        // Build the pin as a DOM element (not an HTML string) so the marker colour\n        // is assigned via the style API and can never be interpreted as markup —\n        // defense-in-depth alongside safeColor().\n        const pin = document.createElement('div');\n        Object.assign(pin.style, {\n          width: '14px',\n          height: '14px',\n          borderRadius: '50% 50% 50% 0',\n          transform: 'rotate(-45deg)',\n          background: safeColor(marker.color),\n          border: '2px solid #fff',\n          boxShadow: '0 1px 4px rgba(0,0,0,.4)',\n        });\n        const icon = L.divIcon({\n          className: 'bc-map-marker',\n          html: pin,\n          iconSize: [14, 14],\n          iconAnchor: [7, 14],\n        });\n        const m = L.marker([marker.lat, marker.lng], { icon }).addTo(layer);\n        m.bindPopup(buildMarkerPopup(marker));\n        m.on('click', () => clickRef.current(marker));\n      }\n    }\n    layer.addTo(map);\n\n    // Only (re)frame the view when the framing inputs actually change — otherwise\n    // a data-prop reference change (e.g. a refetch returning identical markers)\n    // would discard the user's current pan/zoom.\n    const frameSig = JSON.stringify({\n      m: markers.map((mk) => [mk.lat, mk.lng]),\n      c: center ? [center.lat, center.lng] : null,\n      z: zoom ?? null,\n      fc: fallbackCenter ? [fallbackCenter.lat, fallbackCenter.lng] : null,\n      fz: fallbackZoom ?? null,\n      g: geoJson ? regionValues.size : 0,\n    });\n    if (frameSig !== lastFrameSigRef.current) {\n      lastFrameSigRef.current = frameSig;\n      // Framing priority: data-payload center → frame the markers → frame the\n      // choropleth regions → config fallback center → zoom only → world view.\n      // Markers/regions win over the config default so a palette-created map frames\n      // its data instead of {0,0}.\n      if (center) {\n        map.setView([center.lat, center.lng], zoom ?? map.getZoom());\n      } else if (!markers.length && geoLayer) {\n        const b = geoLayer.getBounds();\n        if (b.isValid()) map.fitBounds(b, { padding: [24, 24], maxZoom: 12 });\n      } else if (markers.length === 1) {\n        map.setView([markers[0].lat, markers[0].lng], zoom ?? 8);\n      } else if (markers.length > 1) {\n        const bounds = L.latLngBounds(markers.map((m) => [m.lat, m.lng] as [number, number]));\n        map.fitBounds(bounds, { padding: [32, 32], maxZoom: 12 });\n      } else if (fallbackCenter) {\n        map.setView([fallbackCenter.lat, fallbackCenter.lng], zoom ?? fallbackZoom ?? map.getZoom());\n      } else if (isFiniteNumber(zoom ?? fallbackZoom)) {\n        map.setZoom((zoom ?? fallbackZoom) as number);\n      }\n    }\n\n    const resize = window.setTimeout(() => map.invalidateSize(), 0);\n\n    return () => {\n      window.clearTimeout(resize);\n      layer.remove();\n    };\n  }, [\n    markers,\n    center,\n    zoom,\n    fallbackCenter,\n    fallbackZoom,\n    showMarkers,\n    heatMode,\n    geoJson,\n    regionValues,\n    regionIdField,\n  ]);\n\n  return (\n    <div className=\"relative h-full w-full overflow-hidden rounded-lg bg-bg-sunken\">\n      <div ref={containerRef} className=\"h-full w-full\" />\n\n      {status !== 'error' && markers.length === 0 && !hasChoropleth && (\n        <div className=\"pointer-events-none absolute inset-0 z-[500] flex items-center justify-center bg-bg-sunken/70 text-sm text-text-secondary\">\n          <div className=\"text-center\">\n            <svg\n              className=\"mx-auto mb-2 h-12 w-12 text-text-tertiary\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={1.5}\n                d=\"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z\"\n              />\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={1.5}\n                d=\"M15 11a3 3 0 11-6 0 3 3 0 016 0z\"\n              />\n            </svg>\n            <p>No map data</p>\n          </div>\n        </div>\n      )}\n\n      {status === 'error' && (\n        <div className=\"absolute inset-0 z-[500] flex items-center justify-center bg-bg-sunken px-4 text-center text-sm text-text-secondary\">\n          The map needs an internet connection and couldn’t load.\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default MapWidget;\n"],"mappings":"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"}
+{"version":3,"file":"MapWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/map-widget/MapWidget.tsx"],"sourcesContent":["/**\n * MapWidget Component\n *\n * Interactive geographic map (Leaflet + OpenStreetMap tiles) with data-bound\n * markers. Leaflet's stylesheet is loaded from a CDN at runtime (with SRI) because\n * the build-time MFE library bundle does not ship a component's CSS to the host\n * shell — consistent with the map being an inherently online feature (tiles).\n */\n\nimport { type FC, memo, useEffect, useMemo, useRef, useState } from 'react';\nimport L from 'leaflet';\nimport type { Widget } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface MapWidgetProps {\n  widget: Widget;\n  data?: MapData;\n  onClick?: (marker: MapMarker) => void;\n  /** Drilldown handler - receives selected marker data */\n  onDrilldown?: (selectedData: Record<string, unknown>) => void;\n}\n\nexport interface MapMarker {\n  name: string;\n  lat: number;\n  lng: number;\n  value?: number;\n  popup?: string;\n  color?: string;\n}\n\n/** Minimal GeoJSON FeatureCollection shape (we only read geometry + properties). */\nexport interface GeoJsonFeatureCollection {\n  type: 'FeatureCollection';\n  features: Array<{\n    type: 'Feature';\n    id?: string | number;\n    properties?: Record<string, unknown> | null;\n    geometry: unknown;\n  }>;\n}\n\n/** A region value used to shade a choropleth (joined to a GeoJSON feature). */\nexport interface MapRegionValue {\n  /** Join key — matched against the feature's id field. */\n  id: string;\n  /** Numeric value driving the fill intensity. */\n  value: number;\n  /** Optional display name for the popup. */\n  name?: string;\n}\n\nexport interface MapData {\n  center?: { lat: number; lng: number };\n  zoom?: number;\n  markers?: MapMarker[];\n  /** GeoJSON regions for choropleth mode. */\n  geoJson?: GeoJsonFeatureCollection;\n  /** Per-region values joined to GeoJSON features for choropleth shading. */\n  regions?: MapRegionValue[];\n}\n\n// ============================================================================\n// Leaflet CSS (runtime CDN injection)\n// ============================================================================\n\nconst LEAFLET_CSS = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';\n// SRI for leaflet@1.9.4/dist/leaflet.css (immutable versioned URL) — guards against a CDN compromise.\nconst LEAFLET_CSS_SRI = 'sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=';\n\nlet leafletCssRequested = false;\n\nfunction ensureLeafletCss(): void {\n  // Module-level guard in addition to the DOM check so two MapWidgets mounting in\n  // the same tick can't both append the <link> before either lands in the DOM.\n  if (leafletCssRequested || document.getElementById('leaflet-css')) return;\n  leafletCssRequested = true;\n  const link = document.createElement('link');\n  link.id = 'leaflet-css';\n  link.rel = 'stylesheet';\n  link.href = LEAFLET_CSS;\n  link.integrity = LEAFLET_CSS_SRI;\n  link.crossOrigin = 'anonymous';\n  // Don't leak the current path (workspace/dashboard IDs) to the CDN.\n  link.referrerPolicy = 'no-referrer';\n  // Leaflet needs its stylesheet for correct tile/marker positioning. If the CDN\n  // is unreachable or the SRI check fails the load is otherwise silent, so warn and\n  // clear the guard/element to allow a later mount to retry.\n  link.onerror = () => {\n    console.warn('[bigconsole] Leaflet CSS failed to load; map styling may be broken.');\n    leafletCssRequested = false;\n    link.remove();\n  };\n  document.head.appendChild(link);\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nconst DEFAULT_MARKER_COLOR = 'var(--color-chart-1, #3b82f6)';\n\n/**\n * Marker colours come from widget data and are interpolated into an inline\n * `style` attribute, so restrict them to a safe character set (hex / rgb() /\n * hsl() / css var() / named colours). Anything outside that — or containing\n * style-breaking characters — falls back to the default token colour.\n */\nfunction safeColor(color: unknown): string {\n  // Marker data is untrusted: a parser can emit a non-string colour (e.g. a numeric\n  // status code) that slips past the lat/lng filter, so guard the type before trim().\n  if (typeof color !== 'string') return DEFAULT_MARKER_COLOR;\n  const trimmed = color.trim();\n  if (trimmed.length > 64) return DEFAULT_MARKER_COLOR;\n  if (/[;{}<>\"'\\\\]/.test(trimmed)) return DEFAULT_MARKER_COLOR;\n  // Block `url()` so a marker colour can't smuggle an exfiltration beacon\n  // (e.g. `url(//evil.com/pixel)`) through the otherwise-permissive char set.\n  if (/\\burl\\s*\\(/i.test(trimmed)) return DEFAULT_MARKER_COLOR;\n  // Allow `_` (custom-property names) and `/` (modern `rgb(r g b / a)` syntax);\n  // the dangerous-char guard above still blocks anything that could break out of\n  // the inline style.\n  if (!/^[#a-zA-Z0-9(),.%/_\\s-]+$/.test(trimmed)) return DEFAULT_MARKER_COLOR;\n  return trimmed;\n}\n\nfunction isFiniteNumber(v: unknown): v is number {\n  return typeof v === 'number' && Number.isFinite(v);\n}\n\n/**\n * Theme-safe cold→hot ramp for the heat-point layer: normalized intensity\n * (0–1) → info → warning → error status tokens, returned as `var()` refs.\n *\n * We deliberately pass the `var()` reference (not a resolved color): the map\n * uses Leaflet's default SVG renderer, where `fill` participates in the CSS\n * cascade, so the tokens resolve correctly AND stay live across theme toggles\n * (a resolved concrete color would go stale until the next data refresh). This\n * also matches the choropleth layer and avoids any per-marker `getComputedStyle`\n * lookup. (If the map ever opts into `preferCanvas`, pre-resolve these instead.)\n */\nfunction heatColor(norm: number): string {\n  if (norm >= 0.66) return 'var(--color-status-error)';\n  if (norm >= 0.33) return 'var(--color-status-warning)';\n  return 'var(--color-status-info)';\n}\n\n/**\n * Build a marker/region popup as DOM (a bold title + optional formatted value).\n * Uses textContent — never an HTML string — so marker-supplied text can't be\n * interpreted as markup. Shared by the pin and heat-point branches.\n */\nfunction buildMarkerPopup(marker: MapMarker): HTMLDivElement {\n  const popupEl = document.createElement('div');\n  const title = document.createElement('div');\n  title.style.fontWeight = '600';\n  title.textContent = marker.popup || marker.name || 'Location';\n  popupEl.appendChild(title);\n  if (isFiniteNumber(marker.value)) {\n    const val = document.createElement('div');\n    val.textContent = marker.value.toLocaleString();\n    popupEl.appendChild(val);\n  }\n  return popupEl;\n}\n\n/**\n * Normalize the bound widget data into markers + optional center/zoom. Accepts\n * the documented `{ markers, center, zoom }` shape, or a bare array of markers\n * (parser output), and drops any entry without valid coordinates.\n */\ninterface NormalizedMapData {\n  markers: MapMarker[];\n  /** Center explicitly supplied by the data payload — wins over markers. */\n  center?: { lat: number; lng: number };\n  /** Zoom explicitly supplied by the data payload. */\n  zoom?: number;\n  /** Center from widget config — a static fallback used only when there are no markers. */\n  fallbackCenter?: { lat: number; lng: number };\n  /** Zoom from widget config — fallback for the no-marker case. */\n  fallbackZoom?: number;\n  /** GeoJSON for choropleth mode. */\n  geoJson?: GeoJsonFeatureCollection;\n  /** region id → { value, name } map for choropleth shading. */\n  regionValues: Map<string, { value: number; name?: string }>;\n}\n\nfunction asLatLng(v: unknown): { lat: number; lng: number } | undefined {\n  const c = v as { lat?: unknown; lng?: unknown } | undefined;\n  return c && isFiniteNumber(c.lat) && isFiniteNumber(c.lng) ? { lat: c.lat, lng: c.lng } : undefined;\n}\n\nfunction normalizeMapData(data: MapData | MapMarker[] | undefined, config: Record<string, unknown>): NormalizedMapData {\n  // The widget may be handed either the documented { markers, center, zoom } shape\n  // or a bare marker array (parser output); narrow once so the rest is type-safe.\n  const payload: MapData | undefined = Array.isArray(data) ? undefined : data;\n  const rawMarkers: unknown = Array.isArray(data) ? data : data?.markers;\n  const markers: MapMarker[] = Array.isArray(rawMarkers)\n    ? (rawMarkers as MapMarker[]).filter((m) => m && isFiniteNumber(m.lat) && isFiniteNumber(m.lng))\n    : [];\n\n  // Choropleth inputs: GeoJSON (from data payload or config) + a region→value join.\n  const geoJson = (payload?.geoJson ?? (config.geoJson as GeoJsonFeatureCollection | undefined)) || undefined;\n  const regionIdField = (config.regionIdField as string) || 'id';\n  const regionValues = new Map<string, { value: number; name?: string }>();\n  const rawRegions: unknown = payload?.regions ?? config.regions;\n  if (Array.isArray(rawRegions)) {\n    for (const r of rawRegions as Array<Record<string, unknown>>) {\n      if (!r) continue;\n      const id = r[regionIdField] ?? r.id ?? r.region ?? r.code;\n      const value = r.value ?? r.count ?? r.total;\n      if (id != null && isFiniteNumber(value)) {\n        regionValues.set(String(id), { value, name: typeof r.name === 'string' ? r.name : undefined });\n      }\n    }\n  }\n\n  // Data-payload center/zoom are an explicit intent and win over markers. Config\n  // center/zoom (e.g. the WidgetRegistry default of {0,0}/2) are only a static\n  // fallback for marker-less maps — otherwise that default would pin every marker\n  // dataset to the world view instead of framing the markers.\n  return {\n    markers,\n    center: asLatLng(payload?.center),\n    zoom: isFiniteNumber(payload?.zoom) ? payload?.zoom : undefined,\n    fallbackCenter: asLatLng(config.center),\n    fallbackZoom: isFiniteNumber(config.zoom) ? (config.zoom as number) : undefined,\n    geoJson: geoJson && Array.isArray(geoJson.features) ? geoJson : undefined,\n    regionValues,\n  };\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const MapWidget: FC<MapWidgetProps> = memo(function MapWidget({ widget, data, onClick, onDrilldown }) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const mapRef = useRef<L.Map | null>(null);\n  // Signature of the last view we auto-framed to; lets us re-render markers on\n  // every data change without snapping the viewport back when the framing\n  // inputs (coords/center/zoom) are unchanged — e.g. a refetch of identical data.\n  const lastFrameSigRef = useRef<string | null>(null);\n  const [status, setStatus] = useState<'loading' | 'ready' | 'error'>('loading');\n\n  const config = useMemo(() => (widget?.config ?? {}) as Record<string, unknown>, [widget?.config]);\n  const showMarkers = config.showMarkers !== false;\n  // Heat-point density mode: render weighted, translucent circles whose overlap\n  // accumulates into a heat-like surface (dependency-free — no leaflet.heat).\n  const heatMode = config.mapMode === 'heat';\n  const regionIdField = (config.regionIdField as string) || 'id';\n  const { markers, center, zoom, fallbackCenter, fallbackZoom, geoJson, regionValues } = useMemo(\n    () => normalizeMapData(data, config),\n    [data, config]\n  );\n  const hasChoropleth = Boolean(geoJson && regionValues.size > 0);\n\n  // Keep the latest click handler in a ref so marker bindings don't need rebinding.\n  // Assign in an effect (not during render) per the React 19 useRef guidance.\n  const clickRef = useRef<(marker: MapMarker) => void>(() => undefined);\n  useEffect(() => {\n    clickRef.current = (marker: MapMarker) => {\n      if (onDrilldown) onDrilldown(marker as unknown as Record<string, unknown>);\n      else if (onClick) onClick(marker);\n    };\n  }, [onClick, onDrilldown]);\n\n  // Initialise the map once.\n  useEffect(() => {\n    const el = containerRef.current;\n    if (!el) return undefined;\n    ensureLeafletCss();\n\n    let map: L.Map;\n    try {\n      map = L.map(el, { center: [20, 0], zoom: 2, scrollWheelZoom: true, attributionControl: true });\n      const tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {\n        attribution: '© OpenStreetMap contributors',\n        maxZoom: 18,\n      });\n      // Leaflet reports tile failures asynchronously, so addTo() won't throw when\n      // tiles are blocked/offline. Surface the error overlay only if a tile errors\n      // before any tile has loaded (true offline/blocked), tolerating the odd\n      // transient miss once the base map is up.\n      let anyTileLoaded = false;\n      tiles.on('tileload', () => {\n        anyTileLoaded = true;\n        // Recover if an early tile miss had shown the offline overlay — a flaky\n        // connection that later succeeds shouldn't stay hidden behind it.\n        setStatus((s) => (s === 'error' ? 'ready' : s));\n      });\n      tiles.on('tileerror', () => {\n        if (!anyTileLoaded) setStatus('error');\n      });\n      tiles.addTo(map);\n      mapRef.current = map;\n      // Fresh map ⇒ force the next marker effect to (re)frame it. Without this the\n      // frame-signature ref would survive a remount (e.g. React StrictMode's\n      // double-invoke) and the new map would stay stuck at this init view.\n      lastFrameSigRef.current = null;\n      setStatus('ready');\n    } catch {\n      setStatus('error');\n      return undefined;\n    }\n\n    // Widgets live in a resizable grid; keep tiles correct as the box changes.\n    const ro =\n      typeof ResizeObserver !== 'undefined' ? new ResizeObserver(() => mapRef.current?.invalidateSize()) : undefined;\n    ro?.observe(el);\n    const t = window.setTimeout(() => map.invalidateSize(), 80);\n\n    return () => {\n      window.clearTimeout(t);\n      ro?.disconnect();\n      map.remove();\n      mapRef.current = null;\n    };\n  }, []);\n\n  // Render markers + frame the view whenever the data changes.\n  useEffect(() => {\n    const map = mapRef.current;\n    if (!map) return undefined;\n\n    const layer = L.layerGroup();\n\n    // Choropleth: shade GeoJSON regions by a single-hue intensity ramp (the\n    // semantic `info` token at varying opacity) joined on the region id field.\n    let geoLayer: L.GeoJSON | null = null;\n    if (geoJson && regionValues.size > 0) {\n      const vals = Array.from(regionValues.values()).map((v) => v.value);\n      const min = Math.min(...vals);\n      const max = Math.max(...vals);\n      const span = max - min || 1;\n      const FILL = 'var(--color-status-info, #3b82f6)';\n\n      const lookup = (feature: { id?: string | number; properties?: Record<string, unknown> | null }) => {\n        const props = feature.properties ?? {};\n        const joinId = feature.id ?? props[regionIdField] ?? props.id ?? props.code;\n        return joinId != null ? regionValues.get(String(joinId)) : undefined;\n      };\n\n      geoLayer = L.geoJSON(geoJson as unknown as Parameters<typeof L.geoJSON>[0], {\n        style: (feature) => {\n          const hit = feature ? lookup(feature) : undefined;\n          const norm = hit ? (hit.value - min) / span : 0;\n          return {\n            fillColor: FILL,\n            fillOpacity: hit ? 0.2 + norm * 0.65 : 0.05,\n            color: 'var(--color-border-default, #cbd5e1)',\n            weight: 1,\n          };\n        },\n        onEachFeature: (feature, lyr) => {\n          const hit = lookup(feature);\n          const name =\n            hit?.name ??\n            (typeof feature.properties?.name === 'string' ? (feature.properties.name as string) : undefined) ??\n            String(feature.id ?? '');\n          const popupEl = document.createElement('div');\n          const title = document.createElement('div');\n          title.style.fontWeight = '600';\n          title.textContent = name || 'Region';\n          popupEl.appendChild(title);\n          if (hit) {\n            const val = document.createElement('div');\n            val.textContent = hit.value.toLocaleString();\n            popupEl.appendChild(val);\n          }\n          lyr.bindPopup(popupEl);\n          lyr.on('click', () => clickRef.current({ name, lat: NaN, lng: NaN, value: hit?.value } as MapMarker));\n        },\n      });\n      geoLayer.addTo(layer);\n    }\n\n    if (showMarkers && heatMode) {\n      // Heat-point layer: translucent weighted circles, sized + colored by value.\n      const weights = markers.map((mk) => (isFiniteNumber(mk.value) ? mk.value : 1));\n      // reduce, not Math.min(...spread) — spreading a large array as args can\n      // blow the call-stack (RangeError) for big datasets.\n      const minW = weights.reduce((a, b) => Math.min(a, b), Infinity);\n      const maxW = weights.reduce((a, b) => Math.max(a, b), -Infinity);\n      const spanW = maxW - minW || 1;\n      markers.forEach((marker, i) => {\n        const norm = (weights[i] - minW) / spanW;\n        const circle = L.circleMarker([marker.lat, marker.lng], {\n          radius: 10 + norm * 22,\n          fillColor: heatColor(norm),\n          // Both radius and opacity ramp with intensity for a truer density look.\n          fillOpacity: 0.25 + norm * 0.35,\n          stroke: false,\n        }).addTo(layer);\n        circle.bindPopup(buildMarkerPopup(marker));\n        circle.on('click', () => clickRef.current(marker));\n      });\n    } else if (showMarkers) {\n      for (const marker of markers) {\n        // Build the pin as a DOM element (not an HTML string) so the marker colour\n        // is assigned via the style API and can never be interpreted as markup —\n        // defense-in-depth alongside safeColor().\n        const pin = document.createElement('div');\n        Object.assign(pin.style, {\n          width: '14px',\n          height: '14px',\n          borderRadius: '50% 50% 50% 0',\n          transform: 'rotate(-45deg)',\n          background: safeColor(marker.color),\n          border: '2px solid #fff',\n          boxShadow: '0 1px 4px rgba(0,0,0,.4)',\n        });\n        const icon = L.divIcon({\n          className: 'bc-map-marker',\n          html: pin,\n          iconSize: [14, 14],\n          iconAnchor: [7, 14],\n        });\n        const m = L.marker([marker.lat, marker.lng], { icon }).addTo(layer);\n        m.bindPopup(buildMarkerPopup(marker));\n        m.on('click', () => clickRef.current(marker));\n      }\n    }\n    layer.addTo(map);\n\n    // Only (re)frame the view when the framing inputs actually change — otherwise\n    // a data-prop reference change (e.g. a refetch returning identical markers)\n    // would discard the user's current pan/zoom.\n    const frameSig = JSON.stringify({\n      m: markers.map((mk) => [mk.lat, mk.lng]),\n      c: center ? [center.lat, center.lng] : null,\n      z: zoom ?? null,\n      fc: fallbackCenter ? [fallbackCenter.lat, fallbackCenter.lng] : null,\n      fz: fallbackZoom ?? null,\n      g: geoJson ? regionValues.size : 0,\n    });\n    if (frameSig !== lastFrameSigRef.current) {\n      lastFrameSigRef.current = frameSig;\n      // Framing priority: data-payload center → frame the markers → frame the\n      // choropleth regions → config fallback center → zoom only → world view.\n      // Markers/regions win over the config default so a palette-created map frames\n      // its data instead of {0,0}.\n      if (center) {\n        map.setView([center.lat, center.lng], zoom ?? map.getZoom());\n      } else if (!markers.length && geoLayer) {\n        const b = geoLayer.getBounds();\n        if (b.isValid()) map.fitBounds(b, { padding: [24, 24], maxZoom: 12 });\n      } else if (markers.length === 1) {\n        map.setView([markers[0].lat, markers[0].lng], zoom ?? 8);\n      } else if (markers.length > 1) {\n        const bounds = L.latLngBounds(markers.map((m) => [m.lat, m.lng] as [number, number]));\n        map.fitBounds(bounds, { padding: [32, 32], maxZoom: 12 });\n      } else if (fallbackCenter) {\n        map.setView([fallbackCenter.lat, fallbackCenter.lng], zoom ?? fallbackZoom ?? map.getZoom());\n      } else if (isFiniteNumber(zoom ?? fallbackZoom)) {\n        map.setZoom((zoom ?? fallbackZoom) as number);\n      }\n    }\n\n    const resize = window.setTimeout(() => map.invalidateSize(), 0);\n\n    return () => {\n      window.clearTimeout(resize);\n      layer.remove();\n    };\n  }, [\n    markers,\n    center,\n    zoom,\n    fallbackCenter,\n    fallbackZoom,\n    showMarkers,\n    heatMode,\n    geoJson,\n    regionValues,\n    regionIdField,\n  ]);\n\n  return (\n    <div className=\"relative h-full w-full overflow-hidden rounded-lg bg-bg-sunken\">\n      <div ref={containerRef} className=\"h-full w-full\" />\n\n      {status !== 'error' && markers.length === 0 && !hasChoropleth && (\n        <div className=\"pointer-events-none absolute inset-0 z-[500] flex items-center justify-center bg-bg-sunken/70 text-sm text-text-secondary\">\n          <div className=\"text-center\">\n            <svg\n              className=\"mx-auto mb-2 h-12 w-12 text-text-muted\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={1.5}\n                d=\"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z\"\n              />\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={1.5}\n                d=\"M15 11a3 3 0 11-6 0 3 3 0 016 0z\"\n              />\n            </svg>\n            <p>No map data</p>\n          </div>\n        </div>\n      )}\n\n      {status === 'error' && (\n        <div className=\"absolute inset-0 z-[500] flex items-center justify-center bg-bg-sunken px-4 text-center text-sm text-text-secondary\">\n          The map needs an internet connection and couldn’t load.\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default MapWidget;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/metric-card/MetricCardConfig.js

@@ -10,7 +10,7 @@ var a = e(function({ config: e, onChange: a }) {
 		});
 	}, [e, a]);
 	return /* @__PURE__ */ i("div", {
-		className: "space-y-4",
+		className: "min-w-0 space-y-form-gap",
 		children: [
 			/* @__PURE__ */ i("div", { children: [
 				/* @__PURE__ */ r("label", {
@@ -43,10 +43,14 @@ var a = e(function({ config: e, onChange: a }) {
 				className: "block text-sm font-medium text-text-primary mb-1",
 				children: o("bigconsole.widget.config.metricCard.format.label", "Value Format")
 			}), /* @__PURE__ */ i("select", {
-				value: e.format || "number",
+				value: e.format || "auto",
 				onChange: (e) => s("format", e.target.value),
 				className: "\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            ",
 				children: [
+					/* @__PURE__ */ r("option", {
+						value: "auto",
+						children: o("bigconsole.widget.config.metricCard.format.auto", "Auto (from data)")
+					}),
 					/* @__PURE__ */ r("option", {
 						value: "number",
 						children: o("bigconsole.widget.config.metricCard.format.number", "Number")
@@ -66,7 +70,7 @@ var a = e(function({ config: e, onChange: a }) {
 				]
 			})] }),
 			/* @__PURE__ */ i("div", {
-				className: "grid grid-cols-2 gap-3",
+				className: "grid grid-cols-1 gap-3 sm:grid-cols-2",
 				children: [/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("label", {
 					className: "block text-sm font-medium text-text-primary mb-1",
 					children: o("bigconsole.widget.config.metricCard.prefix.label", "Prefix")
@@ -98,8 +102,14 @@ var a = e(function({ config: e, onChange: a }) {
 				className: "\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            "
 			})] }),
 			/* @__PURE__ */ i("div", {
-				className: "space-y-3",
+				role: "group",
+				"aria-label": "Display options",
+				className: "space-y-3 border-t border-[var(--color-border-subtle)] pt-form-gap",
 				children: [
+					/* @__PURE__ */ r("p", {
+						className: "text-xs font-bold uppercase tracking-wider text-text-secondary",
+						children: "Display options"
+					}),
 					/* @__PURE__ */ i("label", {
 						className: "flex items-center gap-3",
 						children: [/* @__PURE__ */ r("input", {

package/dist/bigconsole/components/widgets/metric-card/MetricCardConfig.js.map

@@ -1 +1 @@
-{"version":3,"file":"MetricCardConfig.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/metric-card/MetricCardConfig.tsx"],"sourcesContent":["/**\n * MetricCardConfig Component\n *\n * Configuration panel for MetricCard widgets.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { MetricCardConfig as ConfigType } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface MetricCardConfigProps {\n  /** Current configuration */\n  config: ConfigType;\n  /** Callback when config changes */\n  onChange: (config: ConfigType) => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const MetricCardConfig: FC<MetricCardConfigProps> = memo(function MetricCardConfig({ config, onChange }) {\n  const { t } = useI18n();\n  const handleChange = useCallback(\n    <K extends keyof ConfigType>(key: K, value: ConfigType[K]) => {\n      onChange({ ...config, [key]: value });\n    },\n    [config, onChange]\n  );\n\n  return (\n    <div className=\"space-y-4\">\n      {/* Value Field */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.valueField.label', 'Value Field')}\n        </label>\n        <input\n          type=\"text\"\n          value={((config as unknown as Record<string, unknown>).valueField as string) || ''}\n          onChange={(e) => handleChange('valueField' as keyof ConfigType, e.target.value as never)}\n          placeholder={t(\n            'bigconsole.widget.config.metricCard.valueField.placeholder',\n            'e.g., totalSales, value, amount'\n          )}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        />\n        <p className=\"text-xs text-text-secondary mt-1\">\n          {t(\n            'bigconsole.widget.config.metricCard.valueField.help',\n            'Field name to extract from data (leave empty for auto-detect)'\n          )}\n        </p>\n      </div>\n\n      {/* Subtitle */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.subtitle.label', 'Subtitle')}\n        </label>\n        <input\n          type=\"text\"\n          value={config.subtitle || ''}\n          onChange={(e) => handleChange('subtitle', e.target.value)}\n          placeholder={t('bigconsole.widget.config.metricCard.subtitle.placeholder', 'e.g., Total Revenue')}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        />\n      </div>\n\n      {/* Format */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.format.label', 'Value Format')}\n        </label>\n        <select\n          value={config.format || 'number'}\n          onChange={(e) => handleChange('format', e.target.value as ConfigType['format'])}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        >\n          <option value=\"number\">{t('bigconsole.widget.config.metricCard.format.number', 'Number')}</option>\n          <option value=\"currency\">{t('bigconsole.widget.config.metricCard.format.currency', 'Currency')}</option>\n          <option value=\"percentage\">{t('bigconsole.widget.config.metricCard.format.percentage', 'Percentage')}</option>\n          <option value=\"compact\">{t('bigconsole.widget.config.metricCard.format.compact', 'Compact (1K, 1M)')}</option>\n        </select>\n      </div>\n\n      {/* Prefix & Suffix */}\n      <div className=\"grid grid-cols-2 gap-3\">\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">\n            {t('bigconsole.widget.config.metricCard.prefix.label', 'Prefix')}\n          </label>\n          <input\n            type=\"text\"\n            value={config.prefix || ''}\n            onChange={(e) => handleChange('prefix', e.target.value)}\n            placeholder={t('bigconsole.widget.config.metricCard.prefix.placeholder', 'e.g., $')}\n            className=\"\n                w-full px-3 py-2\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n          />\n        </div>\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">\n            {t('bigconsole.widget.config.metricCard.suffix.label', 'Suffix')}\n          </label>\n          <input\n            type=\"text\"\n            value={config.suffix || ''}\n            onChange={(e) => handleChange('suffix', e.target.value)}\n            placeholder={t('bigconsole.widget.config.metricCard.suffix.placeholder', 'e.g., users')}\n            className=\"\n                w-full px-3 py-2\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n          />\n        </div>\n      </div>\n\n      {/* Comparison Label */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.comparisonLabel.label', 'Comparison Label')}\n        </label>\n        <input\n          type=\"text\"\n          value={config.comparisonLabel || ''}\n          onChange={(e) => handleChange('comparisonLabel', e.target.value)}\n          placeholder={t('bigconsole.widget.config.metricCard.comparisonLabel.placeholder', 'e.g., vs last week')}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        />\n      </div>\n\n      {/* Toggle Options */}\n      <div className=\"space-y-3\">\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showTrend !== false}\n            onChange={(e) => handleChange('showTrend', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.showTrend', 'Show trend indicator')}\n          </span>\n        </label>\n\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showComparison !== false}\n            onChange={(e) => handleChange('showComparison', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.showComparison', 'Show comparison badge')}\n          </span>\n        </label>\n\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showSparkline !== false}\n            onChange={(e) => handleChange('showSparkline', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.showSparkline', 'Show sparkline chart')}\n          </span>\n        </label>\n\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.positiveIsGood !== false}\n            onChange={(e) => handleChange('positiveIsGood', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.positiveIsGood', 'Positive change is good')}\n          </span>\n        </label>\n      </div>\n    </div>\n  );\n});\n\nexport default MetricCardConfig;\n"],"mappings":"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"}
+{"version":3,"file":"MetricCardConfig.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/metric-card/MetricCardConfig.tsx"],"sourcesContent":["/**\n * MetricCardConfig Component\n *\n * Configuration panel for MetricCard widgets.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { MetricCardConfig as ConfigType } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface MetricCardConfigProps {\n  /** Current configuration */\n  config: ConfigType;\n  /** Callback when config changes */\n  onChange: (config: ConfigType) => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const MetricCardConfig: FC<MetricCardConfigProps> = memo(function MetricCardConfig({ config, onChange }) {\n  const { t } = useI18n();\n  const handleChange = useCallback(\n    <K extends keyof ConfigType>(key: K, value: ConfigType[K]) => {\n      onChange({ ...config, [key]: value });\n    },\n    [config, onChange]\n  );\n\n  return (\n    <div className=\"min-w-0 space-y-form-gap\">\n      {/* Value Field */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.valueField.label', 'Value Field')}\n        </label>\n        <input\n          type=\"text\"\n          value={((config as unknown as Record<string, unknown>).valueField as string) || ''}\n          onChange={(e) => handleChange('valueField' as keyof ConfigType, e.target.value as never)}\n          placeholder={t(\n            'bigconsole.widget.config.metricCard.valueField.placeholder',\n            'e.g., totalSales, value, amount'\n          )}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        />\n        <p className=\"text-xs text-text-secondary mt-1\">\n          {t(\n            'bigconsole.widget.config.metricCard.valueField.help',\n            'Field name to extract from data (leave empty for auto-detect)'\n          )}\n        </p>\n      </div>\n\n      {/* Subtitle */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.subtitle.label', 'Subtitle')}\n        </label>\n        <input\n          type=\"text\"\n          value={config.subtitle || ''}\n          onChange={(e) => handleChange('subtitle', e.target.value)}\n          placeholder={t('bigconsole.widget.config.metricCard.subtitle.placeholder', 'e.g., Total Revenue')}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        />\n      </div>\n\n      {/* Format */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.format.label', 'Value Format')}\n        </label>\n        <select\n          value={config.format || 'auto'}\n          onChange={(e) => handleChange('format', e.target.value as ConfigType['format'])}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        >\n          <option value=\"auto\">{t('bigconsole.widget.config.metricCard.format.auto', 'Auto (from data)')}</option>\n          <option value=\"number\">{t('bigconsole.widget.config.metricCard.format.number', 'Number')}</option>\n          <option value=\"currency\">{t('bigconsole.widget.config.metricCard.format.currency', 'Currency')}</option>\n          <option value=\"percentage\">{t('bigconsole.widget.config.metricCard.format.percentage', 'Percentage')}</option>\n          <option value=\"compact\">{t('bigconsole.widget.config.metricCard.format.compact', 'Compact (1K, 1M)')}</option>\n        </select>\n      </div>\n\n      {/* Prefix & Suffix */}\n      <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">\n            {t('bigconsole.widget.config.metricCard.prefix.label', 'Prefix')}\n          </label>\n          <input\n            type=\"text\"\n            value={config.prefix || ''}\n            onChange={(e) => handleChange('prefix', e.target.value)}\n            placeholder={t('bigconsole.widget.config.metricCard.prefix.placeholder', 'e.g., $')}\n            className=\"\n                w-full px-3 py-2\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n          />\n        </div>\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">\n            {t('bigconsole.widget.config.metricCard.suffix.label', 'Suffix')}\n          </label>\n          <input\n            type=\"text\"\n            value={config.suffix || ''}\n            onChange={(e) => handleChange('suffix', e.target.value)}\n            placeholder={t('bigconsole.widget.config.metricCard.suffix.placeholder', 'e.g., users')}\n            className=\"\n                w-full px-3 py-2\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n          />\n        </div>\n      </div>\n\n      {/* Comparison Label */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.metricCard.comparisonLabel.label', 'Comparison Label')}\n        </label>\n        <input\n          type=\"text\"\n          value={config.comparisonLabel || ''}\n          onChange={(e) => handleChange('comparisonLabel', e.target.value)}\n          placeholder={t('bigconsole.widget.config.metricCard.comparisonLabel.placeholder', 'e.g., vs last week')}\n          className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n        />\n      </div>\n\n      {/* Toggle Options */}\n      <div\n        role=\"group\"\n        aria-label=\"Display options\"\n        className=\"space-y-3 border-t border-[var(--color-border-subtle)] pt-form-gap\"\n      >\n        {/* Toggles are a different KIND of control from the field stack above,\n            so they get their own labelled group instead of being visually\n            identical to it (BOFF-5636). */}\n        <p className=\"text-xs font-bold uppercase tracking-wider text-text-secondary\">Display options</p>\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showTrend !== false}\n            onChange={(e) => handleChange('showTrend', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.showTrend', 'Show trend indicator')}\n          </span>\n        </label>\n\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showComparison !== false}\n            onChange={(e) => handleChange('showComparison', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.showComparison', 'Show comparison badge')}\n          </span>\n        </label>\n\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showSparkline !== false}\n            onChange={(e) => handleChange('showSparkline', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.showSparkline', 'Show sparkline chart')}\n          </span>\n        </label>\n\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.positiveIsGood !== false}\n            onChange={(e) => handleChange('positiveIsGood', e.target.checked)}\n            className=\"\n                w-4 h-4\n                text-action-primary-bg\n                bg-bg-surface\n                border-border-default\n                rounded\n                focus:ring-action-primary-bg\n              \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.metricCard.positiveIsGood', 'Positive change is good')}\n          </span>\n        </label>\n      </div>\n    </div>\n  );\n});\n\nexport default MetricCardConfig;\n"],"mappings":"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"}