@burdenoff/microfe-bigconsole 2026.613.3 → 2026.613.5

package/dist/bigconsole/components/widgets/kpi-comparison/KPIComparisonWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"KPIComparisonWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/kpi-comparison/KPIComparisonWidget.tsx"],"sourcesContent":["/**\n * KPIComparisonWidget Component\n *\n * Displays multiple KPIs in a grid for comparison.\n */\n\nimport { type FC, memo } from 'react';\nimport type { Widget } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface KPIComparisonWidgetProps {\n  widget: Widget;\n  data?: KPIComparisonData;\n  onClick?: (kpi: KPIItem) => void;\n  onDrilldown?: (data: Record<string, unknown>) => void;\n}\n\nexport interface KPIItem {\n  id: string;\n  label: string;\n  value: number;\n  previousValue?: number;\n  target?: number;\n  unit?: string;\n  trend?: 'up' | 'down' | 'stable';\n  trendValue?: number;\n}\n\nexport interface KPIComparisonData {\n  kpis?: KPIItem[];\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction formatValue(value: number, unit?: string): string {\n  if (unit === '$') {\n    return new Intl.NumberFormat('en-US', {\n      style: 'currency',\n      currency: 'USD',\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 1,\n    }).format(value);\n  }\n  if (unit === '%') {\n    return `${value.toFixed(1)}%`;\n  }\n  return new Intl.NumberFormat('en-US', {\n    notation: value >= 10000 ? 'compact' : 'standard',\n    maximumFractionDigits: 1,\n  }).format(value);\n}\n\nfunction getTrendColor(trend?: string, trendValue?: number): string {\n  if (!trend || trend === 'stable') return 'text-text-secondary';\n  if (trend === 'up' && (trendValue ?? 0) >= 0) return 'text-state-success';\n  if (trend === 'down' && (trendValue ?? 0) < 0) return 'text-state-error';\n  return 'text-text-secondary';\n}\n\nfunction getTrendIcon(trend?: string): string {\n  if (trend === 'up') return '↑';\n  if (trend === 'down') return '↓';\n  return '→';\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const KPIComparisonWidget: FC<KPIComparisonWidgetProps> = memo(function KPIComparisonWidget({\n  widget,\n  data,\n  onClick,\n  onDrilldown,\n}) {\n  const hasDrilldown = !!widget.drilldown?.enabled;\n  const config = widget.config as Record<string, unknown> | undefined;\n\n  // Build KPIs array from data\n  // Support multiple formats:\n  // 1. data.kpis array (standard format)\n  // 2. Single value from data.processed (e.g., 125000 from DataSink)\n  // 3. data is a number/string directly\n  // 4. Nested summary object (e.g., {sales: [...], summary: {totalSales: 123}})\n  // 5. Array of objects from DataSink (e.g., [{month: \"Jan\", revenue: 45000}, ...])\n  let kpis: KPIItem[] = [];\n\n  // Get configured value field from widget config (for DataSink data)\n  const valueField = (config?.valueField as string) || (config?.value_field as string) || 'value';\n  const labelField = (config?.labelField as string) || (config?.label_field as string) || 'label';\n\n  // Helper to convert object with numeric values to KPIs\n  const objectToKpis = (obj: Record<string, unknown>): KPIItem[] => {\n    const entries = Object.entries(obj);\n    return entries\n      .filter(([, v]) => typeof v === 'number')\n      .map(([key, value]) => ({\n        id: key,\n        label: key.replace(/([A-Z])/g, ' $1').replace(/^./, (s) => s.toUpperCase()),\n        value: value as number,\n        unit:\n          key.toLowerCase().includes('sales') ||\n          key.toLowerCase().includes('revenue') ||\n          key.toLowerCase().includes('value')\n            ? '$'\n            : undefined,\n      }));\n  };\n\n  // Helper to extract KPI from a single data row using config fields\n  const extractKpiFromRow = (row: Record<string, unknown>, index: number): KPIItem | null => {\n    // Try to get value from configured field or common field names\n    const valueCandidates = [valueField, 'value', 'revenue', 'amount', 'total', 'count', 'sales', 'growth'];\n    let value: number | null = null;\n\n    for (const field of valueCandidates) {\n      if (typeof row[field] === 'number') {\n        value = row[field] as number;\n        break;\n      }\n      if (typeof row[field] === 'string' && !isNaN(parseFloat(row[field] as string))) {\n        value = parseFloat(row[field] as string);\n        break;\n      }\n    }\n\n    if (value === null) {\n      // Try to find any numeric field\n      const numericEntry = Object.entries(row).find(([, v]) => typeof v === 'number');\n      if (numericEntry) {\n        value = numericEntry[1] as number;\n      }\n    }\n\n    if (value === null) return null;\n\n    // Try to get label from configured field or common field names\n    const labelCandidates = [labelField, 'label', 'name', 'title', 'month', 'region', 'category'];\n    let label = `Item ${index + 1}`;\n\n    for (const field of labelCandidates) {\n      if (row[field] && typeof row[field] === 'string') {\n        label = row[field] as string;\n        break;\n      }\n    }\n\n    // Check for growth/trend fields\n    const growthValue = row.growth ?? row.change ?? row.trend ?? row.percentChange;\n    const trend =\n      typeof growthValue === 'number' ? (growthValue > 0 ? 'up' : growthValue < 0 ? 'down' : 'stable') : undefined;\n\n    return {\n      id: `kpi-${index}`,\n      label,\n      value,\n      unit:\n        valueField.toLowerCase().includes('revenue') || valueField.toLowerCase().includes('sales') ? '$' : undefined,\n      trend: trend as 'up' | 'down' | 'stable' | undefined,\n      trendValue: typeof growthValue === 'number' ? growthValue : undefined,\n    };\n  };\n\n  if (data?.kpis && Array.isArray(data.kpis)) {\n    // Standard KPIs array\n    kpis = data.kpis;\n  } else if (Array.isArray(data) && data.length > 0) {\n    // NEW: Handle array of objects from DataSink\n    // Extract KPIs from each row, up to 4 items for display\n    const maxKpis = 4;\n    for (let i = 0; i < Math.min(data.length, maxKpis); i++) {\n      const row = data[i] as Record<string, unknown>;\n      if (row && typeof row === 'object') {\n        const kpi = extractKpiFromRow(row, i);\n        if (kpi) kpis.push(kpi);\n      }\n    }\n\n    // If we couldn't extract KPIs from rows, try to aggregate numeric fields\n    if (kpis.length === 0 && data.length > 0) {\n      const firstRow = data[0] as Record<string, unknown>;\n      const numericFields = Object.entries(firstRow).filter(([, v]) => typeof v === 'number');\n\n      // Create KPIs by aggregating (summing) each numeric field across all rows\n      kpis = numericFields.slice(0, maxKpis).map(([field]) => {\n        const sum = data.reduce((acc, row) => {\n          const val = (row as Record<string, unknown>)[field];\n          return acc + (typeof val === 'number' ? val : 0);\n        }, 0);\n\n        return {\n          id: field,\n          label: field.replace(/([A-Z])/g, ' $1').replace(/^./, (s) => s.toUpperCase()),\n          value: sum,\n          unit: field.toLowerCase().includes('revenue') || field.toLowerCase().includes('sales') ? '$' : undefined,\n        };\n      });\n    }\n  } else if (typeof data === 'number' || typeof data === 'string') {\n    // Single value - create a KPI from it using widget config\n    const value = typeof data === 'string' ? parseFloat(data) : data;\n    if (!isNaN(value)) {\n      kpis = [\n        {\n          id: 'primary',\n          label: ((config?.subtitle as string) || widget.title || 'Value').trim(),\n          value,\n          unit: config?.format === 'currency' ? '$' : config?.format === 'percent' ? '%' : undefined,\n        },\n      ];\n    }\n  } else if (data && typeof data === 'object' && !Array.isArray(data)) {\n    const dataObj = data as Record<string, unknown>;\n\n    // First, check if there's a nested 'summary' object with numeric values\n    if ('summary' in dataObj && dataObj.summary && typeof dataObj.summary === 'object') {\n      kpis = objectToKpis(dataObj.summary as Record<string, unknown>);\n    }\n\n    // If no KPIs from summary, try top-level numeric values\n    if (kpis.length === 0) {\n      kpis = objectToKpis(dataObj);\n    }\n  }\n\n  if (!kpis.length) {\n    return (\n      <div className=\"flex items-center justify-center h-full text-text-secondary text-sm\">\n        <div className=\"text-center\">\n          <svg\n            className=\"w-12 h-12 mx-auto mb-2 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=\"M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z\"\n            />\n          </svg>\n          <p>No KPI data</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"h-full p-4 overflow-auto\">\n      <div className=\"grid grid-cols-2 gap-3\">\n        {kpis.map((kpi) => (\n          <div\n            key={kpi.id}\n            className={`\n                p-3 rounded-lg border border-border-default bg-bg-muted/30\n                ${onClick || hasDrilldown ? 'cursor-pointer hover:border-action-primary-bg transition-colors' : ''}\n              `}\n            onClick={() => {\n              // Trigger drilldown with KPI data if enabled\n              if (hasDrilldown && onDrilldown) {\n                onDrilldown({\n                  kpiId: kpi.id,\n                  kpiLabel: kpi.label,\n                  kpiValue: kpi.value,\n                  kpiUnit: kpi.unit,\n                  kpiTrend: kpi.trend,\n                  kpiTrendValue: kpi.trendValue,\n                  kpiTarget: kpi.target,\n                  kpiPreviousValue: kpi.previousValue,\n                });\n              }\n              onClick?.(kpi);\n            }}\n          >\n            {/* Label */}\n            <p className=\"text-xs text-text-secondary truncate mb-1\">{kpi.label}</p>\n\n            {/* Value */}\n            <p className=\"text-xl font-semibold text-text-primary\">{formatValue(kpi.value, kpi.unit)}</p>\n\n            {/* Trend */}\n            {kpi.trendValue !== undefined && (\n              <div className={`flex items-center gap-1 mt-1 text-xs ${getTrendColor(kpi.trend, kpi.trendValue)}`}>\n                <span>{getTrendIcon(kpi.trend)}</span>\n                <span>\n                  {kpi.trendValue >= 0 ? '+' : ''}\n                  {kpi.trendValue.toFixed(1)}%\n                </span>\n              </div>\n            )}\n\n            {/* Target progress */}\n            {kpi.target !== undefined && (\n              <div className=\"mt-2\">\n                <div className=\"flex justify-between text-[10px] text-text-tertiary mb-0.5\">\n                  <span>vs target</span>\n                  <span>{((kpi.value / kpi.target) * 100).toFixed(0)}%</span>\n                </div>\n                <div className=\"h-1 bg-bg-muted rounded-full overflow-hidden\">\n                  <div\n                    className={`h-full rounded-full ${kpi.value >= kpi.target ? 'bg-state-success' : 'bg-action-primary-bg'}`}\n                    style={{ width: `${Math.min((kpi.value / kpi.target) * 100, 100)}%` }}\n                  />\n                </div>\n              </div>\n            )}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n});\n\nexport default KPIComparisonWidget;\n"],"mappings":"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"}
+{"version":3,"file":"KPIComparisonWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/kpi-comparison/KPIComparisonWidget.tsx"],"sourcesContent":["/**\n * KPIComparisonWidget Component\n *\n * Displays multiple KPIs in a grid for comparison.\n */\n\nimport { type FC, memo } from 'react';\nimport type { Widget } from '../../../types';\nimport { type ConditionalRule, resolveConditionalStyle, conditionalStyleToClassName } from '../utils/conditionalFormat';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface KPIComparisonWidgetProps {\n  widget: Widget;\n  data?: KPIComparisonData;\n  onClick?: (kpi: KPIItem) => void;\n  onDrilldown?: (data: Record<string, unknown>) => void;\n}\n\nexport interface KPIItem {\n  id: string;\n  label: string;\n  value: number;\n  previousValue?: number;\n  target?: number;\n  unit?: string;\n  trend?: 'up' | 'down' | 'stable';\n  trendValue?: number;\n}\n\nexport interface KPIComparisonData {\n  kpis?: KPIItem[];\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction formatValue(value: number, unit?: string): string {\n  if (unit === '$') {\n    return new Intl.NumberFormat('en-US', {\n      style: 'currency',\n      currency: 'USD',\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 1,\n    }).format(value);\n  }\n  if (unit === '%') {\n    return `${value.toFixed(1)}%`;\n  }\n  return new Intl.NumberFormat('en-US', {\n    notation: value >= 10000 ? 'compact' : 'standard',\n    maximumFractionDigits: 1,\n  }).format(value);\n}\n\nfunction getTrendColor(trend?: string, trendValue?: number): string {\n  if (!trend || trend === 'stable') return 'text-text-secondary';\n  if (trend === 'up' && (trendValue ?? 0) >= 0) return 'text-state-success';\n  if (trend === 'down' && (trendValue ?? 0) < 0) return 'text-state-error';\n  return 'text-text-secondary';\n}\n\nfunction getTrendIcon(trend?: string): string {\n  if (trend === 'up') return '↑';\n  if (trend === 'down') return '↓';\n  return '→';\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const KPIComparisonWidget: FC<KPIComparisonWidgetProps> = memo(function KPIComparisonWidget({\n  widget,\n  data,\n  onClick,\n  onDrilldown,\n}) {\n  const hasDrilldown = !!widget.drilldown?.enabled;\n  const config = widget.config as Record<string, unknown> | undefined;\n  const conditionalRules = config?.conditionalRules as ConditionalRule[] | undefined;\n\n  // Build KPIs array from data\n  // Support multiple formats:\n  // 1. data.kpis array (standard format)\n  // 2. Single value from data.processed (e.g., 125000 from DataSink)\n  // 3. data is a number/string directly\n  // 4. Nested summary object (e.g., {sales: [...], summary: {totalSales: 123}})\n  // 5. Array of objects from DataSink (e.g., [{month: \"Jan\", revenue: 45000}, ...])\n  let kpis: KPIItem[] = [];\n\n  // Get configured value field from widget config (for DataSink data)\n  const valueField = (config?.valueField as string) || (config?.value_field as string) || 'value';\n  const labelField = (config?.labelField as string) || (config?.label_field as string) || 'label';\n\n  // Helper to convert object with numeric values to KPIs\n  const objectToKpis = (obj: Record<string, unknown>): KPIItem[] => {\n    const entries = Object.entries(obj);\n    return entries\n      .filter(([, v]) => typeof v === 'number')\n      .map(([key, value]) => ({\n        id: key,\n        label: key.replace(/([A-Z])/g, ' $1').replace(/^./, (s) => s.toUpperCase()),\n        value: value as number,\n        unit:\n          key.toLowerCase().includes('sales') ||\n          key.toLowerCase().includes('revenue') ||\n          key.toLowerCase().includes('value')\n            ? '$'\n            : undefined,\n      }));\n  };\n\n  // Helper to extract KPI from a single data row using config fields\n  const extractKpiFromRow = (row: Record<string, unknown>, index: number): KPIItem | null => {\n    // Try to get value from configured field or common field names\n    const valueCandidates = [valueField, 'value', 'revenue', 'amount', 'total', 'count', 'sales', 'growth'];\n    let value: number | null = null;\n\n    for (const field of valueCandidates) {\n      if (typeof row[field] === 'number') {\n        value = row[field] as number;\n        break;\n      }\n      if (typeof row[field] === 'string' && !isNaN(parseFloat(row[field] as string))) {\n        value = parseFloat(row[field] as string);\n        break;\n      }\n    }\n\n    if (value === null) {\n      // Try to find any numeric field\n      const numericEntry = Object.entries(row).find(([, v]) => typeof v === 'number');\n      if (numericEntry) {\n        value = numericEntry[1] as number;\n      }\n    }\n\n    if (value === null) return null;\n\n    // Try to get label from configured field or common field names\n    const labelCandidates = [labelField, 'label', 'name', 'title', 'month', 'region', 'category'];\n    let label = `Item ${index + 1}`;\n\n    for (const field of labelCandidates) {\n      if (row[field] && typeof row[field] === 'string') {\n        label = row[field] as string;\n        break;\n      }\n    }\n\n    // Check for growth/trend fields\n    const growthValue = row.growth ?? row.change ?? row.trend ?? row.percentChange;\n    const trend =\n      typeof growthValue === 'number' ? (growthValue > 0 ? 'up' : growthValue < 0 ? 'down' : 'stable') : undefined;\n\n    return {\n      id: `kpi-${index}`,\n      label,\n      value,\n      unit:\n        valueField.toLowerCase().includes('revenue') || valueField.toLowerCase().includes('sales') ? '$' : undefined,\n      trend: trend as 'up' | 'down' | 'stable' | undefined,\n      trendValue: typeof growthValue === 'number' ? growthValue : undefined,\n    };\n  };\n\n  if (data?.kpis && Array.isArray(data.kpis)) {\n    // Standard KPIs array\n    kpis = data.kpis;\n  } else if (Array.isArray(data) && data.length > 0) {\n    // NEW: Handle array of objects from DataSink\n    // Extract KPIs from each row, up to 4 items for display\n    const maxKpis = 4;\n    for (let i = 0; i < Math.min(data.length, maxKpis); i++) {\n      const row = data[i] as Record<string, unknown>;\n      if (row && typeof row === 'object') {\n        const kpi = extractKpiFromRow(row, i);\n        if (kpi) kpis.push(kpi);\n      }\n    }\n\n    // If we couldn't extract KPIs from rows, try to aggregate numeric fields\n    if (kpis.length === 0 && data.length > 0) {\n      const firstRow = data[0] as Record<string, unknown>;\n      const numericFields = Object.entries(firstRow).filter(([, v]) => typeof v === 'number');\n\n      // Create KPIs by aggregating (summing) each numeric field across all rows\n      kpis = numericFields.slice(0, maxKpis).map(([field]) => {\n        const sum = data.reduce((acc, row) => {\n          const val = (row as Record<string, unknown>)[field];\n          return acc + (typeof val === 'number' ? val : 0);\n        }, 0);\n\n        return {\n          id: field,\n          label: field.replace(/([A-Z])/g, ' $1').replace(/^./, (s) => s.toUpperCase()),\n          value: sum,\n          unit: field.toLowerCase().includes('revenue') || field.toLowerCase().includes('sales') ? '$' : undefined,\n        };\n      });\n    }\n  } else if (typeof data === 'number' || typeof data === 'string') {\n    // Single value - create a KPI from it using widget config\n    const value = typeof data === 'string' ? parseFloat(data) : data;\n    if (!isNaN(value)) {\n      kpis = [\n        {\n          id: 'primary',\n          label: ((config?.subtitle as string) || widget.title || 'Value').trim(),\n          value,\n          unit: config?.format === 'currency' ? '$' : config?.format === 'percent' ? '%' : undefined,\n        },\n      ];\n    }\n  } else if (data && typeof data === 'object' && !Array.isArray(data)) {\n    const dataObj = data as Record<string, unknown>;\n\n    // First, check if there's a nested 'summary' object with numeric values\n    if ('summary' in dataObj && dataObj.summary && typeof dataObj.summary === 'object') {\n      kpis = objectToKpis(dataObj.summary as Record<string, unknown>);\n    }\n\n    // If no KPIs from summary, try top-level numeric values\n    if (kpis.length === 0) {\n      kpis = objectToKpis(dataObj);\n    }\n  }\n\n  if (!kpis.length) {\n    return (\n      <div className=\"flex items-center justify-center h-full text-text-secondary text-sm\">\n        <div className=\"text-center\">\n          <svg\n            className=\"w-12 h-12 mx-auto mb-2 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=\"M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z\"\n            />\n          </svg>\n          <p>No KPI data</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"h-full p-4 overflow-auto\">\n      <div className=\"grid grid-cols-2 gap-3\">\n        {kpis.map((kpi) => (\n          <div\n            key={kpi.id}\n            className={`\n                p-3 rounded-lg border border-border-default bg-bg-muted/30\n                ${onClick || hasDrilldown ? 'cursor-pointer hover:border-action-primary-bg transition-colors' : ''}\n              `}\n            onClick={() => {\n              // Trigger drilldown with KPI data if enabled\n              if (hasDrilldown && onDrilldown) {\n                onDrilldown({\n                  kpiId: kpi.id,\n                  kpiLabel: kpi.label,\n                  kpiValue: kpi.value,\n                  kpiUnit: kpi.unit,\n                  kpiTrend: kpi.trend,\n                  kpiTrendValue: kpi.trendValue,\n                  kpiTarget: kpi.target,\n                  kpiPreviousValue: kpi.previousValue,\n                });\n              }\n              onClick?.(kpi);\n            }}\n          >\n            {/* Label */}\n            <p className=\"text-xs text-text-secondary truncate mb-1\">{kpi.label}</p>\n\n            {/* Value (with optional threshold-based conditional color) */}\n            <p\n              className={`text-xl font-semibold ${\n                conditionalStyleToClassName(\n                  resolveConditionalStyle(kpi.value, conditionalRules, { [kpi.label]: kpi.value, value: kpi.value })\n                ) || 'text-text-primary'\n              }`}\n            >\n              {formatValue(kpi.value, kpi.unit)}\n            </p>\n\n            {/* Trend */}\n            {kpi.trendValue !== undefined && (\n              <div className={`flex items-center gap-1 mt-1 text-xs ${getTrendColor(kpi.trend, kpi.trendValue)}`}>\n                <span>{getTrendIcon(kpi.trend)}</span>\n                <span>\n                  {kpi.trendValue >= 0 ? '+' : ''}\n                  {kpi.trendValue.toFixed(1)}%\n                </span>\n              </div>\n            )}\n\n            {/* Target progress */}\n            {kpi.target !== undefined && (\n              <div className=\"mt-2\">\n                <div className=\"flex justify-between text-[10px] text-text-tertiary mb-0.5\">\n                  <span>vs target</span>\n                  <span>{((kpi.value / kpi.target) * 100).toFixed(0)}%</span>\n                </div>\n                <div className=\"h-1 bg-bg-muted rounded-full overflow-hidden\">\n                  <div\n                    className={`h-full rounded-full ${kpi.value >= kpi.target ? 'bg-state-success' : 'bg-action-primary-bg'}`}\n                    style={{ width: `${Math.min((kpi.value / kpi.target) * 100, 100)}%` }}\n                  />\n                </div>\n              </div>\n            )}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n});\n\nexport default KPIComparisonWidget;\n"],"mappings":"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"}

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

