@ardium-ui/ui 5.0.0-alpha.20 → 5.0.0-alpha.21

package/fesm2022/ardium-ui-ui.mjs

@@ -14094,6 +14094,7 @@ class ArdiumTabberComponent {
         this.focusedTabId = signal(null);
         this.focusedTab = computed(() => this.tabs().find(tab => tab.tabId() === this.focusedTabId()) ?? null);
         this.focusedTabIdChange = output();
+        this._selectedTabIdToCheck = null;
         this.initialTab = input(undefined);
         this.focusEvent = output({ alias: 'focus' });
         this.blurEvent = output({ alias: 'blur' });
@@ -14125,20 +14126,32 @@ class ArdiumTabberComponent {
     }
     ngOnChanges(changes) {
         if (changes['selectedTabId']) {
+            // make sure the tab exists
             const newTabId = changes['selectedTabId'].currentValue;
-            if (newTabId !== null) {
-                const newTab = this.tabs().find(tab => tab._isTabIdInitialized && tab.tabId() === newTabId);
-                if (!newTab) {
-                    console.error(`ARD-NF6000: Trying to select a tab with id '${newTabId}' that does not exist.`);
-                    return;
-                }
-                const oldTabId = changes['selectedTabId'].previousValue;
+            const oldTabId = changes['selectedTabId'].previousValue;
+            const isValid = this._validateSelectedTabId(newTabId, oldTabId);
+            if (!isValid && this.tabs().some(tab => !tab._isTabIdInitialized)) {
+                this._selectedTabIdToCheck = newTabId;
+            }
+        }
+    }
+    _validateSelectedTabId(newTabId, oldTabId) {
+        if (newTabId !== null) {
+            const newTab = this.tabs().find(tab => tab._isTabIdInitialized && tab.tabId() === newTabId);
+            if (!newTab) {
+                // tabs are initialized but the tab does not exist, show error
+                console.error(`ARD-NF6000: Trying to select a tab with id '${newTabId}' that does not exist.`);
+                return false;
+            }
+            // tab exists, select it and unselect the old one
+            if (oldTabId !== null) {
                 const oldTab = this.tabs().find(tab => tab._isTabIdInitialized && tab.tabId() === oldTabId);
                 if (oldTab)
                     this._unselectSpecificTab(oldTab);
-                this._selectNewTab(newTab);
             }
+            this._selectNewTab(newTab);
         }
+        return true;
     }
     ngAfterContentInit() {
         let selectedCmp = null;
@@ -14165,6 +14178,11 @@ class ArdiumTabberComponent {
                 this.selectTab(cmp);
             });
         }
+        // if there was a pending selectedTabId to check, do it now
+        if (this._selectedTabIdToCheck !== null) {
+            this._validateSelectedTabId(this._selectedTabIdToCheck, null);
+            this._selectedTabIdToCheck = null;
+        }
         // if no tab is selected, select the initial tab or the first tab
         if (!selectedCmp) {
             const initiallySelectedTab = this.tabs().find(tab => tab.tabId() === this.initialTab());