@expcat/tigercat-react 0.1.6 → 0.2.0

package/dist/{chunk-QORSSZX4.js → chunk-ZPFZMXA6.js}

@@ -1,10 +1,10 @@
 'use strict';
 
+var chunkZYPEO2KY_js = require('./chunk-ZYPEO2KY.js');
 var react = require('react');
 var tigercatCore = require('@expcat/tigercat-core');
 var jsxRuntime = require('react/jsx-runtime');
 
-// src/components/Popover.tsx
 var popoverIdCounter = 0;
 var createPopoverId = () => `tiger-popover-${++popoverIdCounter}`;
 var Popover = ({
@@ -16,6 +16,7 @@ var Popover = ({
   placement = "top",
   disabled = false,
   width,
+  offset = 8,
   className,
   style,
   children,
@@ -28,6 +29,8 @@ var Popover = ({
   const [internalVisible, setInternalVisible] = react.useState(defaultVisible);
   const currentVisible = isControlled ? visible : internalVisible;
   const containerRef = react.useRef(null);
+  const triggerRef = react.useRef(null);
+  const floatingRef = react.useRef(null);
   const popoverIdRef = react.useRef(null);
   if (!popoverIdRef.current) {
     popoverIdRef.current = createPopoverId();
@@ -35,6 +38,17 @@ var Popover = ({
   const popoverId = popoverIdRef.current;
   const titleId = `${popoverId}-title`;
   const contentId = `${popoverId}-content`;
+  const {
+    x,
+    y,
+    placement: actualPlacement
+  } = chunkZYPEO2KY_js.useFloating({
+    referenceRef: triggerRef,
+    floatingRef,
+    enabled: currentVisible,
+    placement,
+    offset
+  });
   const setVisible = react.useCallback(
     (nextVisible) => {
       if (disabled && nextVisible) return;
@@ -65,37 +79,28 @@ var Popover = ({
     if (disabled || trigger !== "focus") return;
     setVisible(false);
   };
-  react.useEffect(() => {
-    if (!currentVisible || trigger !== "click") return;
-    const handleClickOutside = (event) => {
-      const target = event.target;
-      if (!target) return;
-      if (containerRef.current?.contains(target)) return;
-      setVisible(false);
-    };
-    const timeoutId = setTimeout(() => {
-      document.addEventListener("click", handleClickOutside);
-    }, 0);
-    return () => {
-      clearTimeout(timeoutId);
-      document.removeEventListener("click", handleClickOutside);
-    };
-  }, [currentVisible, trigger, setVisible]);
-  react.useEffect(() => {
-    if (!currentVisible || trigger === "manual") return;
-    const handleKeyDown = (event) => {
-      if (event.key !== "Escape") return;
-      setVisible(false);
-    };
-    document.addEventListener("keydown", handleKeyDown);
-    return () => document.removeEventListener("keydown", handleKeyDown);
-  }, [currentVisible, trigger, setVisible]);
+  chunkZYPEO2KY_js.useClickOutside({
+    enabled: currentVisible && trigger === "click",
+    refs: [containerRef],
+    onOutsideClick: () => setVisible(false),
+    defer: true
+  });
+  chunkZYPEO2KY_js.useEscapeKey({
+    enabled: currentVisible && trigger !== "manual",
+    onEscape: () => setVisible(false)
+  });
   const containerClasses = tigercatCore.classNames(tigercatCore.getPopoverContainerClasses(), className);
   const triggerClasses = tigercatCore.getPopoverTriggerClasses(disabled);
-  const contentWrapperClasses = tigercatCore.getDropdownMenuWrapperClasses(currentVisible, placement);
   const contentClasses = tigercatCore.getPopoverContentClasses(width);
   const titleClasses = tigercatCore.getPopoverTitleClasses();
   const contentTextClasses = tigercatCore.getPopoverContentTextClasses();
+  const floatingStyles = {
+    position: "absolute",
+    left: x,
+    top: y,
+    transformOrigin: tigercatCore.getTransformOrigin(actualPlacement),
+    zIndex: 1e3
+  };
   const triggerHandlers = {};
   if (trigger === "click") {
     triggerHandlers.onClick = handleTriggerClick;
@@ -116,6 +121,7 @@ var Popover = ({
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
+        ref: triggerRef,
         className: triggerClasses,
         "aria-haspopup": "dialog",
         "aria-disabled": disabled ? "true" : void 0,
@@ -123,7 +129,7 @@ var Popover = ({
         children
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentWrapperClasses, hidden: !currentVisible, "aria-hidden": !currentVisible, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    currentVisible && /* @__PURE__ */ jsxRuntime.jsx("div", { ref: floatingRef, style: floatingStyles, "aria-hidden": false, children: /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
         id: popoverId,

package/dist/chunk-ZUUG3WOL.js

@@ -0,0 +1,432 @@
+'use strict';
+
+var chunkKQZ4F7FZ_js = require('./chunk-KQZ4F7FZ.js');
+var chunkDUWAV47E_js = require('./chunk-DUWAV47E.js');
+var chunkAX5XRD2Q_js = require('./chunk-AX5XRD2Q.js');
+var chunkM375I56K_js = require('./chunk-M375I56K.js');
+var react = require('react');
+var tigercatCore = require('@expcat/tigercat-core');
+var jsxRuntime = require('react/jsx-runtime');
+
+var RadarChart = ({
+  width = 320,
+  height = 200,
+  padding = 24,
+  data,
+  series,
+  maxValue,
+  startAngle = -Math.PI / 2,
+  levels = 5,
+  showLevelLabels = false,
+  showGrid = true,
+  showAxis = true,
+  showLabels = true,
+  labelOffset = 12,
+  labelFormatter,
+  levelLabelFormatter,
+  levelLabelOffset = 8,
+  colors,
+  gridLineStyle = "solid",
+  gridStrokeWidth = 1,
+  hoverable = false,
+  hoveredIndex: hoveredIndexProp,
+  activeOpacity = 1,
+  inactiveOpacity = 0.25,
+  showTooltip = true,
+  tooltipFormatter,
+  selectable = false,
+  selectedIndex: selectedIndexProp,
+  onHoveredIndexChange,
+  onSelectedIndexChange,
+  onSeriesClick,
+  onSeriesHover,
+  showLegend = false,
+  legendPosition = "bottom",
+  legendFormatter,
+  legendMarkerSize = 10,
+  legendGap = 8,
+  strokeColor = tigercatCore.DEFAULT_CHART_COLORS[0],
+  strokeWidth = 2,
+  fillColor = tigercatCore.DEFAULT_CHART_COLORS[0],
+  fillOpacity = 0.2,
+  showPoints = true,
+  pointSize = 3,
+  pointColor,
+  title,
+  desc,
+  className
+}) => {
+  const resolvedSeries = react.useMemo(() => {
+    if (series && series.length > 0) return series;
+    return [{ data: data ?? [] }];
+  }, [series, data]);
+  const {
+    resolvedHoveredIndex: _resolvedHoveredIndex,
+    resolvedSelectedIndex: _resolvedSelectedIndex,
+    activeIndex: resolvedActiveIndex,
+    tooltipPosition,
+    handleMouseEnter: handleHoverEnter,
+    handleMouseMove,
+    handleMouseLeave: handleHoverLeave,
+    handleClick: handleSelectIndex
+  } = chunkKQZ4F7FZ_js.useChartInteraction({
+    hoverable,
+    hoveredIndexProp,
+    selectable,
+    selectedIndexProp,
+    activeOpacity,
+    inactiveOpacity,
+    legendPosition,
+    getData: (index) => resolvedSeries[index],
+    onHoveredIndexChange: (index) => {
+      onHoveredIndexChange?.(index);
+      onSeriesHover?.(index, index !== null ? resolvedSeries[index] : null);
+    },
+    onSelectedIndexChange: (index) => {
+      onSelectedIndexChange?.(index);
+      if (index !== null) {
+        onSeriesClick?.(index, resolvedSeries[index]);
+      }
+    }
+  });
+  const [hoveredPoint, setHoveredPoint] = react.useState(null);
+  const handlePointEnter = react.useCallback(
+    (seriesIndex, pointIndex, event) => {
+      if (!hoverable) return;
+      setHoveredPoint({ seriesIndex, pointIndex });
+      handleHoverEnter(seriesIndex, event);
+    },
+    [hoverable, handleHoverEnter]
+  );
+  const handlePointMove = react.useCallback(
+    (event) => {
+      handleMouseMove(event);
+    },
+    [handleMouseMove]
+  );
+  const handlePointLeave = react.useCallback(() => {
+    setHoveredPoint(null);
+    handleHoverLeave();
+  }, [handleHoverLeave]);
+  const innerRect = react.useMemo(
+    () => tigercatCore.getChartInnerRect(width, height, padding),
+    [width, height, padding]
+  );
+  const radius = react.useMemo(
+    () => Math.max(0, Math.min(innerRect.width, innerRect.height) / 2),
+    [innerRect.width, innerRect.height]
+  );
+  const cx = innerRect.width / 2;
+  const cy = innerRect.height / 2;
+  const axisData = react.useMemo(() => {
+    if (series && series.length > 0) return series[0]?.data ?? [];
+    return data ?? [];
+  }, [series, data]);
+  const resolvedMaxValue = react.useMemo(() => {
+    if (typeof maxValue === "number") return Math.max(0, maxValue);
+    const values = resolvedSeries.flatMap((item) => item.data.map((datum) => datum.value));
+    const computedMax = values.length > 0 ? Math.max(...values) : 0;
+    return computedMax > 0 ? computedMax : 1;
+  }, [resolvedSeries, maxValue]);
+  const angles = react.useMemo(
+    () => tigercatCore.getRadarAngles(axisData.length, startAngle),
+    [axisData.length, startAngle]
+  );
+  const seriesPoints = react.useMemo(
+    () => resolvedSeries.map((item) => ({
+      series: item,
+      points: tigercatCore.getRadarPoints(item.data, {
+        cx,
+        cy,
+        radius,
+        startAngle,
+        maxValue: resolvedMaxValue
+      })
+    })),
+    [resolvedSeries, cx, cy, radius, startAngle, resolvedMaxValue]
+  );
+  const gridPaths = react.useMemo(() => {
+    if (!showGrid || angles.length === 0) return [];
+    const resolvedLevels = Math.max(1, Math.floor(levels));
+    return Array.from({ length: resolvedLevels }, (_, index) => {
+      const levelRadius = radius * ((index + 1) / resolvedLevels);
+      const ringPoints = angles.map((angle) => tigercatCore.polarToCartesian(cx, cy, levelRadius, angle));
+      return tigercatCore.createPolygonPath(ringPoints);
+    });
+  }, [showGrid, levels, angles, radius, cx, cy]);
+  const axisLines = react.useMemo(() => {
+    if (!showAxis || angles.length === 0) return [];
+    return angles.map((angle) => {
+      const end = tigercatCore.polarToCartesian(cx, cy, radius, angle);
+      return {
+        x1: cx,
+        y1: cy,
+        x2: end.x,
+        y2: end.y
+      };
+    });
+  }, [showAxis, angles, cx, cy, radius]);
+  const labels = react.useMemo(() => {
+    if (!showLabels || angles.length === 0) return [];
+    const formatLabel = labelFormatter ?? ((datum) => datum.label ?? `${datum.value}`);
+    return axisData.map((datum, index) => {
+      const angle = angles[index];
+      const position = tigercatCore.polarToCartesian(cx, cy, radius + labelOffset, angle);
+      return {
+        x: position.x,
+        y: position.y,
+        text: formatLabel(datum, index)
+      };
+    });
+  }, [showLabels, axisData, angles, cx, cy, radius, labelOffset, labelFormatter]);
+  const levelLabels = react.useMemo(() => {
+    if (!showLevelLabels || !showGrid || angles.length === 0) return [];
+    const resolvedLevels = Math.max(1, Math.floor(levels));
+    const formatLevel = levelLabelFormatter ?? ((value) => `${value}`);
+    return Array.from({ length: resolvedLevels }, (_, index) => {
+      const ratio = (index + 1) / resolvedLevels;
+      const value = resolvedMaxValue * ratio;
+      const position = tigercatCore.polarToCartesian(cx, cy, radius * ratio + levelLabelOffset, startAngle);
+      return {
+        x: position.x,
+        y: position.y,
+        text: formatLevel(value, index)
+      };
+    });
+  }, [
+    showLevelLabels,
+    showGrid,
+    angles.length,
+    levels,
+    resolvedMaxValue,
+    cx,
+    cy,
+    radius,
+    levelLabelOffset,
+    startAngle,
+    levelLabelFormatter
+  ]);
+  const dasharray = tigercatCore.getChartGridLineDasharray(gridLineStyle);
+  const palette = react.useMemo(
+    () => colors && colors.length > 0 ? colors : [...tigercatCore.DEFAULT_CHART_COLORS],
+    [colors]
+  );
+  const formatTooltip = react.useMemo(
+    () => tooltipFormatter ?? ((datum, seriesIndex, index, series2) => {
+      const label = datum.label ?? `#${index + 1}`;
+      const value = datum.value;
+      const name = series2?.name ?? `Series ${seriesIndex + 1}`;
+      return `${name} \xB7 ${label}: ${value}`;
+    }),
+    [tooltipFormatter]
+  );
+  const tooltipContent = react.useMemo(() => {
+    if (!hoveredPoint) return "";
+    const { seriesIndex, pointIndex } = hoveredPoint;
+    const series2 = resolvedSeries[seriesIndex];
+    if (!series2) return "";
+    const datum = series2.data[pointIndex];
+    if (!datum) return "";
+    return formatTooltip(datum, seriesIndex, pointIndex, series2);
+  }, [hoveredPoint, resolvedSeries, formatTooltip]);
+  const resolvedLegendItems = react.useMemo(
+    () => resolvedSeries.map((item, index) => {
+      const color = item.color ?? palette[index % palette.length];
+      const label = legendFormatter ? legendFormatter(item, index) : item.name ?? `Series ${index + 1}`;
+      return {
+        index,
+        label,
+        color
+      };
+    }),
+    [resolvedSeries, palette, legendFormatter]
+  );
+  const legendContainerClasses = tigercatCore.classNames(
+    "flex flex-wrap",
+    legendPosition === "right" ? "flex-col gap-2" : "flex-row gap-3"
+  );
+  const wrapperClasses = tigercatCore.classNames(
+    "inline-flex",
+    legendPosition === "right" ? "flex-row items-start gap-4" : "flex-col gap-2"
+  );
+  const chart = /* @__PURE__ */ jsxRuntime.jsxs(
+    chunkDUWAV47E_js.ChartCanvas,
+    {
+      width,
+      height,
+      padding,
+      title,
+      desc,
+      className: tigercatCore.classNames(className),
+      children: [
+        gridPaths.map((path, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: path,
+            className: tigercatCore.chartGridLineClasses,
+            fill: "none",
+            strokeWidth: gridStrokeWidth,
+            strokeDasharray: dasharray
+          },
+          `grid-${index}`
+        )),
+        axisLines.map((line, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          "line",
+          {
+            x1: line.x1,
+            y1: line.y1,
+            x2: line.x2,
+            y2: line.y2,
+            className: tigercatCore.chartGridLineClasses,
+            strokeWidth: gridStrokeWidth,
+            strokeDasharray: dasharray
+          },
+          `axis-${index}`
+        )),
+        seriesPoints.map((item, seriesIndex) => {
+          const seriesColor = item.series.color ?? palette[seriesIndex % palette.length];
+          const resolvedStrokeColor = item.series.strokeColor ?? seriesColor ?? strokeColor;
+          const resolvedFillColor = item.series.fillColor ?? seriesColor ?? fillColor;
+          const resolvedFillOpacity = item.series.fillOpacity ?? fillOpacity;
+          const resolvedStrokeWidth = item.series.strokeWidth ?? strokeWidth;
+          const resolvedShowPoints = item.series.showPoints ?? showPoints;
+          const resolvedPointSize = item.series.pointSize ?? pointSize;
+          const resolvedPointColor = item.series.pointColor ?? seriesColor ?? pointColor;
+          const areaPath = tigercatCore.createPolygonPath(item.points.map((point) => ({ x: point.x, y: point.y })));
+          const resolvedOpacity = resolvedActiveIndex === null ? void 0 : seriesIndex === resolvedActiveIndex ? activeOpacity : inactiveOpacity;
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            chunkAX5XRD2Q_js.ChartSeries,
+            {
+              data: item.series.data,
+              name: item.series.name,
+              type: "radar",
+              className: item.series.className,
+              opacity: resolvedOpacity,
+              style: hoverable || selectable ? { cursor: "pointer" } : void 0,
+              onMouseEnter: hoverable ? (e) => handleHoverEnter(seriesIndex, e) : void 0,
+              onMouseLeave: hoverable ? handleHoverLeave : void 0,
+              onClick: selectable ? () => handleSelectIndex(seriesIndex) : void 0,
+              tabIndex: selectable ? 0 : void 0,
+              onKeyDown: (event) => {
+                if (!selectable) return;
+                if (event.key !== "Enter" && event.key !== " ") return;
+                event.preventDefault();
+                handleSelectIndex(seriesIndex);
+              },
+              children: [
+                areaPath ? /* @__PURE__ */ jsxRuntime.jsx(
+                  "path",
+                  {
+                    d: areaPath,
+                    fill: resolvedFillColor,
+                    fillOpacity: resolvedFillOpacity,
+                    stroke: resolvedStrokeColor,
+                    strokeWidth: resolvedStrokeWidth,
+                    "data-radar-area": "true",
+                    "data-series-index": seriesIndex
+                  }
+                ) : null,
+                resolvedShowPoints ? item.points.map((point) => {
+                  return /* @__PURE__ */ jsxRuntime.jsx(
+                    "circle",
+                    {
+                      cx: point.x,
+                      cy: point.y,
+                      r: point.data.size ?? resolvedPointSize,
+                      fill: point.data.color ?? resolvedPointColor ?? resolvedStrokeColor,
+                      className: showTooltip && hoverable ? "cursor-pointer" : void 0,
+                      "data-radar-point": "true",
+                      "data-series-index": seriesIndex,
+                      "data-point-index": point.index,
+                      onMouseEnter: showTooltip && hoverable ? (e) => handlePointEnter(seriesIndex, point.index, e) : void 0,
+                      onMouseMove: showTooltip && hoverable ? handlePointMove : void 0,
+                      onMouseLeave: showTooltip && hoverable ? handlePointLeave : void 0
+                    },
+                    `point-${seriesIndex}-${point.index}`
+                  );
+                }) : null
+              ]
+            },
+            `series-${seriesIndex}`
+          );
+        }),
+        labels.map((label, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          "text",
+          {
+            x: label.x,
+            y: label.y,
+            className: tigercatCore.chartAxisTickTextClasses,
+            textAnchor: "middle",
+            dominantBaseline: "middle",
+            children: label.text
+          },
+          `label-${index}`
+        )),
+        levelLabels.map((label, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          "text",
+          {
+            x: label.x,
+            y: label.y,
+            className: tigercatCore.chartAxisTickTextClasses,
+            textAnchor: "middle",
+            dominantBaseline: "middle",
+            "data-radar-level-label": "true",
+            children: label.text
+          },
+          `level-${index}`
+        ))
+      ]
+    }
+  );
+  const tooltip = showTooltip && hoverable ? /* @__PURE__ */ jsxRuntime.jsx(
+    chunkM375I56K_js.ChartTooltip,
+    {
+      content: tooltipContent,
+      visible: hoveredPoint !== null && tooltipContent !== "",
+      x: tooltipPosition.x,
+      y: tooltipPosition.y
+    }
+  ) : null;
+  if (!showLegend) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-block relative", children: [
+      chart,
+      tooltip
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: wrapperClasses, children: [
+    chart,
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: legendContainerClasses, children: resolvedLegendItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        className: tigercatCore.classNames(
+          "flex items-center gap-2 text-sm text-gray-600",
+          selectable ? "cursor-pointer" : "cursor-default"
+        ),
+        onClick: selectable ? () => handleSelectIndex(item.index) : void 0,
+        onMouseEnter: hoverable ? (e) => handleHoverEnter(item.index, e) : void 0,
+        onMouseLeave: hoverable ? handlePointLeave : void 0,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "inline-block rounded-full",
+              style: {
+                width: `${legendMarkerSize}px`,
+                height: `${legendMarkerSize}px`,
+                backgroundColor: item.color
+              }
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { style: { marginRight: `${legendGap}px` }, children: item.label })
+        ]
+      },
+      `legend-${item.index}`
+    )) }),
+    tooltip
+  ] });
+};
+var RadarChart_default = RadarChart;
+
+exports.RadarChart = RadarChart;
+exports.RadarChart_default = RadarChart_default;

package/dist/chunk-ZYPEO2KY.js

@@ -0,0 +1,115 @@
+'use strict';
+
+var react = require('react');
+var tigercatCore = require('@expcat/tigercat-core');
+
+// src/utils/overlay.ts
+function useClickOutside({
+  enabled,
+  refs,
+  onOutsideClick,
+  defer = false
+}) {
+  react.useEffect(() => {
+    if (!enabled) return;
+    const handler = (event) => {
+      const elements = refs.map((ref) => ref?.current);
+      if (tigercatCore.isEventOutside(event, elements)) {
+        onOutsideClick();
+      }
+    };
+    const attach = () => document.addEventListener("click", handler);
+    const detach = () => document.removeEventListener("click", handler);
+    if (!defer) {
+      attach();
+      return () => detach();
+    }
+    const timer = window.setTimeout(() => attach(), 0);
+    return () => {
+      window.clearTimeout(timer);
+      detach();
+    };
+  }, [enabled, refs, onOutsideClick, defer]);
+}
+function useEscapeKey({ enabled, onEscape }) {
+  react.useEffect(() => {
+    if (!enabled) return;
+    const handler = (event) => {
+      if (event.defaultPrevented) return;
+      if (!tigercatCore.isEscapeKey(event)) return;
+      onEscape();
+    };
+    document.addEventListener("keydown", handler);
+    return () => document.removeEventListener("keydown", handler);
+  }, [enabled, onEscape]);
+}
+function useFloating(options) {
+  const {
+    referenceRef,
+    floatingRef,
+    enabled,
+    placement: initialPlacement = "bottom",
+    offset: offsetDistance = 8,
+    arrowRef,
+    onPlacementChange
+  } = options;
+  const [x, setX] = react.useState(0);
+  const [y, setY] = react.useState(0);
+  const [placement, setPlacement] = react.useState(initialPlacement);
+  const [arrowX, setArrowX] = react.useState(void 0);
+  const [arrowY, setArrowY] = react.useState(void 0);
+  const onPlacementChangeRef = react.useRef(onPlacementChange);
+  onPlacementChangeRef.current = onPlacementChange;
+  const update = react.useCallback(async () => {
+    const reference = referenceRef.current;
+    const floating = floatingRef.current;
+    if (!reference || !floating) return;
+    const floatingOptions = {
+      placement: initialPlacement,
+      offset: offsetDistance,
+      flip: true,
+      shift: true,
+      arrowElement: arrowRef?.current
+    };
+    const result = await tigercatCore.computeFloatingPosition(
+      reference,
+      floating,
+      floatingOptions
+    );
+    setX(result.x);
+    setY(result.y);
+    setPlacement((prev) => {
+      if (prev !== result.placement) {
+        onPlacementChangeRef.current?.(result.placement);
+        return result.placement;
+      }
+      return prev;
+    });
+    if (result.arrow) {
+      setArrowX(result.arrow.x);
+      setArrowY(result.arrow.y);
+    }
+  }, [referenceRef, floatingRef, initialPlacement, offsetDistance, arrowRef]);
+  react.useEffect(() => {
+    const reference = referenceRef.current;
+    const floating = floatingRef.current;
+    if (!enabled || !reference || !floating) return;
+    update();
+    const cleanup = tigercatCore.autoUpdateFloating(reference, floating, update);
+    return () => {
+      cleanup();
+    };
+  }, [enabled, referenceRef, floatingRef, update]);
+  return {
+    x,
+    y,
+    placement,
+    arrowX,
+    arrowY,
+    update
+  };
+}
+
+exports.useClickOutside = useClickOutside;
+exports.useEscapeKey = useEscapeKey;
+exports.useFloating = useFloating;

package/dist/components/AreaChart.d.mts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { AreaChartProps as AreaChartProps$1, AreaChartDatum, AreaChartSeries, ChartPadding, ChartScale } from '@expcat/tigercat-core';
+
+interface AreaChartProps extends AreaChartProps$1 {
+    data?: AreaChartDatum[];
+    series?: AreaChartSeries[];
+    padding?: ChartPadding;
+    xScale?: ChartScale;
+    yScale?: ChartScale;
+    onHoveredIndexChange?: (index: number | null) => void;
+    onSelectedIndexChange?: (index: number | null) => void;
+    onSeriesClick?: (seriesIndex: number, series: AreaChartSeries) => void;
+    onSeriesHover?: (seriesIndex: number | null, series: AreaChartSeries | null) => void;
+    onPointClick?: (seriesIndex: number, pointIndex: number, datum: AreaChartDatum) => void;
+    onPointHover?: (seriesIndex: number | null, pointIndex: number | null, datum: AreaChartDatum | null) => void;
+}
+declare const AreaChart: React.FC<AreaChartProps>;
+
+export { AreaChart, type AreaChartProps, AreaChart as default };