@deepnoid/ui 0.1.126 → 0.1.128

package/dist/{chunk-4WHX4RXX.mjs → chunk-2OTW3LHJ.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   text_button_default
-} from "./chunk-SDUDU3CU.mjs";
+} from "./chunk-3Q54M5ED.mjs";
 import {
   Icon_default
 } from "./chunk-XX2PHROM.mjs";

package/dist/{chunk-KP2KOY5Z.mjs → chunk-DRQQKLIE.mjs}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-ZOTHPHXA.mjs";
 import {
   toast_default
-} from "./chunk-5R3ARH2N.mjs";
+} from "./chunk-XBQEL2CR.mjs";
 
 // src/components/toast/use-toast.tsx
 import { createContext, useContext, useState, useCallback, useEffect, useRef } from "react";

package/dist/chunk-FBIG4AGH.mjs

@@ -0,0 +1,138 @@
+"use client";
+import {
+  clsx
+} from "./chunk-27Y6K5NK.mjs";
+import {
+  tv
+} from "./chunk-76QIZILI.mjs";
+
+// src/components/table/definition-table.tsx
+import { forwardRef, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_CELL_CLASSES = "px-[10px] py-[8px] text-md border-r border-neutral-light h-[50px]";
+var FIRST_CELL_WIDTH_CLASS = "w-[120px] font-bold text-md text-body-foreground";
+var renderColGroup = (rows) => {
+  let maxCols = 0;
+  const colWidths = [];
+  rows.forEach((row) => {
+    let currentColCount = 0;
+    row.cells.forEach((cell) => {
+      currentColCount += cell.colSpan || 1;
+    });
+    maxCols = Math.max(maxCols, currentColCount);
+  });
+  colWidths[0] = "120px";
+  rows.forEach((row) => {
+    let colIndex = 0;
+    row.cells.forEach((cell) => {
+      const span = cell.colSpan || 1;
+      if (colIndex > 0 && cell.width && cell.width !== "auto" && colIndex < maxCols) {
+        colWidths[colIndex] = cell.width;
+      }
+      colIndex += span;
+    });
+  });
+  const cols = [];
+  for (let i = 0; i < maxCols; i++) {
+    cols.push(/* @__PURE__ */ jsx("col", { style: { width: colWidths[i] || "auto" } }, i));
+  }
+  return /* @__PURE__ */ jsx("colgroup", { children: cols });
+};
+var getHighlightColumnIndex = (rows, key) => {
+  if (!key) return null;
+  for (const row of rows) {
+    let colIndex = 0;
+    for (const cell of row.cells) {
+      const span = cell.colSpan || 1;
+      if (cell.key === key) return colIndex;
+      colIndex += span;
+    }
+  }
+  return null;
+};
+var DefinitionTableRow = ({
+  cells,
+  className,
+  rowIndex = 0,
+  rowCount = 0,
+  highlightColumnIndex
+}) => /* @__PURE__ */ jsx("tr", { className: clsx("border-neutral-light border-b", className), children: cells.map((cell, colIndex) => {
+  const isFirstCell = colIndex === 0;
+  const isHighlighted = colIndex === highlightColumnIndex;
+  const isFirstRow = rowIndex === 0;
+  const isLastRow = rowIndex === rowCount - 1;
+  const borderHighlightClass = isHighlighted ? clsx(
+    "border-l-[2px] border-r-[2px] border-primary-main bg-neutral-soft",
+    isFirstRow && "border-t-[2px]",
+    isLastRow && "border-b-[2px]"
+  ) : "";
+  const combinedClassName = clsx(
+    DEFAULT_CELL_CLASSES,
+    isFirstCell && FIRST_CELL_WIDTH_CLASS,
+    cell.className,
+    borderHighlightClass
+  );
+  let cellStyle;
+  if (isFirstCell) {
+    cellStyle = {
+      width: "120px",
+      minWidth: "120px",
+      maxWidth: "120px"
+    };
+  } else if (cell.width && cell.width !== "auto") {
+    cellStyle = {
+      width: cell.width,
+      minWidth: cell.width,
+      maxWidth: cell.width
+    };
+  } else {
+    cellStyle = { width: "100%" };
+  }
+  return /* @__PURE__ */ jsx(
+    "td",
+    {
+      className: combinedClassName,
+      colSpan: cell.colSpan,
+      rowSpan: cell.rowSpan,
+      style: { ...cellStyle, height: "50px" },
+      children: cell.content
+    },
+    colIndex
+  );
+}) });
+var DefinitionTable = forwardRef(
+  ({ rows = [], footer, highlightColumnKey, classNames }, ref) => {
+    const slots = useMemo(() => DefinitionTableStyle(), []);
+    const highlightColumnIndex = useMemo(
+      () => getHighlightColumnIndex(rows, highlightColumnKey),
+      [rows, highlightColumnKey]
+    );
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx(slots.base(), classNames == null ? void 0 : classNames.base), children: /* @__PURE__ */ jsxs("table", { className: clsx(slots.table(), classNames == null ? void 0 : classNames.table), children: [
+      renderColGroup(rows),
+      /* @__PURE__ */ jsx("tbody", { children: rows.map((row, i) => /* @__PURE__ */ jsx(
+        DefinitionTableRow,
+        {
+          ...row,
+          rowIndex: i,
+          rowCount: rows.length,
+          highlightColumnIndex,
+          className: row.className
+        },
+        i
+      )) }),
+      footer && /* @__PURE__ */ jsx("tfoot", { children: footer })
+    ] }) });
+  }
+);
+DefinitionTable.displayName = "DefinitionTable";
+var definition_table_default = DefinitionTable;
+var DefinitionTableStyle = tv({
+  slots: {
+    base: ["flex", "flex-col", "gap-[30px]"],
+    table: ["w-full", "table-auto", "border", "border-neutral-light"]
+  }
+});
+
+export {
+  definition_table_default
+};

