@burdenoff/microfe-bigconsole 2026.613.3 → 2026.613.4

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

@@ -28,19 +28,29 @@ function h(e) {
 	} : void 0;
 }
 function g(e, t) {
-	let n = Array.isArray(e) ? void 0 : e, r = Array.isArray(e) ? e : e?.markers;
+	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)) : [],
+		markers: i,
 		center: h(n?.center),
 		zoom: m(n?.zoom) ? n?.zoom : void 0,
 		fallbackCenter: h(t.center),
-		fallbackZoom: m(t.zoom) ? t.zoom : void 0
+		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);
+	let f = r(null), h = r(null), _ = r(null), [v, y] = i("loading"), b = n(() => e?.config ?? {}, [e?.config]), x = b.showMarkers !== !1, S = b.regionIdField || "id", { markers: C, center: w, zoom: T, fallbackCenter: E, fallbackZoom: D, geoJson: O, regionValues: k } = n(() => g(c, b), [c, b]), A = !!(O && k.size > 0), j = r(() => void 0);
 	return t(() => {
-		D.current = (e) => {
+		j.current = (e) => {
 			u ? u(e) : l && l(e);
 		};
 	}, [l, u]), t(() => {
@@ -77,8 +87,38 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 	}, []), t(() => {
 		let e = h.current;
 		if (!e) return;
-		let t = s.layerGroup();
-		if (x) for (let e of S) {
+		let t = s.layerGroup(), n = null;
+		if (O && k.size > 0) {
+			let e = Array.from(k.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[S] ?? t.id ?? t.code;
+				return n == null ? void 0 : k.get(String(n));
+			};
+			n = s.geoJSON(O, {
+				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", () => j.current({
+						name: r,
+						lat: NaN,
+						lng: NaN,
+						value: n?.value
+					}));
+				}
+			}), n.addTo(t);
+		}
+		if (x) for (let e of C) {
 			let n = document.createElement("div");
 			Object.assign(n.style, {
 				width: "14px",
@@ -99,36 +139,46 @@ var _ = e(function({ widget: e, data: c, onClick: l, onDrilldown: u }) {
 				let t = document.createElement("div");
 				t.textContent = e.value.toLocaleString(), a.appendChild(t);
 			}
-			i.bindPopup(a), i.on("click", () => D.current(e));
+			i.bindPopup(a), i.on("click", () => j.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: C.map((e) => [e.lat, e.lng]),
+			c: w ? [w.lat, w.lng] : null,
+			z: T ?? null,
+			fc: E ? [E.lat, E.lng] : null,
+			fz: D ?? null,
+			g: O ? k.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 !== _.current) if (_.current = r, w) e.setView([w.lat, w.lng], T ?? e.getZoom());
+		else if (!C.length && n) {
+			let t = n.getBounds();
+			t.isValid() && e.fitBounds(t, {
+				padding: [24, 24],
+				maxZoom: 12
+			});
+		} else if (C.length === 1) e.setView([C[0].lat, C[0].lng], T ?? 8);
+		else if (C.length > 1) {
+			let t = s.latLngBounds(C.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 E ? e.setView([E.lat, E.lng], T ?? D ?? e.getZoom()) : m(T ?? D) && e.setZoom(T ?? D);
+		let i = window.setTimeout(() => e.invalidateSize(), 0);
 		return () => {
-			window.clearTimeout(r), t.remove();
+			window.clearTimeout(i), t.remove();
 		};
 	}, [
-		S,
 		C,
 		w,
 		T,
 		E,
-		x
+		D,
+		x,
+		O,
+		k,
+		S
 	]), /* @__PURE__ */ o("div", {
 		className: "relative h-full w-full overflow-hidden rounded-lg bg-bg-muted",
 		children: [
@@ -136,7 +186,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", {
+			v !== "error" && C.length === 0 && !A && /* @__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",

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 * 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  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) {\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      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  }, [markers, center, zoom, fallbackCenter, fallbackZoom, showMarkers, geoJson, regionValues, regionIdField]);\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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"}

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

@@ -1,11 +1,12 @@
-import { firstObjectRow as e, inferValueField as t, unwrapRows as n } from "../utils/inferFields.js";
-import r from "./TrendIndicator.js";
-import i from "./ComparisonBadge.js";
-import a from "./SparklineChart.js";
-import { memo as o, useCallback as s, useMemo as c } from "react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { conditionalStyleToClassName as e, resolveConditionalStyle as t } from "../utils/conditionalFormat.js";
+import { firstObjectRow as n, inferValueField as r, unwrapRows as i } from "../utils/inferFields.js";
+import a from "./TrendIndicator.js";
+import o from "./ComparisonBadge.js";
+import s from "./SparklineChart.js";
+import { memo as c, useCallback as l, useMemo as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/metric-card/MetricCardWidget.tsx
-function d(e, t) {
+function p(e, t) {
 	if (typeof e == "string") return e;
 	let { format: n = "number", prefix: r, suffix: i } = t || {}, a;
 	switch (n) {
@@ -30,26 +31,26 @@ function d(e, t) {
 	}
 	return r && (a = `${r}${a}`), i && (a = `${a}${i}`), a;
 }
-function f(e) {
+function m(e) {
 	return e === void 0 || e === 0 ? "flat" : e > 0 ? "up" : "down";
 }
-function p(e, t) {
+function h(e, t) {
 	return e === "flat" ? "muted" : (t ? e === "up" : e === "down") ? "success" : "error";
 }
-var m = o(function({ widget: o, data: m, onClick: h, onDrilldown: g }) {
-	let _ = o.config, v = c(() => {
-		if (!m) return;
-		let r = (e, t) => t.split(".").reduce((e, t) => e && typeof e == "object" ? e[t] : void 0, e);
-		if ("value" in m && m.value !== void 0) return m;
-		let i = _?.valueField;
-		if (i && typeof m == "object") {
-			let e = r(m, i);
-			if (e !== void 0) {
-				let t = _?.previousValueField, n = t ? r(m, t) : void 0;
+var g = c(function({ widget: c, data: g, onClick: _, onDrilldown: v }) {
+	let y = c.config, b = u(() => {
+		if (!g) return;
+		let e = (e, t) => t.split(".").reduce((e, t) => e && typeof e == "object" ? e[t] : void 0, e);
+		if ("value" in g && g.value !== void 0) return g;
+		let t = y?.valueField;
+		if (t && typeof g == "object") {
+			let n = e(g, t);
+			if (n !== void 0) {
+				let t = y?.previousValueField, r = t ? e(g, t) : void 0;
 				return {
-					value: e,
-					previousValue: n,
-					changePercent: n !== void 0 && typeof e == "number" ? (e - n) / n * 100 : void 0
+					value: n,
+					previousValue: r,
+					changePercent: r !== void 0 && typeof n == "number" ? (n - r) / r * 100 : void 0
 				};
 			}
 		}
@@ -63,12 +64,12 @@ var m = o(function({ widget: o, data: m, onClick: h, onDrilldown: g }) {
 			"totalRevenue",
 			"totalOrders"
 		];
-		for (let e of a) if (typeof m == "object" && e in m) {
-			let t = m[e];
+		for (let e of a) if (typeof g == "object" && e in g) {
+			let t = g[e];
 			if (typeof t == "number" || typeof t == "string") return { value: t };
 		}
-		if (typeof m == "object" && "summary" in m) {
-			let e = m.summary;
+		if (typeof g == "object" && "summary" in g) {
+			let e = g.summary;
 			if (e && typeof e == "object") {
 				for (let t of a) if (t in e) {
 					let n = e[t];
@@ -76,108 +77,108 @@ var m = o(function({ widget: o, data: m, onClick: h, onDrilldown: g }) {
 				}
 			}
 		}
-		if (typeof m == "number" || typeof m == "string") return { value: m };
-		let o = e(m);
+		if (typeof g == "number" || typeof g == "string") return { value: g };
+		let o = n(g);
 		if (o) {
-			let e = _?.valueField;
-			if (e) {
-				let t = n(m) ?? [o];
-				for (let n of t) if (n && typeof n == "object") {
-					let t = r(n, e);
-					if (typeof t == "number" || typeof t == "string") return { value: t };
+			let t = y?.valueField;
+			if (t) {
+				let n = i(g) ?? [o];
+				for (let r of n) if (r && typeof r == "object") {
+					let n = e(r, t);
+					if (typeof n == "number" || typeof n == "string") return { value: n };
 				}
 				return;
 			}
-			let i = t(o);
-			if (i) {
-				let e = o[i];
+			let n = r(o);
+			if (n) {
+				let e = o[n];
 				if (typeof e == "number" || typeof e == "string") return { value: e };
 			}
 		}
-	}, [m, _]), y = c(() => v?.trend || f(v?.changePercent), [v?.trend, v?.changePercent]), b = _?.positiveIsGood ?? !0, x = c(() => v?.value ? d(v.value, _) : "—", [v?.value, _]), S = c(() => p(y, b), [y, b]), C = s(() => {
-		g ? g({
-			value: v?.value,
-			changePercent: v?.changePercent,
-			trend: y,
-			target: v?.target
-		}) : h && o.drilldowns?.length && h();
+	}, [g, y]), x = u(() => b?.trend || m(b?.changePercent), [b?.trend, b?.changePercent]), S = y?.positiveIsGood ?? !0, C = u(() => b?.value ? p(b.value, y) : "—", [b?.value, y]), w = u(() => h(x, S), [x, S]), T = u(() => e(t(b?.value, y?.conditionalRules)), [b?.value, y?.conditionalRules]), E = l(() => {
+		v ? v({
+			value: b?.value,
+			changePercent: b?.changePercent,
+			trend: x,
+			target: b?.target
+		}) : _ && c.drilldowns?.length && _();
 	}, [
-		h,
-		g,
-		o.drilldowns,
+		_,
 		v,
-		y
-	]), w = !!(g || h && o.drilldowns?.length);
-	return /* @__PURE__ */ u("div", {
+		c.drilldowns,
+		b,
+		x
+	]), D = !!(v || _ && c.drilldowns?.length);
+	return /* @__PURE__ */ f("div", {
 		className: `
           flex flex-col h-full p-4
-          ${w ? "cursor-pointer hover:bg-bg-muted/50 transition-colors" : ""}
+          ${D ? "cursor-pointer hover:bg-bg-muted/50 transition-colors" : ""}
         `,
-		onClick: C,
-		role: w ? "button" : void 0,
-		tabIndex: w ? 0 : void 0,
+		onClick: E,
+		role: D ? "button" : void 0,
+		tabIndex: D ? 0 : void 0,
 		onKeyDown: (e) => {
-			w && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), C());
+			D && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), E());
 		},
 		children: [
-			_?.subtitle && /* @__PURE__ */ l("p", {
+			y?.subtitle && /* @__PURE__ */ d("p", {
 				className: "text-xs text-text-secondary mb-1 truncate",
-				children: _.subtitle
+				children: y.subtitle
 			}),
-			/* @__PURE__ */ u("div", {
+			/* @__PURE__ */ f("div", {
 				className: "flex items-baseline gap-2 mb-2",
-				children: [/* @__PURE__ */ l("span", {
-					className: "text-3xl font-semibold text-text-primary tracking-tight",
-					title: String(v?.value),
-					children: x
-				}), _?.showTrend !== !1 && v?.changePercent !== void 0 && /* @__PURE__ */ l(r, {
-					direction: y,
+				children: [/* @__PURE__ */ d("span", {
+					className: `text-3xl font-semibold tracking-tight ${T || "text-text-primary"}`,
+					title: String(b?.value),
+					children: C
+				}), y?.showTrend !== !1 && b?.changePercent !== void 0 && /* @__PURE__ */ d(a, {
+					direction: x,
 					size: "md",
-					positiveIsGood: b
+					positiveIsGood: S
 				})]
 			}),
-			_?.showComparison !== !1 && v?.changePercent !== void 0 && /* @__PURE__ */ l("div", {
+			y?.showComparison !== !1 && b?.changePercent !== void 0 && /* @__PURE__ */ d("div", {
 				className: "mb-3",
-				children: /* @__PURE__ */ l(i, {
-					value: v.changePercent,
-					label: _?.comparisonLabel,
-					positiveIsGood: b,
+				children: /* @__PURE__ */ d(o, {
+					value: b.changePercent,
+					label: y?.comparisonLabel,
+					positiveIsGood: S,
 					size: "sm"
 				})
 			}),
-			v?.target !== void 0 && typeof v.value == "number" && /* @__PURE__ */ u("div", {
+			b?.target !== void 0 && typeof b.value == "number" && /* @__PURE__ */ f("div", {
 				className: "mb-3",
-				children: [/* @__PURE__ */ u("div", {
+				children: [/* @__PURE__ */ f("div", {
 					className: "flex justify-between text-xs text-text-secondary mb-1",
-					children: [/* @__PURE__ */ u("span", { children: ["Target: ", d(v.target, _)] }), /* @__PURE__ */ u("span", { children: [(v.value / v.target * 100).toFixed(0), "%"] })]
-				}), /* @__PURE__ */ l("div", {
+					children: [/* @__PURE__ */ f("span", { children: ["Target: ", p(b.target, y)] }), /* @__PURE__ */ f("span", { children: [(b.value / b.target * 100).toFixed(0), "%"] })]
+				}), /* @__PURE__ */ d("div", {
 					className: "h-1.5 bg-bg-muted rounded-full overflow-hidden",
-					children: /* @__PURE__ */ l("div", {
-						className: `h-full rounded-full transition-all ${v.value >= v.target ? "bg-state-success" : "bg-action-primary-bg"}`,
-						style: { width: `${Math.min(v.value / v.target * 100, 100)}%` }
+					children: /* @__PURE__ */ d("div", {
+						className: `h-full rounded-full transition-all ${b.value >= b.target ? "bg-state-success" : "bg-action-primary-bg"}`,
+						style: { width: `${Math.min(b.value / b.target * 100, 100)}%` }
 					})
 				})]
 			}),
-			_?.showSparkline !== !1 && v?.sparklineData?.length ? /* @__PURE__ */ l("div", {
+			y?.showSparkline !== !1 && b?.sparklineData?.length ? /* @__PURE__ */ d("div", {
 				className: "mt-auto pt-2",
-				children: /* @__PURE__ */ l(a, {
-					data: v.sparklineData,
+				children: /* @__PURE__ */ d(s, {
+					data: b.sparklineData,
 					width: 120,
 					height: 32,
-					color: S,
+					color: w,
 					showFill: !0
 				})
 			}) : null,
-			w && /* @__PURE__ */ l("div", {
+			D && /* @__PURE__ */ d("div", {
 				className: "mt-auto pt-2 flex items-center justify-end",
-				children: /* @__PURE__ */ u("span", {
+				children: /* @__PURE__ */ f("span", {
 					className: "text-xs text-text-secondary flex items-center gap-1",
-					children: ["View details", /* @__PURE__ */ l("svg", {
+					children: ["View details", /* @__PURE__ */ d("svg", {
 						className: "w-3 h-3",
 						fill: "none",
 						stroke: "currentColor",
 						viewBox: "0 0 24 24",
-						children: /* @__PURE__ */ l("path", {
+						children: /* @__PURE__ */ d("path", {
 							strokeLinecap: "round",
 							strokeLinejoin: "round",
 							strokeWidth: 2,
@@ -190,6 +191,6 @@ var m = o(function({ widget: o, data: m, onClick: h, onDrilldown: g }) {
 	});
 });
 //#endregion
-export { m as default };
+export { g as default };
 
 //# sourceMappingURL=MetricCardWidget.js.map