Skip to content

Commit f8cc510

Browse files
Merge branch 'main' into feat/allow_passing_label_as_prop
2 parents 841885d + a641abb commit f8cc510

File tree

12 files changed

+110
-20
lines changed

12 files changed

+110
-20
lines changed

README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
<br />
22
<br />
3+
<h2>WARNING: This is a fork of the Tremor library that can be found at: https://github.com/tremorlabs/tremor</h2>
4+
<p>This fork is intended to be used at Panalyt until the pending PRs that resolves some of the necessary items for Panalyt are merged</p>
35
<p align="center">
46
<a href="https://tremor.so">
57
<picture>

package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
2-
"name": "@tremor/react",
2+
"name": "@abalonperin/tremor",
33
"version": "0.0.0-development",
4-
"description": "The React library to build dashboards faster.",
4+
"description": "A fork of the Tremor library",
55
"scripts": {
66
"prebuild": "rm -rf dist",
77
"build": "rollup -c",
@@ -15,10 +15,10 @@
1515
},
1616
"repository": {
1717
"type": "git",
18-
"url": "https://github.com/tremorlabs/tremor.git"
18+
"url": "git+https://github.com/tremorlabs/tremor.git"
1919
},
2020
"author": "tremor",
21-
"license": "Apache 2.0",
21+
"license": "Apache-2.0",
2222
"bugs": {
2323
"url": "https://github.com/tremorlabs/tremor/issues"
2424
},

src/components/chart-elements/AreaChart/AreaChart.tsx

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
6565
showTooltip = true,
6666
showLegend = true,
6767
showGridLines = true,
68+
showAxisLine = false,
6869
showGradient = true,
6970
autoMinValue = false,
7071
curveType = "linear",
@@ -189,10 +190,16 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
189190
"fill-tremor-content",
190191
// dark
191192
"dark:fill-dark-tremor-content",
193+
// common
194+
"stroke-1",
195+
// light
196+
"stroke-tremor-border",
197+
// dark
198+
"dark:stroke-dark-tremor-border",
192199
)}
193200
interval={startEndOnly ? "preserveStartEnd" : intervalType}
194201
tickLine={false}
195-
axisLine={false}
202+
axisLine={showAxisLine}
196203
minTickGap={tickGap}
197204
angle={rotateLabelX?.angle}
198205
dy={rotateLabelX?.verticalShift}
@@ -211,7 +218,7 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
211218
<YAxis
212219
width={yAxisWidth}
213220
hide={!showYAxis}
214-
axisLine={false}
221+
axisLine={showAxisLine}
215222
tickLine={false}
216223
type="number"
217224
domain={yAxisDomain as AxisDomain}
@@ -225,6 +232,12 @@ const AreaChart = React.forwardRef<HTMLDivElement, AreaChartProps>((props, ref)
225232
"fill-tremor-content",
226233
// dark
227234
"dark:fill-dark-tremor-content",
235+
// common
236+
"stroke-1",
237+
// light
238+
"stroke-tremor-border",
239+
// dark
240+
"dark:stroke-dark-tremor-border",
228241
)}
229242
tickFormatter={valueFormatter}
230243
allowDecimals={allowDecimals}

src/components/chart-elements/BarChart/BarChart.tsx

