SlSplitPanel snap improvements.

[Aurailus]

Continuing on from #1639, this PR adds new functionality to SlSplitPanel to allow it to have more flexible snapping logic, which allows it to function in more domains. For example, use-cases where the panel must always snap to specific percentage intervals, or where the panel must snap to the start or end of its region, but not in-between.

This is my first PR to this project. I tried to follow the existing code style as closely as possible, but please let me know if there's anything that could be improved for this PR to be merged.

Changes

• Extend sl-split-panel's snap property to accept a string in the form of repeat(50px) or repeat(10%), which creates uniformly distributed snap points. e.g. a 450px wide split panel with snap set to repeat(100px) would generate snap points at 100px 200px 300px 400px.
• Allow SlSplitPanel.snap to be set to a function to fully customize snap behaviour, allowing for logic such as panel.snap = ({ pos, size }) => (pos < size / 2) ? 100 : (size - 100) to define a split panel which snaps 100px from the left, and 100px from the right.
• Tweak the default snapping algorithm to prioritize the closest snap point instead of the first when there are multiple valid points within the snap threshold, allowing snapThreshold = Infinity to behave as you would intuitively expect it to and snap to the closest point instead of always the first.
• Update documentation.

[vercel]

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

Name	Status	Preview	Updated (UTC)
shoelace	✅ Ready (Inspect)	Visit Preview	Jan 10, 2025 10:16pm