structra-ui 0.1.74 → 0.1.76

package/fesm2022/structra-ui.mjs

@@ -829,6 +829,28 @@ function buildMenuRows(nodes) {
 function focusableActionCount(rows) {
     return rows.filter((r) => (r.kind === 'action' || r.kind === 'submenu') && r.focusIndex !== null).length;
 }
+/**
+ * `true` se `selectedId` for id de um item de acção (folha) em qualquer profundidade.
+ * Usado para marcar o gatilho de submenu como selected quando a selecção actual é um filho.
+ */
+function menuNodeTreeContainsId(items, selectedId) {
+    for (const node of items) {
+        if (node.kind === 'divider') {
+            continue;
+        }
+        if (node.kind === 'item') {
+            if (node.id === selectedId) {
+                return true;
+            }
+        }
+        else {
+            if (menuNodeTreeContainsId(node.items, selectedId)) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
 
 const GAP$1 = 4;
 /**
@@ -907,6 +929,13 @@ class MenuListComponent {
                 this.activeIndex = -1;
             }
         }
+        if (changes['selectedItemId'] ||
+            changes['items'] ||
+            changes['compressText'] ||
+            changes['dense'] ||
+            changes['menuId']) {
+            this.cdr.markForCheck();
+        }
     }
     submenuRowKey(row, index) {
         return row.kind === 'submenu' ? `sm-${String(row.item.id)}-${index}` : '';
@@ -1071,7 +1100,8 @@ class MenuListComponent {
             return row.item.id === this.selectedItemId;
         }
         if (row.kind === 'submenu') {
-            return row.item.id === this.selectedItemId;
+            return (row.item.id === this.selectedItemId ||
+                menuNodeTreeContainsId(row.item.items, this.selectedItemId));
         }
         return false;
     }
@@ -1195,7 +1225,7 @@ class MenuListComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MenuListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: MenuListComponent, isStandalone: true, selector: "app-menu-list", inputs: { items: "items", menuId: "menuId", dense: ["dense", "dense", booleanAttribute], nested: ["nested", "nested", booleanAttribute], selectedItemId: "selectedItemId", compressText: ["compressText", "compressText", booleanAttribute] }, outputs: { itemSelect: "itemSelect", closeRequest: "closeRequest", submenuBack: "submenuBack" }, host: { listeners: { "keydown": "onKeydown($event)" } }, viewQueries: [{ propertyName: "nestedLists", predicate: MenuListComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"menu-list\"\n  [class.menu-list--dense]=\"dense\"\n  [class.menu-list--compress-text]=\"compressText\"\n  role=\"menu\"\n  [attr.aria-labelledby]=\"null\"\n  tabindex=\"-1\"\n  (mouseleave)=\"onMenuSurfaceLeave()\"\n>\n  @for (row of rows; track idx; let idx = $index) {\n    @switch (row.kind) {\n      @case ('divider') {\n        <app-menu-divider />\n      }\n      @case ('group') {\n        <app-menu-group [label]=\"row.label\" [hideLabel]=\"compressText\" />\n      }\n      @case ('submenu') {\n        <div\n          class=\"menu-list__submenu-wrap\"\n          cdkOverlayOrigin\n          #subOrigin=\"cdkOverlayOrigin\"\n          (mouseenter)=\"onSubmenuTriggerEnter(row, idx)\"\n          (mouseleave)=\"onSubmenuTriggerLeave(row, idx)\"\n        >\n          <div\n            class=\"menu-list__option menu-list__option--submenu\"\n            role=\"menuitem\"\n            [attr.aria-haspopup]=\"'true'\"\n            [attr.aria-expanded]=\"isSubmenuOpen(row, idx)\"\n            [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n            [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n            [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n            [attr.title]=\"compressText ? row.item.label : null\"\n            [attr.aria-label]=\"compressText ? row.item.label : null\"\n            [class.menu-list__option--disabled]=\"row.item.disabled\"\n            [class.menu-list__option--active]=\"isActiveRow(row)\"\n            [class.menu-list__option--selected]=\"isRowSelected(row)\"\n            (click)=\"onSubmenuRowClick($event, row, idx)\"\n            (mouseenter)=\"onRowMouseEnter(row)\"\n          >\n            @if (row.item.icon?.trim()) {\n              <span class=\"menu-list__icon\" aria-hidden=\"true\">\n                <i [ngClass]=\"row.item.icon\"></i>\n              </span>\n            }\n            <span class=\"menu-list__text\">\n              <span class=\"menu-list__label\">{{ row.item.label }}</span>\n              @if (row.item.description?.trim()) {\n                <span class=\"menu-list__description\">{{ row.item.description }}</span>\n              }\n            </span>\n            <span class=\"menu-list__submenu-chevron\" aria-hidden=\"true\">\u203A</span>\n          </div>\n          <ng-template\n            cdkConnectedOverlay\n            [cdkConnectedOverlayOrigin]=\"subOrigin\"\n            [cdkConnectedOverlayOpen]=\"isSubmenuOpen(row, idx)\"\n            [cdkConnectedOverlayPositions]=\"submenuPositions\"\n            [cdkConnectedOverlayPush]=\"true\"\n            [cdkConnectedOverlayPanelClass]=\"overlayPanelClasses()\"\n            [cdkConnectedOverlayMinWidth]=\"200\"\n            (overlayOutsideClick)=\"onSubmenuOutsideClick(row, idx)\"\n          >\n            <div\n              class=\"menu-submenu__panel\"\n              [ngClass]=\"panelThemeNgClass()\"\n              (mouseenter)=\"onSubmenuPanelEnter()\"\n              (mouseleave)=\"onSubmenuPanelLeave(row, idx)\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              <app-menu-list\n                [items]=\"row.item.items\"\n                [menuId]=\"submenuMenuId(row)\"\n                [nested]=\"true\"\n                [dense]=\"dense\"\n                [compressText]=\"compressText\"\n                [selectedItemId]=\"selectedItemId\"\n                (itemSelect)=\"onNestedItemSelect($event)\"\n                (closeRequest)=\"closeRequest.emit()\"\n                (submenuBack)=\"closeOpenSubmenu()\"\n              />\n            </div>\n          </ng-template>\n        </div>\n      }\n      @case ('action') {\n        <div\n          class=\"menu-list__option\"\n          role=\"menuitem\"\n          [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n          [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n          [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n          [attr.aria-busy]=\"row.item.loading ? true : null\"\n          [attr.title]=\"compressText ? row.item.label : null\"\n          [attr.aria-label]=\"compressText ? row.item.label : null\"\n          [class.menu-list__option--disabled]=\"row.item.disabled\"\n          [class.menu-list__option--loading]=\"row.item.loading\"\n          [class.menu-list__option--danger]=\"row.item.danger\"\n          [class.menu-list__option--active]=\"isActiveRow(row)\"\n          [class.menu-list__option--selected]=\"isRowSelected(row)\"\n          (click)=\"onItemClick($event, row.item)\"\n          (mouseenter)=\"onRowMouseEnter(row)\"\n        >\n          @if (row.item.loading) {\n            <span class=\"menu-list__icon menu-list__icon--spin\" aria-hidden=\"true\">\n              <i class=\"fa-solid fa-spinner\"></i>\n            </span>\n          } @else if (row.item.icon?.trim()) {\n            <span class=\"menu-list__icon\" aria-hidden=\"true\">\n              <i [ngClass]=\"row.item.icon\"></i>\n            </span>\n          }\n          <span class=\"menu-list__text\">\n            <span class=\"menu-list__label\">{{ row.item.label }}</span>\n            @if (row.item.description?.trim()) {\n              <span class=\"menu-list__description\">{{ row.item.description }}</span>\n            }\n          </span>\n        </div>\n      }\n    }\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes app-sidebar-nav-reveal-in{0%{opacity:0;transform:translate3d(-.45rem,0,0)}to{opacity:1;transform:translateZ(0)}}:host{display:block;min-width:0;box-sizing:border-box}.menu-list{background:var(--app-color-surface, #ffffff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .12));border-radius:10px;box-shadow:0 10px 28px -14px #0f172a29;max-height:min(70vh,22rem);overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;gap:.1rem;padding:.45rem 0;outline:none}.menu-list--dense{padding:.2rem 0;gap:0}.menu-list__submenu-wrap{position:relative;display:block}.menu-list__option{display:flex;align-items:center;box-sizing:border-box;gap:.5rem;margin:0 .25rem;padding:.48rem .6rem;border-radius:8px;cursor:pointer;color:var(--app-color-text-primary, #1a2f45);background:transparent;border:1px solid transparent;text-align:left;font:inherit;line-height:1.25}.menu-list__option:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:1px}.menu-list__option:hover:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 6%,transparent)}.menu-list__option.menu-list__option--active:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 7%,transparent);border-color:transparent;box-shadow:none}.menu-list__option.menu-list__option--disabled{cursor:not-allowed;color:var(--app-color-text-muted, #6b8299);background:transparent;opacity:.72}.menu-list__option.menu-list__option--loading{cursor:wait;opacity:.92;pointer-events:none}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading){color:var(--app-color-error, #b91c1c)}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading):hover,.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading).menu-list__option--active{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-error-border, #dc2626)}.menu-list__option--submenu{padding-right:.35rem}.menu-list__option--selected:not(.menu-list__option--disabled){background:color-mix(in srgb,var(--app-color-primary) 9%,transparent);border-radius:8px;border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-primary, #2b7fd9)}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__label{color:var(--app-color-primary, #2b7fd9);font-weight:600}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__icon{color:var(--app-color-primary, #2b7fd9)}.menu-list--compress-text .menu-list__label,.menu-list--compress-text .menu-list__description{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.menu-list--compress-text .menu-list__text,.menu-list--compress-text .menu-list__submenu-chevron{display:none}.menu-list--compress-text .menu-list__submenu-wrap{width:100%}.menu-list--compress-text .menu-list__option{justify-content:center;align-items:center;text-align:center;width:calc(100% - .5rem);max-width:100%;box-sizing:border-box;margin-left:.25rem;margin-right:.25rem;padding:.5rem .35rem}.menu-list--compress-text .menu-list__option--submenu{padding-left:.35rem;padding-right:.35rem}.menu-list--compress-text .menu-list__icon{flex:0 0 auto;width:auto;min-width:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding-top:0}.menu-list__submenu-chevron{flex:0 0 auto;margin-left:auto;padding-left:.35rem;font-size:1rem;line-height:1;color:var(--app-color-text-muted, #6b8299);opacity:.85}.menu-list__icon{flex:0 0 auto;width:1.25rem;height:1.25rem;min-height:1.25rem;display:inline-flex;align-items:center;justify-content:center;text-align:center;color:var(--app-color-text-secondary, #5a7fa3);line-height:1}.menu-list__icon i{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1;font-size:.95rem}.menu-list__option--disabled .menu-list__icon{opacity:.55}.menu-list__icon--spin i{animation:menu-list-spin .8s linear infinite}.menu-list__text{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}.menu-list__label{font-size:.875rem;font-weight:500;line-height:1.25rem;display:inline-flex;align-items:center;min-height:1.25rem}.menu-list__description{font-size:.75rem;color:var(--app-color-text-muted, #6b8299);line-height:1.3}.menu-list:not(.menu-list--compress-text){animation:app-sidebar-nav-reveal-in .45s cubic-bezier(.16,1,.32,1) both}@media(prefers-reduced-motion:reduce){.menu-list:not(.menu-list--compress-text){animation:none}}.menu-submenu__panel{box-sizing:border-box;min-width:0;padding:0;background:transparent;border:none;box-shadow:none;border-radius:10px;overflow:hidden}@keyframes menu-list-spin{to{transform:rotate(360deg)}}:host ::ng-deep .menu-submenu__cdk-panel{background:transparent;box-shadow:none;border-radius:10px}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => MenuListComponent), selector: "app-menu-list", inputs: ["items", "menuId", "dense", "nested", "selectedItemId", "compressText"], outputs: ["itemSelect", "closeRequest", "submenuBack"] }, { kind: "directive", type: i0.forwardRef(() => NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => CdkConnectedOverlay), selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i0.forwardRef(() => CdkOverlayOrigin), selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i0.forwardRef(() => MenuDividerComponent), selector: "app-menu-divider" }, { kind: "component", type: i0.forwardRef(() => MenuGroupComponent), selector: "app-menu-group", inputs: ["label", "hideLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: MenuListComponent, isStandalone: true, selector: "app-menu-list", inputs: { items: "items", menuId: "menuId", dense: ["dense", "dense", booleanAttribute], nested: ["nested", "nested", booleanAttribute], selectedItemId: "selectedItemId", compressText: ["compressText", "compressText", booleanAttribute] }, outputs: { itemSelect: "itemSelect", closeRequest: "closeRequest", submenuBack: "submenuBack" }, host: { listeners: { "keydown": "onKeydown($event)" } }, viewQueries: [{ propertyName: "nestedLists", predicate: MenuListComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"menu-list\"\n  [class.menu-list--dense]=\"dense\"\n  [class.menu-list--compress-text]=\"compressText\"\n  role=\"menu\"\n  [attr.aria-labelledby]=\"null\"\n  tabindex=\"-1\"\n  (mouseleave)=\"onMenuSurfaceLeave()\"\n>\n  @for (row of rows; track idx; let idx = $index) {\n    @switch (row.kind) {\n      @case ('divider') {\n        <app-menu-divider />\n      }\n      @case ('group') {\n        <app-menu-group [label]=\"row.label\" [hideLabel]=\"compressText\" />\n      }\n      @case ('submenu') {\n        <div\n          class=\"menu-list__submenu-wrap\"\n          cdkOverlayOrigin\n          #subOrigin=\"cdkOverlayOrigin\"\n          (mouseenter)=\"onSubmenuTriggerEnter(row, idx)\"\n          (mouseleave)=\"onSubmenuTriggerLeave(row, idx)\"\n        >\n          <div\n            class=\"menu-list__option menu-list__option--submenu\"\n            role=\"menuitem\"\n            [attr.aria-haspopup]=\"'true'\"\n            [attr.aria-expanded]=\"isSubmenuOpen(row, idx)\"\n            [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n            [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n            [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n            [attr.title]=\"compressText ? row.item.label : null\"\n            [attr.aria-label]=\"compressText ? row.item.label : null\"\n            [class.menu-list__option--disabled]=\"row.item.disabled\"\n            [class.menu-list__option--active]=\"isActiveRow(row)\"\n            [class.menu-list__option--selected]=\"isRowSelected(row)\"\n            (click)=\"onSubmenuRowClick($event, row, idx)\"\n            (mouseenter)=\"onRowMouseEnter(row)\"\n          >\n            @if (row.item.icon?.trim()) {\n              <span class=\"menu-list__icon\" aria-hidden=\"true\">\n                <i [ngClass]=\"row.item.icon\"></i>\n              </span>\n            }\n            <span class=\"menu-list__text\">\n              <span class=\"menu-list__label\">{{ row.item.label }}</span>\n              @if (row.item.description?.trim()) {\n                <span class=\"menu-list__description\">{{ row.item.description }}</span>\n              }\n            </span>\n            <span class=\"menu-list__submenu-chevron\" aria-hidden=\"true\">\u203A</span>\n          </div>\n          <ng-template\n            cdkConnectedOverlay\n            [cdkConnectedOverlayOrigin]=\"subOrigin\"\n            [cdkConnectedOverlayOpen]=\"isSubmenuOpen(row, idx)\"\n            [cdkConnectedOverlayPositions]=\"submenuPositions\"\n            [cdkConnectedOverlayPush]=\"true\"\n            [cdkConnectedOverlayPanelClass]=\"overlayPanelClasses()\"\n            [cdkConnectedOverlayMinWidth]=\"200\"\n            (overlayOutsideClick)=\"onSubmenuOutsideClick(row, idx)\"\n          >\n            <div\n              class=\"menu-submenu__panel\"\n              [ngClass]=\"panelThemeNgClass()\"\n              (mouseenter)=\"onSubmenuPanelEnter()\"\n              (mouseleave)=\"onSubmenuPanelLeave(row, idx)\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              <app-menu-list\n                [items]=\"row.item.items\"\n                [menuId]=\"submenuMenuId(row)\"\n                [nested]=\"true\"\n                [dense]=\"dense\"\n                [compressText]=\"compressText\"\n                [selectedItemId]=\"selectedItemId\"\n                (itemSelect)=\"onNestedItemSelect($event)\"\n                (closeRequest)=\"closeRequest.emit()\"\n                (submenuBack)=\"closeOpenSubmenu()\"\n              />\n            </div>\n          </ng-template>\n        </div>\n      }\n      @case ('action') {\n        <div\n          class=\"menu-list__option\"\n          role=\"menuitem\"\n          [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n          [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n          [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n          [attr.aria-busy]=\"row.item.loading ? true : null\"\n          [attr.title]=\"compressText ? row.item.label : null\"\n          [attr.aria-label]=\"compressText ? row.item.label : null\"\n          [class.menu-list__option--disabled]=\"row.item.disabled\"\n          [class.menu-list__option--loading]=\"row.item.loading\"\n          [class.menu-list__option--danger]=\"row.item.danger\"\n          [class.menu-list__option--active]=\"isActiveRow(row)\"\n          [class.menu-list__option--selected]=\"isRowSelected(row)\"\n          (click)=\"onItemClick($event, row.item)\"\n          (mouseenter)=\"onRowMouseEnter(row)\"\n        >\n          @if (row.item.loading) {\n            <span class=\"menu-list__icon menu-list__icon--spin\" aria-hidden=\"true\">\n              <i class=\"fa-solid fa-spinner\"></i>\n            </span>\n          } @else if (row.item.icon?.trim()) {\n            <span class=\"menu-list__icon\" aria-hidden=\"true\">\n              <i [ngClass]=\"row.item.icon\"></i>\n            </span>\n          }\n          <span class=\"menu-list__text\">\n            <span class=\"menu-list__label\">{{ row.item.label }}</span>\n            @if (row.item.description?.trim()) {\n              <span class=\"menu-list__description\">{{ row.item.description }}</span>\n            }\n          </span>\n        </div>\n      }\n    }\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes app-sidebar-nav-reveal-in{0%{opacity:0;transform:translate3d(-.45rem,0,0)}to{opacity:1;transform:translateZ(0)}}:host{display:block;min-width:0;box-sizing:border-box}.menu-list{background:var(--app-color-surface, #ffffff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .12));border-radius:10px;box-shadow:0 10px 28px -14px #0f172a29;max-height:min(70vh,22rem);overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;gap:.1rem;padding:.45rem 0;outline:none}.menu-list--dense{padding:.2rem 0;gap:0}.menu-list__submenu-wrap{position:relative;display:block}.menu-list__option{display:flex;align-items:center;box-sizing:border-box;gap:.5rem;margin:0 .25rem;padding:.48rem .6rem;border-radius:8px;cursor:pointer;color:var(--app-color-text-primary, #1a2f45);background:transparent;border:1px solid transparent;text-align:left;font:inherit;line-height:1.25}.menu-list__option:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:1px}.menu-list__option:hover:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 6%,transparent)}.menu-list__option.menu-list__option--active:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 7%,transparent);border-color:transparent}.menu-list__option.menu-list__option--active:not(.menu-list__option--disabled):not(.menu-list__option--loading):not(.menu-list__option--selected){box-shadow:none}.menu-list__option.menu-list__option--disabled{cursor:not-allowed;color:var(--app-color-text-muted, #6b8299);background:transparent;opacity:.72}.menu-list__option.menu-list__option--loading{cursor:wait;opacity:.92;pointer-events:none}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading){color:var(--app-color-error, #b91c1c)}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading):hover,.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading).menu-list__option--active{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-error-border, #dc2626)}.menu-list__option--submenu{padding-right:.35rem}.menu-list__option--selected:not(.menu-list__option--disabled){background:color-mix(in srgb,var(--app-color-primary) 9%,transparent);border-radius:8px;border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-primary, #2b7fd9)}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__label{color:var(--app-color-primary, #2b7fd9);font-weight:600}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__icon{color:var(--app-color-primary, #2b7fd9)}.menu-list--compress-text .menu-list__label,.menu-list--compress-text .menu-list__description{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.menu-list--compress-text .menu-list__text,.menu-list--compress-text .menu-list__submenu-chevron{display:none}.menu-list--compress-text .menu-list__submenu-wrap{width:100%}.menu-list--compress-text .menu-list__option{justify-content:center;align-items:center;text-align:center;width:calc(100% - .5rem);max-width:100%;box-sizing:border-box;margin-left:.25rem;margin-right:.25rem;padding:.5rem .35rem}.menu-list--compress-text .menu-list__option--submenu{padding-left:.35rem;padding-right:.35rem}.menu-list--compress-text .menu-list__icon{flex:0 0 auto;width:auto;min-width:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding-top:0}.menu-list__submenu-chevron{flex:0 0 auto;margin-left:auto;padding-left:.35rem;font-size:1rem;line-height:1;color:var(--app-color-text-muted, #6b8299);opacity:.85}.menu-list__icon{flex:0 0 auto;width:1.25rem;height:1.25rem;min-height:1.25rem;display:inline-flex;align-items:center;justify-content:center;text-align:center;color:var(--app-color-text-secondary, #5a7fa3);line-height:1}.menu-list__icon i{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1;font-size:.95rem}.menu-list__option--disabled .menu-list__icon{opacity:.55}.menu-list__icon--spin i{animation:menu-list-spin .8s linear infinite}.menu-list__text{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}.menu-list__label{font-size:.875rem;font-weight:500;line-height:1.25rem;display:inline-flex;align-items:center;min-height:1.25rem}.menu-list__description{font-size:.75rem;color:var(--app-color-text-muted, #6b8299);line-height:1.3}.menu-list:not(.menu-list--compress-text){animation:app-sidebar-nav-reveal-in .45s cubic-bezier(.16,1,.32,1) both}@media(prefers-reduced-motion:reduce){.menu-list:not(.menu-list--compress-text){animation:none}}.menu-submenu__panel{box-sizing:border-box;min-width:0;padding:0;background:transparent;border:none;box-shadow:none;border-radius:10px;overflow:hidden}@keyframes menu-list-spin{to{transform:rotate(360deg)}}:host ::ng-deep .menu-submenu__cdk-panel{background:transparent;box-shadow:none;border-radius:10px}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => MenuListComponent), selector: "app-menu-list", inputs: ["items", "menuId", "dense", "nested", "selectedItemId", "compressText"], outputs: ["itemSelect", "closeRequest", "submenuBack"] }, { kind: "directive", type: i0.forwardRef(() => NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => CdkConnectedOverlay), selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i0.forwardRef(() => CdkOverlayOrigin), selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i0.forwardRef(() => MenuDividerComponent), selector: "app-menu-divider" }, { kind: "component", type: i0.forwardRef(() => MenuGroupComponent), selector: "app-menu-group", inputs: ["label", "hideLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MenuListComponent, decorators: [{
             type: Component,
@@ -1206,7 +1236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                         CdkOverlayOrigin,
                         MenuDividerComponent,
                         MenuGroupComponent,
-                    ], template: "<div\n  class=\"menu-list\"\n  [class.menu-list--dense]=\"dense\"\n  [class.menu-list--compress-text]=\"compressText\"\n  role=\"menu\"\n  [attr.aria-labelledby]=\"null\"\n  tabindex=\"-1\"\n  (mouseleave)=\"onMenuSurfaceLeave()\"\n>\n  @for (row of rows; track idx; let idx = $index) {\n    @switch (row.kind) {\n      @case ('divider') {\n        <app-menu-divider />\n      }\n      @case ('group') {\n        <app-menu-group [label]=\"row.label\" [hideLabel]=\"compressText\" />\n      }\n      @case ('submenu') {\n        <div\n          class=\"menu-list__submenu-wrap\"\n          cdkOverlayOrigin\n          #subOrigin=\"cdkOverlayOrigin\"\n          (mouseenter)=\"onSubmenuTriggerEnter(row, idx)\"\n          (mouseleave)=\"onSubmenuTriggerLeave(row, idx)\"\n        >\n          <div\n            class=\"menu-list__option menu-list__option--submenu\"\n            role=\"menuitem\"\n            [attr.aria-haspopup]=\"'true'\"\n            [attr.aria-expanded]=\"isSubmenuOpen(row, idx)\"\n            [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n            [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n            [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n            [attr.title]=\"compressText ? row.item.label : null\"\n            [attr.aria-label]=\"compressText ? row.item.label : null\"\n            [class.menu-list__option--disabled]=\"row.item.disabled\"\n            [class.menu-list__option--active]=\"isActiveRow(row)\"\n            [class.menu-list__option--selected]=\"isRowSelected(row)\"\n            (click)=\"onSubmenuRowClick($event, row, idx)\"\n            (mouseenter)=\"onRowMouseEnter(row)\"\n          >\n            @if (row.item.icon?.trim()) {\n              <span class=\"menu-list__icon\" aria-hidden=\"true\">\n                <i [ngClass]=\"row.item.icon\"></i>\n              </span>\n            }\n            <span class=\"menu-list__text\">\n              <span class=\"menu-list__label\">{{ row.item.label }}</span>\n              @if (row.item.description?.trim()) {\n                <span class=\"menu-list__description\">{{ row.item.description }}</span>\n              }\n            </span>\n            <span class=\"menu-list__submenu-chevron\" aria-hidden=\"true\">\u203A</span>\n          </div>\n          <ng-template\n            cdkConnectedOverlay\n            [cdkConnectedOverlayOrigin]=\"subOrigin\"\n            [cdkConnectedOverlayOpen]=\"isSubmenuOpen(row, idx)\"\n            [cdkConnectedOverlayPositions]=\"submenuPositions\"\n            [cdkConnectedOverlayPush]=\"true\"\n            [cdkConnectedOverlayPanelClass]=\"overlayPanelClasses()\"\n            [cdkConnectedOverlayMinWidth]=\"200\"\n            (overlayOutsideClick)=\"onSubmenuOutsideClick(row, idx)\"\n          >\n            <div\n              class=\"menu-submenu__panel\"\n              [ngClass]=\"panelThemeNgClass()\"\n              (mouseenter)=\"onSubmenuPanelEnter()\"\n              (mouseleave)=\"onSubmenuPanelLeave(row, idx)\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              <app-menu-list\n                [items]=\"row.item.items\"\n                [menuId]=\"submenuMenuId(row)\"\n                [nested]=\"true\"\n                [dense]=\"dense\"\n                [compressText]=\"compressText\"\n                [selectedItemId]=\"selectedItemId\"\n                (itemSelect)=\"onNestedItemSelect($event)\"\n                (closeRequest)=\"closeRequest.emit()\"\n                (submenuBack)=\"closeOpenSubmenu()\"\n              />\n            </div>\n          </ng-template>\n        </div>\n      }\n      @case ('action') {\n        <div\n          class=\"menu-list__option\"\n          role=\"menuitem\"\n          [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n          [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n          [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n          [attr.aria-busy]=\"row.item.loading ? true : null\"\n          [attr.title]=\"compressText ? row.item.label : null\"\n          [attr.aria-label]=\"compressText ? row.item.label : null\"\n          [class.menu-list__option--disabled]=\"row.item.disabled\"\n          [class.menu-list__option--loading]=\"row.item.loading\"\n          [class.menu-list__option--danger]=\"row.item.danger\"\n          [class.menu-list__option--active]=\"isActiveRow(row)\"\n          [class.menu-list__option--selected]=\"isRowSelected(row)\"\n          (click)=\"onItemClick($event, row.item)\"\n          (mouseenter)=\"onRowMouseEnter(row)\"\n        >\n          @if (row.item.loading) {\n            <span class=\"menu-list__icon menu-list__icon--spin\" aria-hidden=\"true\">\n              <i class=\"fa-solid fa-spinner\"></i>\n            </span>\n          } @else if (row.item.icon?.trim()) {\n            <span class=\"menu-list__icon\" aria-hidden=\"true\">\n              <i [ngClass]=\"row.item.icon\"></i>\n            </span>\n          }\n          <span class=\"menu-list__text\">\n            <span class=\"menu-list__label\">{{ row.item.label }}</span>\n            @if (row.item.description?.trim()) {\n              <span class=\"menu-list__description\">{{ row.item.description }}</span>\n            }\n          </span>\n        </div>\n      }\n    }\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes app-sidebar-nav-reveal-in{0%{opacity:0;transform:translate3d(-.45rem,0,0)}to{opacity:1;transform:translateZ(0)}}:host{display:block;min-width:0;box-sizing:border-box}.menu-list{background:var(--app-color-surface, #ffffff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .12));border-radius:10px;box-shadow:0 10px 28px -14px #0f172a29;max-height:min(70vh,22rem);overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;gap:.1rem;padding:.45rem 0;outline:none}.menu-list--dense{padding:.2rem 0;gap:0}.menu-list__submenu-wrap{position:relative;display:block}.menu-list__option{display:flex;align-items:center;box-sizing:border-box;gap:.5rem;margin:0 .25rem;padding:.48rem .6rem;border-radius:8px;cursor:pointer;color:var(--app-color-text-primary, #1a2f45);background:transparent;border:1px solid transparent;text-align:left;font:inherit;line-height:1.25}.menu-list__option:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:1px}.menu-list__option:hover:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 6%,transparent)}.menu-list__option.menu-list__option--active:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 7%,transparent);border-color:transparent;box-shadow:none}.menu-list__option.menu-list__option--disabled{cursor:not-allowed;color:var(--app-color-text-muted, #6b8299);background:transparent;opacity:.72}.menu-list__option.menu-list__option--loading{cursor:wait;opacity:.92;pointer-events:none}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading){color:var(--app-color-error, #b91c1c)}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading):hover,.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading).menu-list__option--active{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-error-border, #dc2626)}.menu-list__option--submenu{padding-right:.35rem}.menu-list__option--selected:not(.menu-list__option--disabled){background:color-mix(in srgb,var(--app-color-primary) 9%,transparent);border-radius:8px;border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-primary, #2b7fd9)}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__label{color:var(--app-color-primary, #2b7fd9);font-weight:600}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__icon{color:var(--app-color-primary, #2b7fd9)}.menu-list--compress-text .menu-list__label,.menu-list--compress-text .menu-list__description{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.menu-list--compress-text .menu-list__text,.menu-list--compress-text .menu-list__submenu-chevron{display:none}.menu-list--compress-text .menu-list__submenu-wrap{width:100%}.menu-list--compress-text .menu-list__option{justify-content:center;align-items:center;text-align:center;width:calc(100% - .5rem);max-width:100%;box-sizing:border-box;margin-left:.25rem;margin-right:.25rem;padding:.5rem .35rem}.menu-list--compress-text .menu-list__option--submenu{padding-left:.35rem;padding-right:.35rem}.menu-list--compress-text .menu-list__icon{flex:0 0 auto;width:auto;min-width:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding-top:0}.menu-list__submenu-chevron{flex:0 0 auto;margin-left:auto;padding-left:.35rem;font-size:1rem;line-height:1;color:var(--app-color-text-muted, #6b8299);opacity:.85}.menu-list__icon{flex:0 0 auto;width:1.25rem;height:1.25rem;min-height:1.25rem;display:inline-flex;align-items:center;justify-content:center;text-align:center;color:var(--app-color-text-secondary, #5a7fa3);line-height:1}.menu-list__icon i{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1;font-size:.95rem}.menu-list__option--disabled .menu-list__icon{opacity:.55}.menu-list__icon--spin i{animation:menu-list-spin .8s linear infinite}.menu-list__text{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}.menu-list__label{font-size:.875rem;font-weight:500;line-height:1.25rem;display:inline-flex;align-items:center;min-height:1.25rem}.menu-list__description{font-size:.75rem;color:var(--app-color-text-muted, #6b8299);line-height:1.3}.menu-list:not(.menu-list--compress-text){animation:app-sidebar-nav-reveal-in .45s cubic-bezier(.16,1,.32,1) both}@media(prefers-reduced-motion:reduce){.menu-list:not(.menu-list--compress-text){animation:none}}.menu-submenu__panel{box-sizing:border-box;min-width:0;padding:0;background:transparent;border:none;box-shadow:none;border-radius:10px;overflow:hidden}@keyframes menu-list-spin{to{transform:rotate(360deg)}}:host ::ng-deep .menu-submenu__cdk-panel{background:transparent;box-shadow:none;border-radius:10px}\n"] }]
+                    ], template: "<div\n  class=\"menu-list\"\n  [class.menu-list--dense]=\"dense\"\n  [class.menu-list--compress-text]=\"compressText\"\n  role=\"menu\"\n  [attr.aria-labelledby]=\"null\"\n  tabindex=\"-1\"\n  (mouseleave)=\"onMenuSurfaceLeave()\"\n>\n  @for (row of rows; track idx; let idx = $index) {\n    @switch (row.kind) {\n      @case ('divider') {\n        <app-menu-divider />\n      }\n      @case ('group') {\n        <app-menu-group [label]=\"row.label\" [hideLabel]=\"compressText\" />\n      }\n      @case ('submenu') {\n        <div\n          class=\"menu-list__submenu-wrap\"\n          cdkOverlayOrigin\n          #subOrigin=\"cdkOverlayOrigin\"\n          (mouseenter)=\"onSubmenuTriggerEnter(row, idx)\"\n          (mouseleave)=\"onSubmenuTriggerLeave(row, idx)\"\n        >\n          <div\n            class=\"menu-list__option menu-list__option--submenu\"\n            role=\"menuitem\"\n            [attr.aria-haspopup]=\"'true'\"\n            [attr.aria-expanded]=\"isSubmenuOpen(row, idx)\"\n            [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n            [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n            [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n            [attr.title]=\"compressText ? row.item.label : null\"\n            [attr.aria-label]=\"compressText ? row.item.label : null\"\n            [class.menu-list__option--disabled]=\"row.item.disabled\"\n            [class.menu-list__option--active]=\"isActiveRow(row)\"\n            [class.menu-list__option--selected]=\"isRowSelected(row)\"\n            (click)=\"onSubmenuRowClick($event, row, idx)\"\n            (mouseenter)=\"onRowMouseEnter(row)\"\n          >\n            @if (row.item.icon?.trim()) {\n              <span class=\"menu-list__icon\" aria-hidden=\"true\">\n                <i [ngClass]=\"row.item.icon\"></i>\n              </span>\n            }\n            <span class=\"menu-list__text\">\n              <span class=\"menu-list__label\">{{ row.item.label }}</span>\n              @if (row.item.description?.trim()) {\n                <span class=\"menu-list__description\">{{ row.item.description }}</span>\n              }\n            </span>\n            <span class=\"menu-list__submenu-chevron\" aria-hidden=\"true\">\u203A</span>\n          </div>\n          <ng-template\n            cdkConnectedOverlay\n            [cdkConnectedOverlayOrigin]=\"subOrigin\"\n            [cdkConnectedOverlayOpen]=\"isSubmenuOpen(row, idx)\"\n            [cdkConnectedOverlayPositions]=\"submenuPositions\"\n            [cdkConnectedOverlayPush]=\"true\"\n            [cdkConnectedOverlayPanelClass]=\"overlayPanelClasses()\"\n            [cdkConnectedOverlayMinWidth]=\"200\"\n            (overlayOutsideClick)=\"onSubmenuOutsideClick(row, idx)\"\n          >\n            <div\n              class=\"menu-submenu__panel\"\n              [ngClass]=\"panelThemeNgClass()\"\n              (mouseenter)=\"onSubmenuPanelEnter()\"\n              (mouseleave)=\"onSubmenuPanelLeave(row, idx)\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              <app-menu-list\n                [items]=\"row.item.items\"\n                [menuId]=\"submenuMenuId(row)\"\n                [nested]=\"true\"\n                [dense]=\"dense\"\n                [compressText]=\"compressText\"\n                [selectedItemId]=\"selectedItemId\"\n                (itemSelect)=\"onNestedItemSelect($event)\"\n                (closeRequest)=\"closeRequest.emit()\"\n                (submenuBack)=\"closeOpenSubmenu()\"\n              />\n            </div>\n          </ng-template>\n        </div>\n      }\n      @case ('action') {\n        <div\n          class=\"menu-list__option\"\n          role=\"menuitem\"\n          [id]=\"row.focusIndex !== null ? optionId(row.focusIndex) : null\"\n          [attr.tabindex]=\"row.focusIndex !== null && !row.item.disabled ? (isActiveRow(row) ? 0 : -1) : -1\"\n          [attr.aria-disabled]=\"row.item.disabled ? true : null\"\n          [attr.aria-busy]=\"row.item.loading ? true : null\"\n          [attr.title]=\"compressText ? row.item.label : null\"\n          [attr.aria-label]=\"compressText ? row.item.label : null\"\n          [class.menu-list__option--disabled]=\"row.item.disabled\"\n          [class.menu-list__option--loading]=\"row.item.loading\"\n          [class.menu-list__option--danger]=\"row.item.danger\"\n          [class.menu-list__option--active]=\"isActiveRow(row)\"\n          [class.menu-list__option--selected]=\"isRowSelected(row)\"\n          (click)=\"onItemClick($event, row.item)\"\n          (mouseenter)=\"onRowMouseEnter(row)\"\n        >\n          @if (row.item.loading) {\n            <span class=\"menu-list__icon menu-list__icon--spin\" aria-hidden=\"true\">\n              <i class=\"fa-solid fa-spinner\"></i>\n            </span>\n          } @else if (row.item.icon?.trim()) {\n            <span class=\"menu-list__icon\" aria-hidden=\"true\">\n              <i [ngClass]=\"row.item.icon\"></i>\n            </span>\n          }\n          <span class=\"menu-list__text\">\n            <span class=\"menu-list__label\">{{ row.item.label }}</span>\n            @if (row.item.description?.trim()) {\n              <span class=\"menu-list__description\">{{ row.item.description }}</span>\n            }\n          </span>\n        </div>\n      }\n    }\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes app-sidebar-nav-reveal-in{0%{opacity:0;transform:translate3d(-.45rem,0,0)}to{opacity:1;transform:translateZ(0)}}:host{display:block;min-width:0;box-sizing:border-box}.menu-list{background:var(--app-color-surface, #ffffff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .12));border-radius:10px;box-shadow:0 10px 28px -14px #0f172a29;max-height:min(70vh,22rem);overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;gap:.1rem;padding:.45rem 0;outline:none}.menu-list--dense{padding:.2rem 0;gap:0}.menu-list__submenu-wrap{position:relative;display:block}.menu-list__option{display:flex;align-items:center;box-sizing:border-box;gap:.5rem;margin:0 .25rem;padding:.48rem .6rem;border-radius:8px;cursor:pointer;color:var(--app-color-text-primary, #1a2f45);background:transparent;border:1px solid transparent;text-align:left;font:inherit;line-height:1.25}.menu-list__option:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:1px}.menu-list__option:hover:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 6%,transparent)}.menu-list__option.menu-list__option--active:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb,var(--app-color-primary) 7%,transparent);border-color:transparent}.menu-list__option.menu-list__option--active:not(.menu-list__option--disabled):not(.menu-list__option--loading):not(.menu-list__option--selected){box-shadow:none}.menu-list__option.menu-list__option--disabled{cursor:not-allowed;color:var(--app-color-text-muted, #6b8299);background:transparent;opacity:.72}.menu-list__option.menu-list__option--loading{cursor:wait;opacity:.92;pointer-events:none}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading){color:var(--app-color-error, #b91c1c)}.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading):hover,.menu-list__option.menu-list__option--danger:not(.menu-list__option--disabled):not(.menu-list__option--loading).menu-list__option--active{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-error-border, #dc2626)}.menu-list__option--submenu{padding-right:.35rem}.menu-list__option--selected:not(.menu-list__option--disabled){background:color-mix(in srgb,var(--app-color-primary) 9%,transparent);border-radius:8px;border-color:transparent;box-shadow:inset 2px 0 0 0 var(--app-color-primary, #2b7fd9)}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__label{color:var(--app-color-primary, #2b7fd9);font-weight:600}.menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__icon{color:var(--app-color-primary, #2b7fd9)}.menu-list--compress-text .menu-list__label,.menu-list--compress-text .menu-list__description{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.menu-list--compress-text .menu-list__text,.menu-list--compress-text .menu-list__submenu-chevron{display:none}.menu-list--compress-text .menu-list__submenu-wrap{width:100%}.menu-list--compress-text .menu-list__option{justify-content:center;align-items:center;text-align:center;width:calc(100% - .5rem);max-width:100%;box-sizing:border-box;margin-left:.25rem;margin-right:.25rem;padding:.5rem .35rem}.menu-list--compress-text .menu-list__option--submenu{padding-left:.35rem;padding-right:.35rem}.menu-list--compress-text .menu-list__icon{flex:0 0 auto;width:auto;min-width:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding-top:0}.menu-list__submenu-chevron{flex:0 0 auto;margin-left:auto;padding-left:.35rem;font-size:1rem;line-height:1;color:var(--app-color-text-muted, #6b8299);opacity:.85}.menu-list__icon{flex:0 0 auto;width:1.25rem;height:1.25rem;min-height:1.25rem;display:inline-flex;align-items:center;justify-content:center;text-align:center;color:var(--app-color-text-secondary, #5a7fa3);line-height:1}.menu-list__icon i{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1;font-size:.95rem}.menu-list__option--disabled .menu-list__icon{opacity:.55}.menu-list__icon--spin i{animation:menu-list-spin .8s linear infinite}.menu-list__text{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}.menu-list__label{font-size:.875rem;font-weight:500;line-height:1.25rem;display:inline-flex;align-items:center;min-height:1.25rem}.menu-list__description{font-size:.75rem;color:var(--app-color-text-muted, #6b8299);line-height:1.3}.menu-list:not(.menu-list--compress-text){animation:app-sidebar-nav-reveal-in .45s cubic-bezier(.16,1,.32,1) both}@media(prefers-reduced-motion:reduce){.menu-list:not(.menu-list--compress-text){animation:none}}.menu-submenu__panel{box-sizing:border-box;min-width:0;padding:0;background:transparent;border:none;box-shadow:none;border-radius:10px;overflow:hidden}@keyframes menu-list-spin{to{transform:rotate(360deg)}}:host ::ng-deep .menu-submenu__cdk-panel{background:transparent;box-shadow:none;border-radius:10px}\n"] }]
         }], propDecorators: { items: [{
                 type: Input,
                 args: [{ required: true }]
@@ -5904,6 +5934,19 @@ class ValidationSummaryComponent {
          * nem alterar o scroll da página (útil em formulários muito longos).
          */
         this.pinned = false;
+        /**
+         * Com resumo em fluxo (`pinned === false`), após o painel passar a visível, rola o scrollport
+         * (ex.: `main` com overflow) até alinhar o painel no topo — necessário além de `window.scrollTo`
+         * quando o layout aplica scroll num contentor (docs, modais, etc.).
+         * Com `pinned === true` não tem efeito.
+         */
+        this.autoScrollOnReveal = true;
+        /**
+         * Incrementar a cada submissão com erros (ex.: `++validarComErroSeq`) para voltar a rolar
+         * o painel **em fluxo** quando já está visível. Sem ligação, mantém-se só o scroll da
+         * primeira revelação.
+         */
+        this.unpinnedScrollTick = 0;
         this.variant = 'error';
         this.compact = false;
         /**
@@ -5929,6 +5972,8 @@ class ValidationSummaryComponent {
         /** `true`: lista de erros visível; `false`: só cabeçalho + botões (menos altura). */
         this.panelBodyExpanded = true;
         this.wasShown = false;
+        /** Evita loop em {@link scrollHostIntoNearestBlockScrollport} se o host ainda não tiver medidas. */
+        this.unpinnedScrollMeasureAttempts = 0;
     }
     static { this.nextTitleUid = 0; }
     static { this.nextListRegionUid = 0; }
@@ -5945,7 +5990,7 @@ class ValidationSummaryComponent {
         }
         return parts.join(' ');
     }
-    ngOnChanges(_changes) {
+    ngOnChanges(c) {
         const shown = this.isShown;
         if (this.pinned && shown && !this.wasShown) {
             this.pinnedOpen = false;
@@ -5961,6 +6006,16 @@ class ValidationSummaryComponent {
             this.pinnedOpen = false;
             this.panelBodyExpanded = true;
         }
+        else if (this.autoScrollOnReveal && !this.pinned && shown) {
+            const tch = c['unpinnedScrollTick'];
+            const tickBumped = !!tch &&
+                tch.currentValue !== tch.previousValue &&
+                (tch.previousValue !== undefined ||
+                    (typeof tch.currentValue === 'number' && tch.currentValue > 0));
+            if (tickBumped || !this.wasShown) {
+                this.scheduleUnpinnedRevealScroll();
+            }
+        }
         this.wasShown = shown;
     }
     get hostHidden() {
@@ -6150,6 +6205,70 @@ class ValidationSummaryComponent {
         const inner = el.querySelector('input, select, textarea, button, [href], [tabindex]:not([tabindex="-1"])');
         return inner ?? el;
     }
+    scheduleUnpinnedRevealScroll() {
+        this.unpinnedScrollMeasureAttempts = 0;
+        afterNextRender(() => {
+            requestAnimationFrame(() => {
+                requestAnimationFrame(() => this.scrollHostIntoNearestBlockScrollport());
+            });
+        }, { injector: this.injector });
+    }
+    /**
+     * Rola o primeiro contentor com overflow (ex.: `main` da shell de docs) para mostrar o host.
+     * `Element.scrollIntoView` em contentores aninhados é pouco fiável; usamos o rect do alvo
+     * relativamente ao scrollport, como no foco a partir de um item.
+     */
+    scrollHostIntoNearestBlockScrollport() {
+        if (this.pinned) {
+            return;
+        }
+        const el = this.hostRef.nativeElement;
+        if (!el.isConnected) {
+            return;
+        }
+        const { width, height } = el.getBoundingClientRect();
+        if (width === 0 && height === 0) {
+            if (this.unpinnedScrollMeasureAttempts++ < 5) {
+                requestAnimationFrame(() => {
+                    requestAnimationFrame(() => this.scrollHostIntoNearestBlockScrollport());
+                });
+            }
+            return;
+        }
+        const marginPx = 12;
+        const scrollport = this.findFirstBlockScrollportAncestor(el) ??
+            document.scrollingElement ??
+            document.documentElement;
+        const elRect = el.getBoundingClientRect();
+        const portRect = scrollport.getBoundingClientRect();
+        const deltaY = elRect.top - portRect.top - marginPx;
+        if (Math.abs(deltaY) < 2) {
+            return;
+        }
+        const nextTop = scrollport.scrollTop + deltaY;
+        const maxTop = Math.max(0, scrollport.scrollHeight - scrollport.clientHeight);
+        const clamped = Math.max(0, Math.min(maxTop, nextTop));
+        scrollport.scrollTo({ top: clamped, behavior: this.scrollBehavior });
+    }
+    findFirstBlockScrollportAncestor(from) {
+        let node = from.parentElement;
+        let depth = 0;
+        while (node && depth < 64) {
+            if (node === document.body || node === document.documentElement) {
+                return null;
+            }
+            const { overflowY } = getComputedStyle(node);
+            if ((overflowY === 'auto' ||
+                overflowY === 'scroll' ||
+                overflowY === 'overlay') &&
+                node.scrollHeight > node.clientHeight + 1) {
+                return node;
+            }
+            node = node.parentElement;
+            depth += 1;
+        }
+        return null;
+    }
     isFocusableElement(el) {
         if (el.hasAttribute('disabled')) {
             return false;
@@ -6165,11 +6284,11 @@ class ValidationSummaryComponent {
         return tab != null && tab !== '-1';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ValidationSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ValidationSummaryComponent, isStandalone: true, selector: "app-validation-summary", inputs: { messages: "messages", items: "items", summaryHeading: ["title", "summaryHeading"], visible: ["visible", "visible", booleanAttribute], pinned: ["pinned", "pinned", booleanAttribute], variant: "variant", compact: ["compact", "compact", booleanAttribute], panelMaxHeight: "panelMaxHeight", scrollBehavior: "scrollBehavior", beforeItemActivate: "beforeItemActivate", showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute], showListCollapseToggle: ["showListCollapseToggle", "showListCollapseToggle", booleanAttribute], closeButtonLabel: "closeButtonLabel", fieldNavigateHint: "fieldNavigateHint" }, outputs: { panelClose: "panelClose" }, host: { properties: { "class": "this.hostClass", "attr.hidden": "this.hostHidden" } }, usesOnChanges: true, ngImport: i0, template: "@if (isShown) {\r\n<div class=\"validation-summary__panel\" role=\"region\"\r\n  [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n  [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n  [class.validation-summary__panel--pinned]=\"pinned\"\r\n  [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n  [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\">\r\n  <div class=\"validation-summary__head\">\r\n    @if (showListCollapseToggle) {\r\n    <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n      [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n      [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n      <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n        [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n    </button>\r\n    }\r\n    @if (summaryHeading.trim()) {\r\n    <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n      {{ summaryHeading }}\r\n    </h3>\r\n    }\r\n    @if (showCloseButton) {\r\n    <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n      {{ closeButtonLabel }}\r\n    </button>\r\n    }\r\n  </div>\r\n  <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n    [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n    [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n    [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n    <ul class=\"validation-summary__list\" role=\"list\">\r\n      @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n      <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n        @if (row.fieldId) {\r\n        <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n          {{ row.message }}\r\n        </button>\r\n        } @else {\r\n        <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n        }\r\n      </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 1400);top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:none;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}:host.validation-summary--error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}:host.validation-summary--error .validation-summary__panel{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}:host.validation-summary--error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}:host.validation-summary--warning .validation-summary__panel{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}:host.validation-summary--warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}:host.validation-summary--warning .validation-summary__close{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}:host.validation-summary--info .validation-summary__panel{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}:host.validation-summary--info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}:host.validation-summary--info .validation-summary__close{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}:host.validation-summary--compact .validation-summary__panel{padding:.55rem .7rem}:host.validation-summary--compact .validation-summary__head{margin-bottom:.35rem}:host.validation-summary--compact .validation-summary__title{font-size:.92rem}:host.validation-summary--compact .validation-summary__list{padding-left:0}:host.validation-summary--compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}:host.validation-summary--compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ValidationSummaryComponent, isStandalone: true, selector: "app-validation-summary", inputs: { messages: "messages", items: "items", summaryHeading: ["title", "summaryHeading"], visible: ["visible", "visible", booleanAttribute], pinned: ["pinned", "pinned", booleanAttribute], autoScrollOnReveal: ["autoScrollOnReveal", "autoScrollOnReveal", booleanAttribute], unpinnedScrollTick: "unpinnedScrollTick", variant: "variant", compact: ["compact", "compact", booleanAttribute], panelMaxHeight: "panelMaxHeight", scrollBehavior: "scrollBehavior", beforeItemActivate: "beforeItemActivate", showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute], showListCollapseToggle: ["showListCollapseToggle", "showListCollapseToggle", booleanAttribute], closeButtonLabel: "closeButtonLabel", fieldNavigateHint: "fieldNavigateHint" }, outputs: { panelClose: "panelClose" }, host: { properties: { "class": "this.hostClass", "attr.hidden": "this.hostHidden" } }, usesOnChanges: true, ngImport: i0, template: "@if (isShown) {\r\n<div class=\"validation-summary__panel\" role=\"region\"\r\n  [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n  [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n  [class.validation-summary__panel--pinned]=\"pinned\"\r\n  [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n  [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\">\r\n  <div class=\"validation-summary__head\">\r\n    @if (showListCollapseToggle) {\r\n    <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n      [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n      [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n      <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n        [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n    </button>\r\n    }\r\n    @if (summaryHeading.trim()) {\r\n    <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n      {{ summaryHeading }}\r\n    </h3>\r\n    }\r\n    @if (showCloseButton) {\r\n    <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n      {{ closeButtonLabel }}\r\n    </button>\r\n    }\r\n  </div>\r\n  <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n    [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n    [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n    [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n    <ul class=\"validation-summary__list\" role=\"list\">\r\n      @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n      <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n        @if (row.fieldId) {\r\n        <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n          {{ row.message }}\r\n        </button>\r\n        } @else {\r\n        <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n        }\r\n      </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;scroll-margin-top:.75rem;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none;scroll-margin-top:0}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 1400);top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}:host.validation-summary--error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}:host.validation-summary--error .validation-summary__panel{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}:host.validation-summary--error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}:host.validation-summary--warning .validation-summary__panel{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}:host.validation-summary--warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}:host.validation-summary--warning .validation-summary__close{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}:host.validation-summary--info .validation-summary__panel{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}:host.validation-summary--info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}:host.validation-summary--info .validation-summary__close{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}:host.validation-summary--compact .validation-summary__panel{padding:.55rem .7rem}:host.validation-summary--compact .validation-summary__head{margin-bottom:.35rem}:host.validation-summary--compact .validation-summary__title{font-size:.92rem}:host.validation-summary--compact .validation-summary__list{padding-left:0}:host.validation-summary--compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}:host.validation-summary--compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}@media(max-width:30rem){.validation-summary__title{font-size:.875rem}:host.validation-summary--compact .validation-summary__title{font-size:.82rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ValidationSummaryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-validation-summary', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isShown) {\r\n<div class=\"validation-summary__panel\" role=\"region\"\r\n  [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n  [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n  [class.validation-summary__panel--pinned]=\"pinned\"\r\n  [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n  [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\">\r\n  <div class=\"validation-summary__head\">\r\n    @if (showListCollapseToggle) {\r\n    <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n      [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n      [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n      <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n        [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n    </button>\r\n    }\r\n    @if (summaryHeading.trim()) {\r\n    <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n      {{ summaryHeading }}\r\n    </h3>\r\n    }\r\n    @if (showCloseButton) {\r\n    <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n      {{ closeButtonLabel }}\r\n    </button>\r\n    }\r\n  </div>\r\n  <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n    [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n    [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n    [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n    <ul class=\"validation-summary__list\" role=\"list\">\r\n      @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n      <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n        @if (row.fieldId) {\r\n        <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n          {{ row.message }}\r\n        </button>\r\n        } @else {\r\n        <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n        }\r\n      </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 1400);top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:none;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}:host.validation-summary--error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}:host.validation-summary--error .validation-summary__panel{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}:host.validation-summary--error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}:host.validation-summary--warning .validation-summary__panel{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}:host.validation-summary--warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}:host.validation-summary--warning .validation-summary__close{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}:host.validation-summary--info .validation-summary__panel{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}:host.validation-summary--info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}:host.validation-summary--info .validation-summary__close{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}:host.validation-summary--compact .validation-summary__panel{padding:.55rem .7rem}:host.validation-summary--compact .validation-summary__head{margin-bottom:.35rem}:host.validation-summary--compact .validation-summary__title{font-size:.92rem}:host.validation-summary--compact .validation-summary__list{padding-left:0}:host.validation-summary--compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}:host.validation-summary--compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}\n"] }]
+            args: [{ selector: 'app-validation-summary', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isShown) {\r\n<div class=\"validation-summary__panel\" role=\"region\"\r\n  [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n  [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n  [class.validation-summary__panel--pinned]=\"pinned\"\r\n  [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n  [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\">\r\n  <div class=\"validation-summary__head\">\r\n    @if (showListCollapseToggle) {\r\n    <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n      [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n      [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n      <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n        [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n    </button>\r\n    }\r\n    @if (summaryHeading.trim()) {\r\n    <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n      {{ summaryHeading }}\r\n    </h3>\r\n    }\r\n    @if (showCloseButton) {\r\n    <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n      {{ closeButtonLabel }}\r\n    </button>\r\n    }\r\n  </div>\r\n  <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n    [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n    [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n    [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n    <ul class=\"validation-summary__list\" role=\"list\">\r\n      @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n      <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n        @if (row.fieldId) {\r\n        <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n          {{ row.message }}\r\n        </button>\r\n        } @else {\r\n        <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n        }\r\n      </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;scroll-margin-top:.75rem;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none;scroll-margin-top:0}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 1400);top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}:host.validation-summary--error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}:host.validation-summary--error .validation-summary__panel{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}:host.validation-summary--error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}:host.validation-summary--warning .validation-summary__panel{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}:host.validation-summary--warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}:host.validation-summary--warning .validation-summary__close{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}:host.validation-summary--info .validation-summary__panel{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}:host.validation-summary--info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}:host.validation-summary--info .validation-summary__close{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}:host.validation-summary--compact .validation-summary__panel{padding:.55rem .7rem}:host.validation-summary--compact .validation-summary__head{margin-bottom:.35rem}:host.validation-summary--compact .validation-summary__title{font-size:.92rem}:host.validation-summary--compact .validation-summary__list{padding-left:0}:host.validation-summary--compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}:host.validation-summary--compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}@media(max-width:30rem){.validation-summary__title{font-size:.875rem}:host.validation-summary--compact .validation-summary__title{font-size:.82rem}}\n"] }]
         }], propDecorators: { messages: [{
                 type: Input
             }], items: [{
@@ -6183,6 +6302,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             }], pinned: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
+            }], autoScrollOnReveal: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], unpinnedScrollTick: [{
+                type: Input
             }], variant: [{
                 type: Input
             }], compact: [{
@@ -8159,7 +8283,13 @@ class DrawerComponent {
             if (a instanceof HTMLElement && a !== document.body) {
                 this.focusPreOpen = a;
             }
+            /**
+             * Garante CD na árvore projectada (sidebar / app-menu-list) com OnPush; sem isto, o
+             * realce `option--selected` só surgia após p.ex. `mouseenter` na lista.
+             */
+            this.cdr.markForCheck();
             afterNextRender(() => {
+                this.cdr.markForCheck();
                 if (this.open) {
                     this.panelRef?.nativeElement?.focus({ preventScroll: true });
                 }
@@ -8231,14 +8361,14 @@ class DrawerComponent {
         this.focusPreOpen = null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DrawerComponent, isStandalone: true, selector: "app-drawer", inputs: { open: ["open", "open", booleanAttribute], side: "side", size: "size", drawerHeading: ["title", "drawerHeading"], showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute] }, outputs: { openChange: "openChange" }, host: { properties: { "class.app-drawer-host--open": "open" }, classAttribute: "app-drawer-host" }, viewQueries: [{ propertyName: "panelRef", first: true, predicate: ["panelRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (open) {\r\n  <div\r\n    class=\"app-drawer__backdrop\"\r\n    role=\"presentation\"\r\n    tabindex=\"-1\"\r\n    (click)=\"onBackdropClick()\"\r\n  ></div>\r\n\r\n  <aside\r\n    #panelRef\r\n    class=\"app-drawer__panel\"\r\n    [ngClass]=\"panelClasses\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-labelledby]=\"drawerHeading.trim() ? titleId : null\"\r\n    tabindex=\"-1\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    <header class=\"app-drawer__header\">\r\n      @if (drawerHeading.trim()) {\r\n        <h2 class=\"app-drawer__title\" [id]=\"titleId\">{{ drawerHeading }}</h2>\r\n      }\r\n      @if (showCloseButton) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"app-drawer__close\"\r\n          aria-label=\"Fechar painel\"\r\n          (click)=\"onCloseClick()\"\r\n        >\r\n          <span class=\"app-drawer__close-x\" aria-hidden=\"true\">&times;</span>\r\n        </button>\r\n      }\r\n    </header>\r\n\r\n    <div class=\"app-drawer__body\">\r\n      <ng-content />\r\n    </div>\r\n\r\n    <footer class=\"app-drawer__footer\">\r\n      <ng-content select=\"[appDrawerFooter]\" />\r\n    </footer>\r\n  </aside>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-drawer__backdrop{position:fixed;inset:0;z-index:var(--app-z-drawer-backdrop, 1100);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);animation:app-drawer-backdrop-in .22s ease-out both}@keyframes app-drawer-backdrop-in{0%{backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}to{backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05)}}.app-drawer__panel{position:fixed;z-index:var(--app-z-drawer-panel, 1101);display:flex;flex-direction:column;max-width:100vw;max-height:100vh;box-sizing:border-box;background:var(--app-color-surface, #fff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));box-shadow:-4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07));outline:none}.app-drawer__panel--side-right{top:0;right:0;bottom:0;animation:app-drawer-slide-in-right .24s ease-out}.app-drawer__panel--side-left{top:0;left:0;bottom:0;animation:app-drawer-slide-in-left .24s ease-out;box-shadow:4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07))}.app-drawer__panel--side-bottom{inset:auto 0 0;max-height:min(88vh,32rem);border-radius:8px 8px 0 0;animation:app-drawer-slide-in-bottom .24s ease-out}.app-drawer__panel--side-right.app-drawer__panel--size-sm,.app-drawer__panel--side-left.app-drawer__panel--size-sm{width:min(18rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-md,.app-drawer__panel--side-left.app-drawer__panel--size-md{width:min(24rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-lg,.app-drawer__panel--side-left.app-drawer__panel--size-lg{width:min(32rem,90vw)}.app-drawer__panel--side-bottom.app-drawer__panel--size-sm{min-height:12rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-md{min-height:16rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-lg{min-height:22rem}@keyframes app-drawer-slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-left{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}.app-drawer__header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;border-bottom:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));flex:0 0 auto}.app-drawer__title{margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3;flex:1;min-width:0}.app-drawer__close{flex:0 0 auto;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;border:1px solid var(--app-color-border, #d4d4d4);background:var(--app-color-surface-alt, #fff);color:var(--app-color-text-secondary, #5a7fa3);cursor:pointer;margin:0;padding:0}.app-drawer__close:hover{background:var(--app-color-hover-bg, rgba(43, 127, 217, .08))}.app-drawer__close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}.app-drawer__close-x{font-size:1.35rem;line-height:1}.app-drawer__body{flex:1 1 auto;min-height:0;overflow:auto;padding:1rem;color:var(--app-color-text-primary, #1a2f45);font-size:.9rem;line-height:1.5}.app-drawer__footer{flex:0 0 auto;padding:.75rem 1rem 1rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.app-drawer__footer:empty{display:none;padding:0;border:none}@media(prefers-reduced-motion:reduce){.app-drawer__backdrop{animation:none}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DrawerComponent, isStandalone: true, selector: "app-drawer", inputs: { open: ["open", "open", booleanAttribute], side: "side", size: "size", drawerHeading: ["title", "drawerHeading"], showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute] }, outputs: { openChange: "openChange" }, host: { properties: { "class.app-drawer-host--open": "open" }, classAttribute: "app-drawer-host" }, viewQueries: [{ propertyName: "panelRef", first: true, predicate: ["panelRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (open) {\r\n  <div\r\n    class=\"app-drawer__backdrop\"\r\n    role=\"presentation\"\r\n    tabindex=\"-1\"\r\n    (click)=\"onBackdropClick()\"\r\n  ></div>\r\n\r\n  <aside\r\n    #panelRef\r\n    class=\"app-drawer__panel\"\r\n    [ngClass]=\"panelClasses\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-labelledby]=\"drawerHeading.trim() ? titleId : null\"\r\n    tabindex=\"-1\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    <header class=\"app-drawer__header\">\r\n      @if (drawerHeading.trim()) {\r\n        <h2 class=\"app-drawer__title\" [id]=\"titleId\">{{ drawerHeading }}</h2>\r\n      }\r\n      @if (showCloseButton) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"app-drawer__close\"\r\n          aria-label=\"Fechar painel\"\r\n          (click)=\"onCloseClick()\"\r\n        >\r\n          <span class=\"app-drawer__close-x\" aria-hidden=\"true\">&times;</span>\r\n        </button>\r\n      }\r\n    </header>\r\n\r\n    <div class=\"app-drawer__body\">\r\n      <ng-content />\r\n    </div>\r\n\r\n    <footer class=\"app-drawer__footer\">\r\n      <ng-content select=\"[appDrawerFooter]\" />\r\n    </footer>\r\n  </aside>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-drawer__backdrop{position:fixed;inset:0;z-index:var(--app-z-drawer-backdrop, 1100);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);animation:app-drawer-backdrop-in .22s ease-out both}@keyframes app-drawer-backdrop-in{0%{backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}to{backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05)}}.app-drawer__panel{position:fixed;z-index:var(--app-z-drawer-panel, 1101);display:flex;flex-direction:column;max-width:100vw;max-height:100vh;box-sizing:border-box;background:var(--app-color-surface, #fff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));box-shadow:-4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07));outline:none}.app-drawer__panel--side-right{top:0;right:0;bottom:0;animation:app-drawer-slide-in-right .24s ease-out}.app-drawer__panel--side-left{top:0;left:0;bottom:0;animation:app-drawer-slide-in-left .24s ease-out;box-shadow:4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07));border-right:none}.app-drawer__panel--side-bottom{inset:auto 0 0;max-height:min(88vh,32rem);border-radius:8px 8px 0 0;animation:app-drawer-slide-in-bottom .24s ease-out}.app-drawer__panel--side-right.app-drawer__panel--size-sm,.app-drawer__panel--side-left.app-drawer__panel--size-sm{width:min(18rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-md,.app-drawer__panel--side-left.app-drawer__panel--size-md{width:min(24rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-lg,.app-drawer__panel--side-left.app-drawer__panel--size-lg{width:min(32rem,90vw)}.app-drawer__panel--side-bottom.app-drawer__panel--size-sm{min-height:12rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-md{min-height:16rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-lg{min-height:22rem}@keyframes app-drawer-slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-left{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}.app-drawer__header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;border-bottom:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));flex:0 0 auto}.app-drawer__title{margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3;flex:1;min-width:0}.app-drawer__close{flex:0 0 auto;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;border:1px solid var(--app-color-border, #d4d4d4);background:var(--app-color-surface-alt, #fff);color:var(--app-color-text-secondary, #5a7fa3);cursor:pointer;margin:0;padding:0}.app-drawer__close:hover{background:var(--app-color-hover-bg, rgba(43, 127, 217, .08))}.app-drawer__close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}.app-drawer__close-x{font-size:1.35rem;line-height:1}.app-drawer__body{flex:1 1 auto;min-height:0;overflow:auto;padding:1rem;color:var(--app-color-text-primary, #1a2f45);font-size:.9rem;line-height:1.5}.app-drawer__body ::ng-deep app-sidebar .app-sidebar{border-right:0}.app-drawer__body ::ng-deep app-sidebar .app-sidebar__toolbar{display:none}.app-drawer__footer{flex:0 0 auto;padding:.75rem 1rem 1rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.app-drawer__footer:empty{display:none;padding:0;border:none}@media(prefers-reduced-motion:reduce){.app-drawer__backdrop{animation:none}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DrawerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-drawer', imports: [NgClass], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'app-drawer-host',
                         '[class.app-drawer-host--open]': 'open',
-                    }, template: "@if (open) {\r\n  <div\r\n    class=\"app-drawer__backdrop\"\r\n    role=\"presentation\"\r\n    tabindex=\"-1\"\r\n    (click)=\"onBackdropClick()\"\r\n  ></div>\r\n\r\n  <aside\r\n    #panelRef\r\n    class=\"app-drawer__panel\"\r\n    [ngClass]=\"panelClasses\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-labelledby]=\"drawerHeading.trim() ? titleId : null\"\r\n    tabindex=\"-1\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    <header class=\"app-drawer__header\">\r\n      @if (drawerHeading.trim()) {\r\n        <h2 class=\"app-drawer__title\" [id]=\"titleId\">{{ drawerHeading }}</h2>\r\n      }\r\n      @if (showCloseButton) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"app-drawer__close\"\r\n          aria-label=\"Fechar painel\"\r\n          (click)=\"onCloseClick()\"\r\n        >\r\n          <span class=\"app-drawer__close-x\" aria-hidden=\"true\">&times;</span>\r\n        </button>\r\n      }\r\n    </header>\r\n\r\n    <div class=\"app-drawer__body\">\r\n      <ng-content />\r\n    </div>\r\n\r\n    <footer class=\"app-drawer__footer\">\r\n      <ng-content select=\"[appDrawerFooter]\" />\r\n    </footer>\r\n  </aside>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-drawer__backdrop{position:fixed;inset:0;z-index:var(--app-z-drawer-backdrop, 1100);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);animation:app-drawer-backdrop-in .22s ease-out both}@keyframes app-drawer-backdrop-in{0%{backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}to{backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05)}}.app-drawer__panel{position:fixed;z-index:var(--app-z-drawer-panel, 1101);display:flex;flex-direction:column;max-width:100vw;max-height:100vh;box-sizing:border-box;background:var(--app-color-surface, #fff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));box-shadow:-4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07));outline:none}.app-drawer__panel--side-right{top:0;right:0;bottom:0;animation:app-drawer-slide-in-right .24s ease-out}.app-drawer__panel--side-left{top:0;left:0;bottom:0;animation:app-drawer-slide-in-left .24s ease-out;box-shadow:4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07))}.app-drawer__panel--side-bottom{inset:auto 0 0;max-height:min(88vh,32rem);border-radius:8px 8px 0 0;animation:app-drawer-slide-in-bottom .24s ease-out}.app-drawer__panel--side-right.app-drawer__panel--size-sm,.app-drawer__panel--side-left.app-drawer__panel--size-sm{width:min(18rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-md,.app-drawer__panel--side-left.app-drawer__panel--size-md{width:min(24rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-lg,.app-drawer__panel--side-left.app-drawer__panel--size-lg{width:min(32rem,90vw)}.app-drawer__panel--side-bottom.app-drawer__panel--size-sm{min-height:12rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-md{min-height:16rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-lg{min-height:22rem}@keyframes app-drawer-slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-left{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}.app-drawer__header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;border-bottom:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));flex:0 0 auto}.app-drawer__title{margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3;flex:1;min-width:0}.app-drawer__close{flex:0 0 auto;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;border:1px solid var(--app-color-border, #d4d4d4);background:var(--app-color-surface-alt, #fff);color:var(--app-color-text-secondary, #5a7fa3);cursor:pointer;margin:0;padding:0}.app-drawer__close:hover{background:var(--app-color-hover-bg, rgba(43, 127, 217, .08))}.app-drawer__close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}.app-drawer__close-x{font-size:1.35rem;line-height:1}.app-drawer__body{flex:1 1 auto;min-height:0;overflow:auto;padding:1rem;color:var(--app-color-text-primary, #1a2f45);font-size:.9rem;line-height:1.5}.app-drawer__footer{flex:0 0 auto;padding:.75rem 1rem 1rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.app-drawer__footer:empty{display:none;padding:0;border:none}@media(prefers-reduced-motion:reduce){.app-drawer__backdrop{animation:none}}\n"] }]
+                    }, template: "@if (open) {\r\n  <div\r\n    class=\"app-drawer__backdrop\"\r\n    role=\"presentation\"\r\n    tabindex=\"-1\"\r\n    (click)=\"onBackdropClick()\"\r\n  ></div>\r\n\r\n  <aside\r\n    #panelRef\r\n    class=\"app-drawer__panel\"\r\n    [ngClass]=\"panelClasses\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-labelledby]=\"drawerHeading.trim() ? titleId : null\"\r\n    tabindex=\"-1\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    <header class=\"app-drawer__header\">\r\n      @if (drawerHeading.trim()) {\r\n        <h2 class=\"app-drawer__title\" [id]=\"titleId\">{{ drawerHeading }}</h2>\r\n      }\r\n      @if (showCloseButton) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"app-drawer__close\"\r\n          aria-label=\"Fechar painel\"\r\n          (click)=\"onCloseClick()\"\r\n        >\r\n          <span class=\"app-drawer__close-x\" aria-hidden=\"true\">&times;</span>\r\n        </button>\r\n      }\r\n    </header>\r\n\r\n    <div class=\"app-drawer__body\">\r\n      <ng-content />\r\n    </div>\r\n\r\n    <footer class=\"app-drawer__footer\">\r\n      <ng-content select=\"[appDrawerFooter]\" />\r\n    </footer>\r\n  </aside>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-drawer__backdrop{position:fixed;inset:0;z-index:var(--app-z-drawer-backdrop, 1100);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);animation:app-drawer-backdrop-in .22s ease-out both}@keyframes app-drawer-backdrop-in{0%{backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}to{backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05)}}.app-drawer__panel{position:fixed;z-index:var(--app-z-drawer-panel, 1101);display:flex;flex-direction:column;max-width:100vw;max-height:100vh;box-sizing:border-box;background:var(--app-color-surface, #fff);border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));box-shadow:-4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07));outline:none}.app-drawer__panel--side-right{top:0;right:0;bottom:0;animation:app-drawer-slide-in-right .24s ease-out}.app-drawer__panel--side-left{top:0;left:0;bottom:0;animation:app-drawer-slide-in-left .24s ease-out;box-shadow:4px 0 24px var(--app-color-elevated-shadow, rgba(43, 127, 217, .07));border-right:none}.app-drawer__panel--side-bottom{inset:auto 0 0;max-height:min(88vh,32rem);border-radius:8px 8px 0 0;animation:app-drawer-slide-in-bottom .24s ease-out}.app-drawer__panel--side-right.app-drawer__panel--size-sm,.app-drawer__panel--side-left.app-drawer__panel--size-sm{width:min(18rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-md,.app-drawer__panel--side-left.app-drawer__panel--size-md{width:min(24rem,90vw)}.app-drawer__panel--side-right.app-drawer__panel--size-lg,.app-drawer__panel--side-left.app-drawer__panel--size-lg{width:min(32rem,90vw)}.app-drawer__panel--side-bottom.app-drawer__panel--size-sm{min-height:12rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-md{min-height:16rem}.app-drawer__panel--side-bottom.app-drawer__panel--size-lg{min-height:22rem}@keyframes app-drawer-slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-left{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes app-drawer-slide-in-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}.app-drawer__header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;border-bottom:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));flex:0 0 auto}.app-drawer__title{margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3;flex:1;min-width:0}.app-drawer__close{flex:0 0 auto;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;border:1px solid var(--app-color-border, #d4d4d4);background:var(--app-color-surface-alt, #fff);color:var(--app-color-text-secondary, #5a7fa3);cursor:pointer;margin:0;padding:0}.app-drawer__close:hover{background:var(--app-color-hover-bg, rgba(43, 127, 217, .08))}.app-drawer__close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}.app-drawer__close-x{font-size:1.35rem;line-height:1}.app-drawer__body{flex:1 1 auto;min-height:0;overflow:auto;padding:1rem;color:var(--app-color-text-primary, #1a2f45);font-size:.9rem;line-height:1.5}.app-drawer__body ::ng-deep app-sidebar .app-sidebar{border-right:0}.app-drawer__body ::ng-deep app-sidebar .app-sidebar__toolbar{display:none}.app-drawer__footer{flex:0 0 auto;padding:.75rem 1rem 1rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.app-drawer__footer:empty{display:none;padding:0;border:none}@media(prefers-reduced-motion:reduce){.app-drawer__backdrop{animation:none}}\n"] }]
         }], propDecorators: { open: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -8924,6 +9054,7 @@ class AppSidebarComponent {
     }
     constructor() {
         this.theme = inject(AppThemeService);
+        this.cdr = inject(ChangeDetectorRef);
         this.destroyRef = inject(DestroyRef);
         this.menuId = 'app-shell-sidebar';
         /** Sincronizar com o item de navegação activo (realce persistente). */
@@ -8940,6 +9071,9 @@ class AppSidebarComponent {
         this.destroyRef.onDestroy(() => this.clearListRevealTimeout());
     }
     ngOnChanges(changes) {
+        if (changes['selectedItemId'] || changes['items']) {
+            this.cdr.markForCheck();
+        }
         const collapsedCh = changes['collapsed'];
         if (!collapsedCh) {
             return;