@@ -21,26 +21,47 @@ function m(e) {
 	return typeof e == "number" && Number.isFinite(e);
 }
 function h(e) {
+	return e >= .66 ? "var(--color-status-error)" : e >= .33 ? "var(--color-status-warning)" : "var(--color-status-info)";
+}
+function g(e) {
+	let t = document.createElement("div"), n = document.createElement("div");
+	if (n.style.fontWeight = "600", n.textContent = e.popup || e.name || "Location", t.appendChild(n), m(e.value)) {
+		let n = document.createElement("div");
+		n.textContent = e.value.toLocaleString(), t.appendChild(n);
+	}
+	return t;
+}
+function _(e) {
 	let t = e;
 	return t && m(t.lat) && m(t.lng) ? {
 		lat: t.lat,
 		lng: t.lng
 	} : void 0;
 }
-function g(e, t) {
-	let n = Array.isArray(e) ? void 0 : e, r = Array.isArray(e) ? e : e?.markers;
+function v(e, t) {
+	let n = Array.isArray(e) ? void 0 : e, r = Array.isArray(e) ? e : e?.markers, i = Array.isArray(r) ? r.filter((e) => e && m(e.lat) && m(e.lng)) : [], a = (n?.geoJson ?? t.geoJson) || void 0, o = t.regionIdField || "id", s = /* @__PURE__ */ new Map(), c = n?.regions ?? t.regions;
+	if (Array.isArray(c)) for (let e of c) {
+		if (!e) continue;
+		let t = e[o] ?? e.id ?? e.region ?? e.code, n = e.value ?? e.count ?? e.total;
+		t != null && m(n) && s.set(String(t), {
+			value: n,
+			name: typeof e.name == "string" ? e.name : void 0
+		});
+	}
 	return {
-		markers: Array.isArray(r) ? r.filter((e) => e && m(e.lat) && m(e.lng)) : [],
-		center: h(n?.center),
+		markers: i,
+		center: _(n?.center),
 		zoom: m(n?.zoom) ? n?.zoom : void 0,
-		fallbackCenter: h(t.center),
-		fallbackZoom: m(t.zoom) ? t.zoom : void 0
+		fallbackCenter: _(t.center),
+		fallbackZoom: m(t.zoom) ? t.zoom : void 0,
+		geoJson: a && Array.isArray(a.features) ? a : void 0,
+		regionValues: s
 	};
 }
-var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
-	let f = r(null), h = r(null), _ = r(null), [v, y] = i("loading"), b = n(() => e?.config ?? {}, [e?.config]), x = b.showMarkers !== !1, { markers: S, center: C, zoom: w, fallbackCenter: T, fallbackZoom: E } = n(() => g(c, b), [c, b]), D = r(() => void 0);
+var y = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
+	let f = r(null), _ = r(null), y = r(null), [b, x] = i("loading"), S = n(() => e?.config ?? {}, [e?.config]), C = S.showMarkers !== !1, w = S.mapMode === "heat", T = S.regionIdField || "id", { markers: E, center: D, zoom: O, fallbackCenter: k, fallbackZoom: A, geoJson: j, regionValues: M } = n(() => v(c, S), [c, S]), N = !!(j && M.size > 0), P = r(() => void 0);
 	return t(() => {
-		D.current = (e) => {
+		P.current = (e) => {
 			u ? u(e) : l && l(e);
 		};
 	}, [l, u]), t(() => {
@@ -60,25 +81,66 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 				maxZoom: 18
 			}), r = !1;
 			n.on("tileload", () => {
-				r = !0, y((e) => e === "error" ? "ready" : e);
+				r = !0, x((e) => e === "error" ? "ready" : e);
 			}), n.on("tileerror", () => {
-				r || y("error");
-			}), n.addTo(t), h.current = t, _.current = null, y("ready");
+				r || x("error");
+			}), n.addTo(t), _.current = t, y.current = null, x("ready");
 		} catch {
-			y("error");
+			x("error");
 			return;
 		}