package/dist/{chunk-MPUZ5T7X.mjs → chunk-G75QD37P.mjs}

@@ -8,10 +8,10 @@ import {
 } from "./chunk-FWFEKWWD.mjs";
 import {
   input_default
-} from "./chunk-ZI3MLO7X.mjs";
+} from "./chunk-M6ODX3GX.mjs";
 import {
   text_button_default
-} from "./chunk-SDUDU3CU.mjs";
+} from "./chunk-3Q54M5ED.mjs";
 import {
   button_default
 } from "./chunk-TRLIC34S.mjs";

package/dist/{chunk-WNNOVISA.mjs → chunk-HUJ5SMJH.mjs}

@@ -8,24 +8,39 @@ import {
 
 // src/components/charts/barChart.tsx
 import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
-import { XAxis, YAxis, ResponsiveContainer, CartesianGrid, BarChart, Bar, Tooltip } from "recharts";
+import { XAxis, YAxis, ResponsiveContainer, CartesianGrid, BarChart, Bar } from "recharts";
 import { jsx, jsxs } from "react/jsx-runtime";
 var BarChartComponent = forwardRef((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, barChartStyle.variantKeys);
   const {
-    data,
+    data = [],
     label,
     classNames,
     yAxisTicks = [0, 20, 40, 60, 80, 100],
     yAxisTickFormatter = (value) => `${value}`,
     yAxisDomain = [-6, 110],
-    customTooltip
+    tooltipFormatter
   } = { ...props, ...variantProps };
   const slots = useMemo(() => barChartStyle({ ...variantProps }), [variantProps]);
   const [tickPositions, setTickPositions] = useState([]);
   const tickRef = useRef([]);
-  const CustomBarShape = (barProps) => {
-    const { x, y, width, height, fill } = barProps;
+  const [tooltipState, setTooltipState] = useState(null);
+  const handleMouseEnter = (e, dataKey) => {
+    if (!tooltipFormatter) return;
+    const { payload, x, y } = e;
+    if (!payload || !payload[dataKey]) return;
+    setTooltipState({
+      x,
+      y,
+      value: payload[dataKey],
+      dataKey,
+      label: payload.title
+    });
+  };
+  const handleMouseLeave = () => {
+    setTooltipState(null);
+  };
+  const CustomBarShape = ({ x, y, width, height, fill }) => {
     const radius = 5;
     const extraHeight = 10;
     const adjustedHeight = height + extraHeight;
@@ -40,9 +55,7 @@ var BarChartComponent = forwardRef((originalProps, ref) => {
     ) : /* @__PURE__ */ jsx("rect", { x, y, width, height: 0, fill });
   };
   const CustomTick = ({ x, y, payload }) => {
-    if (x !== void 0) {
-      tickRef.current.push(x);
-    }
+    if (x !== void 0) tickRef.current.push(x);
     return /* @__PURE__ */ jsx(
       "text",
       {
@@ -57,28 +70,20 @@ var BarChartComponent = forwardRef((originalProps, ref) => {
       }
     );
   };
-  const CustomYAxisTick = ({ x, y, payload }) => {
-    return /* @__PURE__ */ jsx(
-      "text",
-      {
-        x: x - 10,
-        y,
-        textAnchor: "middle",
-        fontSize: 12,
-        fontWeight: 700,
-        fill: "currentColor",
-        className: "text-body-foreground",
-        dy: 4,
-        children: yAxisTickFormatter(payload.value)
-      }
-    );
-  };
-  const CustomTooltip = ({ active, payload, label: label2 }) => {
-    if (customTooltip && active && payload && payload.length) {
-      return customTooltip({ active, payload, label: label2 });
+  const CustomYAxisTick = ({ x, y, payload }) => /* @__PURE__ */ jsx(
+    "text",
+    {
+      x: x - 10,
+      y,
+      textAnchor: "middle",
+      fontSize: 12,
+      fontWeight: 700,
+      fill: "currentColor",
+      className: "text-body-foreground",
+      dy: 4,
+      children: yAxisTickFormatter(payload.value)
     }
-    return null;
-  };
+  );
   useEffect(() => {
     const raf = requestAnimationFrame(() => {
       const unique = [...new Set(tickRef.current)].sort((a, b) => a - b);
@@ -146,26 +151,63 @@ var BarChartComponent = forwardRef((originalProps, ref) => {
               domain: yAxisDomain
             }
           ),
-          customTooltip && /* @__PURE__ */ jsx(Tooltip, { content: /* @__PURE__ */ jsx(CustomTooltip, {}), cursor: { fill: "transparent" } }),
-          /* @__PURE__ */ jsx(Bar, { dataKey: "blue", fill: "url(#blueGradient)", width: 20, shape: CustomBarShape }),
-          /* @__PURE__ */ jsx(Bar, { dataKey: "green", fill: "url(#greenGradient)", width: 20, shape: CustomBarShape }),
-          /* @__PURE__ */ jsx(Bar, { dataKey: "pink", fill: "url(#pinkGradient)", width: 20, shape: CustomBarShape })
+          /* @__PURE__ */ jsx(
+            Bar,
+            {
+              dataKey: "blue",
+              fill: "url(#blueGradient)",
+              shape: CustomBarShape,
+              onMouseEnter: (e) => handleMouseEnter(e, "blue"),
+              onMouseLeave: handleMouseLeave
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Bar,
+            {
+              dataKey: "green",
+              fill: "url(#greenGradient)",
+              shape: CustomBarShape,
+              onMouseEnter: (e) => handleMouseEnter(e, "green"),
+              onMouseLeave: handleMouseLeave
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Bar,
+            {
+              dataKey: "pink",
+              fill: "url(#pinkGradient)",
+              shape: CustomBarShape,
+              onMouseEnter: (e) => handleMouseEnter(e, "pink"),
+              onMouseLeave: handleMouseLeave
+            }
+          )
         ]
       }
-    ) })
+    ) }),
+    tooltipFormatter && tooltipState && /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          position: "absolute",
+          left: tooltipState.x + 10,
+          top: tooltipState.y - 40,
+          transform: "translateX(-50%)",
+          pointerEvents: "none"
+        },
+        children: tooltipFormatter(tooltipState)
+      }
+    )
   ] });
 });
 BarChartComponent.displayName = "barChart";
 var barChart_default = BarChartComponent;
 var barChartStyle = tv({
   slots: {
-    base: ["flex", "flex-col", "gap-[10px]", "select-none"],
+    base: ["flex", "flex-col", "gap-[10px]", "select-none", "relative"],
     label: ["text-md", "font-bold", "text-body-foreground"]
   },
   variants: {},
-  defaultVariants: {
-    color: "primary"
-  }
+  defaultVariants: {}
 });
 
 export {

package/dist/{chunk-ANILRUAS.mjs → chunk-JCPTLQ2B.mjs}

@@ -4,19 +4,19 @@ import {
 } from "./chunk-6PN3DGOE.mjs";
 import {
   pagination_default
-} from "./chunk-IBYQBC6D.mjs";
+} from "./chunk-OWHJOXXX.mjs";
 import {
   scrollArea_default
 } from "./chunk-M37VBNB3.mjs";
 import {
   checkbox_default
-} from "./chunk-3U5NJTRH.mjs";
-import {
-  mapPropsVariants
-} from "./chunk-E3G5QXSH.mjs";
+} from "./chunk-GNJJUQV2.mjs";
 import {
   clsx
 } from "./chunk-27Y6K5NK.mjs";
