js/shoelace
1
0
Fork 0
mirror of https://github.com/shoelace-style/shoelace.git synced 2026-01-12 02:59:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix: split panel properly recalculates when going from hidden to shown (#1942)

Browse Source 
* fix: split-panel now properly calculates it size when it goes from hidden to being shown.

* chore: add changelog note

* prettier
This commit is contained in:
Konnor Rogers
2024-04-11 14:09:56 -04:00
committed by GitHub
parent a427433701
commit 16d5575307
2 changed files with 10 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/pages/resources/changelog.md
View File

@@ -14,7 +14,8 @@ New versions of Shoelace are released as-needed and generally occur when a criti
## Next
- Fixed a bug in `<dialog>` where when it showed it would create a layout shift. [#1967]
- Fixed a bug in `<sl-split-panel>` that caused it not to recalculate it's position when going from being `display: none;` to its original display value. [#1942]
- Fixed a bug in `<dialog>` where when it showed it would cause a layout shift. [#1967]
- Fixed a bug in `<sl-tooltip>` that allowed unwanted text properties to leak in [#1947]
## 2.15.0

8
src/components/split-panel/split-panel.component.ts
View File

@@ -189,6 +189,14 @@ export default class SlSplitPanel extends ShoelaceElement {
const { width, height } = entries[0].contentRect;
this.size = this.vertical ? height : width;
// There's some weird logic that gets `this.cachedPositionInPixels = NaN` or `this.position === Infinity` when
// a split-panel goes from `display: none;` to showing.
if (isNaN(this.cachedPositionInPixels) || this.position === Infinity) {
this.cachedPositionInPixels = Number(this.getAttribute('position-in-pixels'));
this.positionInPixels = Number(this.getAttribute('position-in-pixels'));
this.position = this.pixelsToPercentage(this.positionInPixels);
}
// Resize when a primary panel is set
if (this.primary) {
this.position = this.pixelsToPercentage(this.cachedPositionInPixels);