Lines changed: 29 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
8484
showTooltip = true,
8585
showLegend = true,
8686
showGridLines = true,
87+
showAxisLine = false,
8788
autoMinValue = false,
8889
minValue,
8990
maxValue,
@@ -203,9 +204,15 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
203204
"fill-tremor-content",
204205
// dark
205206
"dark:fill-dark-tremor-content",
207+
// common
208+
"stroke-1",
209+
// light
210+
"stroke-tremor-border",
211+
// dark
212+
"dark:stroke-dark-tremor-border",
206213
)}
207214
tickLine={false}
208-
axisLine={false}
215+
axisLine={showAxisLine}
209216
angle={rotateLabelX?.angle}
210217
dy={rotateLabelX?.verticalShift}
211218
height={rotateLabelX?.xAxisHeight}
@@ -236,9 +243,15 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
236243
"fill-tremor-content",
237244
// dark
238245
"dark:fill-dark-tremor-content",
246+
// common
247+
"stroke-1",
248+
// light
249+
"stroke-tremor-border",
250+
// dark
251+
"dark:stroke-dark-tremor-border",
239252
)}
240253
tickLine={false}
241-
axisLine={false}
254+
axisLine={showAxisLine}
242255
tickFormatter={valueFormatter}
243256
minTickGap={tickGap}
244257
allowDecimals={allowDecimals}
@@ -261,7 +274,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
261274
<YAxis
262275
width={yAxisWidth}
263276
hide={!showYAxis}
264-
axisLine={false}
277+
axisLine={showAxisLine}
265278
tickLine={false}
266279
type="number"
267280
domain={yAxisDomain as AxisDomain}
@@ -275,6 +288,12 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
275288
"fill-tremor-content",
276289
// dark
277290
"dark:fill-dark-tremor-content",
291+
// common
292+
"stroke-1",
293+
// light
294+
"stroke-tremor-border",
295+
// dark
296+
"dark:stroke-dark-tremor-border",
278297
)}
279298
tickFormatter={
280299
relative ? (value: number) => `${(value * 100).toString()} %` : valueFormatter
@@ -298,7 +317,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
298317
width={yAxisWidth}
299318
hide={!showYAxis}
300319
dataKey={index}
301-
axisLine={false}
320+
axisLine={showAxisLine}
302321
tickLine={false}
303322
ticks={startEndOnly ? [data[0][index], data[data.length - 1][index]] : undefined}
304323
type="category"
@@ -313,6 +332,12 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
313332
"fill-tremor-content",
314333
// dark
315334
"dark:fill-dark-tremor-content",
335+
// common
336+
"stroke-1",
337+
// light
338+
"stroke-tremor-border",
339+
// dark
340+
"dark:stroke-dark-tremor-border",
316341
)}
317342
>
318343
{yAxisLabel && (

src/components/chart-elements/LineChart/LineChart.tsx

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
6161
showTooltip = true,
6262
showLegend = true,
6363
showGridLines = true,
64+
showAxisLine = false,
6465
autoMinValue = false,
6566
curveType = "linear",
6667
minValue,
@@ -186,9 +187,15 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
186187
"fill-tremor-content",
187188
// dark
188189
"dark:fill-dark-tremor-content",
190+
// common
191+
"stroke-1",
192+
// light
193+
"stroke-tremor-border",
194+
// dark
195+
"dark:stroke-dark-tremor-border",
189196
)}
190197
tickLine={false}
191-
axisLine={false}
198+
axisLine={showAxisLine}
192199
minTickGap={tickGap}
193200
angle={rotateLabelX?.angle}
194201
dy={rotateLabelX?.verticalShift}
@@ -207,7 +214,7 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
207214
<YAxis
208215
width={yAxisWidth}
209216
hide={!showYAxis}
210-
axisLine={false}
217+
axisLine={showAxisLine}
211218
tickLine={false}
212219
type="number"
213220
domain={yAxisDomain as AxisDomain}
@@ -221,6 +228,12 @@ const LineChart = React.forwardRef<HTMLDivElement, LineChartProps>((props, ref)
221228
"fill-tremor-content",
222229
// dark
223230
"dark:fill-dark-tremor-content",
231+
// common
232+
"stroke-1",
233+
// light
234+
"stroke-tremor-border",
235+
// dark
236+
"dark:stroke-dark-tremor-border",
224237
)}
225238
tickFormatter={valueFormatter}
226239
allowDecimals={allowDecimals}

