From 4c36c9cff1dd307b56c0d3ef81171c2fe33ff050 Mon Sep 17 00:00:00 2001
From: Thomas Camlong <thomas@ajnart.fr>
Date: Mon, 8 Jun 2026 16:16:18 +0200
Subject: [PATCH] fix(beszel): prevent recharts negative dimension warnings

Add minWidth: 0 and overflow: hidden to ChartPanel (CSS Grid item)
and minWidth: 0 to BeszelAreaChart. Prevents ResponsiveContainer from
computing negative width/height in grid/flex layouts before first paint.
---
 packages/widgets/src/beszel/_shared/chart.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/widgets/src/beszel/_shared/chart.tsx b/packages/widgets/src/beszel/_shared/chart.tsx
index cc2a75898..a654f126f 100644
--- a/packages/widgets/src/beszel/_shared/chart.tsx
+++ b/packages/widgets/src/beszel/_shared/chart.tsx
@@ -19,7 +19,7 @@ interface ChartPanelProps {
 }
 
 export const ChartPanel = ({ title, subtitle, children }: ChartPanelProps) => (
-  <Stack gap={4}>
+  <Stack gap={4} style={{ minWidth: 0, overflow: "hidden" }}>
     <Group gap="xs">
       <Text size="sm" fw={600}>
         {title}
@@ -39,13 +39,14 @@ type BeszelAreaChartProps = Omit<AreaChartProps, "dataKey" | "curveType" | "with
   yAxisDomain?: [number, string];
 };
 
-export const BeszelAreaChart = ({ yAxisFormatter, yAxisDomain, yAxisProps, ...props }: BeszelAreaChartProps) => (
+export const BeszelAreaChart = ({ yAxisFormatter, yAxisDomain, yAxisProps, style, ...props }: BeszelAreaChartProps) => (
   <AreaChart
     dataKey="time"
     curveType="monotone"
     withDots={false}
     withXAxis
     withYAxis
+    style={{ minWidth: 0, ...style }}
     yAxisProps={{
       ...yAxisBase,
       ...(yAxisDomain ? { domain: yAxisDomain } : {}),