@itfin/components 2.0.92 → 2.0.93

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itfin/components",
-  "version": "2.0.92",
+  "version": "2.0.93",
   "author": "Vitalii Savchuk <esvit666@gmail.com>",
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/panels/PanelList.vue

@@ -185,6 +185,7 @@ export interface IPanel {
   payload: any;
   nocard?: boolean;
   isCollapsed: boolean;
+  isExpanded: boolean;
   isCloseable: boolean;
   isAnimate: boolean;
   open: (type: string, visOptions: VisualOptions, payload: any) => void;
@@ -258,6 +259,7 @@ export default class PanelList extends Vue {
     const newStack = [...this.panelsStack];
     const index = newStack.findIndex(p => p.id === panel.id);
     newStack[index].isCollapsed = false;
+    newStack[index].isExpanded = true;
     this.panelsStack = newStack;
     this.ensureOnlyTwoOpenPanels(panel.id);
     this.setPanelHash();
@@ -279,10 +281,12 @@ export default class PanelList extends Vue {
         keepOpenIds.push(panel2.id);
       }
       if (keepOpenIds.length === 1) {
-        if (newStack.length - 1 === indexKeep) {
-          keepOpenIds.push(newStack[indexKeep - 1].id);
-        } else {
-          keepOpenIds.push(newStack[indexKeep + 1].id);
+        if (!openPanels.find(p => p.id === keepOpenId).isExpanded) {
+          if (newStack.length - 1 === indexKeep) {
+            keepOpenIds.push(newStack[indexKeep - 1].id);
+          } else {
+            keepOpenIds.push(newStack[indexKeep + 1].id);
+          }
         }
       }
       for (const panel of newStack) {
@@ -292,7 +296,7 @@ export default class PanelList extends Vue {
     this.panelsStack = newStack;
   }
 
-  async internalOpenPanel(type: string, payload: any = {}, openIndex?: number, noEvents = false) {
+  async internalOpenPanel(type: string, payload: any = {}, openIndex?: number, noEvents = false, noExpand = false) {
     let panel = this.panels[type];
     if (!panel) {
       panel = await this.searchPanel(type, this.panels);
@@ -337,7 +341,7 @@ export default class PanelList extends Vue {
       isAnimation = newStack.length === openIndex;
       newStack = newStack.slice(0, openIndex);
     }
-    if (newStack.length > 0 && !newStack.find(p => !p.isCollapsed)) {
+    if (newStack.length > 0 && !newStack.find(p => !p.isCollapsed) && !noExpand) {
       // якщо немає відкритих панелей, то перша панель має бути розгорнута
       newStack[0].isCollapsed = false;
     }
@@ -431,7 +435,7 @@ export default class PanelList extends Vue {
       openPanel.isCollapsed = false;
     }
     const openPanelIndex = this.panelsStack.findIndex(p => p === openPanel);
-    if (openPanelIndex > 0 && !openPanel?.permanentExpanded) {
+    if (openPanelIndex > 0 && !openPanel?.permanentExpanded && !openPanel.isExpanded) {
       this.panelsStack[openPanelIndex - 1].isCollapsed = false;
     }
     this.ensureOnlyTwoOpenPanels(openPanel.id);
@@ -446,6 +450,9 @@ export default class PanelList extends Vue {
     for (const p of newStack) {
       p.isLastOpened = !p.isCollapsed && p !== panel;
       p.isCollapsed = p !== panel;
+      if (!p.isCollapsed) {
+        p.isExpanded = true;
+      }
     }
     this.panelsStack = newStack;
     this.setPanelHash();
@@ -460,6 +467,9 @@ export default class PanelList extends Vue {
     const newStack = [...this.panelsStack];
     const index = newStack.findIndex(p => p.id === panel.id);
     newStack[index].isCollapsed = false;
+    for (const p of newStack) {
+      p.isExpanded = false;
+    }
     this.panelsStack = newStack;
     this.ensureOnlyTwoOpenPanels(panel.id);
     this.setPanelHash();
@@ -471,10 +481,13 @@ export default class PanelList extends Vue {
     const currenctIndex = newStack.findIndex(p => p.id === panel.id);
     const lastOpenedIndex = newStack.findIndex(p => p.isLastOpened);
     if (lastOpenedIndex !== -1) { // якщо зебрежена остання відкрита панель
-      newStack[lastOpenedIndex].isCollapsed = false
+      newStack[lastOpenedIndex].isCollapsed = false;
     } else if (newStack[currenctIndex-1]) { // якщо після оновлення сторінки відсутнє значення "остання відкрита", то відкриваємо ту, що зліва
       newStack[currenctIndex-1].isCollapsed = false;
     }
+    for (const p of newStack) {
+      p.isExpanded = false;
+    }
     this.panelsStack = newStack;
     this.ensureOnlyTwoOpenPanels(panel.id);
     this.setPanelHash();
@@ -511,16 +524,22 @@ export default class PanelList extends Vue {
           // reuse panel
           this.panelsStack[panelIndex].payload = panel.payload;
           this.panelsStack[panelIndex].isCollapsed = panel.isCollapsed;
+          this.panelsStack[panelIndex].isExpanded = false;
           newStack.push(this.panelsStack[panelIndex]);
         } else {
-          const resPanel = await this.internalOpenPanel(panel.type, panel.payload, undefined, true);
+          const resPanel = await this.internalOpenPanel(panel.type, panel.payload, undefined, true, true);
           if (resPanel) {
             resPanel.isCollapsed = panel.isCollapsed;
+            resPanel.isExpanded = false;
             resPanel.isAnimate = false;
             newStack.push(resPanel);
           }
         }
       }
+      const hasExpanded = newStack.length > 1 && newStack.filter(p => !p.isCollapsed).length === 1;
+      if (hasExpanded) {
+        newStack[newStack.findIndex(p => !p.isCollapsed)].isExpanded = true;
+      }
       this.panelsStack = newStack;
       this.emitEvent('panels.changed', this.panelsStack);
       this.updateTitle();