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

package/dist/chunk-V4NSLSCA.js

@@ -0,0 +1,220 @@
+import { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent } from './chunk-XXWCMY2G.js';
+import { cn } from './chunk-RVAYDRMA.js';
+import * as React from 'react';
+import { ScatterChart as ScatterChart$1, CartesianGrid, XAxis, Label, YAxis, ZAxis, Scatter } from 'recharts';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function TooltipContentWithCallback({
+  tooltipCallback,
+  tooltipIndicator,
+  xAxisKey,
+  yAxisKey,
+  zAxisKey,
+  ...props
+}) {
+  const prevActiveRef = React.useRef(false);
+  const { active = false, payload } = props;
+  React.useEffect(() => {
+    if (tooltipCallback && active !== prevActiveRef.current) {
+      prevActiveRef.current = active;
+      tooltipCallback({
+        active,
+        payload: payload?.map((p) => ({
+          payload: p.payload,
+          x: p.payload[xAxisKey],
+          y: p.payload[yAxisKey],
+          z: zAxisKey ? p.payload[zAxisKey] : void 0
+        }))
+      });
+    }
+  }, [active, payload, tooltipCallback, xAxisKey, yAxisKey, zAxisKey]);
+  return /* @__PURE__ */ jsx(ChartTooltipContent, { indicator: tooltipIndicator, ...props });
+}
+function ScatterChart({
+  autoMinValue = false,
+  className,
+  config,
+  enableLegendSlider = false,
+  gridDashArray = "3 3",
+  intervalType,
+  legendPosition = "bottom",
+  maxXValue,
+  maxYValue,
+  minXValue,
+  minYValue,
+  onClick,
+  rotateLabelX,
+  series,
+  shape = "circle",
+  showGrid = true,
+  showLegend = false,
+  showOpacity = false,
+  showTooltip = true,
+  showXAxis = true,
+  showYAxis = true,
+  size = 60,
+  sizeRange = [60, 400],
+  startEndOnly = false,
+  tickGap,
+  tooltipCallback,
+  tooltipIndicator = "dot",
+  valueFormatter,
+  xAxisKey,
+  xAxisLabel,
+  xAxisTickFormatter,
+  yAxisKey,
+  yAxisLabel,
+  yAxisTickFormatter,
+  yAxisWidth,
+  zAxisKey,
+  ...props
+}) {
+  const handleClick = React.useCallback((data) => {
+    if (!onClick || !data) return;
+    onClick({
+      payload: data.payload ?? data,
+      x: data[xAxisKey] ?? data.x,
+      y: data[yAxisKey] ?? data.y,
+      z: zAxisKey ? data[zAxisKey] : void 0
+    });
+  }, [onClick, xAxisKey, yAxisKey, zAxisKey]);
+  const xDomain = React.useMemo(() => {
+    const min = minXValue ?? (autoMinValue ? "auto" : "dataMin");
+    const max = maxXValue ?? "dataMax";
+    return [min, max];
+  }, [autoMinValue, maxXValue, minXValue]);
+  const yDomain = React.useMemo(() => {
+    const min = minYValue ?? (autoMinValue ? "auto" : "dataMin");
+    const max = maxYValue ?? "dataMax";
+    return [min, max];
+  }, [autoMinValue, maxYValue, minYValue]);
+  const xAxisTicks = React.useMemo(() => {
+    if (!startEndOnly) return;
+    const allXValues = [];
+    for (const s of series) {
+      for (const point of s.data) {
+        const xVal = point[xAxisKey];
+        if (typeof xVal === "number") {
+          allXValues.push(xVal);
+        }
+      }
+    }
+    if (allXValues.length < 2) return;
+    const minX = Math.min(...allXValues);
+    const maxX = Math.max(...allXValues);
+    return [minX, maxX];
+  }, [series, startEndOnly, xAxisKey]);
+  const effectiveInterval = startEndOnly ? "preserveStartEnd" : intervalType;
+  const effectiveXFormatter = valueFormatter?.x ?? xAxisTickFormatter;
+  const effectiveYFormatter = valueFormatter?.y ?? yAxisTickFormatter;
+  return /* @__PURE__ */ jsx("div", { "data-slot": "scatter-chart", ...props, children: /* @__PURE__ */ jsx(
+    ChartContainer,
+    {
+      className: cn(className),
+      config,
+      children: /* @__PURE__ */ jsxs(
+        ScatterChart$1,
+        {
+          accessibilityLayer: true,
+          margin: {
+            left: yAxisLabel ? 20 : 12,
+            right: 12,
+            bottom: xAxisLabel ? 20 : 0
+          },
+          children: [
+            showGrid && /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: gridDashArray }),
+            showXAxis && /* @__PURE__ */ jsx(
+              XAxis,
+              {
+                angle: rotateLabelX,
+                axisLine: false,
+                dataKey: xAxisKey,
+                domain: xDomain,
+                interval: effectiveInterval,
+                minTickGap: tickGap,
+                name: xAxisKey,
+                textAnchor: rotateLabelX ? "end" : "middle",
+                tickFormatter: effectiveXFormatter,
+                tickLine: false,
+                tickMargin: 8,
+                ticks: xAxisTicks,
+                type: "number",
+                children: xAxisLabel && /* @__PURE__ */ jsx(Label, { offset: -5, position: "insideBottom", value: xAxisLabel })
+              }
+            ),
+            showYAxis && /* @__PURE__ */ jsx(
+              YAxis,
+              {
+                axisLine: false,
+                dataKey: yAxisKey,
+                domain: yDomain,
+                name: yAxisKey,
+                tickFormatter: effectiveYFormatter,
+                tickLine: false,
+                tickMargin: 8,
+                type: "number",
+                width: yAxisWidth,
+                children: yAxisLabel && /* @__PURE__ */ jsx(Label, { angle: -90, offset: -5, position: "insideLeft", value: yAxisLabel })
+              }
+            ),
+            zAxisKey && /* @__PURE__ */ jsx(ZAxis, { dataKey: zAxisKey, name: zAxisKey, range: sizeRange, type: "number" }),
+            showTooltip && /* @__PURE__ */ jsx(
+              ChartTooltip,
+              {
+                content: tooltipCallback ? /* @__PURE__ */ jsx(
+                  TooltipContentWithCallback,
+                  {
+                    tooltipCallback,
+                    tooltipIndicator,
+                    xAxisKey,
+                    yAxisKey,
+                    zAxisKey
+                  }
+                ) : /* @__PURE__ */ jsx(ChartTooltipContent, { indicator: tooltipIndicator }),
+                cursor: { strokeDasharray: "3 3" }
+              }
+            ),
+            showLegend && /* @__PURE__ */ jsx(
+              ChartLegend,
+              {
+                align: legendPosition === "left" ? "left" : legendPosition === "right" ? "right" : "center",
+                content: /* @__PURE__ */ jsx(ChartLegendContent, { enableSlider: enableLegendSlider }),
+                layout: legendPosition === "left" || legendPosition === "right" ? "vertical" : "horizontal",
+                verticalAlign: legendPosition === "top" ? "top" : legendPosition === "bottom" ? "bottom" : "middle"
+              }
+            ),
+            series.map((seriesConfig) => {
+              const {
+                data,
+                dataKey,
+                fill: seriesFill,
+                shape: seriesShape,
+                size: seriesSize
+              } = seriesConfig;
+              const fill = seriesFill ?? `var(--color-${dataKey})`;
+              return /* @__PURE__ */ jsx(
+                Scatter,
+                {
+                  data,
+                  fill,
+                  fillOpacity: showOpacity ? 0.7 : 1,
+                  name: dataKey,
+                  shape: seriesShape ?? shape,
+                  style: onClick ? { cursor: "pointer" } : void 0,
+                  onClick: onClick ? handleClick : void 0,
+                  children: !zAxisKey && /* @__PURE__ */ jsx(ZAxis, { range: [seriesSize ?? size, seriesSize ?? size] })
+                },
+                dataKey
+              );
+            })
+          ]
+        }
+      )
+    }
+  ) });
+}
+ScatterChart.displayName = "ScatterChart";
+
+export { ScatterChart };
+//# sourceMappingURL=chunk-V4NSLSCA.js.map
+//# sourceMappingURL=chunk-V4NSLSCA.js.map