-		let n = typeof ResizeObserver < "u" ? new ResizeObserver(() => h.current?.invalidateSize()) : void 0;
+		let n = typeof ResizeObserver < "u" ? new ResizeObserver(() => _.current?.invalidateSize()) : void 0;
 		n?.observe(e);
 		let r = window.setTimeout(() => t.invalidateSize(), 80);
 		return () => {
-			window.clearTimeout(r), n?.disconnect(), t.remove(), h.current = null;
+			window.clearTimeout(r), n?.disconnect(), t.remove(), _.current = null;
 		};
 	}, []), t(() => {
-		let e = h.current;
+		let e = _.current;
 		if (!e) return;
-		let t = s.layerGroup();
-		if (x) for (let e of S) {
+		let t = s.layerGroup(), n = null;
+		if (j && M.size > 0) {
+			let e = Array.from(M.values()).map((e) => e.value), r = Math.min(...e), i = Math.max(...e) - r || 1, a = (e) => {
+				let t = e.properties ?? {}, n = e.id ?? t[T] ?? t.id ?? t.code;
+				return n == null ? void 0 : M.get(String(n));
+			};
+			n = s.geoJSON(j, {
+				style: (e) => {
+					let t = e ? a(e) : void 0, n = t ? (t.value - r) / i : 0;
+					return {
+						fillColor: "var(--color-status-info, #3b82f6)",
+						fillOpacity: t ? .2 + n * .65 : .05,
+						color: "var(--color-border-default, #cbd5e1)",
+						weight: 1
+					};
+				},
+				onEachFeature: (e, t) => {
+					let n = a(e), r = n?.name ?? (typeof e.properties?.name == "string" ? e.properties.name : void 0) ?? String(e.id ?? ""), i = document.createElement("div"), o = document.createElement("div");
+					if (o.style.fontWeight = "600", o.textContent = r || "Region", i.appendChild(o), n) {
+						let e = document.createElement("div");
+						e.textContent = n.value.toLocaleString(), i.appendChild(e);
+					}
+					t.bindPopup(i), t.on("click", () => P.current({
+						name: r,
+						lat: NaN,
+						lng: NaN,
+						value: n?.value
+					}));
+				}
+			}), n.addTo(t);
+		}
+		if (C && w) {
+			let e = E.map((e) => m(e.value) ? e.value : 1), n = e.reduce((e, t) => Math.min(e, t), Infinity), r = e.reduce((e, t) => Math.max(e, t), -Infinity) - n || 1;
+			E.forEach((i, a) => {
+				let o = (e[a] - n) / r, c = s.circleMarker([i.lat, i.lng], {
+					radius: 10 + o * 22,
+					fillColor: h(o),
+					fillOpacity: .25 + o * .35,
+					stroke: !1
+				}).addTo(t);
+				c.bindPopup(g(i)), c.on("click", () => P.current(i));
+			});
+		} else if (C) for (let e of E) {
 			let n = document.createElement("div");
 			Object.assign(n.style, {
 				width: "14px",
@@ -94,41 +156,48 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 				html: n,
 				iconSize: [14, 14],
 				iconAnchor: [7, 14]
-			}), i = s.marker([e.lat, e.lng], { icon: r }).addTo(t), a = document.createElement("div"), o = document.createElement("div");
-			if (o.style.fontWeight = "600", o.textContent = e.popup || e.name || "Location", a.appendChild(o), m(e.value)) {
-				let t = document.createElement("div");
-				t.textContent = e.value.toLocaleString(), a.appendChild(t);
-			}
-			i.bindPopup(a), i.on("click", () => D.current(e));
+			}), i = s.marker([e.lat, e.lng], { icon: r }).addTo(t);
+			i.bindPopup(g(e)), i.on("click", () => P.current(e));
 		}
 		t.addTo(e);
-		let n = JSON.stringify({
-			m: S.map((e) => [e.lat, e.lng]),
-			c: C ? [C.lat, C.lng] : null,
-			z: w ?? null,
-			fc: T ? [T.lat, T.lng] : null,
-			fz: E ?? null
+		let r = JSON.stringify({
+			m: E.map((e) => [e.lat, e.lng]),
+			c: D ? [D.lat, D.lng] : null,
+			z: O ?? null,
+			fc: k ? [k.lat, k.lng] : null,
+			fz: A ?? null,
+			g: j ? M.size : 0
 		});
-		if (n !== _.current) if (_.current = n, C) e.setView([C.lat, C.lng], w ?? e.getZoom());
-		else if (S.length === 1) e.setView([S[0].lat, S[0].lng], w ?? 8);
-		else if (S.length > 1) {
-			let t = s.latLngBounds(S.map((e) => [e.lat, e.lng]));
+		if (r !== y.current) if (y.current = r, D) e.setView([D.lat, D.lng], O ?? e.getZoom());
+		else if (!E.length && n) {
+			let t = n.getBounds();
+			t.isValid() && e.fitBounds(t, {
+				padding: [24, 24],
+				maxZoom: 12
+			});
+		} else if (E.length === 1) e.setView([E[0].lat, E[0].lng], O ?? 8);
+		else if (E.length > 1) {
+			let t = s.latLngBounds(E.map((e) => [e.lat, e.lng]));
 			e.fitBounds(t, {
 				padding: [32, 32],
 				maxZoom: 12
 			});
-		} else T ? e.setView([T.lat, T.lng], w ?? E ?? e.getZoom()) : m(w ?? E) && e.setZoom(w ?? E);
-		let r = window.setTimeout(() => e.invalidateSize(), 0);
+		} else k ? e.setView([k.lat, k.lng], O ?? A ?? e.getZoom()) : m(O ?? A) && e.setZoom(O ?? A);
+		let i = window.setTimeout(() => e.invalidateSize(), 0);
 		return () => {
-			window.clearTimeout(r), t.remove();
+			window.clearTimeout(i), t.remove();
 		};
 	}, [
-		S,
+		E,
+		D,
+		O,
+		k,
+		A,
 		C,
 		w,
-		T,
-		E,
-		x
+		j,
+		M,
+		T
 	]), /* @__PURE__ */ o("div", {
 		className: "relative h-full w-full overflow-hidden rounded-lg bg-bg-muted",
 		children: [
@@ -136,7 +205,7 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 				ref: f,
 				className: "h-full w-full"
 			}),
-			v !== "error" && S.length === 0 && /* @__PURE__ */ a("div", {
+			b !== "error" && E.length === 0 && !N && /* @__PURE__ */ a("div", {
 				className: "pointer-events-none absolute inset-0 z-[500] flex items-center justify-center bg-bg-muted/70 text-sm text-text-secondary",
 				children: /* @__PURE__ */ o("div", {
 					className: "text-center",
@@ -159,7 +228,7 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 					}), /* @__PURE__ */ a("p", { children: "No map data" })]
 				})
 			}),
-			v === "error" && /* @__PURE__ */ a("div", {
+			b === "error" && /* @__PURE__ */ a("div", {
 				className: "absolute inset-0 z-[500] flex items-center justify-center bg-bg-muted px-4 text-center text-sm text-text-secondary",
 				children: "The map needs an internet connection and couldn’t load."
 			})
@@ -167,6 +236,6 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 	});
 });
 //#endregion