+import {
+  mapPropsVariants
+} from "./chunk-E3G5QXSH.mjs";
 
 // src/components/table/table.tsx
 import {

package/dist/{chunk-BD4M2FZM.mjs → chunk-JN5LH5YY.mjs}

@@ -1,10 +1,10 @@
 "use client";
 import {
   progress_default
-} from "./chunk-MCBAEW2Q.mjs";
+} from "./chunk-TEP5V4XL.mjs";
 import {
   input_default
-} from "./chunk-ZI3MLO7X.mjs";
+} from "./chunk-M6ODX3GX.mjs";
 import {
   button_default
 } from "./chunk-TRLIC34S.mjs";

package/dist/{chunk-5XW5QDIW.mjs → chunk-NCK5E2NL.mjs}

@@ -69,7 +69,7 @@ var CircularProgress = forwardRef((originalProps, ref) => {
                 cx: size / 2,
                 cy: size / 2,
                 r: OUTER_RADIUS + BORDER_MARGIN,
-                fill: "none",
+                fill: "#fff",
                 stroke: "#DFE2E7",
                 strokeWidth: "1"
               }

package/dist/{chunk-IBYQBC6D.mjs → chunk-OWHJOXXX.mjs}

@@ -4,19 +4,19 @@ import {
 } from "./chunk-F3HENRVM.mjs";
 import {
   input_default
-} from "./chunk-ZI3MLO7X.mjs";
+} from "./chunk-M6ODX3GX.mjs";
 import {
   Icon_default
 } from "./chunk-XX2PHROM.mjs";