package/dist/chunk-V4NSLSCA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/ScatterChart/ScatterChart.tsx"],"names":["RechartsScatterChart"],"mappings":"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","file":"chunk-V4NSLSCA.js","sourcesContent":["\"use client\"\n\nimport type { ScatterChartProps, ScatterChartTooltipCallbackProps, ScatterChartTooltipIndicator } from \"./ScatterChart.types\"\n\nimport * as React from \"react\"\nimport {\n  CartesianGrid,\n  Label,\n  ScatterChart as RechartsScatterChart,\n  Scatter,\n  XAxis,\n  YAxis,\n  ZAxis,\n} from \"recharts\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n} from \"../Chart\"\n\n/**\n * Internal tooltip content wrapper that calls the tooltipCallback\n */\ninterface TooltipContentWithCallbackProps {\n  tooltipCallback?: (props: ScatterChartTooltipCallbackProps) => void\n  tooltipIndicator: ScatterChartTooltipIndicator\n  xAxisKey: string\n  yAxisKey: string\n  zAxisKey?: string\n}\n\nfunction TooltipContentWithCallback({\n  tooltipCallback,\n  tooltipIndicator,\n  xAxisKey,\n  yAxisKey,\n  zAxisKey,\n  ...props\n}: TooltipContentWithCallbackProps & Record<string, unknown>) {\n  const prevActiveRef = React.useRef<boolean>(false)\n  const { active = false, payload } = props as { active?: boolean; payload?: { payload: Record<string, unknown> }[] }\n\n  // Use effect to call callback when active state changes\n  // This is an intentional callback pattern for tooltip state changes\n  /* eslint-disable react-you-might-not-need-an-effect/no-pass-data-to-parent */\n  React.useEffect(() => {\n    if (tooltipCallback && active !== prevActiveRef.current) {\n      prevActiveRef.current = active\n      tooltipCallback({\n        active,\n        payload: payload?.map((p) => ({\n          payload: p.payload,\n          x: p.payload[xAxisKey] as number,\n          y: p.payload[yAxisKey] as number,\n          z: zAxisKey ? p.payload[zAxisKey] as number : undefined,\n        })),\n      })\n    }\n  }, [active, payload, tooltipCallback, xAxisKey, yAxisKey, zAxisKey])\n  /* eslint-enable react-you-might-not-need-an-effect/no-pass-data-to-parent */\n\n  return <ChartTooltipContent indicator={tooltipIndicator} {...props} />\n}\n\n/**\n * ScatterChart - Data visualization for correlation and distribution\n *\n * Displays data points on a two-dimensional plane, ideal for showing\n * relationships between variables, identifying clusters, and\n * detecting outliers.\n *\n * @example\n * ```tsx\n * const data = [\n *   { x: 100, y: 200, name: \"A\" },\n *   { x: 120, y: 100, name: \"B\" },\n *   { x: 170, y: 300, name: \"C\" },\n * ]\n *\n * const config = {\n *   series1: { label: \"Series 1\", color: \"hsl(var(--chart-1))\" },\n * }\n *\n * <ScatterChart\n *   config={config}\n *   series={[{ dataKey: \"series1\", data }]}\n *   xAxisKey=\"x\"\n *   yAxisKey=\"y\"\n * />\n * ```\n */\nexport function ScatterChart({\n  autoMinValue = false,\n  className,\n  config,\n  enableLegendSlider = false,\n  gridDashArray = \"3 3\",\n  intervalType,\n  legendPosition = \"bottom\",\n  maxXValue,\n  maxYValue,\n  minXValue,\n  minYValue,\n  onClick,\n  rotateLabelX,\n  series,\n  shape = \"circle\",\n  showGrid = true,\n  showLegend = false,\n  showOpacity = false,\n  showTooltip = true,\n  showXAxis = true,\n  showYAxis = true,\n  size = 60,\n  sizeRange = [60, 400],\n  startEndOnly = false,\n  tickGap,\n  tooltipCallback,\n  tooltipIndicator = \"dot\",\n  valueFormatter,\n  xAxisKey,\n  xAxisLabel,\n  xAxisTickFormatter,\n  yAxisKey,\n  yAxisLabel,\n  yAxisTickFormatter,\n  yAxisWidth,\n  zAxisKey,\n  ...props\n}: ScatterChartProps) {\n  // Handle point click - Recharts passes any-typed data\n  /* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access */\n  const handleClick = React.useCallback((data: any) => {\n    if (!onClick || !data) return\n    onClick({\n      payload: data.payload ?? data,\n      x: data[xAxisKey] ?? data.x,\n      y: data[yAxisKey] ?? data.y,\n      z: zAxisKey ? data[zAxisKey] : undefined,\n    })\n  }, [onClick, xAxisKey, yAxisKey, zAxisKey])\n  /* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access */\n\n  // Calculate X-axis domain\n  const xDomain = React.useMemo(() => {\n    const min = minXValue ?? (autoMinValue ? \"auto\" : \"dataMin\")\n    const max = maxXValue ?? \"dataMax\"\n    return [min, max] as const\n  }, [autoMinValue, maxXValue, minXValue])\n\n  // Calculate Y-axis domain\n  const yDomain = React.useMemo(() => {\n    const min = minYValue ?? (autoMinValue ? \"auto\" : \"dataMin\")\n    const max = maxYValue ?? \"dataMax\"\n    return [min, max] as const\n  }, [autoMinValue, maxYValue, minYValue])\n\n  // Calculate X-axis ticks for startEndOnly\n  const xAxisTicks = React.useMemo(() => {\n    if (!startEndOnly) return\n    // For scatter charts, we need to find min/max from all series\n    const allXValues: number[] = []\n    for (const s of series) {\n      for (const point of s.data) {\n        const xVal = point[xAxisKey]\n        if (typeof xVal === \"number\") {\n          allXValues.push(xVal)\n        }\n      }\n    }\n    if (allXValues.length < 2) return\n    const minX = Math.min(...allXValues)\n    const maxX = Math.max(...allXValues)\n    return [minX, maxX]\n  }, [series, startEndOnly, xAxisKey])\n\n  // Determine effective interval based on startEndOnly\n  const effectiveInterval = startEndOnly ? \"preserveStartEnd\" : intervalType\n\n  // Effective tick formatters (valueFormatter takes precedence)\n  const effectiveXFormatter = valueFormatter?.x ?? xAxisTickFormatter\n  const effectiveYFormatter = valueFormatter?.y ?? yAxisTickFormatter\n\n  return (\n    <div data-slot=\"scatter-chart\" {...props}>\n      <ChartContainer\n        className={cn(className)}\n        config={config}\n      >\n        <RechartsScatterChart\n          accessibilityLayer\n          margin={{\n            left: yAxisLabel ? 20 : 12,\n            right: 12,\n            bottom: xAxisLabel ? 20 : 0,\n          }}\n        >\n          {showGrid && (\n            <CartesianGrid strokeDasharray={gridDashArray} />\n          )}\n\n          {showXAxis && (\n            <XAxis\n              angle={rotateLabelX}\n              axisLine={false}\n              dataKey={xAxisKey}\n              domain={xDomain}\n              interval={effectiveInterval}\n              minTickGap={tickGap}\n              name={xAxisKey}\n              textAnchor={rotateLabelX ? \"end\" : \"middle\"}\n              tickFormatter={effectiveXFormatter}\n              tickLine={false}\n              tickMargin={8}\n              ticks={xAxisTicks}\n              type=\"number\"\n            >\n              {xAxisLabel && (\n                <Label offset={-5} position=\"insideBottom\" value={xAxisLabel} />\n              )}\n            </XAxis>\n          )}\n\n          {showYAxis && (\n            <YAxis\n              axisLine={false}\n              dataKey={yAxisKey}\n              domain={yDomain}\n              name={yAxisKey}\n              tickFormatter={effectiveYFormatter}\n              tickLine={false}\n              tickMargin={8}\n              type=\"number\"\n              width={yAxisWidth}\n            >\n              {yAxisLabel && (\n                <Label angle={-90} offset={-5} position=\"insideLeft\" value={yAxisLabel} />\n              )}\n            </YAxis>\n          )}\n\n          {zAxisKey && (\n            <ZAxis dataKey={zAxisKey} name={zAxisKey} range={sizeRange} type=\"number\" />\n          )}\n\n          {showTooltip && (\n            <ChartTooltip\n              content={\n                tooltipCallback\n                  ? <TooltipContentWithCallback\n                      tooltipCallback={tooltipCallback}\n                      tooltipIndicator={tooltipIndicator}\n                      xAxisKey={xAxisKey}\n                      yAxisKey={yAxisKey}\n                      zAxisKey={zAxisKey}\n                    />\n                  : <ChartTooltipContent indicator={tooltipIndicator} />\n              }\n              cursor={{ strokeDasharray: \"3 3\" }}\n            />\n          )}\n\n          {showLegend && (\n            <ChartLegend\n              align={legendPosition === \"left\" ? \"left\" : legendPosition === \"right\" ? \"right\" : \"center\"}\n              content={<ChartLegendContent enableSlider={enableLegendSlider} />}\n              layout={legendPosition === \"left\" || legendPosition === \"right\" ? \"vertical\" : \"horizontal\"}\n              verticalAlign={legendPosition === \"top\" ? \"top\" : legendPosition === \"bottom\" ? \"bottom\" : \"middle\"}\n            />\n          )}\n\n          {series.map((seriesConfig) => {\n            const {\n              data,\n              dataKey,\n              fill: seriesFill,\n              shape: seriesShape,\n              size: seriesSize,\n            } = seriesConfig\n\n            const fill = seriesFill ?? `var(--color-${dataKey})`\n\n            return (\n              <Scatter\n                key={dataKey}\n                data={data}\n                fill={fill}\n                fillOpacity={showOpacity ? 0.7 : 1}\n                name={dataKey}\n                shape={seriesShape ?? shape}\n                style={onClick ? { cursor: \"pointer\" } : undefined}\n                onClick={onClick ? handleClick : undefined}\n              >\n                {!zAxisKey && (\n                  <ZAxis range={[seriesSize ?? size, seriesSize ?? size]} />\n                )}\n              </Scatter>\n            )\n          })}\n        </RechartsScatterChart>\n      </ChartContainer>\n    </div>\n  )\n}\n\nScatterChart.displayName = \"ScatterChart\"\n"]}

