@@ -84,6 +84,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
84
84
showTooltip = true ,
85
85
showLegend = true ,
86
86
showGridLines = true ,
87
+ showAxisLine = false ,
87
88
autoMinValue = false ,
88
89
minValue,
89
90
maxValue,
@@ -203,9 +204,15 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
203
204
"fill-tremor-content" ,
204
205
// dark
205
206
"dark:fill-dark-tremor-content" ,
207
+ // common
208
+ "stroke-1" ,
209
+ // light
210
+ "stroke-tremor-border" ,
211
+ // dark
212
+ "dark:stroke-dark-tremor-border" ,
206
213
) }
207
214
tickLine = { false }
208
- axisLine = { false }
215
+ axisLine = { showAxisLine }
209
216
angle = { rotateLabelX ?. angle }
210
217
dy = { rotateLabelX ?. verticalShift }
211
218
height = { rotateLabelX ?. xAxisHeight }
@@ -236,9 +243,15 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
236
243
"fill-tremor-content" ,
237
244
// dark
238
245
"dark:fill-dark-tremor-content" ,
246
+ // common
247
+ "stroke-1" ,
248
+ // light
249
+ "stroke-tremor-border" ,
250
+ // dark
251
+ "dark:stroke-dark-tremor-border" ,
239
252
) }
240
253
tickLine = { false }
241
- axisLine = { false }
254
+ axisLine = { showAxisLine }
242
255
tickFormatter = { valueFormatter }
243
256
minTickGap = { tickGap }
244
257
allowDecimals = { allowDecimals }
@@ -261,7 +274,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
261
274
< YAxis
262
275
width = { yAxisWidth }
263
276
hide = { ! showYAxis }
264
- axisLine = { false }
277
+ axisLine = { showAxisLine }
265
278
tickLine = { false }
266
279
type = "number"
267
280
domain = { yAxisDomain as AxisDomain }
@@ -275,6 +288,12 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
275
288
"fill-tremor-content" ,
276
289
// dark
277
290
"dark:fill-dark-tremor-content" ,
291
+ // common
292
+ "stroke-1" ,
293
+ // light
294
+ "stroke-tremor-border" ,
295
+ // dark
296
+ "dark:stroke-dark-tremor-border" ,
278
297
) }
279
298
tickFormatter = {
280
299
relative ? ( value : number ) => `${ ( value * 100 ) . toString ( ) } %` : valueFormatter
@@ -298,7 +317,7 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
298
317
width = { yAxisWidth }
299
318
hide = { ! showYAxis }
300
319
dataKey = { index }
301
- axisLine = { false }
320
+ axisLine = { showAxisLine }
302
321
tickLine = { false }
303
322
ticks = { startEndOnly ? [ data [ 0 ] [ index ] , data [ data . length - 1 ] [ index ] ] : undefined }
304
323
type = "category"
@@ -313,6 +332,12 @@ const BarChart = React.forwardRef<HTMLDivElement, BarChartProps>((props, ref) =>
313
332
"fill-tremor-content" ,
314
333
// dark
315
334
"dark:fill-dark-tremor-content" ,
335
+ // common
336
+ "stroke-1" ,
337
+ // light
338
+ "stroke-tremor-border" ,
339
+ // dark
340
+ "dark:stroke-dark-tremor-border" ,
316
341
) }
317
342
>
318
343
{ yAxisLabel && (
0 commit comments