@energycap/components 0.47.1-ECAP-33113.20261008-1419 → 0.47.1

package/fesm2022/energycap-components.mjs

@@ -4086,6 +4086,7 @@ var PopupContainerDirective = class PopupContainerDirective {
 		this.hide();
 	}
 	show() {
+		this.cancelFocusRestore();
 		if (PopupContainerDirective.GlobalPopupRef) {
 			if (PopupContainerDirective.GlobalPopupRef != this) {
 				PopupContainerDirective.GlobalPopupRef.hide();
@@ -4113,11 +4114,27 @@ var PopupContainerDirective = class PopupContainerDirective {
 		}
 		if (this.popperRef && this.popupViewRef) {
 			const shouldRestoreFocus = this.isFocusInsidePopup() || this.document.activeElement === this.document.body;
+			const popupNodes = [...this.popupViewRef.rootNodes];
 			this.popupViewRef.destroy();
 			this.popperRef.destroy();
 			this.popperRef = void 0;
 			this.popperStatusChange.emit("hidden");
-			if (shouldRestoreFocus && this.previouslyFocusedElement?.focus) this.previouslyFocusedElement.focus();
+			if (shouldRestoreFocus && this.previouslyFocusedElement?.focus) this.restoreFocusAfterHide(this.previouslyFocusedElement, popupNodes);
+		}
+	}
+	restoreFocusAfterHide(target, popupNodes) {
+		this.cancelFocusRestore();
+		this.focusRestoreTimeout = setTimeout(() => {
+			this.focusRestoreTimeout = void 0;
+			const activeElement = this.document.activeElement;
+			const focusIsUnclaimed = !activeElement || activeElement === this.document.body || popupNodes.some((node) => node.contains && node.contains(activeElement));
+			if (target.isConnected && focusIsUnclaimed) target.focus();
+		});
+	}
+	cancelFocusRestore() {
+		if (this.focusRestoreTimeout !== void 0) {
+			clearTimeout(this.focusRestoreTimeout);
+			this.focusRestoreTimeout = void 0;
 		}
 	}
 	isFocusInsidePopup() {
@@ -14344,8 +14361,8 @@ var WizardProgressComponent = class WizardProgressComponent {
 				currentTab: "currentTab"
 			},
 			ngImport: i0,
-			template: "@for (tab of tabGroup?.items; track tab; let index = $index; let isFirst = $first; let isLast = $last) {\n  <div\n    class=\"progress-tab\"\n    [class.ml-2]=\"!isFirst\"\n    [class.is-active]=\"currentTab?.id === tab.id\">\n    @if (tab.completed) {\n      <i\n      class=\"ec-icon icon-check-circle mr-1 font-color-success\"\n      aria-hidden=\"true\"></i>\n      <span class=\"sr-only\">{{'WizardProgress_StepCompleted_SC' | translate}}</span>\n    }\n    @if (!tab.completed) {\n      <span>{{index+1}}.&nbsp;</span>\n    }\n    <span>{{tab.label | translate}}</span>\n    @if (!isLast) {\n      <i\n      class=\"ec-icon icon-angle-down rotate-270 ml-2\"\n      aria-hidden=\"true\"></i>\n    }\n  </div>\n}",
-			styles: [":host{display:flex;align-items:center;padding:0 1rem}.progress-tab{display:flex;align-items:center}.progress-tab.is-active{font-weight:700}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"],
+			template: "@for (tab of tabGroup?.items; track tab; let index = $index; let isFirst = $first; let isLast = $last) {\n  <div\n    class=\"progress-tab\"\n    [class.ml-2]=\"!isFirst\"\n    [class.is-active]=\"currentTab?.id === tab.id\">\n    @if (tab.completed) {\n      <i\n      class=\"ec-icon icon-check-circle mr-1 font-color-success\"></i>\n    }\n    @if (!tab.completed) {\n      <span>{{index+1}}.&nbsp;</span>\n    }\n    <span>{{tab.label | translate}}</span>\n    @if (!isLast) {\n      <i\n      class=\"ec-icon icon-angle-down rotate-270 ml-2\"></i>\n    }\n  </div>\n}",
+			styles: [":host{display:flex;align-items:center;padding:0 1rem}.progress-tab{display:flex;align-items:center}.progress-tab.is-active{font-weight:700}\n"],
 			dependencies: [{
 				kind: "pipe",
 				type: i2.TranslatePipe,
@@ -14366,8 +14383,8 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "ec-wizard-progress",
 			changeDetection: ChangeDetectionStrategy.Eager,
 			standalone: false,
-			template: "@for (tab of tabGroup?.items; track tab; let index = $index; let isFirst = $first; let isLast = $last) {\n  <div\n    class=\"progress-tab\"\n    [class.ml-2]=\"!isFirst\"\n    [class.is-active]=\"currentTab?.id === tab.id\">\n    @if (tab.completed) {\n      <i\n      class=\"ec-icon icon-check-circle mr-1 font-color-success\"\n      aria-hidden=\"true\"></i>\n      <span class=\"sr-only\">{{'WizardProgress_StepCompleted_SC' | translate}}</span>\n    }\n    @if (!tab.completed) {\n      <span>{{index+1}}.&nbsp;</span>\n    }\n    <span>{{tab.label | translate}}</span>\n    @if (!isLast) {\n      <i\n      class=\"ec-icon icon-angle-down rotate-270 ml-2\"\n      aria-hidden=\"true\"></i>\n    }\n  </div>\n}",
-			styles: [":host{display:flex;align-items:center;padding:0 1rem}.progress-tab{display:flex;align-items:center}.progress-tab.is-active{font-weight:700}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"]
+			template: "@for (tab of tabGroup?.items; track tab; let index = $index; let isFirst = $first; let isLast = $last) {\n  <div\n    class=\"progress-tab\"\n    [class.ml-2]=\"!isFirst\"\n    [class.is-active]=\"currentTab?.id === tab.id\">\n    @if (tab.completed) {\n      <i\n      class=\"ec-icon icon-check-circle mr-1 font-color-success\"></i>\n    }\n    @if (!tab.completed) {\n      <span>{{index+1}}.&nbsp;</span>\n    }\n    <span>{{tab.label | translate}}</span>\n    @if (!isLast) {\n      <i\n      class=\"ec-icon icon-angle-down rotate-270 ml-2\"></i>\n    }\n  </div>\n}",
+			styles: [":host{display:flex;align-items:center;padding:0 1rem}.progress-tab{display:flex;align-items:center}.progress-tab.is-active{font-weight:700}\n"]
 		}]
 	}],
 	ctorParameters: () => [],