package/dist/chunk-V57DERRV.js

@@ -0,0 +1,233 @@
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-NHUUSXBL.js';
+import { SkeletonLoader } from './chunk-NGX3ITG4.js';
+import { Checkbox } from './chunk-JXEIRIU4.js';
+import { cn, isInteractiveTarget } from './chunk-RVAYDRMA.js';
+import { useReactTable, getCoreRowModel, flexRender } from '@tanstack/react-table';
+import { useVirtualizer } from '@tanstack/react-virtual';
+import * as React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var SKELETON_KEYS = [
+  "skeleton-row-1",
+  "skeleton-row-2",
+  "skeleton-row-3",
+  "skeleton-row-4",
+  "skeleton-row-5"
+];
+function VirtualTable({
+  data,
+  columns,
+  rowHeight = 40,
+  overscan = 5,
+  estimateSize,
+  containerHeight = 400,
+  enableRowSelection = false,
+  onRowClick,
+  getRowId,
+  loading = false,
+  loadingComponent,
+  emptyState,
+  className,
+  rowSelection: controlledRowSelection,
+  onRowSelectionChange,
+  onSelectionChange,
+  rowClassName,
+  stickyHeader = true
+}) {
+  const parentRef = React.useRef(null);
+  const [internalRowSelection, setInternalRowSelection] = React.useState({});
+  const rowSelection = controlledRowSelection ?? internalRowSelection;
+  const handleRowSelectionChange = React.useCallback(
+    (updaterOrValue) => {
+      const newValue = typeof updaterOrValue === "function" ? updaterOrValue(rowSelection) : updaterOrValue;
+      if (onRowSelectionChange) {
+        onRowSelectionChange(newValue);
+      } else {
+        setInternalRowSelection(newValue);
+      }
+      if (onSelectionChange) {
+        const selectedIndices = Object.keys(newValue).filter(
+          (key) => newValue[key]
+        );
+        const selectedRows = selectedIndices.map((idx) => data[Number(idx)]).filter(Boolean);
+        onSelectionChange(selectedRows);
+      }
+    },
+    [rowSelection, onRowSelectionChange, onSelectionChange, data]
+  );
+  const tableColumns = React.useMemo(() => {
+    if (!enableRowSelection) return columns;
+    return [
+      {
+        id: "select",
+        header: ({ table: table2 }) => /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            checked: table2.getIsAllPageRowsSelected() || table2.getIsSomePageRowsSelected() && "indeterminate",
+            "aria-label": "Select all",
+            onCheckedChange: (value) => {
+              table2.toggleAllPageRowsSelected(!!value);
+            },
+            onClick: (e) => {
+              e.stopPropagation();
+            }
+          }
+        ),
+        cell: ({ row }) => /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            "aria-label": "Select row",
+            checked: row.getIsSelected(),
+            onCheckedChange: (value) => {
+              row.toggleSelected(!!value);
+            },
+            onClick: (e) => {
+              e.stopPropagation();
+            }
+          }
+        ),
+        enableSorting: false,
+        enableHiding: false,
+        size: 40
+      },
+      ...columns
+    ];
+  }, [columns, enableRowSelection]);
+  const table = useReactTable({
+    data,
+    columns: tableColumns,
+    state: {
+      rowSelection
+    },
+    enableRowSelection,
+    getRowId,
+    getCoreRowModel: getCoreRowModel(),
+    onRowSelectionChange: handleRowSelectionChange
+  });
+  const { rows } = table.getRowModel();
+  const virtualizer = useVirtualizer({
+    count: rows.length,
+    getScrollElement: () => parentRef.current,
+    estimateSize: estimateSize ?? (() => rowHeight),
+    overscan
+  });
+  const virtualItems = virtualizer.getVirtualItems();
+  const totalSize = virtualizer.getTotalSize();
+  const containerStyle = {
+    height: typeof containerHeight === "number" ? `${String(containerHeight)}px` : containerHeight,
+    overflow: "auto",
+    willChange: "transform"
+  };
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), "data-slot": "virtual-table", children: loadingComponent ?? /* @__PURE__ */ jsx("div", { className: "space-y-2", "data-slot": "virtual-table-loading", children: SKELETON_KEYS.map((key) => /* @__PURE__ */ jsx(SkeletonLoader, { className: "h-10 w-full" }, key)) }) });
+  }
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), "data-slot": "virtual-table", children: emptyState ?? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "flex flex-col items-center justify-center py-12 text-center",
+        "data-slot": "virtual-table-empty",
+        children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: "No data available" })
+      }
+    ) });
+  }
+  const firstItem = virtualItems[0];
+  const lastItem = virtualItems[virtualItems.length - 1];
+  const paddingTop = firstItem ? firstItem.start : 0;
+  const paddingBottom = lastItem ? totalSize - lastItem.end : 0;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("rounded-md border", className),
+      "data-slot": "virtual-table",
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: parentRef,
+          className: "relative",
+          "data-slot": "virtual-table-container",
+          style: containerStyle,
+          children: /* @__PURE__ */ jsxs(Table, { children: [
+            /* @__PURE__ */ jsx(
+              TableHeader,
+              {
+                className: cn(
+                  stickyHeader && "bg-[color:var(--table-header-bg)] sticky top-0 z-10"
+                ),
+                children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(TableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(
+                  TableHead,
+                  {
+                    style: {
+                      width: header.getSize() !== 150 ? header.getSize() : void 0
+                    },
+                    children: header.isPlaceholder ? null : flexRender(
+                      header.column.columnDef.header,
+                      header.getContext()
+                    )
+                  },
+                  header.id
+                )) }, headerGroup.id))
+              }
+            ),
+            /* @__PURE__ */ jsxs(TableBody, { children: [
+              paddingTop > 0 && /* @__PURE__ */ jsx("tr", { "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+                "td",
+                {
+                  colSpan: tableColumns.length,
+                  style: { height: `${String(paddingTop)}px`, padding: 0 }
+                }
+              ) }),
+              virtualItems.map((virtualRow) => {
+                const row = rows[virtualRow.index];
+                if (!row) return null;
+                return /* @__PURE__ */ jsx(
+                  TableRow,
+                  {
+                    className: cn(
+                      onRowClick && "cursor-pointer",
+                      rowClassName?.(row)
+                    ),
+                    style: {
+                      height: `${String(virtualRow.size)}px`
+                    },
+                    "aria-rowindex": virtualRow.index + 1,
+                    "data-state": row.getIsSelected() ? "selected" : void 0,
+                    onClick: onRowClick ? (e) => {
+                      if (isInteractiveTarget(e.target, e.currentTarget)) return;
+                      onRowClick(row.original);
+                    } : void 0,
+                    children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(
+                      TableCell,
+                      {
+                        style: {
+                          width: cell.column.getSize() !== 150 ? cell.column.getSize() : void 0
+                        },
+                        children: flexRender(
+                          cell.column.columnDef.cell,
+                          cell.getContext()
+                        )
+                      },
+                      cell.id
+                    ))
+                  },
+                  row.id
+                );
+              }),
+              paddingBottom > 0 && /* @__PURE__ */ jsx("tr", { "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+                "td",
+                {
+                  colSpan: tableColumns.length,
+                  style: { height: `${String(paddingBottom)}px`, padding: 0 }
+                }
+              ) })
+            ] })
+          ] })
+        }
+      )
+    }
+  );
+}
+
+export { VirtualTable };
+//# sourceMappingURL=chunk-V57DERRV.js.map
+//# sourceMappingURL=chunk-V57DERRV.js.map