src/components/chart-elements/ScatterChart/ScatterChart.tsx

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ export interface ScatterChartProps
6464
showTooltip?: boolean;
6565
showLegend?: boolean;
6666
showGridLines?: boolean;
67+
showAxisLine?: boolean;
6768
autoMinXValue?: boolean;
6869
minXValue?: number;
6970
maxXValue?: number;
@@ -129,6 +130,7 @@ const ScatterChart = React.forwardRef<HTMLDivElement, ScatterChartProps>((props,
129130
showTooltip = true,
130131
showLegend = true,
131132
showGridLines = true,
133+
showAxisLine = false,
132134
autoMinXValue = false,
133135
minXValue,
134136
maxXValue,
@@ -246,10 +248,16 @@ const ScatterChart = React.forwardRef<HTMLDivElement, ScatterChartProps>((props,
246248
"fill-tremor-content",
247249
// dark
248250
"dark:fill-dark-tremor-content",
251+
// common
252+
"stroke-1",
253+
// light
254+
"stroke-tremor-border",
255+
// dark
256+
"dark:stroke-dark-tremor-border",
249257
)}
250258
tickLine={false}
251259
tickFormatter={valueFormatter.x}
252-
axisLine={false}
260+
axisLine={showAxisLine}
253261
minTickGap={tickGap}
254262
domain={xAxisDomain as AxisDomain}
255263
allowDataOverflow={true}
@@ -272,7 +280,7 @@ const ScatterChart = React.forwardRef<HTMLDivElement, ScatterChartProps>((props,
272280
<YAxis
273281
width={yAxisWidth}
274282
hide={!showYAxis}
275-
axisLine={false}
283+
axisLine={showAxisLine}
276284
tickLine={false}
277285
dataKey={y}
278286
type="number"
@@ -289,6 +297,12 @@ const ScatterChart = React.forwardRef<HTMLDivElement, ScatterChartProps>((props,
289297
"fill-tremor-content",
290298
// dark
291299
"dark:fill-dark-tremor-content",
300+
// common
301+
"stroke-1",
302+
// light
303+
"stroke-tremor-border",
304+
// dark
305+
"dark:stroke-dark-tremor-border",
292306
)}
293307
allowDecimals={allowDecimals}
294308
allowDataOverflow={true}

src/components/chart-elements/common/BaseChartProps.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ interface BaseChartProps extends BaseAnimationTimingProps, React.HTMLAttributes<
2828
showTooltip?: boolean;
2929
showLegend?: boolean;
3030
showGridLines?: boolean;
31+
showAxisLine?: boolean;
3132
autoMinValue?: boolean;
3233
minValue?: number;
3334
maxValue?: number;

src/hooks/useOnWindowResize.tsx

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,15 @@
1-
import { useEffect, useState } from "react";
1+
import * as React from "react";
22

3-
const useOnWindowResize = (handler: { (): void }, initialWindowSize?: number) => {
4-
const [windowSize, setWindowSize] = useState<undefined | number>(initialWindowSize);
5-
useEffect(() => {
3+
const useOnWindowResize = (handler: { (): void }) => {
4+
React.useEffect(() => {
65
const handleResize = () => {
7-
setWindowSize(window.innerWidth);
86
handler();
97
};
108
handleResize();
119
window.addEventListener("resize", handleResize);
1210

1311
return () => window.removeEventListener("resize", handleResize);
14-
}, [handler, windowSize]);
12+
}, [handler]);
1513
};
1614

1715
export default useOnWindowResize;

src/stories/chart-elements/AreaChart.stories.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -390,3 +390,9 @@ export const DataLabelsFunction: Story = {
390390
renderLabel: renderCustomizedLabel,
391391
},
392392
};
393+
394+
export const ShowAxisLine: Story = {
395+
args: {
396+
showAxisLine: true,
397+
},
398+
};

src/stories/chart-elements/BarChart.stories.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -412,4 +412,10 @@ export const DataLabelsFunction: Story = {
412412
args: {
413413
renderLabel: renderCustomizedLabel,
414414
},
415+
}
416+
417+
export const ShowAxisLine: Story = {
418+
args: {
419+
showAxisLine: true,
420+
},
415421
};

0 commit comments

Comments
 (0)