From b9c3b1522f4b756ca24bacb5cb4f5b712d3c5fdb Mon Sep 17 00:00:00 2001
From: Tomer <4tomer.friedman@gmail.com>
Date: Sun, 31 Mar 2024 11:57:09 +0300
Subject: [PATCH] feat: custom props and children

---
 package.json                                         | 12 ++++++------
 .../chart-elements/AreaChart/AreaChart.tsx           |  4 ++++
 src/components/chart-elements/BarChart/BarChart.tsx  |  4 ++++
 .../chart-elements/LineChart/LineChart.tsx           |  4 ++++
 .../chart-elements/common/BaseChartProps.tsx         |  1 +
 5 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index ee6faff6d..ebb5c093b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "@tremor/react",
-  "version": "0.0.0-development",
+  "name": "@traceloop/tremor",
+  "version": "0.0.0",
   "description": "The React library to build dashboards faster.",
   "scripts": {
     "prebuild": "rm -rf dist",
@@ -15,14 +15,14 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/tremorlabs/tremor.git"
+    "url": "https://github.com/traceloop/tremor.git"
   },
-  "author": "tremor",
+  "author": "tremor (forked by traceloop)",
   "license": "Apache 2.0",
   "bugs": {
-    "url": "https://github.com/tremorlabs/tremor/issues"
+    "url": "https://github.com/traceloop/tremor/issues"
   },
-  "homepage": "https://github.com/tremorlabs/tremor#readme",
+  "homepage": "https://github.com/traceloop/tremor#readme",
   "dependencies": {
     "@floating-ui/react": "^0.19.2",
     "@headlessui/react": "^1.7.18",
diff --git a/src/components/chart-elements/AreaChart/AreaChart.tsx b/src/components/chart-elements/AreaChart/AreaChart.tsx
index 15a9b038d..9055d38a0 100644
--- a/src/components/chart-elements/AreaChart/AreaChart.tsx
+++ b/src/components/chart-elements/AreaChart/AreaChart.tsx
@@ -48,6 +48,7 @@ interface ActiveDot {
 
 const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref) => {
   const {
+    children,
     data = [],
     categories = [],
     index,
@@ -77,6 +78,7 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
     enableLegendSlider = false,
     customTooltip,
     rotateLabelX,
+    rechartProps,
     tickGap = 5,
     ...other
   } = props;
@@ -139,6 +141,7 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
       <ResponsiveContainer className="h-full w-full">
         {data?.length ? (
           <ReChartsAreaChart
+          {...rechartProps}
             data={data}
             onClick={
               hasOnValueChange && (activeLegend || activeDot)
@@ -150,6 +153,7 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
                 : undefined
             }
           >
+            {children}
             {showGridLines ? (
               <CartesianGrid
                 className={tremorTwMerge(
diff --git a/src/components/chart-elements/BarChart/BarChart.tsx b/src/components/chart-elements/BarChart/BarChart.tsx
index 661ad2f13..8e498f823 100644
--- a/src/components/chart-elements/BarChart/BarChart.tsx
+++ b/src/components/chart-elements/BarChart/BarChart.tsx
@@ -64,6 +64,7 @@ export interface BarChartProps extends BaseChartProps {
 
 const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) => {
   const {
+    children,
     data = [],
     categories = [],
     index,
@@ -93,6 +94,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
     rotateLabelX,
     tickGap = 5,
     className,
+    rechartProps,
     ...other
   } = props;
   const CustomTooltip = customTooltip;
@@ -145,6 +147,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
       <ResponsiveContainer className="h-full w-full">
         {data?.length ? (
           <ReChartsBarChart
+          {...rechartProps}
             data={data}
             stackOffset={stack ? "sign" : relative ? "expand" : "none"}
             layout={layout === "vertical" ? "vertical" : "horizontal"}
@@ -158,6 +161,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
                 : undefined
             }
           >
+            {children}
             {showGridLines ? (
               <CartesianGrid
                 className={tremorTwMerge(
diff --git a/src/components/chart-elements/LineChart/LineChart.tsx b/src/components/chart-elements/LineChart/LineChart.tsx
index 90b707a50..fe07d4021 100644
--- a/src/components/chart-elements/LineChart/LineChart.tsx
+++ b/src/components/chart-elements/LineChart/LineChart.tsx
@@ -45,6 +45,7 @@ interface ActiveDot {
 
 const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref) => {
   const {
+    children,
     data = [],
     categories = [],
     index,
@@ -73,6 +74,7 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
     customTooltip,
     rotateLabelX,
     tickGap = 5,
+    rechartProps,
     ...other
   } = props;
   const CustomTooltip = customTooltip;
@@ -135,6 +137,7 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
       <ResponsiveContainer className="h-full w-full">
         {data?.length ? (
           <ReChartsLineChart
+            {...rechartProps}
             data={data}
             onClick={
               hasOnValueChange && (activeLegend || activeDot)
@@ -146,6 +149,7 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
                 : undefined
             }
           >
+            {children}
             {showGridLines ? (
               <CartesianGrid
                 className={tremorTwMerge(
diff --git a/src/components/chart-elements/common/BaseChartProps.tsx b/src/components/chart-elements/common/BaseChartProps.tsx
index c2d915f0e..949168525 100644
--- a/src/components/chart-elements/common/BaseChartProps.tsx
+++ b/src/components/chart-elements/common/BaseChartProps.tsx
@@ -41,6 +41,7 @@ interface BaseChartProps extends BaseAnimationTimingProps, React.HTMLAttributes<
     xAxisHeight?: number;
   };
   tickGap?: number;
+  rechartProps?: { [key: string]: any };
 }
 
 export default BaseChartProps;