laipeng/reflex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix recharts min width/height (#4672)

Browse Source
This commit is contained in:
Khaleel Al-Adhami 2025-01-22 11:11:25 -08:00 committed by GitHub
parent 728607643f
commit 8de14d4384
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 15 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
reflex/components/recharts/charts.py
View File

@ -88,11 +88,13 @@ class ChartBase(RechartsCharts):
"width": width if width is not None else "100%",
"height": height if height is not None else "100%",
}
# Provide min dimensions so the graph always appears, even if the outer container is zero-size.
if width is None:
dim_props["min_width"] = 200
if height is None:
dim_props["min_height"] = 100
# Ensure that the min_height and min_width are set to prevent the chart from collapsing.
# We are using small values so that height and width can still be used over min_height and min_width.
# Without this, sometimes the chart will not be visible. Causing confusion to the user.
# With this, the user will see a small chart and can adjust the height and width and can figure out that the issue is with the size.
dim_props["min_height"] = props.pop("min_height", 10)
dim_props["min_width"] = props.pop("min_width", 10)
return ResponsiveContainer.create(
super().create(*children, **props),

8
reflex/components/recharts/general.py
View File

@ -36,11 +36,11 @@ class ResponsiveContainer(Recharts, MemoizationLeaf):
# The height of chart container. Can be a number or string. Default: "100%"
height: Var[Union[int, str]]
# The minimum width of chart container. Number
min_width: Var[int]
# The minimum width of chart container. Number or string.
min_width: Var[Union[int, str]]
# The minimum height of chart container. Number
min_height: Var[int]
# The minimum height of chart container. Number or string.
min_height: Var[Union[int, str]]
# If specified a positive number, debounced function will be used to handle the resize event. Default: 0
debounce: Var[int]

8
reflex/components/recharts/general.pyi
View File

@ -22,8 +22,8 @@ class ResponsiveContainer(Recharts, MemoizationLeaf):
aspect: Optional[Union[Var[int], int]] = None,
width: Optional[Union[Var[Union[int, str]], int, str]] = None,
height: Optional[Union[Var[Union[int, str]], int, str]] = None,
min_width: Optional[Union[Var[int], int]] = None,
min_height: Optional[Union[Var[int], int]] = None,
min_width: Optional[Union[Var[Union[int, str]], int, str]] = None,
min_height: Optional[Union[Var[Union[int, str]], int, str]] = None,
debounce: Optional[Union[Var[int], int]] = None,
style: Optional[Style] = None,
key: Optional[Any] = None,
@ -56,8 +56,8 @@ class ResponsiveContainer(Recharts, MemoizationLeaf):
aspect: The aspect ratio of the container. The final aspect ratio of the SVG element will be (width / height) * aspect. Number
width: The width of chart container. Can be a number or string. Default: "100%"
height: The height of chart container. Can be a number or string. Default: "100%"
min_width: The minimum width of chart container. Number
min_height: The minimum height of chart container. Number
min_width: The minimum width of chart container. Number or string.
min_height: The minimum height of chart container. Number or string.
debounce: If specified a positive number, debounced function will be used to handle the resize event. Default: 0
on_resize: If specified provides a callback providing the updated chart width and height values.
style: The style of the component.