-export { _ as default };
+export { y as default };
 
 //# sourceMappingURL=MapWidget.js.map

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\nexport interface MapData {\n  center?: { lat: number; lng: number };\n  zoom?: number;\n  markers?: MapMarker[];\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 * 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}\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  // 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  };\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  const { markers, center, zoom, fallbackCenter, fallbackZoom } = useMemo(\n    () => normalizeMapData(data, config),\n    [data, config]\n  );\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    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\n        // bindPopup treats a string as HTML; build a text node so marker-supplied\n        // text can never be interpreted as markup (defense-in-depth).\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        m.bindPopup(popupEl);\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    });\n    if (frameSig !== lastFrameSigRef.current) {\n      lastFrameSigRef.current = frameSig;\n      // Framing priority: data-payload center → frame the markers → config fallback\n      // center (no markers) → config/payload zoom only → world view. Markers win over\n      // the config default so a palette-created map frames its data instead of {0,0}.\n      if (center) {\n        map.setView([center.lat, center.lng], zoom ?? map.getZoom());\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  }, [markers, center, zoom, fallbackCenter, fallbackZoom, showMarkers]);\n\n  return (\n    <div className=\"relative h-full w-full overflow-hidden rounded-lg bg-bg-muted\">\n      <div ref={containerRef} className=\"h-full w-full\" />\n\n      {status !== 'error' && markers.length === 0 && (\n        <div className=\"pointer-events-none absolute inset-0 z-[500] flex items-center justify-center bg-bg-muted/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-muted 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-muted\">\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-muted/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-muted 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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"}