diff --git a/packages/react-resizable-panels/src/PanelGroup.test.tsx b/packages/react-resizable-panels/src/PanelGroup.test.tsx
index abb12ce4..223c65c2 100644
--- a/packages/react-resizable-panels/src/PanelGroup.test.tsx
+++ b/packages/react-resizable-panels/src/PanelGroup.test.tsx
@@ -418,5 +418,26 @@ describe("PanelGroup", () => {
ref.current?.setLayout([60, 80]);
});
});
+
+ it("should warn about an empty layout", () => {
+ act(() => {
+ root.render(
+
+
+
+ );
+ });
+
+ // Since the layout is empty, no warning is expected (even though the sizes won't total 100%)
+
+ act(() => {
+ root.render(
+
+ );
+ });
+ });
});
});
diff --git a/packages/react-resizable-panels/src/utils/validatePanelGroupLayout.ts b/packages/react-resizable-panels/src/utils/validatePanelGroupLayout.ts
index 4f2ee0ee..a2c6e39c 100644
--- a/packages/react-resizable-panels/src/utils/validatePanelGroupLayout.ts
+++ b/packages/react-resizable-panels/src/utils/validatePanelGroupLayout.ts
@@ -25,7 +25,10 @@ export function validatePanelGroupLayout({
.map((size) => `${size}%`)
.join(", ")}`
);
- } else if (!fuzzyNumbersEqual(nextLayoutTotalSize, 100)) {
+ } else if (
+ !fuzzyNumbersEqual(nextLayoutTotalSize, 100) &&
+ nextLayout.length > 0
+ ) {
// This is not ideal so we should warn about it, but it may be recoverable in some cases
// (especially if the amount is small)
if (isDevelopment) {