Refactored Panel/PanelGroup to better work with strict effects mode (#…

…219) Resolves #217
bvaughn · Nov 20, 2023 · 018a5bd · 018a5bd · vercel · Nov 20, 2023
1 parent f42a524
commit 018a5bd
Show file tree

Hide file tree

Showing 4 changed files with 227 additions and 178 deletions.
diff --git a/packages/react-resizable-panels-website/src/utils/UrlData.ts b/packages/react-resizable-panels-website/src/utils/UrlData.ts
@@ -129,7 +129,7 @@ function UrlPanelGroupToData(
   urlPanelGroup: ReactElement<PanelGroupProps>
 ): UrlPanelGroup {
   return {
-    autoSaveId: urlPanelGroup.props.autoSaveId,
+    autoSaveId: urlPanelGroup.props.autoSaveId ?? undefined,
     children: Children.toArray(urlPanelGroup.props.children).map((child) => {
       if (isPanelElement(child)) {
         return UrlPanelToData(child);

diff --git a/packages/react-resizable-panels/src/Panel.ts b/packages/react-resizable-panels/src/Panel.ts
@@ -115,6 +115,7 @@ export function PanelWithForwardedRef({
     expandPanel,
     getPanelSize,
     getPanelStyle,
+    groupId,
     isPanelCollapsed,
     registerPanel,
     resizePanel,
@@ -250,6 +251,7 @@ export function PanelWithForwardedRef({
     // CSS selectors
     "data-panel": "",
     "data-panel-id": panelId,
+    "data-panel-group-id": groupId,
 
     // e2e test attributes
     "data-panel-collapsible": isDevelopment