structra-ui 0.2.26 → 0.2.27

package/fesm2022/structra-ui.mjs

@@ -9733,14 +9733,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\r\n      class=\"app-drawer__header\"\r\n      [class.app-drawer__header--no-title]=\"!drawerHeading.trim()\"\r\n    >\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:center;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;flex:0 0 auto}.app-drawer__header--no-title{justify-content:flex-end;padding-top:.65rem;padding-bottom:.65rem}.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:2.35rem;height:2.35rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:none;background:color-mix(in srgb,var(--app-color-text-primary) 6%,transparent);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;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-drawer__body::-webkit-scrollbar{width:4px;height:4px}.app-drawer__body::-webkit-scrollbar-track{background:transparent}.app-drawer__body::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-drawer__body::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}.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 }); }
+    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\r\n      class=\"app-drawer__header\"\r\n      [class.app-drawer__header--no-title]=\"!drawerHeading.trim()\"\r\n    >\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}.app-drawer__panel:has(.app-drawer__body app-sidebar) .app-drawer__header.app-drawer__header--no-title{position:absolute;z-index:2;inset:.38rem .38rem auto auto;width:auto;max-width:none;padding:0;margin:0;pointer-events:none;flex:0 0 auto}.app-drawer__panel:has(.app-drawer__body app-sidebar) .app-drawer__header.app-drawer__header--no-title .app-drawer__close{pointer-events:auto}.app-drawer__panel:has(.app-drawer__body app-sidebar) .app-drawer__body ::ng-deep app-sidebar .app-sidebar__head[data-app-sidebar-head]{padding-inline-end:2.35rem!important;padding-inline-start:.3rem!important;box-sizing:border-box}@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:center;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;flex:0 0 auto}.app-drawer__header--no-title{justify-content:flex-end;padding-top:.65rem;padding-bottom:.65rem}.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:2.35rem;height:2.35rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:none;background:color-mix(in srgb,var(--app-color-text-primary) 6%,transparent);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;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-drawer__body::-webkit-scrollbar{width:4px;height:4px}.app-drawer__body::-webkit-scrollbar-track{background:transparent}.app-drawer__body::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-drawer__body::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}.app-drawer__body:has(app-sidebar){padding:.35rem .12rem .45rem}.app-drawer__body ::ng-deep app-sidebar .app-sidebar{border-right:0;padding:.38rem .1rem .45rem}.app-drawer__body ::ng-deep app-sidebar .app-sidebar__toolbar app-shell-sidebar-toggle{display:none!important}.app-drawer__body ::ng-deep app-sidebar app-menu-list .menu-list__option{margin-left:.12rem;margin-right:.12rem;padding:.42rem .32rem}.app-drawer__body ::ng-deep app-sidebar app-menu-list .menu-list__submenu-chevron{padding-left:.18rem}.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\r\n      class=\"app-drawer__header\"\r\n      [class.app-drawer__header--no-title]=\"!drawerHeading.trim()\"\r\n    >\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:center;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;flex:0 0 auto}.app-drawer__header--no-title{justify-content:flex-end;padding-top:.65rem;padding-bottom:.65rem}.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:2.35rem;height:2.35rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:none;background:color-mix(in srgb,var(--app-color-text-primary) 6%,transparent);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;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-drawer__body::-webkit-scrollbar{width:4px;height:4px}.app-drawer__body::-webkit-scrollbar-track{background:transparent}.app-drawer__body::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-drawer__body::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}.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"] }]
+                    }, 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\r\n      class=\"app-drawer__header\"\r\n      [class.app-drawer__header--no-title]=\"!drawerHeading.trim()\"\r\n    >\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}.app-drawer__panel:has(.app-drawer__body app-sidebar) .app-drawer__header.app-drawer__header--no-title{position:absolute;z-index:2;inset:.38rem .38rem auto auto;width:auto;max-width:none;padding:0;margin:0;pointer-events:none;flex:0 0 auto}.app-drawer__panel:has(.app-drawer__body app-sidebar) .app-drawer__header.app-drawer__header--no-title .app-drawer__close{pointer-events:auto}.app-drawer__panel:has(.app-drawer__body app-sidebar) .app-drawer__body ::ng-deep app-sidebar .app-sidebar__head[data-app-sidebar-head]{padding-inline-end:2.35rem!important;padding-inline-start:.3rem!important;box-sizing:border-box}@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:center;justify-content:space-between;gap:.75rem;padding:1rem 1rem .75rem;flex:0 0 auto}.app-drawer__header--no-title{justify-content:flex-end;padding-top:.65rem;padding-bottom:.65rem}.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:2.35rem;height:2.35rem;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:none;background:color-mix(in srgb,var(--app-color-text-primary) 6%,transparent);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;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-drawer__body::-webkit-scrollbar{width:4px;height:4px}.app-drawer__body::-webkit-scrollbar-track{background:transparent}.app-drawer__body::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-drawer__body::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}.app-drawer__body:has(app-sidebar){padding:.35rem .12rem .45rem}.app-drawer__body ::ng-deep app-sidebar .app-sidebar{border-right:0;padding:.38rem .1rem .45rem}.app-drawer__body ::ng-deep app-sidebar .app-sidebar__toolbar app-shell-sidebar-toggle{display:none!important}.app-drawer__body ::ng-deep app-sidebar app-menu-list .menu-list__option{margin-left:.12rem;margin-right:.12rem;padding:.42rem .32rem}.app-drawer__body ::ng-deep app-sidebar app-menu-list .menu-list__submenu-chevron{padding-left:.18rem}.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"] }]
         }], ctorParameters: () => [], propDecorators: { open: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -10504,7 +10504,13 @@ class AppSidebarComponent {
         }
         const brand = root.querySelector('.app-sidebar__brand');
         if (brand) {
-            brand.style.setProperty('display', 'flex', 'important');
+            /** Colapsado: não forçar `display:flex` — isso anulava o `display:none` do modo rail no SCSS. */
+            if (this.collapsed) {
+                brand.style.setProperty('display', 'none', 'important');
+            }
+            else {
+                brand.style.setProperty('display', 'flex', 'important');
+            }
             brand.style.setProperty('text-align', 'start', 'important');
             brand.style.setProperty('justify-content', 'flex-start', 'important');
             brand.style.setProperty('align-items', 'center', 'important');
@@ -10521,11 +10527,11 @@ class AppSidebarComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AppSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: AppSidebarComponent, isStandalone: true, selector: "app-sidebar", inputs: { appTheme: { classPropertyName: "appTheme", publicName: "appTheme", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: true, transformFunction: null }, menuId: { classPropertyName: "menuId", publicName: "menuId", isSignal: false, isRequired: false, transformFunction: null }, selectedItemId: { classPropertyName: "selectedItemId", publicName: "selectedItemId", isSignal: false, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, outputs: { itemSelect: "itemSelect" }, usesOnChanges: true, ngImport: i0, template: "<nav class=\"app-sidebar app-nav-surface\" [class.app-sidebar--collapsed]=\"collapsed\"\r\n  [attr.aria-label]=\"'Navega\u00E7\u00E3o principal'\">\r\n  <div class=\"app-sidebar__head\" data-app-sidebar-head=\"\" translate=\"no\">\r\n    <div class=\"app-sidebar__brand\"><ng-content select=\"[appSidebarBrand]\" /></div>\r\n    <div class=\"app-sidebar__toolbar\"><ng-content select=\"[appSidebarToolbar]\" /></div>\r\n  </div>\r\n  <app-menu-list\r\n    class=\"app-sidebar__list\"\r\n    [appTheme]=\"appTheme()\"\r\n    [items]=\"items\"\r\n    [menuId]=\"menuId\"\r\n    [dense]=\"collapsed\"\r\n    [compressText]=\"listCompressText()\"\r\n    [selectedItemId]=\"selectedItemId\"\r\n    (itemSelect)=\"itemSelect.emit($event)\"\r\n  />\r\n</nav>\r\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;flex:1 1 auto;align-self:stretch;min-width:0;min-height:0;box-sizing:border-box}.app-sidebar{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:.65rem .35rem .65rem .5rem;background:var(--app-color-nav-shell-bg);border-right:1px solid var(--app-color-nav-border-subtle)}.app-sidebar--collapsed{padding-left:.5rem;padding-right:.35rem}.app-sidebar__head[data-app-sidebar-head]{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.35rem;width:100%;min-height:2.35rem;padding:0 .1rem .4rem;padding-inline-start:.75rem!important;box-sizing:border-box;contain:layout;direction:ltr;unicode-bidi:isolate;flex-direction:row!important;justify-content:flex-start!important;direction:ltr!important}.app-sidebar--collapsed .app-sidebar__head[data-app-sidebar-head]{justify-content:center!important;padding-inline-start:.25rem!important;padding-inline-end:.25rem;gap:0}.app-sidebar__brand{order:0;flex:1 1 auto;min-width:0;align-self:center;display:flex;justify-content:flex-start;align-items:center;padding:0;box-sizing:border-box;font-size:.95rem;font-weight:700;line-height:1.25;color:var(--app-color-text-primary, #1a2f45);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start!important}.app-sidebar__brand>*{text-align:inherit!important;margin-inline:0!important;padding-inline-start:0!important;padding-inline-end:0!important;box-sizing:border-box;min-width:0}.app-sidebar__brand:empty{display:none}.app-sidebar--collapsed .app-sidebar__brand:not(:empty){display:none}.app-sidebar__toolbar{order:1;flex:0 0 auto;flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;align-self:center;min-width:0;padding:0;box-sizing:border-box;margin-inline-start:auto!important}.app-sidebar__toolbar:empty{display:none}.app-sidebar--collapsed .app-sidebar__toolbar:not(:empty){margin-inline-start:0!important}.app-sidebar__list{flex:1 1 auto;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-sidebar__list::-webkit-scrollbar{width:4px;height:4px}.app-sidebar__list::-webkit-scrollbar-track{background:transparent}.app-sidebar__list::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-sidebar__list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}\n"], dependencies: [{ kind: "component", type: MenuListComponent, selector: "app-menu-list", inputs: ["appTheme", "items", "menuId", "dense", "nested", "selectedItemId", "compressText"], outputs: ["itemSelect", "closeRequest", "submenuBack"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: AppSidebarComponent, isStandalone: true, selector: "app-sidebar", inputs: { appTheme: { classPropertyName: "appTheme", publicName: "appTheme", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: true, transformFunction: null }, menuId: { classPropertyName: "menuId", publicName: "menuId", isSignal: false, isRequired: false, transformFunction: null }, selectedItemId: { classPropertyName: "selectedItemId", publicName: "selectedItemId", isSignal: false, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, outputs: { itemSelect: "itemSelect" }, usesOnChanges: true, ngImport: i0, template: "<nav class=\"app-sidebar app-nav-surface\" [class.app-sidebar--collapsed]=\"collapsed\"\r\n  [attr.aria-label]=\"'Navega\u00E7\u00E3o principal'\">\r\n  <div class=\"app-sidebar__head\" data-app-sidebar-head=\"\" translate=\"no\">\r\n    <div class=\"app-sidebar__brand\"><ng-content select=\"[appSidebarBrand]\" /></div>\r\n    <div class=\"app-sidebar__toolbar\"><ng-content select=\"[appSidebarToolbar]\" /></div>\r\n  </div>\r\n  <app-menu-list\r\n    class=\"app-sidebar__list\"\r\n    [appTheme]=\"appTheme()\"\r\n    [items]=\"items\"\r\n    [menuId]=\"menuId\"\r\n    [dense]=\"collapsed\"\r\n    [compressText]=\"listCompressText()\"\r\n    [selectedItemId]=\"selectedItemId\"\r\n    (itemSelect)=\"itemSelect.emit($event)\"\r\n  />\r\n</nav>\r\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;flex:1 1 auto;align-self:stretch;min-width:0;min-height:0;box-sizing:border-box}.app-sidebar{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:.65rem .35rem .65rem .5rem;background:var(--app-color-nav-shell-bg);border-right:1px solid var(--app-color-nav-border-subtle)}.app-sidebar--collapsed{padding-left:.5rem;padding-right:.35rem}.app-sidebar__head[data-app-sidebar-head]{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.35rem;width:100%;min-height:2.35rem;padding:0 .1rem .4rem;padding-inline-start:.75rem!important;box-sizing:border-box;contain:layout;direction:ltr;unicode-bidi:isolate;flex-direction:row!important;justify-content:flex-start!important;direction:ltr!important}.app-sidebar--collapsed .app-sidebar__head[data-app-sidebar-head]{justify-content:center!important;padding-inline-start:.25rem!important;padding-inline-end:.25rem;gap:0}.app-sidebar__brand{order:0;flex:1 1 auto;min-width:0;align-self:center;display:flex;justify-content:flex-start;align-items:center;padding:0;box-sizing:border-box;font-size:.95rem;font-weight:700;line-height:1.25;color:var(--app-color-text-primary, #1a2f45);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start!important}.app-sidebar__brand>*{text-align:inherit!important;margin-inline:0!important;padding-inline-start:0!important;padding-inline-end:0!important;box-sizing:border-box;min-width:0}.app-sidebar__brand:empty{display:none}.app-sidebar--collapsed .app-sidebar__brand:not(:empty){display:none}.app-sidebar__toolbar{order:1;flex:0 0 auto;flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;align-self:center;min-width:0;padding:0;box-sizing:border-box;margin-inline-start:auto!important}.app-sidebar__toolbar:empty{display:none}.app-sidebar--collapsed .app-sidebar__toolbar:not(:empty){margin-inline-start:0!important}.app-sidebar--collapsed .app-sidebar__toolbar ::ng-deep [appSidebarToolbar]:not(app-shell-sidebar-toggle)>:not(app-shell-sidebar-toggle){display:none!important}.app-sidebar__list{flex:1 1 auto;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-sidebar__list::-webkit-scrollbar{width:4px;height:4px}.app-sidebar__list::-webkit-scrollbar-track{background:transparent}.app-sidebar__list::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-sidebar__list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}\n"], dependencies: [{ kind: "component", type: MenuListComponent, selector: "app-menu-list", inputs: ["appTheme", "items", "menuId", "dense", "nested", "selectedItemId", "compressText"], outputs: ["itemSelect", "closeRequest", "submenuBack"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AppSidebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-sidebar', imports: [MenuListComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"app-sidebar app-nav-surface\" [class.app-sidebar--collapsed]=\"collapsed\"\r\n  [attr.aria-label]=\"'Navega\u00E7\u00E3o principal'\">\r\n  <div class=\"app-sidebar__head\" data-app-sidebar-head=\"\" translate=\"no\">\r\n    <div class=\"app-sidebar__brand\"><ng-content select=\"[appSidebarBrand]\" /></div>\r\n    <div class=\"app-sidebar__toolbar\"><ng-content select=\"[appSidebarToolbar]\" /></div>\r\n  </div>\r\n  <app-menu-list\r\n    class=\"app-sidebar__list\"\r\n    [appTheme]=\"appTheme()\"\r\n    [items]=\"items\"\r\n    [menuId]=\"menuId\"\r\n    [dense]=\"collapsed\"\r\n    [compressText]=\"listCompressText()\"\r\n    [selectedItemId]=\"selectedItemId\"\r\n    (itemSelect)=\"itemSelect.emit($event)\"\r\n  />\r\n</nav>\r\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;flex:1 1 auto;align-self:stretch;min-width:0;min-height:0;box-sizing:border-box}.app-sidebar{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:.65rem .35rem .65rem .5rem;background:var(--app-color-nav-shell-bg);border-right:1px solid var(--app-color-nav-border-subtle)}.app-sidebar--collapsed{padding-left:.5rem;padding-right:.35rem}.app-sidebar__head[data-app-sidebar-head]{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.35rem;width:100%;min-height:2.35rem;padding:0 .1rem .4rem;padding-inline-start:.75rem!important;box-sizing:border-box;contain:layout;direction:ltr;unicode-bidi:isolate;flex-direction:row!important;justify-content:flex-start!important;direction:ltr!important}.app-sidebar--collapsed .app-sidebar__head[data-app-sidebar-head]{justify-content:center!important;padding-inline-start:.25rem!important;padding-inline-end:.25rem;gap:0}.app-sidebar__brand{order:0;flex:1 1 auto;min-width:0;align-self:center;display:flex;justify-content:flex-start;align-items:center;padding:0;box-sizing:border-box;font-size:.95rem;font-weight:700;line-height:1.25;color:var(--app-color-text-primary, #1a2f45);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start!important}.app-sidebar__brand>*{text-align:inherit!important;margin-inline:0!important;padding-inline-start:0!important;padding-inline-end:0!important;box-sizing:border-box;min-width:0}.app-sidebar__brand:empty{display:none}.app-sidebar--collapsed .app-sidebar__brand:not(:empty){display:none}.app-sidebar__toolbar{order:1;flex:0 0 auto;flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;align-self:center;min-width:0;padding:0;box-sizing:border-box;margin-inline-start:auto!important}.app-sidebar__toolbar:empty{display:none}.app-sidebar--collapsed .app-sidebar__toolbar:not(:empty){margin-inline-start:0!important}.app-sidebar__list{flex:1 1 auto;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-sidebar__list::-webkit-scrollbar{width:4px;height:4px}.app-sidebar__list::-webkit-scrollbar-track{background:transparent}.app-sidebar__list::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-sidebar__list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}\n"] }]
+            args: [{ selector: 'app-sidebar', imports: [MenuListComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"app-sidebar app-nav-surface\" [class.app-sidebar--collapsed]=\"collapsed\"\r\n  [attr.aria-label]=\"'Navega\u00E7\u00E3o principal'\">\r\n  <div class=\"app-sidebar__head\" data-app-sidebar-head=\"\" translate=\"no\">\r\n    <div class=\"app-sidebar__brand\"><ng-content select=\"[appSidebarBrand]\" /></div>\r\n    <div class=\"app-sidebar__toolbar\"><ng-content select=\"[appSidebarToolbar]\" /></div>\r\n  </div>\r\n  <app-menu-list\r\n    class=\"app-sidebar__list\"\r\n    [appTheme]=\"appTheme()\"\r\n    [items]=\"items\"\r\n    [menuId]=\"menuId\"\r\n    [dense]=\"collapsed\"\r\n    [compressText]=\"listCompressText()\"\r\n    [selectedItemId]=\"selectedItemId\"\r\n    (itemSelect)=\"itemSelect.emit($event)\"\r\n  />\r\n</nav>\r\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;flex:1 1 auto;align-self:stretch;min-width:0;min-height:0;box-sizing:border-box}.app-sidebar{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:.65rem .35rem .65rem .5rem;background:var(--app-color-nav-shell-bg);border-right:1px solid var(--app-color-nav-border-subtle)}.app-sidebar--collapsed{padding-left:.5rem;padding-right:.35rem}.app-sidebar__head[data-app-sidebar-head]{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.35rem;width:100%;min-height:2.35rem;padding:0 .1rem .4rem;padding-inline-start:.75rem!important;box-sizing:border-box;contain:layout;direction:ltr;unicode-bidi:isolate;flex-direction:row!important;justify-content:flex-start!important;direction:ltr!important}.app-sidebar--collapsed .app-sidebar__head[data-app-sidebar-head]{justify-content:center!important;padding-inline-start:.25rem!important;padding-inline-end:.25rem;gap:0}.app-sidebar__brand{order:0;flex:1 1 auto;min-width:0;align-self:center;display:flex;justify-content:flex-start;align-items:center;padding:0;box-sizing:border-box;font-size:.95rem;font-weight:700;line-height:1.25;color:var(--app-color-text-primary, #1a2f45);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start!important}.app-sidebar__brand>*{text-align:inherit!important;margin-inline:0!important;padding-inline-start:0!important;padding-inline-end:0!important;box-sizing:border-box;min-width:0}.app-sidebar__brand:empty{display:none}.app-sidebar--collapsed .app-sidebar__brand:not(:empty){display:none}.app-sidebar__toolbar{order:1;flex:0 0 auto;flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;align-self:center;min-width:0;padding:0;box-sizing:border-box;margin-inline-start:auto!important}.app-sidebar__toolbar:empty{display:none}.app-sidebar--collapsed .app-sidebar__toolbar:not(:empty){margin-inline-start:0!important}.app-sidebar--collapsed .app-sidebar__toolbar ::ng-deep [appSidebarToolbar]:not(app-shell-sidebar-toggle)>:not(app-shell-sidebar-toggle){display:none!important}.app-sidebar__list{flex:1 1 auto;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 34%,transparent) transparent}.app-sidebar__list::-webkit-scrollbar{width:4px;height:4px}.app-sidebar__list::-webkit-scrollbar-track{background:transparent}.app-sidebar__list::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 40%,transparent)}.app-sidebar__list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--app-color-text-primary, #1a2f45) 55%,transparent)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { appTheme: [{ type: i0.Input, args: [{ isSignal: true, alias: "appTheme", required: false }] }], items: [{
                 type: Input,
                 args: [{ required: true }]
@@ -10541,10 +10547,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             }] } });
 
 /**
- * Marca conteúdo a projectar no topo da sidebar (ex.: botão recolher/expandir).
+ * Marca **só** o botão recolher/expandir no topo da sidebar (slot direito).
+ * O **título/marca** deve usar `[appSidebarBrand]` como irmão — não envolver título + toggle num único
+ * `[appSidebarToolbar]`: no drawer mobile do `app-shell` isso pode esconder o título ou criar layout estranho.
  *
  * ```html
  * <app-sidebar [items]="nav">
+ *   <span appSidebarBrand>Minha aplicação</span>
  *   <app-shell-sidebar-toggle appSidebarToolbar [collapsed]="collapsed" (toggle)="onToggle()" />
  * </app-sidebar>
  * ```
@@ -10565,9 +10574,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  * Marca o título no topo da lateral: **na mesma linha** que o botão recolher (à esquerda);
  * oculto no modo rail (só ícones).
  *
- * **Importante:** não coloque `[appSidebarBrand]` num único `div` que também envolva o botão com classes
- * tipo Tailwind (`flex`, `justify-between`): use **dois projectados irmãos** (marca + `[appSidebarToolbar]`).
- * Caso contrário a linha inteira fica só dentro da zona da marca e o alinhamento à esquerda pode falhar no host da app.
+ * **Importante:** o título **tem** de usar `[appSidebarBrand]` no próprio nó de texto (ou wrapper só da marca).
+ * Não dependa só de um `span` dentro de um `div [appSidebarToolbar]` — em mobile o drawer só oculta o toggle,
+ * mas o padrão correcto é marca + toolbar como **irmãos** projectados (evita cabeçalho vazio se o CSS do host mudar).
  *
  * ```html
  * <app-sidebar [items]="nav">
@@ -10627,11 +10636,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  */
 class AppTopbarComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AppTopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: AppTopbarComponent, isStandalone: true, selector: "app-topbar", ngImport: i0, template: "<div class=\"app-topbar\" role=\"banner\">\r\n  <div class=\"app-topbar__start\">\r\n    <ng-content select=\"[appTopbarStart]\" />\r\n  </div>\r\n  <div class=\"app-topbar__title\">\r\n    <ng-content select=\"[appTopbarTitle]\" />\r\n  </div>\r\n  <div class=\"app-topbar__end\">\r\n    <ng-content select=\"[appTopbarEnd]\" />\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.app-topbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;min-height:3.25rem;padding:.5rem .85rem;box-sizing:border-box;background:var(--app-color-surface, #fff);border-bottom:1px solid var(--app-color-chrome-divider, color-mix(in srgb, var(--app-color-primary) 32%, #ffffff 68%));box-shadow:0 1px 2px var(--app-color-shell-shadow, rgba(26, 47, 69, .05))}.app-topbar__start,.app-topbar__end{display:flex;flex:0 0 auto;align-items:center;gap:.5rem;min-width:0}.app-topbar__title{flex:1 1 auto;min-width:0;margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3}@media(max-width:767.98px){.app-topbar{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;align-items:center;column-gap:.5rem;row-gap:.35rem;min-height:auto;padding:.45rem .65rem .55rem}.app-topbar__start{grid-column:1;grid-row:1}.app-topbar__end{grid-column:3;grid-row:1;justify-self:end}.app-topbar__title{grid-column:1/-1;grid-row:2;flex:unset;font-size:.98rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: AppTopbarComponent, isStandalone: true, selector: "app-topbar", ngImport: i0, template: "<div class=\"app-topbar\" role=\"banner\">\r\n  <div class=\"app-topbar__start\">\r\n    <ng-content select=\"[appTopbarStart]\" />\r\n  </div>\r\n  <div class=\"app-topbar__title\">\r\n    <ng-content select=\"[appTopbarTitle]\" />\r\n  </div>\r\n  <div class=\"app-topbar__end\">\r\n    <ng-content select=\"[appTopbarEnd]\" />\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.app-topbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;min-height:3.25rem;padding:.5rem .85rem;box-sizing:border-box;background:var(--app-color-surface, #fff);border-bottom:1px solid var(--app-color-nav-border-subtle, color-mix(in srgb, var(--app-color-primary) 18%, #ffffff));box-shadow:0 1px 2px var(--app-color-shell-shadow, rgba(26, 47, 69, .05))}.app-topbar__start,.app-topbar__end{display:flex;flex:0 0 auto;align-items:center;gap:.5rem;min-width:0}.app-topbar__title{flex:1 1 auto;min-width:0;margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3}@media(max-width:767.98px){.app-topbar{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;align-items:center;column-gap:.5rem;row-gap:.35rem;min-height:auto;padding:.45rem .65rem .55rem}.app-topbar__start{grid-column:1;grid-row:1}.app-topbar__end{grid-column:3;grid-row:1;justify-self:end}.app-topbar__title{grid-column:1/-1;grid-row:2;flex:unset;font-size:.98rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AppTopbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-topbar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"app-topbar\" role=\"banner\">\r\n  <div class=\"app-topbar__start\">\r\n    <ng-content select=\"[appTopbarStart]\" />\r\n  </div>\r\n  <div class=\"app-topbar__title\">\r\n    <ng-content select=\"[appTopbarTitle]\" />\r\n  </div>\r\n  <div class=\"app-topbar__end\">\r\n    <ng-content select=\"[appTopbarEnd]\" />\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.app-topbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;min-height:3.25rem;padding:.5rem .85rem;box-sizing:border-box;background:var(--app-color-surface, #fff);border-bottom:1px solid var(--app-color-chrome-divider, color-mix(in srgb, var(--app-color-primary) 32%, #ffffff 68%));box-shadow:0 1px 2px var(--app-color-shell-shadow, rgba(26, 47, 69, .05))}.app-topbar__start,.app-topbar__end{display:flex;flex:0 0 auto;align-items:center;gap:.5rem;min-width:0}.app-topbar__title{flex:1 1 auto;min-width:0;margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3}@media(max-width:767.98px){.app-topbar{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;align-items:center;column-gap:.5rem;row-gap:.35rem;min-height:auto;padding:.45rem .65rem .55rem}.app-topbar__start{grid-column:1;grid-row:1}.app-topbar__end{grid-column:3;grid-row:1;justify-self:end}.app-topbar__title{grid-column:1/-1;grid-row:2;flex:unset;font-size:.98rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}\n"] }]
+            args: [{ selector: 'app-topbar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"app-topbar\" role=\"banner\">\r\n  <div class=\"app-topbar__start\">\r\n    <ng-content select=\"[appTopbarStart]\" />\r\n  </div>\r\n  <div class=\"app-topbar__title\">\r\n    <ng-content select=\"[appTopbarTitle]\" />\r\n  </div>\r\n  <div class=\"app-topbar__end\">\r\n    <ng-content select=\"[appTopbarEnd]\" />\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.app-topbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;min-height:3.25rem;padding:.5rem .85rem;box-sizing:border-box;background:var(--app-color-surface, #fff);border-bottom:1px solid var(--app-color-nav-border-subtle, color-mix(in srgb, var(--app-color-primary) 18%, #ffffff));box-shadow:0 1px 2px var(--app-color-shell-shadow, rgba(26, 47, 69, .05))}.app-topbar__start,.app-topbar__end{display:flex;flex:0 0 auto;align-items:center;gap:.5rem;min-width:0}.app-topbar__title{flex:1 1 auto;min-width:0;margin:0;font-size:1.05rem;font-weight:600;color:var(--app-color-text-primary, #1a2f45);line-height:1.3}@media(max-width:767.98px){.app-topbar{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;align-items:center;column-gap:.5rem;row-gap:.35rem;min-height:auto;padding:.45rem .65rem .55rem}.app-topbar__start{grid-column:1;grid-row:1}.app-topbar__end{grid-column:3;grid-row:1;justify-self:end}.app-topbar__title{grid-column:1/-1;grid-row:2;flex:unset;font-size:.98rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}\n"] }]
         }] });
 
 /**