awesome-heatmap 0.1.0

package/LICENSE

@@ -0,0 +1,23 @@
+MIT License
+
+Copyright (c) 2026
+AwesomeHeatmap Contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/README.md

@@ -0,0 +1,358 @@
+# awesome-heatmap
+
+A zero-dependency **heatmap grid** React component. Feed it any data shape — arrays of objects, REST API URLs, GeoJSON, CSV-style nested arrays — and it auto-extracts a numeric matrix, renders colour-coded cells, and gives you a full toolbar with colour scale picker, row sorting, cell size slider, theme switcher, and a floating tooltip. All styles are injected at runtime, so no CSS import is needed.
+
+---
+
+## Features
+
+- **Universal data ingestion** — arrays of objects, URL strings (JSON / REST API), GeoJSON FeatureCollections, CSV-style `[[headers], [row], ...]`, envelope-wrapped responses (`{ data: [...] }`, `{ results: [...] }`, etc.)
+- **Auto matrix extraction** — detects numeric columns (≥ 75% parseable values), picks the first non-numeric column as the row label, flattens nested objects up to 3 levels deep
+- **8 colour scales** — Plasma, Inferno, Viridis, Magma, Thermal, Ice, Red→Blue, Spectral — all using perceptually uniform control-point interpolation
+- **3 built-in themes** — `dark`, `light`, `ember` — all colours driven by CSS custom properties
+- **Toolbar controls** — colour scale dropdown with preview dots, row sort (original / A→Z / Z→A / sum↑ / sum↓), cell size slider (16–80px), show/hide cell values toggle, theme switcher
+- **Column header mini-bars** — each column header shows a colour-coded bar for its average value relative to the global range
+- **Sticky row labels + column headers** — both stay in view while scrolling a large matrix
+- **Floating tooltip** — shows row label, column label, formatted value, and a colour-matched progress bar
+- **Summary footer** — global Σ, x̄, max, min, and cell count
+- **IndexedDB preference persistence** — theme, scale, sort, cell size, and show-values are saved per `storageKey` and restored on next load
+- **Self-contained styles** — CSS Module replaced with a runtime-injected `<style>` tag; no stylesheet import required
+- **ESM + CJS dual build** — works in Vite, Next.js, CRA, and any modern bundler
+- **Zero runtime dependencies** beyond React
+
+---
+
+## Installation
+
+```bash
+npm install awesome-heatmap
+# or
+yarn add awesome-heatmap
+# or
+pnpm add awesome-heatmap
+```
+
+> **Peer dependencies** — React ≥ 18 and ReactDOM ≥ 18 must already be installed.
+
+---
+
+## Quick Start
+
+No CSS import needed — styles are injected automatically.
+
+```jsx
+import { AwesomeHeatmap } from 'awesome-heatmap';
+
+var data = [
+  { city: 'New York',  jan: 2,  feb: 4,  mar: 10, apr: 17, may: 23, jun: 28 },
+  { city: 'London',    jan: 5,  feb: 6,  mar: 9,  apr: 13, may: 17, jun: 20 },
+  { city: 'Tokyo',     jan: 6,  feb: 7,  mar: 11, apr: 17, may: 22, jun: 26 },
+  { city: 'Sydney',    jan: 26, feb: 26, mar: 23, apr: 18, may: 14, jun: 11 },
+  { city: 'Dubai',     jan: 19, feb: 21, mar: 25, apr: 33, may: 38, jun: 40 },
+];
+
+export default function App() {
+  return (
+    <div style={{ width: '100%', height: '500px' }}>
+      <AwesomeHeatmap
+        data={data}
+        title="Monthly Temperatures (°C)"
+      />
+    </div>
+  );
+}
+```
+
+---
+
+## Props
+
+| Prop | Type | Default | Description |
+|---|---|---|---|
+| `data` | `Array \| string` | `[]` | Data to visualise. Pass an array of objects, or a URL string pointing to a JSON endpoint. See [Data formats](#-data-formats) below. |
+| `title` | `string` | `'Heatmap'` | Title shown in the toolbar. |
+| `theme` | `'dark' \| 'light' \| 'ember'` | `'dark'` | Initial colour theme. User can switch at runtime via the toolbar. |
+| `colorScale` | `string` | `'plasma'` | Initial colour scale key. Must be one of the `COLOR_SCALES` keys. |
+| `storageKey` | `string` | `'awesome-heatmap'` | IndexedDB key used to persist and restore user preferences. Pass a unique value per instance. Set to `''` to disable persistence. |
+| `height` | `string \| number` | `'100%'` | CSS height of the component. Numbers are treated as px. |
+| `onThemeChange` | `(theme: string) => void` | — | Called whenever the user switches theme, with the new theme name. |
+
+---
+
+## Named Exports
+
+### `COLOR_SCALES`
+
+An object mapping scale keys to display labels. Use this to build your own scale picker or to pass a valid value to the `colorScale` prop.
+
+```js
+import { COLOR_SCALES } from 'awesome-heatmap';
+
+console.log(COLOR_SCALES);
+// {
+//   plasma:   "Plasma",
+//   inferno:  "Inferno",
+//   viridis:  "Viridis",
+//   magma:    "Magma",
+//   thermal:  "Thermal",
+//   ice:      "Ice",
+//   rdbu:     "Red → Blue",
+//   spectral: "Spectral",
+// }
+```
+
+### `PAGE_BG`
+
+An object mapping theme names to their recommended outer page background colours. Useful for styling the page wrapper to match the heatmap.
+
+```js
+import { PAGE_BG } from 'awesome-heatmap';
+
+console.log(PAGE_BG);
+// { dark: "#04060c", light: "#e0e5f0", ember: "#070402" }
+```
+
+---
+
+## Data Formats
+
+AwesomeHeatmap accepts data in many shapes and normalises them automatically.
+
+### Array of objects (recommended)
+
+```js
+var data = [
+  { product: 'Shoes',  mon: 120, tue: 95,  wed: 143 },
+  { product: 'Bags',   mon: 88,  tue: 112, wed: 76  },
+  { product: 'Hats',   mon: 54,  tue: 67,  wed: 91  },
+];
+```
+
+The first non-numeric column (`product`) becomes the row label. All numeric columns become the heatmap columns.
+
+### URL string — JSON endpoint
+
+```jsx
+<AwesomeHeatmap data="https://api.example.com/metrics" title="Server Metrics" />
+```
+
+The component fetches the URL, then unwraps common envelope keys (`data`, `results`, `items`, `rows`, etc.) automatically.
+
+### Envelope-wrapped response
+
+```json
+{ "results": [ { "region": "APAC", "q1": 4.2, "q2": 5.1, "q3": 3.8 } ] }
+```
+
+### CSV-style nested arrays (first row = headers)
+
+```js
+var data = [
+  ['city',      'q1',  'q2',  'q3',  'q4'],
+  ['Berlin',    8.2,   14.1,  19.3,  9.5 ],
+  ['Paris',     9.1,   15.0,  20.2,  10.1],
+  ['Madrid',    11.5,  17.3,  24.8,  13.2],
+];
+```
+
+### GeoJSON FeatureCollection
+
+```js
+var geojson = {
+  type: 'FeatureCollection',
+  features: [
+    { type: 'Feature', geometry: { type: 'Point', coordinates: [0,0] }, properties: { name: 'A', value: 42 } },
+  ],
+};
+```
+
+Properties are extracted automatically; the geometry is ignored.
+
+---
+
+## Examples
+
+### Example 1 — Dark theme with Viridis scale and persistence disabled
+
+```jsx
+import { AwesomeHeatmap } from 'awesome-heatmap';
+
+var salesData = [
+  { rep: 'Alice',   jan: 42000, feb: 38000, mar: 51000, apr: 47000, may: 55000, jun: 61000 },
+  { rep: 'Bob',     jan: 31000, feb: 44000, mar: 39000, apr: 52000, may: 48000, jun: 43000 },
+  { rep: 'Carol',   jan: 58000, feb: 62000, mar: 55000, apr: 67000, may: 71000, jun: 69000 },
+  { rep: 'David',   jan: 27000, feb: 31000, mar: 35000, apr: 29000, may: 38000, jun: 42000 },
+  { rep: 'Eva',     jan: 49000, feb: 53000, mar: 61000, apr: 58000, may: 64000, jun: 72000 },
+  { rep: 'Frank',   jan: 36000, feb: 41000, mar: 38000, apr: 44000, may: 46000, jun: 50000 },
+];
+
+export default function SalesDashboard() {
+  return (
+    <div style={{ width: '100%', height: '480px', borderRadius: 16, overflow: 'hidden' }}>
+      <AwesomeHeatmap
+        data={salesData}
+        title="Sales by Rep — H1"
+        theme="dark"
+        colorScale="viridis"
+        storageKey=""
+      />
+    </div>
+  );
+}
+```
+
+---
+
+### Example 2 — Light theme, live data from a REST API, `onThemeChange` callback
+
+```jsx
+import { useState } from 'react';
+import { AwesomeHeatmap, PAGE_BG } from 'awesome-heatmap';
+
+export default function LiveMetrics() {
+  var [theme, setTheme] = useState('light');
+
+  return (
+    <div style={{ background: PAGE_BG[theme], minHeight: '100vh', padding: 32, transition: 'background 0.4s' }}>
+      <div style={{ width: '100%', height: '600px', borderRadius: 20, overflow: 'hidden', boxShadow: '0 4px 24px rgba(0,0,0,0.12)' }}>
+        <AwesomeHeatmap
+          data="https://jsonplaceholder.typicode.com/users"
+          title="User Metrics (live)"
+          theme={theme}
+          colorScale="thermal"
+          storageKey="live-metrics-heatmap"
+          onThemeChange={function(t) { setTheme(t); }}
+        />
+      </div>
+    </div>
+  );
+}
+```
+
+---
+
+### Example 3 — Ember theme, CSV-style array, controlled height, multiple instances
+
+```jsx
+import { AwesomeHeatmap, COLOR_SCALES } from 'awesome-heatmap';
+
+var weeklyTraffic = [
+  ['page',       'mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'],
+  ['Home',       9420,  8830,  9210,  9640,  11200, 8100,  7300],
+  ['Products',   4210,  4650,  4120,  4980,  5340,  3800,  3200],
+  ['Blog',       2100,  2340,  2890,  2670,  2450,  3100,  2900],
+  ['Pricing',    1840,  2010,  1950,  2200,  2680,  1400,  1100],
+  ['Contact',    820,   910,   880,   970,   1050,  640,   580 ],
+  ['Docs',       3400,  3800,  4200,  4100,  3900,  2200,  1900],
+];
+
+var teamPerformance = [
+  ['team',       'sprints_completed', 'bugs_closed', 'prs_merged', 'reviews_done', 'deploys'],
+  ['Frontend',   8,   24,  31,  42,  12],
+  ['Backend',    6,   38,  22,  28,   9],
+  ['Mobile',     7,   19,  17,  24,   6],
+  ['DevOps',     5,   11,   8,  15,  28],
+  ['Data',       4,   14,  12,  18,   4],
+];
+
+export default function MultiHeatmap() {
+  return (
+    <div style={{ background: '#070402', minHeight: '100vh', padding: 32, display: 'flex', flexDirection: 'column', gap: 24 }}>
+
+      <div style={{ height: 420, borderRadius: 16, overflow: 'hidden' }}>
+        <AwesomeHeatmap
+          data={weeklyTraffic}
+          title="Weekly Page Traffic"
+          theme="ember"
+          colorScale="plasma"
+          storageKey="traffic-heatmap"
+        />
+      </div>
+
+      <div style={{ height: 360, borderRadius: 16, overflow: 'hidden' }}>
+        <AwesomeHeatmap
+          data={teamPerformance}
+          title="Team Performance — Current Sprint"
+          theme="ember"
+          colorScale="inferno"
+          storageKey="team-heatmap"
+        />
+      </div>
+
+      {/* Display available colour scales */}
+      <div style={{ color: '#a0836a', fontFamily: 'monospace', fontSize: 12 }}>
+        Available scales: {Object.keys(COLOR_SCALES).join(', ')}
+      </div>
+    </div>
+  );
+}
+```
+
+---
+
+No separate CSS file is produced. All styles are bundled as a JavaScript string and injected into `<head>` when the component first mounts.
+
+
+## Toolbar Controls
+
+| Control | Description |
+|---|---|
+| **Cell size slider** | Resize all cells from 16px to 80px. Values are shown inside cells when size ≥ 28px and the eye toggle is on. |
+| **Eye toggle** | Show or hide numeric values inside each cell. |
+| **Colour scale dropdown** | Switch between the 8 available scales. Each option shows a preview strip. |
+| **Sort dropdown** | Sort rows by: original order, label A→Z / Z→A, or row sum ascending / descending. |
+| **Theme dots** | Switch between Dark (blue), Light (indigo), and Ember (orange) themes. |
+
+---
+
+## CSS Custom Properties
+
+All visual tokens are CSS custom properties set on the root element. Override them per-instance via a wrapper class:
+
+```css
+.my-heatmap-wrapper {
+  --hm-bg:        #0a0a0a;
+  --hm-surface:   #141414;
+  --hm-surface2:  #1c1c1c;
+  --hm-surface3:  #242424;
+  --hm-border:    rgba(255,255,255,0.06);
+  --hm-border2:   rgba(255,255,255,0.12);
+  --hm-text1:     #f0f0f0;
+  --hm-text2:     #888;
+  --hm-text3:     #444;
+  --hm-accent:    #7c3aed;
+  --hm-accentbg:  rgba(124,58,237,0.12);
+  --hm-shadow:    0 8px 40px rgba(0,0,0,0.7);
+}
+```
+
+Then wrap the component:
+
+```jsx
+<div className="my-heatmap-wrapper" style={{ height: 500 }}>
+  <AwesomeHeatmap data={data} />
+</div>
+```
+
+---
+
+## Preference Persistence
+
+User preferences (theme, colour scale, sort order, cell size, show-values toggle) are automatically saved to IndexedDB under the `storageKey` and restored on the next mount. To use multiple independent instances on the same page, pass a unique `storageKey` to each:
+
+```jsx
+<AwesomeHeatmap data={salesData}    storageKey="sales-heatmap" />
+<AwesomeHeatmap data={trafficData}  storageKey="traffic-heatmap" />
+```
+
+To disable persistence entirely, pass an empty string:
+
+```jsx
+<AwesomeHeatmap data={data} storageKey="" />
+```
+
+---
+
+## License
+
+MIT

package/dist/cjs/index.js

@@ -0,0 +1,215 @@
+"use strict";const t=require("react/jsx-runtime"),c=require("react"),e="ahm",B=(...s)=>s.filter(Boolean).join(" "),ue=`
+@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Outfit:wght@400;500;600;700&display=swap");
+
+.${e}-root {
+  display: flex; flex-direction: column; overflow: hidden;
+  background: var(--hm-bg); color: var(--hm-text1);
+  font-family: "Outfit", sans-serif;
+  border-radius: 16px; box-shadow: var(--hm-shadow);
+  position: relative; container-type: inline-size;
+}
+.${e}-toolbar {
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 0 16px; height: 52px; flex-shrink: 0;
+  border-bottom: 1px solid var(--hm-border);
+  background: var(--hm-surface); gap: 12px;
+}
+.${e}-toolbarL { display: flex; align-items: center; gap: 10px; overflow: hidden; }
+.${e}-toolbarR { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
+.${e}-logoMark { display: flex; align-items: center; flex-shrink: 0; }
+.${e}-title {
+  font-family: "Outfit", sans-serif; font-size: 15px; font-weight: 600;
+  color: var(--hm-text1); white-space: nowrap; overflow: hidden;
+  text-overflow: ellipsis; letter-spacing: -.01em;
+}
+.${e}-dimBadge {
+  font-family: "IBM Plex Mono", monospace; font-size: 11px; font-weight: 500;
+  color: var(--hm-text3); background: var(--hm-surface2);
+  border: 1px solid var(--hm-border); border-radius: 6px;
+  padding: 2px 8px; white-space: nowrap; letter-spacing: .03em; flex-shrink: 0;
+}
+.${e}-sizeControl { display: flex; align-items: center; gap: 5px; color: var(--hm-text3); }
+.${e}-sizeIcon { flex-shrink: 0; }
+.${e}-sizeSlider { width: 72px; accent-color: var(--hm-accent); cursor: pointer; height: 3px; }
+.${e}-iconBtn {
+  display: flex; align-items: center; justify-content: center;
+  width: 30px; height: 30px; border-radius: 8px;
+  border: 1px solid var(--hm-border); background: var(--hm-surface2);
+  color: var(--hm-text2); cursor: pointer; transition: all .14s; flex-shrink: 0;
+}
+.${e}-iconBtn:hover { border-color: var(--hm-border2); color: var(--hm-text1); }
+.${e}-iconBtnOn { background: var(--hm-accentbg) !important; border-color: var(--hm-accent) !important; color: var(--hm-accent) !important; }
+.${e}-dropdownWrap { position: relative; }
+.${e}-dropBtn {
+  display: flex; align-items: center; gap: 6px; padding: 5px 10px;
+  border-radius: 8px; border: 1px solid var(--hm-border);
+  background: var(--hm-surface2); color: var(--hm-text1);
+  font-family: "Outfit", sans-serif; font-size: 12px; font-weight: 500;
+  cursor: pointer; white-space: nowrap; transition: all .14s; height: 30px;
+}
+.${e}-dropBtn:hover { border-color: var(--hm-border2); }
+.${e}-dropBtnOn { border-color: var(--hm-accent) !important; background: var(--hm-accentbg) !important; }
+.${e}-dropBtnLabel { font-size: 11.5px; color: var(--hm-text2); max-width: 90px; overflow: hidden; text-overflow: ellipsis; }
+.${e}-dropArrow { color: var(--hm-text3); flex-shrink: 0; }
+.${e}-dropdown {
+  position: absolute; right: 0; top: calc(100% + 6px); z-index: 500;
+  background: var(--hm-surface); border: 1px solid var(--hm-border2);
+  border-radius: 10px; box-shadow: var(--hm-shadow);
+  padding: 4px; min-width: 170px; display: flex; flex-direction: column; gap: 1px;
+}
+.${e}-dropItem {
+  display: flex; align-items: center; gap: 8px; padding: 7px 10px;
+  border-radius: 7px; border: none; background: none;
+  color: var(--hm-text1); font-family: "Outfit", sans-serif;
+  font-size: 12.5px; font-weight: 500; cursor: pointer;
+  text-align: left; transition: background .10s; white-space: nowrap;
+}
+.${e}-dropItem:hover { background: var(--hm-surface2); }
+.${e}-dropItemOn { background: var(--hm-accentbg) !important; color: var(--hm-accent) !important; }
+.${e}-scalePreview { display: flex; gap: 2px; align-items: center; flex-shrink: 0; }
+.${e}-scalePreviewDot { width: 10px; height: 10px; border-radius: 2px; display: inline-block; flex-shrink: 0; }
+.${e}-themeToggle { display: flex; gap: 5px; margin-left: 4px; }
+.${e}-themeBtn {
+  width: 14px; height: 14px; border-radius: 50%;
+  border: 2px solid transparent; background: var(--dot);
+  cursor: pointer; transition: all .15s; flex-shrink: 0; padding: 0;
+}
+.${e}-themeBtn:hover { transform: scale(1.25); }
+.${e}-themeBtnOn { border-color: var(--hm-text1) !important; transform: scale(1.2); box-shadow: 0 0 0 1px var(--hm-bg); }
+.${e}-body { flex: 1; overflow: hidden; display: flex; flex-direction: column; position: relative; }
+.${e}-stateWrap {
+  flex: 1; display: flex; flex-direction: column;
+  align-items: center; justify-content: center;
+  gap: 12px; color: var(--hm-text2); font-size: 14px; padding: 40px 20px;
+}
+.${e}-stateHint { font-size: 12.5px; color: var(--hm-text3); text-align: center; max-width: 360px; line-height: 1.6; }
+.${e}-stateHint code {
+  font-family: "IBM Plex Mono", monospace; font-size: 11px;
+  background: var(--hm-surface2); padding: 1px 5px;
+  border-radius: 4px; color: var(--hm-accent);
+}
+.${e}-spinner {
+  width: 28px; height: 28px;
+  border: 2.5px solid var(--hm-border2);
+  border-top-color: var(--hm-accent);
+  border-radius: 50%;
+  animation: ${e}-spin .65s linear infinite;
+}
+@keyframes ${e}-spin { to { transform: rotate(360deg); } }
+.${e}-errBanner {
+  margin: 16px; padding: 12px 16px;
+  background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.25);
+  border-radius: 10px; color: #f87171; font-size: 13px; line-height: 1.5;
+}
+.${e}-heatmapWrap { flex: 1; overflow: hidden; display: flex; flex-direction: column; }
+.${e}-colHeaderRow {
+  display: flex; align-items: flex-end; padding-bottom: 2px;
+  border-bottom: 1px solid var(--hm-border); flex-shrink: 0;
+  background: var(--hm-bg); position: sticky; top: 0; z-index: 20; overflow: hidden;
+}
+.${e}-cornerCell { width: 140px; min-width: 140px; flex-shrink: 0; }
+.${e}-colHeader {
+  flex-shrink: 0; display: flex; flex-direction: column;
+  align-items: center; justify-content: flex-end;
+  padding-bottom: 4px; height: 72px; position: relative;
+  transition: background .12s; border-radius: 4px 4px 0 0;
+}
+.${e}-colHeaderOn { background: var(--hm-accentbg) !important; }
+.${e}-colHeaderText {
+  font-family: "IBM Plex Mono", monospace; font-size: 10px; font-weight: 500;
+  color: var(--hm-text2); writing-mode: vertical-rl; transform: rotate(180deg);
+  white-space: nowrap; overflow: hidden; max-height: 56px;
+  text-overflow: ellipsis; letter-spacing: .02em; line-height: 1;
+  padding-bottom: 2px; transition: color .12s;
+}
+.${e}-colHeaderOn .${e}-colHeaderText { color: var(--hm-text1) !important; }
+.${e}-colMiniBar {
+  width: 100%; height: 3px; background: var(--hm-surface3);
+  margin-top: 3px; border-radius: 2px; overflow: hidden;
+  display: flex; align-items: flex-end;
+}
+.${e}-colMiniBarFill { width: 100%; border-radius: 2px; transition: height .3s ease; }
+.${e}-grid {
+  flex: 1; overflow: auto;
+  scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.08) transparent;
+}
+.${e}-grid::-webkit-scrollbar { width: 5px; height: 5px; }
+.${e}-grid::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); border-radius: 4px; }
+.${e}-row { display: flex; align-items: stretch; }
+.${e}-row:hover .${e}-rowLabel { color: var(--hm-text1); background: var(--hm-accentbg); }
+.${e}-rowLabel {
+  width: 140px; min-width: 140px; flex-shrink: 0;
+  font-family: "IBM Plex Mono", monospace; font-size: 10.5px; font-weight: 400;
+  color: var(--hm-text2); padding: 0 10px; display: flex; align-items: center;
+  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  border-right: 1px solid var(--hm-border); background: var(--hm-bg);
+  position: sticky; left: 0; z-index: 10; transition: all .12s; letter-spacing: .01em;
+}
+.${e}-rowLabelOn { color: var(--hm-text1) !important; background: var(--hm-accentbg) !important; }
+.${e}-cell {
+  display: flex; align-items: center; justify-content: center;
+  flex-shrink: 0; cursor: crosshair;
+  transition: outline .08s, filter .08s;
+  outline: 2px solid transparent; outline-offset: -1px;
+  position: relative; background: var(--hm-surface3);
+}
+.${e}-cell:hover { outline-color: rgba(255,255,255,.6); z-index: 5; filter: brightness(1.15); }
+.${e}-cellVal {
+  font-family: "IBM Plex Mono", monospace; font-size: 9px; font-weight: 600;
+  letter-spacing: -.01em; pointer-events: none;
+  text-shadow: 0 1px 2px rgba(0,0,0,.3); line-height: 1;
+  max-width: 100%; overflow: hidden; text-overflow: ellipsis;
+  white-space: nowrap; padding: 0 2px;
+}
+.${e}-cellNull { font-family: "IBM Plex Mono", monospace; font-size: 11px; color: var(--hm-text3); opacity: .4; }
+.${e}-footer {
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 8px 12px; border-top: 1px solid var(--hm-border);
+  background: var(--hm-surface); flex-shrink: 0; gap: 16px; flex-wrap: wrap;
+}
+.${e}-legend { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
+.${e}-legendMin, .${e}-legendMax {
+  font-family: "IBM Plex Mono", monospace; font-size: 10px;
+  color: var(--hm-text3); white-space: nowrap; min-width: 32px;
+}
+.${e}-legendMax { text-align: right; }
+.${e}-legendBar { border-radius: 4px; display: block; height: 12px; width: 140px; flex-shrink: 0; }
+.${e}-summaryStats { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
+.${e}-statItem {
+  font-family: "IBM Plex Mono", monospace; font-size: 11px;
+  color: var(--hm-text2); display: flex; align-items: center; gap: 4px; white-space: nowrap;
+}
+.${e}-statItem span:first-child { color: var(--hm-text3); font-size: 10px; }
+.${e}-statNulls { font-family: "IBM Plex Mono", monospace; font-size: 10px; color: var(--hm-text3); white-space: nowrap; }
+.${e}-tooltip {
+  position: fixed; z-index: 9999; pointer-events: none;
+  background: var(--hm-surface); border: 1px solid var(--hm-border2);
+  border-radius: 10px; box-shadow: var(--hm-shadow);
+  padding: 0; overflow: hidden; min-width: 180px; max-width: 260px;
+  animation: ${e}-ttIn .1s ease;
+}
+@keyframes ${e}-ttIn {
+  from { opacity: 0; transform: scale(.96) translateY(3px); }
+  to   { opacity: 1; transform: scale(1)  translateY(0); }
+}
+.${e}-ttBody { padding: 12px 14px; display: flex; flex-direction: column; gap: 5px; }
+.${e}-ttRow { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
+.${e}-ttKey {
+  font-family: "Outfit", sans-serif; font-size: 10px; font-weight: 600;
+  text-transform: uppercase; letter-spacing: .07em; color: var(--hm-text3); flex-shrink: 0;
+}
+.${e}-ttVal {
+  font-family: "IBM Plex Mono", monospace; font-size: 12.5px; font-weight: 500;
+  color: var(--hm-text1); text-align: right; overflow: hidden;
+  text-overflow: ellipsis; white-space: nowrap; max-width: 140px;
+}
+.${e}-ttDivider { height: 1px; background: var(--hm-border); margin: 2px 0; }
+.${e}-ttBar { height: 4px; background: var(--hm-surface3); border-radius: 3px; overflow: hidden; margin-top: 3px; }
+.${e}-ttBarFill { height: 100%; border-radius: 3px; transition: width .15s ease; }
+/* Theme variants */
+.${e}-themeLight .${e}-grid::-webkit-scrollbar-thumb { background: rgba(0,0,0,.12); }
+.${e}-themeLight .${e}-cell:hover { outline-color: rgba(0,0,0,.5); }
+.${e}-themeEmber .${e}-grid::-webkit-scrollbar-thumb { background: rgba(255,100,20,.12); }
+.${e}-themeEmber .${e}-cell:hover { outline-color: rgba(255,160,60,.6); }
+`;function ge(){const s="__ahm_styles__";if(typeof document>"u"||document.getElementById(s))return;const o=document.createElement("style");o.id=s,o.textContent=ue,document.head.appendChild(o)}const be=s=>String(s??"").replace(/([a-z])([A-Z])/g,"$1 $2").replace(/[_\-]+/g," ").replace(/\b\w/g,o=>o.toUpperCase()).trim()||String(s),we=s=>String(s??"").trim().replace(/[_\s\-]+(.)?/g,(o,a)=>a?a.toUpperCase():"").replace(/^(.)/,o=>o.toLowerCase()),ne=(s,o="",a=0)=>a>3||typeof s!="object"||s===null?{[o]:s}:Object.entries(s).reduce((n,[d,l])=>{const x=o?`${o}_${d}`:d;return typeof l=="object"&&l!==null&&!Array.isArray(l)&&a<3?{...n,...ne(l,x,a+1)}:{...n,[x]:l}},{}),$e=s=>{const o=ne(s);return Object.fromEntries(Object.entries(o).map(([a,n])=>[we(a),n]))},se=["data","items","results","rows","records","list","content","payload","body","response","output","dataset","datasets","values","entries"],ve=s=>{if(!s)return[];if(Array.isArray(s)){if(!s.length)return[];const o=s[0];if(typeof o!="object"||o===null)return s.map((a,n)=>({index:n,value:a}));if(Array.isArray(o)){const a=o.map((n,d)=>n!=null?String(n):`col${d}`);return s.slice(1).map(n=>{const d={};return a.forEach((l,x)=>{d[l]=n[x]??null}),d})}return s}if(s.type==="FeatureCollection"&&Array.isArray(s.features))return s.features.filter(o=>(o==null?void 0:o.properties)&&typeof o.properties=="object").map(o=>{var a;return{...o.properties,_geomType:(a=o.geometry)==null?void 0:a.type}});for(const o of se){if(Array.isArray(s[o]))return s[o];if(s[o]&&typeof s[o]=="object"){for(const a of se)if(Array.isArray(s[o][a]))return s[o][a]}}return typeof s=="object"?[s]:[]},ye=s=>{if(s==null||s==="")return!1;const o=parseFloat(String(s).replace(/[,$%\s€£¥]/g,""));return!isNaN(o)&&isFinite(o)},je=s=>{if(s==null||s==="")return null;const o=parseFloat(String(s).replace(/[,$%\s€£¥]/g,""));return isNaN(o)?null:o},ke=s=>{if(!s.length)return null;const o=s.slice(0,200),a=[...new Set(o.flatMap(Object.keys))],n=a.filter(w=>{const f=o.map(k=>k[w]).filter(k=>k!=null&&k!=="");return f.length?f.filter(ye).length/f.length>.75:!1}),d=a.find(w=>!n.includes(w))??null;if(!n.length)return null;const l=s,x=n,v=l.map((w,f)=>d?String(w[d]??`Row ${f+1}`):`Row ${f+1}`),j=x.map(be),b=l.map(w=>x.map(f=>je(w[f])));let g=1/0,$=-1/0;return b.forEach(w=>w.forEach(f=>{f!==null&&(f<g&&(g=f),f>$&&($=f))})),isFinite(g)||(g=0,$=1),g===$&&(g=g-1,$=$+1),{rows:l,cols:x,rowLabels:v,colLabels:j,values:b,min:g,max:$,labelKey:d}},_={plasma:"Plasma",inferno:"Inferno",viridis:"Viridis",magma:"Magma",thermal:"Thermal",ice:"Ice",rdbu:"Red → Blue",spectral:"Spectral"},Ne=(s,o)=>{const a=s.length-1,n=Math.min(Math.floor(o*a),a-1),d=o*a-n,[l,x,v]=s[n],[j,b,g]=s[n+1];return[Math.round(l+(j-l)*d),Math.round(x+(b-x)*d),Math.round(v+(g-v)*d)]},oe={plasma:[[13,8,135],[84,2,163],[139,10,165],[185,50,137],[219,92,104],[244,136,73],[254,188,43],[240,249,33]],inferno:[[0,0,4],[40,11,84],[101,21,110],[159,42,99],[212,72,66],[245,125,21],[250,193,39],[252,255,164]],viridis:[[68,1,84],[72,40,120],[62,83,160],[49,120,183],[38,153,180],[31,183,152],[122,209,81],[253,231,37]],magma:[[0,0,4],[28,16,68],[79,18,123],[129,37,129],[181,54,122],[229,80,100],[251,135,97],[252,253,191]],thermal:[[4,35,51],[23,84,107],[60,146,153],[99,197,174],[162,220,193],[218,241,211],[246,210,169],[249,142,82],[214,41,21]],ice:[[4,0,46],[32,20,115],[66,59,170],[103,107,211],[142,156,232],[181,205,247],[215,238,255],[252,255,255]],rdbu:[[178,24,43],[214,96,77],[244,165,130],[253,219,199],[209,229,240],[146,197,222],[67,147,195],[33,102,172]],spectral:[[158,1,66],[213,62,79],[244,109,67],[253,174,97],[254,224,139],[230,245,152],[171,221,164],[102,194,165],[50,136,189],[94,79,162]]},E=(s,o)=>Ne(oe[s]??oe.plasma,Math.max(0,Math.min(1,o))),H=([s,o,a])=>`rgb(${s},${o},${a})`,S={dark:{"--hm-bg":"#080c14","--hm-surface":"#0e1521","--hm-surface2":"#141d2e","--hm-surface3":"#1a243b","--hm-border":"rgba(255,255,255,.07)","--hm-border2":"rgba(255,255,255,.13)","--hm-text1":"#e4eaf8","--hm-text2":"#6b7a9e","--hm-text3":"#3a445e","--hm-accent":"#4f7cff","--hm-accentbg":"rgba(79,124,255,.12)","--hm-shadow":"0 8px 40px rgba(0,0,0,.6)","--hm-page-bg":"#04060c"},light:{"--hm-bg":"#f0f2f7","--hm-surface":"#ffffff","--hm-surface2":"#e8ecf5","--hm-surface3":"#dde2ee","--hm-border":"rgba(0,0,0,.08)","--hm-border2":"rgba(0,0,0,.14)","--hm-text1":"#0d1324","--hm-text2":"#4a5370","--hm-text3":"#99a3bc","--hm-accent":"#2f5cf0","--hm-accentbg":"rgba(47,92,240,.09)","--hm-shadow":"0 4px 24px rgba(0,0,0,.10)","--hm-page-bg":"#e0e5f0"},ember:{"--hm-bg":"#0e0804","--hm-surface":"#170e06","--hm-surface2":"#1f1408","--hm-surface3":"#271a0a","--hm-border":"rgba(255,160,60,.08)","--hm-border2":"rgba(255,160,60,.16)","--hm-text1":"#faebd7","--hm-text2":"#a0836a","--hm-text3":"#5a3d2a","--hm-accent":"#ff7a2f","--hm-accentbg":"rgba(255,122,47,.13)","--hm-shadow":"0 8px 40px rgba(80,20,0,.7)","--hm-page-bg":"#070402"}};S.dark["--hm-page-bg"],S.light["--hm-page-bg"],S.ember["--hm-page-bg"];const ie="awesome-heatmap",z="prefs",Me=s=>new Promise(o=>{try{const a=indexedDB.open(ie,1);a.onupgradeneeded=n=>n.target.result.createObjectStore(z),a.onsuccess=n=>{try{const l=n.target.result.transaction(z,"readonly").objectStore(z).get(s);l.onsuccess=()=>o(l.result??null),l.onerror=()=>o(null)}catch{o(null)}},a.onerror=()=>o(null)}catch{o(null)}}),Se=(s,o)=>new Promise(a=>{try{const n=indexedDB.open(ie,1);n.onupgradeneeded=d=>d.target.result.createObjectStore(z),n.onsuccess=d=>{try{const l=d.target.result.transaction(z,"readwrite");l.objectStore(z).put(o,s),l.oncomplete=()=>a(!0),l.onerror=()=>a(!1)}catch{a(!1)}},n.onerror=()=>a(!1)}catch{a(!1)}}),C=s=>s==null?"—":Math.abs(s)>=1e6?(s/1e6).toFixed(2)+"M":Math.abs(s)>=1e3?(s/1e3).toFixed(1)+"K":Number.isInteger(s)?String(s):s.toFixed(2),ae=[{id:"none",label:"Original order"},{id:"rowAsc",label:"Row A → Z"},{id:"rowDesc",label:"Row Z → A"},{id:"sumAsc",label:"Row sum ↑"},{id:"sumDesc",label:"Row sum ↓"}];function Be({content:s,x:o,y:a,visible:n,theme:d}){const l=c.useRef(null),[x,v]=c.useState({top:0,left:0});return c.useEffect(()=>{if(!n||!l.current)return;const j=l.current,b=window.innerWidth,g=window.innerHeight,$=j.offsetWidth||200,w=j.offsetHeight||80,f=14;let k=o+f,y=a-w/2;k+$>b-8&&(k=o-$-f),y<8&&(y=8),y+w>g-8&&(y=g-w-8),v({top:y,left:k})},[o,a,n,s]),n?t.jsx("div",{ref:l,className:`${e}-tooltip`,style:{...S[d],top:x.top,left:x.left},children:s}):null}function Le({scale:s,min:o,max:a,theme:n}){const d=S[n]??S.dark,l=c.useRef(null);return c.useEffect(()=>{const x=l.current;if(!x)return;const v=x.getContext("2d"),j=x.width;for(let b=0;b<j;b++){const[g,$,w]=E(s,b/(j-1));v.fillStyle=`rgb(${g},${$},${w})`,v.fillRect(b,0,1,x.height)}},[s]),t.jsxs("div",{className:`${e}-legend`,style:d,children:[t.jsx("span",{className:`${e}-legendMin`,children:C(o)}),t.jsx("canvas",{ref:l,width:200,height:12,className:`${e}-legendBar`}),t.jsx("span",{className:`${e}-legendMax`,children:C(a)})]})}const Ce=c.memo(function({value:o,t:a,scaleName:n,showVal:d,cellSize:l,onEnter:x,onLeave:v}){if(o===null)return t.jsx("div",{className:`${e}-cell`,style:{width:l,height:l},onMouseEnter:x,onMouseLeave:v,children:t.jsx("span",{className:`${e}-cellNull`,children:"·"})});const[j,b,g]=E(n,a),w=.299*j+.587*b+.114*g>140?"rgba(0,0,0,.85)":"rgba(255,255,255,.9)";return t.jsx("div",{className:`${e}-cell`,style:{width:l,height:l,background:`rgb(${j},${b},${g})`,color:w},onMouseEnter:x,onMouseLeave:v,children:d&&t.jsx("span",{className:`${e}-cellVal`,children:C(o)})})});function Oe({data:s=[],title:o="Heatmap",theme:a="dark",colorScale:n="plasma",storageKey:d="awesome-heatmap",height:l="100%",onThemeChange:x=null}){var te;ge();const[v,j]=c.useState([]),[b,g]=c.useState(!1),[$,w]=c.useState("");c.useEffect(()=>{let r=!1;return(async()=>{g(!0),w("");try{let h;if(typeof s=="string"){const m=await fetch(s);if(!m.ok)throw new Error(`HTTP ${m.status} — ${s}`);h=await m.json()}else h=s;const u=ve(h).map($e);r||j(u)}catch(h){r||w(h.message)}finally{r||g(!1)}})(),()=>{r=!0}},[s]);const[f,k]=c.useState(a),[y,V]=c.useState(n),[M,q]=c.useState("none"),[R,K]=c.useState(!1),[L,U]=c.useState(40),[Ee,Z]=c.useState(null),[W,F]=c.useState({visible:!1,content:null,x:0,y:0}),[X,P]=c.useState(!1),[G,D]=c.useState(!1),[le,J]=c.useState(null),[ce,Q]=c.useState(null),T=c.useRef(!1),I=S[f]??S.dark;c.useEffect(()=>{d&&Me(d).then(r=>{if(!r){T.current=!0;return}r.theme&&S[r.theme]&&k(r.theme),r.scale&&_[r.scale]&&V(r.scale),r.sortMode&&q(r.sortMode),typeof r.showVals=="boolean"&&K(r.showVals),r.cellSize&&r.cellSize>=16&&U(r.cellSize),T.current=!0})},[d]),c.useEffect(()=>{!d||!T.current||Se(d,{theme:f,scale:y,sortMode:M,showVals:R,cellSize:L})},[d,f,y,M,R,L]),c.useEffect(()=>{S[a]&&(k(a),x==null||x(a))},[a,x]),c.useEffect(()=>{_[n]&&V(n)},[n]);const i=c.useMemo(()=>ke(v),[v]),Y=c.useMemo(()=>{if(!i)return[];const r=i.rows.length,p=Array.from({length:r},(u,m)=>m);if(M==="none")return p;if(M==="rowAsc")return[...p].sort((u,m)=>String(i.rowLabels[u]).localeCompare(String(i.rowLabels[m])));if(M==="rowDesc")return[...p].sort((u,m)=>String(i.rowLabels[m]).localeCompare(String(i.rowLabels[u])));const h=u=>i.values[u].reduce((m,A)=>m+(A??0),0);return M==="sumAsc"?[...p].sort((u,m)=>h(u)-h(m)):M==="sumDesc"?[...p].sort((u,m)=>h(m)-h(u)):p},[i,M]),ee=c.useMemo(()=>i?i.cols.map((r,p)=>{const h=i.values.map(m=>m[p]).filter(m=>m!==null);if(!h.length)return{min:0,max:0,avg:0,sum:0};const u=h.reduce((m,A)=>m+A,0);return{min:Math.min(...h),max:Math.max(...h),avg:u/h.length,sum:u}}):[],[i]),O=c.useCallback(r=>!i||r===null?0:(r-i.min)/(i.max-i.min),[i]),de=r=>{k(r),x==null||x(r)},he=c.useCallback((r,p,h)=>{var re;if(!i)return;const u=Y[r],m=(re=i.values[u])==null?void 0:re[p],A=i.rowLabels[u],fe=i.colLabels[p];Q(r),J(p),Z({row:r,col:p}),F({visible:!0,x:h.clientX,y:h.clientY,content:t.jsxs("div",{className:`${e}-ttBody`,style:I,children:[t.jsxs("div",{className:`${e}-ttRow`,children:[t.jsx("span",{className:`${e}-ttKey`,children:"Row"}),t.jsx("span",{className:`${e}-ttVal`,children:A})]}),t.jsxs("div",{className:`${e}-ttRow`,children:[t.jsx("span",{className:`${e}-ttKey`,children:"Column"}),t.jsx("span",{className:`${e}-ttVal`,children:fe})]}),t.jsx("div",{className:`${e}-ttDivider`}),t.jsxs("div",{className:`${e}-ttRow`,children:[t.jsx("span",{className:`${e}-ttKey`,children:"Value"}),t.jsx("span",{className:`${e}-ttVal`,style:{color:m!==null?H(E(y,O(m))):void 0},children:m!==null?C(m):"—"})]}),m!==null&&t.jsx("div",{className:`${e}-ttBar`,children:t.jsx("div",{className:`${e}-ttBarFill`,style:{width:`${O(m)*100}%`,background:H(E(y,O(m)))}})})]})})},[i,Y,y,O,I]),pe=c.useCallback(()=>{Z(null),Q(null),J(null),F(r=>({...r,visible:!1}))},[]),me=c.useCallback(r=>{F(p=>p.visible?{...p,x:r.clientX,y:r.clientY}:p)},[]),N=c.useMemo(()=>{if(!i)return null;const r=i.values.flat().filter(h=>h!==null);if(!r.length)return null;const p=r.reduce((h,u)=>h+u,0);return{count:r.length,total:i.rows.length*i.cols.length,min:i.min,max:i.max,avg:p/r.length,sum:p,rows:i.rows.length,cols:i.cols.length}},[i]);c.useEffect(()=>{const r=()=>{P(!1),D(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);const xe=f==="light"?`${e}-themeLight`:f==="ember"?`${e}-themeEmber`:`${e}-themeDark`;return t.jsxs("div",{className:B(`${e}-root`,xe),style:{...I,height:typeof l=="number"?`${l}px`:l},onMouseMove:me,children:[t.jsxs("div",{className:`${e}-toolbar`,children:[t.jsxs("div",{className:`${e}-toolbarL`,children:[t.jsx("div",{className:`${e}-logoMark`,"aria-hidden":"true",children:t.jsxs("svg",{width:"22",height:"22",viewBox:"0 0 22 22",fill:"none",children:[t.jsx("rect",{x:"1",y:"1",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".3"}),t.jsx("rect",{x:"6",y:"1",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"11",y:"1",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".9"}),t.jsx("rect",{x:"16",y:"1",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"1",y:"6",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"6",y:"6",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".9"}),t.jsx("rect",{x:"11",y:"6",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"16",y:"6",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".3"}),t.jsx("rect",{x:"1",y:"11",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".9"}),t.jsx("rect",{x:"6",y:"11",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"11",y:"11",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".3"}),t.jsx("rect",{x:"16",y:"11",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"1",y:"16",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"6",y:"16",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".3"}),t.jsx("rect",{x:"11",y:"16",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".5"}),t.jsx("rect",{x:"16",y:"16",width:"4",height:"4",rx:"1",fill:"var(--hm-accent)",opacity:".9"})]})}),t.jsx("h1",{className:`${e}-title`,children:o}),N&&t.jsxs("span",{className:`${e}-dimBadge`,children:[N.rows.toLocaleString()," × ",N.cols.toLocaleString()]})]}),t.jsxs("div",{className:`${e}-toolbarR`,children:[t.jsxs("div",{className:`${e}-sizeControl`,children:[t.jsxs("svg",{viewBox:"0 0 14 14",fill:"none",width:"12",height:"12",className:`${e}-sizeIcon`,children:[t.jsx("rect",{x:"1",y:"1",width:"5",height:"5",rx:"1",stroke:"currentColor",strokeWidth:"1.3"}),t.jsx("rect",{x:"8",y:"1",width:"5",height:"5",rx:"1",stroke:"currentColor",strokeWidth:"1.3"}),t.jsx("rect",{x:"1",y:"8",width:"5",height:"5",rx:"1",stroke:"currentColor",strokeWidth:"1.3"}),t.jsx("rect",{x:"8",y:"8",width:"5",height:"5",rx:"1",stroke:"currentColor",strokeWidth:"1.3"})]}),t.jsx("input",{type:"range",min:16,max:80,step:4,value:L,onChange:r=>U(Number(r.target.value)),className:`${e}-sizeSlider`,title:`Cell size: ${L}px`})]}),t.jsx("button",{className:B(`${e}-iconBtn`,R&&`${e}-iconBtnOn`),onClick:()=>K(r=>!r),title:R?"Hide cell values":"Show cell values",children:t.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",width:"14",height:"14",children:[t.jsx("path",{d:"M1 8C1 8 3.5 3 8 3s7 5 7 5-2.5 5-7 5S1 8 1 8z",stroke:"currentColor",strokeWidth:"1.4"}),t.jsx("circle",{cx:"8",cy:"8",r:"2",stroke:"currentColor",strokeWidth:"1.4"})]})}),t.jsxs("div",{className:`${e}-dropdownWrap`,onMouseDown:r=>r.stopPropagation(),children:[t.jsxs("button",{className:B(`${e}-dropBtn`,X&&`${e}-dropBtnOn`),onClick:()=>{P(r=>!r),D(!1)},title:"Color scale",children:[t.jsx("span",{className:`${e}-scalePreview`,children:[0,.25,.5,.75,1].map(r=>t.jsx("span",{style:{background:H(E(y,r))},className:`${e}-scalePreviewDot`},r))}),t.jsx("span",{className:`${e}-dropBtnLabel`,children:_[y]}),t.jsx("svg",{viewBox:"0 0 10 6",fill:"none",width:"9",className:`${e}-dropArrow`,children:t.jsx("path",{d:"M1 1l4 4 4-4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})})]}),X&&t.jsx("div",{className:`${e}-dropdown`,style:I,children:Object.entries(_).map(([r,p])=>t.jsxs("button",{className:B(`${e}-dropItem`,y===r&&`${e}-dropItemOn`),onClick:()=>{V(r),P(!1)},children:[t.jsx("span",{className:`${e}-scalePreview`,children:[0,.2,.4,.6,.8,1].map(h=>t.jsx("span",{style:{background:H(E(r,h))},className:`${e}-scalePreviewDot`},h))}),t.jsx("span",{children:p})]},r))})]}),t.jsxs("div",{className:`${e}-dropdownWrap`,onMouseDown:r=>r.stopPropagation(),children:[t.jsxs("button",{className:B(`${e}-dropBtn`,G&&`${e}-dropBtnOn`),onClick:()=>{D(r=>!r),P(!1)},title:"Sort rows",children:[t.jsx("svg",{viewBox:"0 0 14 14",fill:"none",width:"13",height:"13",children:t.jsx("path",{d:"M2 3h10M4 7h6M6 11h2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})}),t.jsx("span",{className:`${e}-dropBtnLabel`,children:((te=ae.find(r=>r.id===M))==null?void 0:te.label)??"Sort"}),t.jsx("svg",{viewBox:"0 0 10 6",fill:"none",width:"9",className:`${e}-dropArrow`,children:t.jsx("path",{d:"M1 1l4 4 4-4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})})]}),G&&t.jsx("div",{className:`${e}-dropdown`,style:I,children:ae.map(r=>t.jsx("button",{className:B(`${e}-dropItem`,M===r.id&&`${e}-dropItemOn`),onClick:()=>{q(r.id),D(!1)},children:r.label},r.id))})]}),t.jsx("div",{className:`${e}-themeToggle`,children:[{id:"dark",color:"#4f7cff",label:"Dark"},{id:"light",color:"#2f5cf0",label:"Light"},{id:"ember",color:"#ff7a2f",label:"Ember"}].map(r=>t.jsx("button",{className:B(`${e}-themeBtn`,f===r.id&&`${e}-themeBtnOn`),style:{"--dot":r.color},onClick:()=>de(r.id),title:r.label},r.id))})]})]}),t.jsxs("div",{className:`${e}-body`,children:[b&&t.jsxs("div",{className:`${e}-stateWrap`,children:[t.jsx("div",{className:`${e}-spinner`}),t.jsx("span",{children:"Loading data…"})]}),!b&&$&&t.jsxs("div",{className:`${e}-errBanner`,children:[t.jsx("strong",{children:"Failed to load:"})," ",$]}),!b&&!$&&!i&&v.length>0&&t.jsxs("div",{className:`${e}-stateWrap`,children:[t.jsxs("svg",{viewBox:"0 0 48 48",fill:"none",width:"48",height:"48",opacity:".3",children:[t.jsx("rect",{x:"4",y:"4",width:"40",height:"40",rx:"4",stroke:"currentColor",strokeWidth:"2"}),t.jsx("path",{d:"M12 24h24M24 12v24",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]}),t.jsx("p",{children:"No numeric columns found in this dataset."}),t.jsx("p",{className:`${e}-stateHint`,children:"AwesomeHeatmap needs at least one numeric column to render."})]}),!b&&!$&&v.length===0&&t.jsxs("div",{className:`${e}-stateWrap`,children:[t.jsxs("svg",{viewBox:"0 0 48 48",fill:"none",width:"48",height:"48",opacity:".3",children:[t.jsx("rect",{x:"4",y:"8",width:"40",height:"32",rx:"4",stroke:"currentColor",strokeWidth:"2"}),t.jsx("line",{x1:"4",y1:"16",x2:"44",y2:"16",stroke:"currentColor",strokeWidth:"2"}),t.jsx("line",{x1:"16",y1:"8",x2:"16",y2:"40",stroke:"currentColor",strokeWidth:"2",opacity:".5"})]}),t.jsx("p",{children:"No data loaded"}),t.jsxs("p",{className:`${e}-stateHint`,children:["Pass an array, a JSON file path, or a REST API URL to the ",t.jsx("code",{children:"data"})," prop."]})]}),!b&&i&&t.jsxs("div",{className:`${e}-heatmapWrap`,children:[t.jsxs("div",{className:`${e}-colHeaderRow`,style:{paddingLeft:0},children:[t.jsx("div",{className:`${e}-cornerCell`}),i.colLabels.map((r,p)=>{var h,u;return t.jsxs("div",{className:B(`${e}-colHeader`,le===p&&`${e}-colHeaderOn`),style:{width:L,minWidth:L},title:r,children:[t.jsx("span",{className:`${e}-colHeaderText`,children:r}),t.jsx("div",{className:`${e}-colMiniBar`,children:t.jsx("div",{className:`${e}-colMiniBarFill`,style:{height:`${Math.round(O(((h=ee[p])==null?void 0:h.avg)??0)*100)}%`,background:H(E(y,O(((u=ee[p])==null?void 0:u.avg)??0)))}})})]},p)})]}),t.jsx("div",{className:`${e}-grid`,children:Y.map((r,p)=>t.jsxs("div",{className:`${e}-row`,children:[t.jsx("div",{className:B(`${e}-rowLabel`,ce===p&&`${e}-rowLabelOn`),title:i.rowLabels[r],children:i.rowLabels[r]}),i.values[r].map((h,u)=>t.jsx(Ce,{value:h,t:O(h),scaleName:y,showVal:R&&L>=28,cellSize:L,onEnter:m=>he(p,u,m),onLeave:pe},u))]},r))}),t.jsxs("div",{className:`${e}-footer`,children:[t.jsx(Le,{scale:y,min:i.min,max:i.max,theme:f}),N&&t.jsxs("div",{className:`${e}-summaryStats`,children:[t.jsxs("span",{className:`${e}-statItem`,children:[t.jsx("span",{children:"Σ"})," ",C(N.sum)]}),t.jsxs("span",{className:`${e}-statItem`,children:[t.jsx("span",{children:"x̄"})," ",C(N.avg)]}),t.jsxs("span",{className:`${e}-statItem`,children:[t.jsx("span",{children:"↑"})," ",C(N.max)]}),t.jsxs("span",{className:`${e}-statItem`,children:[t.jsx("span",{children:"↓"})," ",C(N.min)]}),t.jsx("span",{className:`${e}-statNulls`,children:N.total-N.count>0?`${(N.total-N.count).toLocaleString()} null cells`:`${N.count.toLocaleString()} cells`})]})]})]})]}),t.jsx(Be,{content:W.content,x:W.x,y:W.y,visible:W.visible,theme:f})]})}module.exports=Oe;
+//# sourceMappingURL=index.js.map