+import {
+  clsx
+} from "./chunk-27Y6K5NK.mjs";
 import {
   mapPropsVariants
 } from "./chunk-E3G5QXSH.mjs";
 import {
   tv
 } from "./chunk-76QIZILI.mjs";
-import {
-  clsx
-} from "./chunk-27Y6K5NK.mjs";
 
 // src/components/pagination/pagination.tsx
 import { forwardRef, useMemo, useState } from "react";

package/dist/{chunk-4X67BUPA.mjs → chunk-UPVTVM5V.mjs}

@@ -1,19 +1,19 @@
 "use client";
 import {
   select_default
-} from "./chunk-YWLC7KRK.mjs";
+} from "./chunk-M3ZHMKBV.mjs";
 import {
   Icon_default
 } from "./chunk-XX2PHROM.mjs";
+import {
+  clsx
+} from "./chunk-27Y6K5NK.mjs";
 import {
   mapPropsVariants
 } from "./chunk-E3G5QXSH.mjs";
 import {
   tv
 } from "./chunk-76QIZILI.mjs";
-import {
-  clsx
-} from "./chunk-27Y6K5NK.mjs";
 
 // src/components/picker/timePicker.tsx
 import { forwardRef, useCallback, useMemo, useState, useRef } from "react";

package/dist/{chunk-DDK4NEDX.mjs → chunk-ZI2HHPRM.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   backdrop_default
-} from "./chunk-IW2MDZBW.mjs";
+} from "./chunk-UMPLXLIP.mjs";
 import {
   button_default
 } from "./chunk-TRLIC34S.mjs";

package/dist/components/backdrop/backdrop.mjs

@@ -1,9 +1,9 @@
 "use client";
 import {
   backdrop_default
-} from "../../chunk-IW2MDZBW.mjs";
-import "../../chunk-76QIZILI.mjs";
+} from "../../chunk-UMPLXLIP.mjs";
 import "../../chunk-27Y6K5NK.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   backdrop_default as default

package/dist/components/backdrop/index.mjs

@@ -2,9 +2,9 @@
 import "../../chunk-SE5TU755.mjs";
 import {
   backdrop_default
-} from "../../chunk-IW2MDZBW.mjs";
-import "../../chunk-76QIZILI.mjs";
+} from "../../chunk-UMPLXLIP.mjs";
 import "../../chunk-27Y6K5NK.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   backdrop_default as Backdrop

package/dist/components/breadcrumb/breadcrumb.mjs

@@ -1,9 +1,9 @@
 "use client";
 import {
   breadcrumb_default
-} from "../../chunk-4WHX4RXX.mjs";
+} from "../../chunk-2OTW3LHJ.mjs";
 import "../../chunk-MY5U63QO.mjs";
-import "../../chunk-SDUDU3CU.mjs";
+import "../../chunk-3Q54M5ED.mjs";
 import "../../chunk-GUTGDPXH.mjs";
 import "../../chunk-TRLIC34S.mjs";
 import "../../chunk-OLQJXFHU.mjs";
@@ -12,10 +12,10 @@ import "../../chunk-LXHUO6VM.mjs";
 import "../../chunk-SZL743JC.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-XX2PHROM.mjs";
-import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-GQFNYXJZ.mjs";
-import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
+import "../../chunk-E3G5QXSH.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   breadcrumb_default as default

