fix: enable pane content focus on mount (#404)

johnwalley · Aug 31, 2022 · bfb34cd · bfb34cd
1 parent 9d13519
commit bfb34cd
Show file tree

Hide file tree

Showing 3 changed files with 2 additions and 7 deletions.
diff --git 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
@@ -295,7 +295,7 @@ const Allotment = forwardRef<AllotmentHandle, AllotmentProps>(
     /**
      * 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
@@ -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) {