package/dist/chunk-V57DERRV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/VirtualTable/VirtualTable.tsx"],"names":["table"],"mappings":"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","file":"chunk-V57DERRV.js","sourcesContent":["import type { VirtualTableProps } from \"./VirtualTable.types\"\nimport type {\n  Table as ReactTable,\n  Row,\n  RowSelectionState,\n} from \"@tanstack/react-table\"\n\nimport {\n  flexRender,\n  getCoreRowModel,\n  useReactTable,\n} from \"@tanstack/react-table\"\nimport { useVirtualizer } from \"@tanstack/react-virtual\"\nimport * as React from \"react\"\n\nimport { cn, isInteractiveTarget } from \"../../../lib/utils\"\nimport { Checkbox } from \"../../forms/Checkbox\"\nimport { SkeletonLoader } from \"../../primitives/SkeletonLoader\"\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"../Table\"\n\n// Static keys for skeleton loader to avoid array index as key\nconst SKELETON_KEYS = [\n  \"skeleton-row-1\",\n  \"skeleton-row-2\",\n  \"skeleton-row-3\",\n  \"skeleton-row-4\",\n  \"skeleton-row-5\",\n] as const\n\n/**\n * VirtualTable - High-performance virtualized table for large datasets.\n *\n * Renders only visible rows in the viewport, enabling smooth scrolling\n * with thousands or millions of rows. Built on TanStack Virtual and\n * TanStack Table.\n *\n * @example\n * ```tsx\n * import { VirtualTable } from '@etus/ui'\n * import { ColumnDef } from '@tanstack/react-table'\n *\n * interface LogEntry {\n *   id: string\n *   timestamp: Date\n *   level: 'info' | 'warn' | 'error'\n *   message: string\n * }\n *\n * const columns: ColumnDef<LogEntry>[] = [\n *   { accessorKey: 'timestamp', header: 'Time', size: 150 },\n *   { accessorKey: 'level', header: 'Level', size: 80 },\n *   { accessorKey: 'message', header: 'Message' },\n * ]\n *\n * function LogViewer() {\n *   const { data } = useLogs() // 100k+ entries\n *\n *   return (\n *     <VirtualTable\n *       data={data}\n *       columns={columns}\n *       rowHeight={36}\n *       containerHeight={600}\n *       getRowId={(row) => row.id}\n *     />\n *   )\n * }\n * ```\n */\nfunction VirtualTable<TData>({\n  data,\n  columns,\n  rowHeight = 40,\n  overscan = 5,\n  estimateSize,\n  containerHeight = 400,\n  enableRowSelection = false,\n  onRowClick,\n  getRowId,\n  loading = false,\n  loadingComponent,\n  emptyState,\n  className,\n  rowSelection: controlledRowSelection,\n  onRowSelectionChange,\n  onSelectionChange,\n  rowClassName,\n  stickyHeader = true,\n}: VirtualTableProps<TData>) {\n  const parentRef = React.useRef<HTMLDivElement>(null)\n  const [internalRowSelection, setInternalRowSelection] =\n    React.useState<RowSelectionState>({})\n\n  const rowSelection = controlledRowSelection ?? internalRowSelection\n\n  // Create wrapper for row selection change to also notify onSelectionChange\n  const handleRowSelectionChange = React.useCallback(\n    (\n      updaterOrValue:\n        | ((old: RowSelectionState) => RowSelectionState)\n        | RowSelectionState\n    ) => {\n      const newValue =\n        typeof updaterOrValue === \"function\"\n          ? updaterOrValue(rowSelection)\n          : updaterOrValue\n\n      // Update internal or controlled state\n      if (onRowSelectionChange) {\n        onRowSelectionChange(newValue)\n      } else {\n        setInternalRowSelection(newValue)\n      }\n\n      // Notify parent of selected rows as TData array\n      if (onSelectionChange) {\n        const selectedIndices = Object.keys(newValue).filter(\n          (key) => newValue[key]\n        )\n        const selectedRows = selectedIndices\n          .map((idx) => data[Number(idx)])\n          .filter(Boolean) as TData[]\n        onSelectionChange(selectedRows)\n      }\n    },\n    [rowSelection, onRowSelectionChange, onSelectionChange, data]\n  )\n\n  // Memoize column definitions with selection column\n  const tableColumns = React.useMemo(() => {\n    if (!enableRowSelection) return columns\n\n    return [\n      {\n        id: \"select\",\n        header: ({ table }: { table: ReactTable<TData> }) => (\n          <Checkbox\n            checked={\n              table.getIsAllPageRowsSelected() ||\n              (table.getIsSomePageRowsSelected() && \"indeterminate\")\n            }\n            aria-label=\"Select all\"\n            onCheckedChange={(value) => {\n              table.toggleAllPageRowsSelected(!!value)\n            }}\n            onClick={(e) => {\n              e.stopPropagation()\n            }}\n          />\n        ),\n        cell: ({ row }: { row: Row<TData> }) => (\n          <Checkbox\n            aria-label=\"Select row\"\n            checked={row.getIsSelected()}\n            onCheckedChange={(value) => {\n              row.toggleSelected(!!value)\n            }}\n            // Selection must never bubble into onRowClick (or consumer wrappers)\n            onClick={(e) => {\n              e.stopPropagation()\n            }}\n          />\n        ),\n        enableSorting: false,\n        enableHiding: false,\n        size: 40,\n      },\n      ...columns,\n    ]\n  }, [columns, enableRowSelection])\n\n  // Initialize table\n  // eslint-disable-next-line react-hooks/incompatible-library -- TanStack Table's API is required here.\n  const table = useReactTable({\n    data,\n    columns: tableColumns,\n    state: {\n      rowSelection,\n    },\n    enableRowSelection,\n    getRowId,\n    getCoreRowModel: getCoreRowModel(),\n    onRowSelectionChange: handleRowSelectionChange,\n  })\n\n  const { rows } = table.getRowModel()\n\n  // Initialize virtualizer\n  const virtualizer = useVirtualizer({\n    count: rows.length,\n    getScrollElement: () => parentRef.current,\n    estimateSize: estimateSize ?? (() => rowHeight),\n    overscan,\n  })\n\n  const virtualItems = virtualizer.getVirtualItems()\n  const totalSize = virtualizer.getTotalSize()\n\n  // Calculate container height style\n  const containerStyle: React.CSSProperties = {\n    height:\n      typeof containerHeight === \"number\"\n        ? `${String(containerHeight)}px`\n        : containerHeight,\n    overflow: \"auto\",\n    willChange: \"transform\",\n  }\n\n  // Render loading state\n  if (loading) {\n    return (\n      <div className={cn(\"space-y-4\", className)} data-slot=\"virtual-table\">\n        {loadingComponent ?? (\n          <div className=\"space-y-2\" data-slot=\"virtual-table-loading\">\n            {SKELETON_KEYS.map((key) => (\n              <SkeletonLoader key={key} className=\"h-10 w-full\" />\n            ))}\n          </div>\n        )}\n      </div>\n    )\n  }\n\n  // Render empty state\n  if (data.length === 0) {\n    return (\n      <div className={cn(\"space-y-4\", className)} data-slot=\"virtual-table\">\n        {emptyState ?? (\n          <div\n            className=\"flex flex-col items-center justify-center py-12 text-center\"\n            data-slot=\"virtual-table-empty\"\n          >\n            <p className=\"text-muted-foreground text-sm\">No data available</p>\n          </div>\n        )}\n      </div>\n    )\n  }\n\n  // Calculate padding for virtual items\n  const firstItem = virtualItems[0]\n  const lastItem = virtualItems[virtualItems.length - 1]\n  const paddingTop = firstItem ? firstItem.start : 0\n  const paddingBottom = lastItem ? totalSize - lastItem.end : 0\n\n  return (\n    <div\n      className={cn(\"rounded-md border\", className)}\n      data-slot=\"virtual-table\"\n    >\n      <div\n        ref={parentRef}\n        className=\"relative\"\n        data-slot=\"virtual-table-container\"\n        style={containerStyle}\n      >\n        <Table>\n          <TableHeader\n            className={cn(\n              stickyHeader && \"bg-[color:var(--table-header-bg)] sticky top-0 z-10\"\n            )}\n          >\n            {table.getHeaderGroups().map((headerGroup) => (\n              <TableRow key={headerGroup.id}>\n                {headerGroup.headers.map((header) => (\n                  <TableHead\n                    key={header.id}\n                    style={{\n                      width: header.getSize() !== 150 ? header.getSize() : undefined,\n                    }}\n                  >\n                    {header.isPlaceholder\n                      ? null\n                      : flexRender(\n                          header.column.columnDef.header,\n                          header.getContext()\n                        )}\n                  </TableHead>\n                ))}\n              </TableRow>\n            ))}\n          </TableHeader>\n          <TableBody>\n            {/* Top padding row */}\n            {paddingTop > 0 && (\n              <tr aria-hidden=\"true\">\n                <td\n                  colSpan={tableColumns.length}\n                  style={{ height: `${String(paddingTop)}px`, padding: 0 }}\n                />\n              </tr>\n            )}\n\n            {/* Virtual rows */}\n            {virtualItems.map((virtualRow) => {\n              const row = rows[virtualRow.index]\n              if (!row) return null\n              return (\n                <TableRow\n                  key={row.id}\n                  className={cn(\n                    onRowClick && \"cursor-pointer\",\n                    rowClassName?.(row)\n                  )}\n                  style={{\n                    height: `${String(virtualRow.size)}px`,\n                  }}\n                  aria-rowindex={virtualRow.index + 1}\n                  data-state={row.getIsSelected() ? \"selected\" : undefined}\n                  onClick={\n                    onRowClick\n                      ? (e) => {\n                          if (isInteractiveTarget(e.target, e.currentTarget)) return\n                          onRowClick(row.original)\n                        }\n                      : undefined\n                  }\n                >\n                  {row.getVisibleCells().map((cell) => (\n                    <TableCell\n                      key={cell.id}\n                      style={{\n                        width:\n                          cell.column.getSize() !== 150\n                            ? cell.column.getSize()\n                            : undefined,\n                      }}\n                    >\n                      {flexRender(\n                        cell.column.columnDef.cell,\n                        cell.getContext()\n                      )}\n                    </TableCell>\n                  ))}\n                </TableRow>\n              )\n            })}\n\n            {/* Bottom padding row */}\n            {paddingBottom > 0 && (\n              <tr aria-hidden=\"true\">\n                <td\n                  colSpan={tableColumns.length}\n                  style={{ height: `${String(paddingBottom)}px`, padding: 0 }}\n                />\n              </tr>\n            )}\n          </TableBody>\n        </Table>\n      </div>\n    </div>\n  )\n}\n\nexport { VirtualTable }\n"]}