package/dist/components/breadcrumb/index.mjs

@@ -2,9 +2,9 @@
 import "../../chunk-KYIODWXL.mjs";
 import {
   breadcrumb_default
-} from "../../chunk-4WHX4RXX.mjs";
+} from "../../chunk-2OTW3LHJ.mjs";
 import "../../chunk-MY5U63QO.mjs";
-import "../../chunk-SDUDU3CU.mjs";
+import "../../chunk-3Q54M5ED.mjs";
 import "../../chunk-GUTGDPXH.mjs";
 import "../../chunk-TRLIC34S.mjs";
 import "../../chunk-OLQJXFHU.mjs";
@@ -13,10 +13,10 @@ import "../../chunk-LXHUO6VM.mjs";
 import "../../chunk-SZL743JC.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-XX2PHROM.mjs";
-import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-GQFNYXJZ.mjs";
-import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
+import "../../chunk-E3G5QXSH.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   breadcrumb_default as Breadcrumb

package/dist/components/button/button.mjs

@@ -7,8 +7,8 @@ import "../../chunk-LXHUO6VM.mjs";
 import "../../chunk-SZL743JC.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-XX2PHROM.mjs";
-import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-GQFNYXJZ.mjs";
+import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/button/icon-button.mjs

@@ -7,8 +7,8 @@ import "../../chunk-LXHUO6VM.mjs";
 import "../../chunk-SZL743JC.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-XX2PHROM.mjs";
-import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-GQFNYXJZ.mjs";
+import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/button/index.mjs

@@ -2,7 +2,7 @@
 import "../../chunk-MY5U63QO.mjs";
 import {
   text_button_default
-} from "../../chunk-SDUDU3CU.mjs";
+} from "../../chunk-3Q54M5ED.mjs";
 import {
   button_group_default
 } from "../../chunk-GUTGDPXH.mjs";
@@ -17,10 +17,10 @@ import "../../chunk-LXHUO6VM.mjs";
 import "../../chunk-SZL743JC.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-XX2PHROM.mjs";
-import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-GQFNYXJZ.mjs";
-import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
+import "../../chunk-E3G5QXSH.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   button_default as Button,

package/dist/components/button/text-button.mjs

@@ -1,10 +1,10 @@
 "use client";
 import {
   text_button_default
-} from "../../chunk-SDUDU3CU.mjs";
+} from "../../chunk-3Q54M5ED.mjs";
+import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-76QIZILI.mjs";
-import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   text_button_default as default

package/dist/components/charts/areaChart.mjs

@@ -4,9 +4,9 @@ import {
 } from "../../chunk-IHLCZM5T.mjs";
 import "../../chunk-DQRAFUDA.mjs";
 import "../../chunk-M37VBNB3.mjs";
+import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-76QIZILI.mjs";
-import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   areaChart_default as default

package/dist/components/charts/barChart.d.mts

@@ -10,9 +10,9 @@ type BarData = {
     green: number;
     pink: number;
 };
-type TooltipProps = {
-    active: boolean;
-    payload: any[];
+type TooltipFormatterParams = {
+    dataKey: string;
+    value: number;
     label: string;
 };
 type Props = {
@@ -22,7 +22,7 @@ type Props = {
     yAxisTicks?: number[];
     yAxisTickFormatter?: (value: number) => string;
     yAxisDomain?: [number, number];
-    customTooltip?: (props: TooltipProps) => ReactNode;
+    tooltipFormatter?: (params: TooltipFormatterParams) => ReactNode;
 };
 type barChartProps = Props & barChartVariantProps;
 declare const BarChartComponent: react.ForwardRefExoticComponent<Props & barChartVariantProps & react.RefAttributes<HTMLDivElement>>;

package/dist/components/charts/barChart.d.ts

@@ -10,9 +10,9 @@ type BarData = {
     green: number;
     pink: number;
 };
-type TooltipProps = {
-    active: boolean;
-    payload: any[];
+type TooltipFormatterParams = {
+    dataKey: string;
+    value: number;
     label: string;
 };
 type Props = {
@@ -22,7 +22,7 @@ type Props = {
     yAxisTicks?: number[];
     yAxisTickFormatter?: (value: number) => string;
     yAxisDomain?: [number, number];
-    customTooltip?: (props: TooltipProps) => ReactNode;
+    tooltipFormatter?: (params: TooltipFormatterParams) => ReactNode;
 };
 type barChartProps = Props & barChartVariantProps;
 declare const BarChartComponent: react.ForwardRefExoticComponent<Props & barChartVariantProps & react.RefAttributes<HTMLDivElement>>;