Rewrite layout algorithm internals [draft]

[bvaughn]

Support mix of percentage and pixel units within a group or panel.

<Panel
  defaultSizePixels={100}
  minSizePercentage={20}
  maxSizePercentage={50}
/>

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-resizable-panels	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 12, 2023 4:05pm

[bvaughn]

I made pretty good progress this weekend on migrating the React components to use the new utilities. One more weekend of this and I think I should be ready to publish a release.

[viveleroi]

How's this going?

I've realized a flaw in the "custom" pixel approach we're using currently (setting sizes by watching windows resize and using math to translate a pixel value into a percent const navCollapseSize = width > 0 ? (36 / width) * 100 : 0)

When the user resizes or collapses the panel, and then resizes the window, the current size needs to be recalculated. For example if they collapse our panel it needs to be exactly 36px. Say that translates to 1.85% of the screen width. When they shrink the window, the current size stays 1.85% so therefore shrinks below the 36px minimum.

I could write logic to recalculate the new percentage on windows resize and use the panel api to .resize() myself but if this is something that is already being addressed by this effort, I'd rather wait.

[bvaughn]

Unfortunately no update since my last comment.

I've been busy with my day job, and also traveling a lot, and this remains an unpaid side project. I'll get to it when I can find the time and energy. No promises when that will be.

[bvaughn]

Picking this back up today to see if I can make a little progress. I don't have a sense of how close to finished it is. There's some work (mostly in PanelGroup) to wire up callbacks and imperative API, then some testing, but maybe it's close. We'll see.

[bvaughn]

Was traveling for most of October, in Japan for a few weeks, so I didn't do anything here, but I picked things back up this weekend and filled in some of the remaining TODO comments for tests. I'm getting closer but it's still several hours away from being complete. I think the biggest TODO I need to tackle is the ResizeObserver bit for PanelGroups with pixel based constraints. I haven't thought much about that one yet, but...otherwise the remaining DEV warning tests are probably straight forward enough.

[bvaughn]

I believe all of the functionality has been ported, and all tests should be passing now. All that's left is for me to write the changelog entry with a few before/after code examples to help people update their components.