@etus/ui 0.4.0-beta.2 → 0.4.0-beta.3

package/dist/chunk-65YSTUD2.js

@@ -0,0 +1,206 @@
+import { cn } from './chunk-HRNDJU7D.js';
+import 'react';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+var tableContainerVariants = cva(
+  // Base styles (always applied)
+  "relative w-full overflow-x-auto",
+  {
+    variants: {
+      bordered: {
+        true: "rounded-md border",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      bordered: false
+    }
+  }
+);
+var tableVariants = cva(
+  // Base styles (always applied)
+  "w-full caption-bottom text-sm",
+  {
+    variants: {
+      density: {
+        compact: "[&_td]:py-[var(--table-cell-padding-compact-y)] [&_th]:py-[var(--table-cell-padding-compact-y)]",
+        default: "[&_td]:py-[var(--table-cell-padding-default-y)] [&_th]:py-[var(--table-cell-padding-default-y)]",
+        comfortable: "[&_td]:py-[var(--table-cell-padding-comfortable-y)] [&_th]:py-[var(--table-cell-padding-comfortable-y)]"
+      }
+    },
+    defaultVariants: {
+      density: "default"
+    }
+  }
+);
+var tableRowVariants = cva(
+  // Base styles (always applied)
+  "border-b border-[color:var(--table-row-border)] transition-colors",
+  {
+    variants: {
+      hoverable: {
+        true: "hover:bg-[color:var(--table-row-hover)]",
+        false: ""
+      },
+      selected: {
+        true: "bg-[color:var(--table-row-selected)]",
+        false: ""
+      },
+      striped: {
+        true: "even:bg-[color:var(--table-row-striped)]",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      hoverable: true,
+      selected: false,
+      striped: false
+    }
+  }
+);
+var tableHeadVariants = cva(
+  // Base styles (always applied)
+  "text-[length:var(--text-size-sm-font-size)] h-[var(--table-header-height)] px-[var(--table-header-padding-x)] text-left align-middle font-medium text-[color:var(--table-header-fg)] whitespace-nowrap",
+  {
+    variants: {
+      sortable: {
+        true: "cursor-pointer select-none hover:bg-muted/50",
+        false: ""
+      },
+      sticky: {
+        true: "sticky top-0 bg-background z-10",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      sortable: false,
+      sticky: false
+    }
+  }
+);
+var tableCellVariants = cva(
+  // Base styles (always applied)
+  "px-[var(--table-cell-padding-x)] align-middle whitespace-nowrap text-[length:var(--table-cell-text)]",
+  {
+    variants: {
+      align: {
+        left: "text-left",
+        center: "text-center",
+        right: "text-right"
+      }
+    },
+    defaultVariants: {
+      align: "left"
+    }
+  }
+);
+function Table({ className, ref, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(tableContainerVariants(), "w-full overflow-x-auto"),
+      "data-slot": "table-container",
+      children: /* @__PURE__ */ jsx(
+        "table",
+        {
+          ref,
+          className: cn(tableVariants(), className),
+          "data-slot": "table",
+          ...props
+        }
+      )
+    }
+  );
+}
+function TableHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "thead",
+    {
+      className: cn("[&_tr]:border-b", className),
+      "data-slot": "table-header",
+      ...props
+    }
+  );
+}
+function TableBody({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tbody",
+    {
+      className: cn("[&_tr:last-child]:border-0", className),
+      "data-slot": "table-body",
+      ...props
+    }
+  );
+}
+function TableFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tfoot",
+    {
+      className: cn(
+        "bg-[color:var(--table-footer-bg)] border-[color:var(--table-footer-border)] border-t font-medium [&>tr]:last:border-b-0",
+        className
+      ),
+      "data-slot": "table-footer",
+      ...props
+    }
+  );
+}
+function TableRow({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tr",
+    {
+      className: cn(
+        tableRowVariants(),
+        className
+      ),
+      "data-slot": "table-row",
+      ...props
+    }
+  );
+}
+function TableHead({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "th",
+    {
+      className: cn(
+        tableHeadVariants(),
+        "[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      "data-slot": "table-head",
+      ...props
+    }
+  );
+}
+function TableCell({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "td",
+    {
+      className: cn(
+        tableCellVariants(),
+        "[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      "data-slot": "table-cell",
+      ...props
+    }
+  );
+}
+function TableCaption({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "caption",
+    {
+      className: cn("text-[color:var(--table-caption-fg)] mt-[var(--table-caption-margin-top)] text-[length:var(--table-caption-text)]", className),
+      "data-slot": "table-caption",
+      ...props
+    }
+  );
+}
+
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };
+//# sourceMappingURL=chunk-65YSTUD2.js.map
+//# sourceMappingURL=chunk-65YSTUD2.js.map

package/dist/chunk-65YSTUD2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Table/Table.variants.ts","../src/components/data-display/Table/Table.tsx"],"names":[],"mappings":"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","file":"chunk-65YSTUD2.js","sourcesContent":["// Table/Table.variants.ts\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\n/**\n * Table container style variants using CVA\n *\n * @see https://cva.style/docs\n */\nexport const tableContainerVariants = cva(\n  // Base styles (always applied)\n  \"relative w-full overflow-x-auto\",\n  {\n    variants: {\n      bordered: {\n        true: \"rounded-md border\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      bordered: false,\n    },\n  }\n)\n\n/**\n * Table style variants\n */\nexport const tableVariants = cva(\n  // Base styles (always applied)\n  \"w-full caption-bottom text-sm\",\n  {\n    variants: {\n      density: {\n        compact: \"[&_td]:py-[var(--table-cell-padding-compact-y)] [&_th]:py-[var(--table-cell-padding-compact-y)]\",\n        default: \"[&_td]:py-[var(--table-cell-padding-default-y)] [&_th]:py-[var(--table-cell-padding-default-y)]\",\n        comfortable: \"[&_td]:py-[var(--table-cell-padding-comfortable-y)] [&_th]:py-[var(--table-cell-padding-comfortable-y)]\",\n      },\n    },\n    defaultVariants: {\n      density: \"default\",\n    },\n  }\n)\n\n/**\n * Table row style variants\n */\nexport const tableRowVariants = cva(\n  // Base styles (always applied)\n  \"border-b border-[color:var(--table-row-border)] transition-colors\",\n  {\n    variants: {\n      hoverable: {\n        true: \"hover:bg-[color:var(--table-row-hover)]\",\n        false: \"\",\n      },\n      selected: {\n        true: \"bg-[color:var(--table-row-selected)]\",\n        false: \"\",\n      },\n      striped: {\n        true: \"even:bg-[color:var(--table-row-striped)]\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      hoverable: true,\n      selected: false,\n      striped: false,\n    },\n  }\n)\n\n/**\n * Table header cell style variants\n */\nexport const tableHeadVariants = cva(\n  // Base styles (always applied)\n  \"text-[length:var(--text-size-sm-font-size)] h-[var(--table-header-height)] px-[var(--table-header-padding-x)] text-left align-middle font-medium text-[color:var(--table-header-fg)] whitespace-nowrap\",\n  {\n    variants: {\n      sortable: {\n        true: \"cursor-pointer select-none hover:bg-muted/50\",\n        false: \"\",\n      },\n      sticky: {\n        true: \"sticky top-0 bg-background z-10\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      sortable: false,\n      sticky: false,\n    },\n  }\n)\n\n/**\n * Table cell style variants\n */\nexport const tableCellVariants = cva(\n  // Base styles (always applied)\n  \"px-[var(--table-cell-padding-x)] align-middle whitespace-nowrap text-[length:var(--table-cell-text)]\",\n  {\n    variants: {\n      align: {\n        left: \"text-left\",\n        center: \"text-center\",\n        right: \"text-right\",\n      },\n    },\n    defaultVariants: {\n      align: \"left\",\n    },\n  }\n)\n\n// Export variant prop types\nexport type TableContainerVariantProps = VariantProps<typeof tableContainerVariants>\nexport type TableVariantProps = VariantProps<typeof tableVariants>\nexport type TableRowVariantProps = VariantProps<typeof tableRowVariants>\nexport type TableHeadVariantProps = VariantProps<typeof tableHeadVariants>\nexport type TableCellVariantProps = VariantProps<typeof tableCellVariants>\n","import * as React from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  tableCellVariants,\n  tableContainerVariants,\n  tableHeadVariants,\n  tableRowVariants,\n  tableVariants,\n} from \"./Table.variants\"\n\nfunction Table({ className, ref, ...props }: React.ComponentProps<\"table\">) {\n  return (\n    <div\n      className={cn(tableContainerVariants(), \"w-full overflow-x-auto\")}\n      data-slot=\"table-container\"\n    >\n      <table\n        ref={ref}\n        className={cn(tableVariants(), className)}\n        data-slot=\"table\"\n        {...props}\n      />\n    </div>\n  )\n}\n\nfunction TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n  return (\n    <thead\n      className={cn(\"[&_tr]:border-b\", className)}\n      data-slot=\"table-header\"\n      {...props}\n    />\n  )\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n  return (\n    <tbody\n      className={cn(\"[&_tr:last-child]:border-0\", className)}\n      data-slot=\"table-body\"\n      {...props}\n    />\n  )\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n  return (\n    <tfoot\n      className={cn(\n        \"bg-[color:var(--table-footer-bg)] border-[color:var(--table-footer-border)] border-t font-medium [&>tr]:last:border-b-0\",\n        className\n      )}\n      data-slot=\"table-footer\"\n      {...props}\n    />\n  )\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n  return (\n    <tr\n      className={cn(\n        tableRowVariants(),\n        className\n      )}\n      data-slot=\"table-row\"\n      {...props}\n    />\n  )\n}\n\nfunction TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n  return (\n    <th\n      className={cn(\n        tableHeadVariants(),\n        \"[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\",\n        className\n      )}\n      data-slot=\"table-head\"\n      {...props}\n    />\n  )\n}\n\nfunction TableCell({ className, ...props }: React.ComponentProps<\"td\">) {\n  return (\n    <td\n      className={cn(\n        tableCellVariants(),\n        \"[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\",\n        className\n      )}\n      data-slot=\"table-cell\"\n      {...props}\n    />\n  )\n}\n\nfunction TableCaption({\n  className,\n  ...props\n}: React.ComponentProps<\"caption\">) {\n  return (\n    <caption\n      className={cn(\"text-[color:var(--table-caption-fg)] mt-[var(--table-caption-margin-top)] text-[length:var(--table-caption-text)]\", className)}\n      data-slot=\"table-caption\"\n      {...props}\n    />\n  )\n}\n\nexport {\n  Table,\n  TableBody,\n  TableCaption,\n  TableCell,\n  TableFooter,\n  TableHead,\n  TableHeader,\n  TableRow,\n}\n"]}

package/dist/chunk-6GWO7JNP.js

@@ -0,0 +1,438 @@
+import { Tooltip, TooltipTrigger, TooltipContent } from './chunk-7ZJ32KRQ.js';
+import { cn } from './chunk-HRNDJU7D.js';
+import { cva } from 'class-variance-authority';
+import * as React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var CSS_VAR_MUTED = "var(--muted)";
+var CSS_VAR_PRIMARY = "var(--primary)";
+var heatmapVariants = cva("inline-flex flex-col gap-2", {
+  variants: {
+    variant: {
+      calendar: "",
+      grid: "",
+      triangular: ""
+    }
+  },
+  defaultVariants: {
+    variant: "grid"
+  }
+});
+function interpolateColor(color1, color2, ratio) {
+  if (color1.startsWith("var(") || color2.startsWith("var(")) {
+    return `color-mix(in srgb, ${color2} ${String(Math.round(ratio * 100))}%, ${color1})`;
+  }
+  if (color1.startsWith("hsl") || color2.startsWith("hsl")) {
+    const opacity = Math.max(0.1, Math.min(1, ratio));
+    return color2.replace(")", ` / ${String(opacity)})`);
+  }
+  const hexToRgb = (hex) => {
+    const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+    if (!result?.[1] || !result[2] || !result[3]) return null;
+    return [
+      Number.parseInt(result[1], 16),
+      Number.parseInt(result[2], 16),
+      Number.parseInt(result[3], 16)
+    ];
+  };
+  const rgb1 = hexToRgb(color1);
+  const rgb2 = hexToRgb(color2);
+  if (!rgb1 || !rgb2) {
+    return `color-mix(in srgb, ${color2} ${String(Math.round(ratio * 100))}%, ${color1})`;
+  }
+  const r = Math.round(rgb1[0] + (rgb2[0] - rgb1[0]) * ratio);
+  const g = Math.round(rgb1[1] + (rgb2[1] - rgb1[1]) * ratio);
+  const b = Math.round(rgb1[2] + (rgb2[2] - rgb1[2]) * ratio);
+  return `rgb(${String(r)}, ${String(g)}, ${String(b)})`;
+}
+function getColorForValue(value, min, max, colorScale, minColor, maxColor, midColor) {
+  if (max === min) return maxColor;
+  if (colorScale === "diverging") {
+    const mid = (max + min) / 2;
+    const midColorActual = midColor ?? CSS_VAR_MUTED;
+    if (value < mid) {
+      const ratio2 = (value - min) / (mid - min);
+      return interpolateColor(minColor, midColorActual, ratio2);
+    } else {
+      const ratio2 = (value - mid) / (max - mid);
+      return interpolateColor(midColorActual, maxColor, ratio2);
+    }
+  }
+  const ratio = (value - min) / (max - min);
+  return interpolateColor(minColor, maxColor, ratio);
+}
+function HeatmapCell({
+  color,
+  data,
+  isHighlighted,
+  isSelected,
+  onClick,
+  renderTooltip,
+  showTooltip,
+  size
+}) {
+  const cellContent = /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "rounded-sm cursor-pointer transition-all",
+        "hover:ring-2 hover:ring-ring hover:ring-offset-1",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+        isSelected && "ring-2 ring-primary ring-offset-2",
+        isHighlighted && "ring-1 ring-muted-foreground/50"
+      ),
+      style: {
+        backgroundColor: color,
+        height: size,
+        width: size
+      },
+      "aria-label": `${data.label ?? `${String(data.x)}, ${String(data.y)}`}: ${String(data.value)}`,
+      "data-highlighted": isHighlighted ? true : void 0,
+      "data-selected": isSelected ? true : void 0,
+      "data-slot": "heatmap-cell",
+      "data-value": data.value,
+      role: "gridcell",
+      tabIndex: 0,
+      onClick,
+      onKeyDown: (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onClick?.(e);
+        }
+      }
+    }
+  );
+  if (!showTooltip) {
+    return cellContent;
+  }
+  return /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: cellContent }),
+    /* @__PURE__ */ jsx(TooltipContent, { children: renderTooltip ? renderTooltip(data) : /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+      data.label && /* @__PURE__ */ jsx("p", { className: "font-medium", children: data.label }),
+      /* @__PURE__ */ jsxs("p", { className: "text-sm", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Value: " }),
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: data.value })
+      ] }),
+      /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+        String(data.x),
+        ", ",
+        String(data.y)
+      ] })
+    ] }) })
+  ] });
+}
+function HeatmapLegend({
+  colorScale,
+  max,
+  maxColor,
+  midColor,
+  min,
+  minColor,
+  position
+}) {
+  const isHorizontal = position === "top" || position === "bottom";
+  const gradientStyle = colorScale === "diverging" ? {
+    background: `linear-gradient(${isHorizontal ? "to right" : "to top"}, ${minColor}, ${midColor ?? CSS_VAR_MUTED}, ${maxColor})`
+  } : {
+    background: `linear-gradient(${isHorizontal ? "to right" : "to top"}, ${minColor}, ${maxColor})`
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-2 text-xs text-muted-foreground",
+        isHorizontal ? "flex-row" : "flex-col"
+      ),
+      "data-slot": "heatmap-legend",
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: min }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "rounded",
+              isHorizontal ? "w-24 h-3" : "w-3 h-24"
+            ),
+            style: gradientStyle
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: max })
+      ]
+    }
+  );
+}
+function Heatmap({
+  ariaLabel,
+  cellGap = 2,
+  cellSize = 20,
+  className,
+  colorScale = "sequential",
+  data,
+  highlightedRow,
+  legendPosition = "bottom",
+  maxColor = CSS_VAR_PRIMARY,
+  midColor,
+  minColor = CSS_VAR_MUTED,
+  onCellClick,
+  onRowHover,
+  renderTooltip,
+  selectedCell,
+  showLegend = true,
+  showTooltip = true,
+  valueKey,
+  variant = "grid",
+  xKey,
+  xLabels,
+  yKey,
+  yLabels,
+  ...props
+}) {
+  const derivedXLabels = React.useMemo(() => {
+    if (xLabels) return xLabels;
+    const uniqueX = [...new Set(data.map((d) => String(d[xKey])))];
+    return uniqueX;
+  }, [data, xKey, xLabels]);
+  const derivedYLabels = React.useMemo(() => {
+    if (yLabels) return yLabels;
+    const uniqueY = [...new Set(data.map((d) => String(d[yKey])))];
+    return uniqueY;
+  }, [data, yKey, yLabels]);
+  const { maxValue, minValue } = React.useMemo(() => {
+    const values = data.map((d) => d[valueKey]);
+    return {
+      maxValue: Math.max(...values),
+      minValue: Math.min(...values)
+    };
+  }, [data, valueKey]);
+  const dataMap = React.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    data.forEach((d) => {
+      const key = `${String(d[xKey])}-${String(d[yKey])}`;
+      map.set(key, d);
+    });
+    return map;
+  }, [data, xKey, yKey]);
+  const handleCellClick = React.useCallback(
+    (cellData) => (event) => {
+      if (!onCellClick) return;
+      const payload = {
+        label: cellData.label,
+        timestamp: Date.now(),
+        value: cellData.value,
+        x: cellData.x,
+        y: cellData.y
+      };
+      onCellClick(event, payload);
+    },
+    [onCellClick]
+  );
+  const shouldRenderCell = React.useCallback(
+    (xIndex, yIndex) => {
+      if (variant === "triangular") {
+        return yIndex >= xIndex;
+      }
+      return true;
+    },
+    [variant]
+  );
+  const getCellData = React.useCallback(
+    (xLabel, yLabel) => {
+      const key = `${xLabel}-${yLabel}`;
+      const found = dataMap.get(key);
+      if (found) return found;
+      const matchingData = data.find(
+        (d) => String(d[xKey]) === xLabel && String(d[yKey]) === yLabel
+      );
+      return matchingData ?? null;
+    },
+    [data, dataMap, xKey, yKey]
+  );
+  const renderLegend = showLegend && /* @__PURE__ */ jsx(
+    HeatmapLegend,
+    {
+      colorScale,
+      max: maxValue,
+      maxColor,
+      midColor,
+      min: minValue,
+      minColor,
+      position: legendPosition
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-label": ariaLabel ?? "Heatmap visualization",
+      className: cn(heatmapVariants({ variant }), className),
+      "data-slot": "heatmap",
+      role: "region",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("table", { className: "sr-only", children: [
+          /* @__PURE__ */ jsx("caption", { children: ariaLabel ?? "Heatmap data" }),
+          /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx("th", { scope: "col", children: "Row / Column" }),
+            derivedXLabels.map((label) => /* @__PURE__ */ jsx("th", { scope: "col", children: label }, label))
+          ] }) }),
+          /* @__PURE__ */ jsx("tbody", { children: derivedYLabels.map((yLabel, yIndex) => /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx("th", { scope: "row", children: yLabel }),
+            derivedXLabels.map((xLabel, xIndex) => {
+              if (!shouldRenderCell(xIndex, yIndex)) {
+                return /* @__PURE__ */ jsx("td", { children: "-" }, xLabel);
+              }
+              const cellData = getCellData(xLabel, yLabel);
+              return /* @__PURE__ */ jsx("td", { children: cellData?.value ?? "-" }, xLabel);
+            })
+          ] }, yLabel)) })
+        ] }),
+        showLegend && (legendPosition === "top" || legendPosition === "left") && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              legendPosition === "left" && "self-center"
+            ),
+            children: renderLegend
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "flex",
+              legendPosition === "left" || legendPosition === "right" ? "flex-row gap-4" : "flex-col"
+            ),
+            children: /* @__PURE__ */ jsxs("div", { className: "flex gap-0.5", "data-slot": "heatmap-container", children: [
+              /* @__PURE__ */ jsx("div", { className: "flex flex-col", style: { gap: cellGap }, children: derivedYLabels.map((yLabel) => /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "flex items-center justify-end pr-2 text-xs text-muted-foreground",
+                  style: { height: cellSize },
+                  children: yLabel
+                },
+                yLabel
+              )) }),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  "aria-hidden": "true",
+                  className: "flex flex-col",
+                  "data-slot": "heatmap-grid",
+                  role: "grid",
+                  style: { gap: cellGap },
+                  children: [
+                    derivedYLabels.map((yLabel, yIndex) => /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: "flex",
+                        "data-slot": "heatmap-row",
+                        role: "row",
+                        style: { gap: cellGap },
+                        onMouseEnter: () => onRowHover?.(yLabel),
+                        onMouseLeave: () => onRowHover?.(null),
+                        children: derivedXLabels.map((xLabel, xIndex) => {
+                          if (!shouldRenderCell(xIndex, yIndex)) {
+                            return /* @__PURE__ */ jsx(
+                              "div",
+                              {
+                                style: { height: cellSize, width: cellSize }
+                              },
+                              xLabel
+                            );
+                          }
+                          const cellData = getCellData(xLabel, yLabel);
+                          if (!cellData) {
+                            return /* @__PURE__ */ jsx(
+                              "div",
+                              {
+                                className: "rounded-sm bg-muted",
+                                "data-empty": "true",
+                                "data-slot": "heatmap-cell",
+                                role: "gridcell",
+                                style: { height: cellSize, width: cellSize }
+                              },
+                              xLabel
+                            );
+                          }
+                          const color = getColorForValue(
+                            cellData.value,
+                            minValue,
+                            maxValue,
+                            colorScale,
+                            minColor,
+                            maxColor,
+                            midColor
+                          );
+                          const isSelected = selectedCell?.x === cellData.x && selectedCell.y === cellData.y;
+                          const isHighlighted = highlightedRow === yLabel;
+                          return /* @__PURE__ */ jsx(
+                            HeatmapCell,
+                            {
+                              data: {
+                                label: cellData.label,
+                                value: cellData.value,
+                                x: cellData.x,
+                                y: cellData.y
+                              },
+                              color,
+                              isHighlighted,
+                              isSelected,
+                              renderTooltip,
+                              showTooltip,
+                              size: cellSize,
+                              onClick: handleCellClick(cellData)
+                            },
+                            xLabel
+                          );
+                        })
+                      },
+                      yLabel
+                    )),
+                    variant !== "calendar" && /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: "flex pt-1",
+                        "data-slot": "heatmap-x-labels",
+                        style: { gap: cellGap },
+                        children: derivedXLabels.map((xLabel) => /* @__PURE__ */ jsx(
+                          "div",
+                          {
+                            className: "flex items-start justify-center text-xs text-muted-foreground",
+                            style: { width: cellSize },
+                            children: /* @__PURE__ */ jsx(
+                              "span",
+                              {
+                                className: cn(
+                                  derivedXLabels.length > 10 && "rotate-45 origin-top-left text-xs"
+                                ),
+                                children: xLabel
+                              }
+                            )
+                          },
+                          xLabel
+                        ))
+                      }
+                    )
+                  ]
+                }
+              )
+            ] })
+          }
+        ),
+        showLegend && (legendPosition === "bottom" || legendPosition === "right") && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "flex justify-end",
+              legendPosition === "right" && "self-center"
+            ),
+            children: renderLegend
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { Heatmap, HeatmapCell, HeatmapLegend, heatmapVariants };
+//# sourceMappingURL=chunk-6GWO7JNP.js.map
+//# sourceMappingURL=chunk-6GWO7JNP.js.map