diff --git a/src/allotment.module.css b/src/allotment.module.css index bcd01fd2..4c5fdfbd 100644 --- a/src/allotment.module.css +++ b/src/allotment.module.css @@ -33,10 +33,6 @@ white-space: initial; } -.splitView > .splitViewContainer > .splitViewView:not(.visible) { - display: none; -} - .splitView.vertical > .splitViewContainer > .splitViewView { width: 100%; } diff --git a/src/allotment.tsx b/src/allotment.tsx index 5f06b872..e8268b0d 100644 --- a/src/allotment.tsx +++ b/src/allotment.tsx @@ -295,7 +295,7 @@ const Allotment = forwardRef( /** * Add, remove or update views as children change */ - useEffect(() => { + useIsomorphicLayoutEffect(() => { if (dimensionsInitialized) { const keys = childrenArray.map((child) => child.key as string); const panes = [...previousKeys.current]; diff --git a/src/split-view/split-view.ts b/src/split-view/split-view.ts index 2edb7987..a7346dff 100644 --- a/src/split-view/split-view.ts +++ b/src/split-view/split-view.ts @@ -176,7 +176,7 @@ abstract class ViewItem { if (typeof size === "number") { this._size = size; this._cachedVisibleSize = undefined; - container.classList.add("split-view-view-visible", styles.visible); + container.classList.add("split-view-view-visible"); } else { this._size = 0; this._cachedVisibleSize = size.cachedVisibleSize; @@ -225,7 +225,6 @@ abstract class ViewItem { this.size = 0; } - this.container.classList.toggle(styles.visible, visible); this.container.classList.toggle("split-view-view-visible", visible); if (this.view.setVisible) {