@seniorsistemas/angular-components 19.8.0 → 19.9.0

package/fesm2022/seniorsistemas-angular-components-side-sheet.mjs

@@ -0,0 +1,257 @@
+import { NgTemplateOutlet } from '@angular/common';
+import { trigger, transition, style, animate } from '@angular/animations';
+import { CdkTrapFocus } from '@angular/cdk/a11y';
+import * as i0 from '@angular/core';
+import { signal, inject, isDevMode, Injectable, viewChild, computed, DestroyRef, effect, untracked, Component } from '@angular/core';
+import { randomHash, disableScroll, enableScroll } from '@seniorsistemas/angular-components/utils';
+import { Router, NavigationStart } from '@angular/router';
+import { filter } from 'rxjs';
+
+/**
+ * @description Controla remotamente a única instância de `s-side-sheet` da aplicação —
+ * declarada uma vez no shell do app (ex: em `app.component.html`, logo abaixo da topbar), sem
+ * nenhum input — a partir de qualquer componente de rota.
+ *
+ * O componente que solicita a abertura declara seu próprio `<ng-template>` e passa o
+ * `TemplateRef` correspondente; o `s-side-sheet` do shell projeta esse template internamente.
+ * Fecha automaticamente a cada navegação de rota — tanto por UX (não deixar conteúdo de uma
+ * página antiga empurrando uma página nova) quanto por segurança técnica (o `TemplateRef`
+ * pertence a um componente que a navegação pode destruir).
+ *
+ * @example
+ * ```typescript
+ * private readonly sideSheetService = inject(SideSheetService);
+ * private readonly panelBody = viewChild<TemplateRef<unknown>>('panelBody');
+ *
+ * protected selectOrder(order: Order): void {
+ *     this.sideSheetService.open({ header: order.number, template: this.panelBody()! });
+ * }
+ * ```
+ */
+class SideSheetService {
+    _header = signal('');
+    _template = signal(null);
+    _context = signal(undefined);
+    _size = signal('default');
+    _mountedInstanceCount = 0;
+    /** @description Visibilidade do painel. Controlada internamente pelo `s-side-sheet`. */
+    visible = signal(false);
+    header = this._header.asReadonly();
+    template = this._template.asReadonly();
+    context = this._context.asReadonly();
+    size = this._size.asReadonly();
+    constructor() {
+        const router = inject(Router, { optional: true });
+        router?.events.pipe(filter((event) => event instanceof NavigationStart)).subscribe(() => this.close());
+    }
+    /** @description Abre (ou atualiza, se já aberto) o painel com o cabeçalho e o template informados. */
+    open(config) {
+        if (this._mountedInstanceCount === 0 && isDevMode()) {
+            console.warn('[SideSheetService] open() foi chamado, mas nenhum <s-side-sheet> está montado ' +
+                'no shell do app. Declare um em app.component.html.');
+        }
+        this._header.set(config.header);
+        this._template.set(config.template);
+        this._context.set(config.context);
+        this._size.set(config.size ?? 'default');
+        this.visible.set(true);
+    }
+    /** @description Fecha o painel e limpa o cabeçalho, template, contexto e tamanho armazenados. */
+    close() {
+        this.visible.set(false);
+        this._header.set('');
+        this._template.set(null);
+        this._context.set(undefined);
+        this._size.set('default');
+    }
+    /** @internal Chamado por SideSheetComponent ao ser criado. */
+    _registerInstance() {
+        if (this._mountedInstanceCount > 0 && isDevMode()) {
+            throw new Error('[SideSheetComponent] Já existe uma instância montada nesta aplicação. ' +
+                'Declare <s-side-sheet> uma única vez, no ponto mais alto da árvore ' +
+                '(ex: app.component.html).');
+        }
+        this._mountedInstanceCount++;
+    }
+    /** @internal Chamado por SideSheetComponent ao ser destruído. */
+    _unregisterInstance() {
+        this._mountedInstanceCount = Math.max(0, this._mountedInstanceCount - 1);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SideSheetService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SideSheetService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SideSheetService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [] });
+
+/** Mantida em sincronia com o breakpoint `[@media(min-width:1024px)]` usado no template e em `panelWidthClasses`. */
+const OVERLAY_QUERY = '(min-width: 1024px)';
+/**
+ * @description Painel que empurra o conteúdo adjacente para a esquerda, dividindo o espaço
+ * horizontal com ele — sem escurecer a tela e sem sobrepor o conteúdo, no modo desktop
+ * (>= 1024px). Abaixo de 1024px o painel passa a funcionar como um overlay em tela cheia,
+ * com fundo escurecido, igual a um Drawer.
+ *
+ * Fecha somente pelo botão de fechar (X) do cabeçalho — não há fechamento por tecla Escape
+ * ou clique fora, em nenhuma resolução. Essa é uma decisão de produto deliberada: o conteúdo
+ * por trás do painel permanece interativo (filtros, dropdowns, autocomplete) e um atalho
+ * global de Escape entraria em conflito com outros overlays já abertos sobre esse conteúdo.
+ *
+ * Sem inputs: é uma instância **única** por aplicação, declarada uma vez no shell do app (ex:
+ * `app.component.html`, logo abaixo da topbar) e controlada remotamente por
+ * `SideSheetService.open()`/`close()` a partir de qualquer componente de rota. Uma segunda
+ * instância montada simultaneamente lança um erro em modo de desenvolvimento. O conteúdo
+ * projetado dentro do `<s-side-sheet>` é o conteúdo principal da página (ex: o
+ * `router-outlet`), empurrado pelo painel quando ele abre.
+ *
+ * @example
+ * ```html
+ * <!-- app.component.html -->
+ * <s-side-sheet>
+ *   <router-outlet />
+ * </s-side-sheet>
+ * ```
+ * ```typescript
+ * // pedidos.component.ts
+ * private readonly sideSheetService = inject(SideSheetService);
+ * private readonly panelBody = viewChild<TemplateRef<unknown>>('panelBody');
+ *
+ * protected selecionarPedido(pedido: Pedido): void {
+ *     this.sideSheetService.open({ header: pedido.numero, template: this.panelBody()! });
+ * }
+ * ```
+ *
+ * @category Overlay
+ */
+class SideSheetComponent {
+    sideSheetService = inject(SideSheetService);
+    /** @description Id único usado para associar o título ao painel via `aria-labelledby`. */
+    titleId = randomHash('side-sheet-title');
+    titleRef = viewChild('titleRef');
+    isDesktopViewport = signal(this._matchesDesktop());
+    /** @description `true` quando o painel funciona como overlay em tela cheia (< 1024px). */
+    isOverlayMode = computed(() => !this.isDesktopViewport());
+    animationMode = computed(() => this.isOverlayMode() ? 'overlay' : 'push');
+    /**
+     * @description Largura do painel no modo push, por breakpoint. `half` só passa a ser
+     * fluido a partir de 1366px — entre 1024–1365px herda os mesmos 400px do `default`
+     * (conversão de "Half" para "Default" descrita na especificação de produto).
+     */
+    panelWidthClasses = computed(() => this.sideSheetService.size() === 'half'
+        ? '[@media(min-width:1024px)]:w-[400px] [@media(min-width:1366px)]:w-[max(400px,50vw)]'
+        : '[@media(min-width:1024px)]:w-[400px] [@media(min-width:1920px)]:w-[480px] [@media(min-width:2560px)]:w-[560px] [@media(min-width:3440px)]:w-[640px]');
+    _elementToRefocus = null;
+    constructor() {
+        const destroyRef = inject(DestroyRef);
+        this.sideSheetService._registerInstance();
+        destroyRef.onDestroy(() => this.sideSheetService._unregisterInstance());
+        if (typeof window !== 'undefined' && typeof window.matchMedia === 'function') {
+            const mediaQueryList = window.matchMedia(OVERLAY_QUERY);
+            const listener = (event) => this.isDesktopViewport.set(event.matches);
+            mediaQueryList.addEventListener('change', listener);
+            destroyRef.onDestroy(() => mediaQueryList.removeEventListener('change', listener));
+        }
+        effect(() => {
+            const shouldLockScroll = this.sideSheetService.visible() && this.isOverlayMode();
+            if (shouldLockScroll) {
+                disableScroll();
+            }
+            else {
+                enableScroll();
+            }
+        });
+        effect(() => {
+            if (this.sideSheetService.visible()) {
+                this._elementToRefocus = document.activeElement;
+                if (!untracked(this.isOverlayMode)) {
+                    queueMicrotask(() => this.titleRef()?.nativeElement.focus());
+                }
+            }
+            else {
+                this._elementToRefocus?.focus();
+                this._elementToRefocus = null;
+            }
+        });
+        destroyRef.onDestroy(() => enableScroll());
+    }
+    closeSideSheet() {
+        this.sideSheetService.close();
+    }
+    _matchesDesktop() {
+        return typeof window !== 'undefined' && typeof window.matchMedia === 'function'
+            ? window.matchMedia(OVERLAY_QUERY).matches
+            : true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SideSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SideSheetComponent, isStandalone: true, selector: "s-side-sheet", host: { classAttribute: "block h-full w-full flex-1 min-h-0" }, viewQueries: [{ propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"side-sheet relative flex h-full w-full\">\n    <div class=\"side-sheet__content min-w-0 flex-1 overflow-auto\">\n        <ng-content></ng-content>\n    </div>\n\n    @if (sideSheetService.visible()) {\n        @if (isOverlayMode()) {\n            <div class=\"side-sheet__backdrop absolute inset-0 z-20 bg-[rgba(0,0,0,0.5)]\" @backdropVisibility></div>\n        }\n\n        <aside\n            cdkTrapFocus\n            [cdkTrapFocusAutoCapture]=\"isOverlayMode()\"\n            [@panelVisibility]=\"animationMode()\"\n            class=\"side-sheet__panel z-30 flex flex-col gap-4 border-l border-grayscale-20 bg-grayscale-0 p-4 shadow-[0px_2px_4px_rgba(0,0,0,0.2),0px_1px_10px_rgba(0,0,0,0.12),0px_4px_5px_rgba(0,0,0,0.14)] absolute inset-0 w-full [@media(min-width:1024px)]:static [@media(min-width:1024px)]:inset-auto\"\n            [class]=\"panelWidthClasses()\"\n            [class.side-sheet__panel--half]=\"sideSheetService.size() === 'half'\"\n            [attr.role]=\"isOverlayMode() ? 'dialog' : 'complementary'\"\n            [attr.aria-modal]=\"isOverlayMode() ? true : null\"\n            [attr.aria-labelledby]=\"titleId\"\n        >\n            <div class=\"side-sheet__header flex flex-col gap-3\">\n                <div class=\"flex items-center gap-4\">\n                    <h2\n                        #titleRef\n                        [id]=\"titleId\"\n                        tabindex=\"-1\"\n                        class=\"min-w-0 flex-1 break-words font-open-sans text-base font-normal uppercase text-grayscale-90 outline-none\"\n                    >\n                        {{ sideSheetService.header() }}\n                    </h2>\n                    <button\n                        type=\"button\"\n                        class=\"flex shrink-0 cursor-pointer items-center justify-center rounded-medium border-none bg-transparent p-2 outline-none focus-visible:ring-2 focus-visible:ring-primary\"\n                        aria-label=\"Fechar\"\n                        (click)=\"closeSideSheet()\"\n                    >\n                        <i class=\"fas fa-times text-xs\" aria-hidden=\"true\"></i>\n                    </button>\n                </div>\n                <hr class=\"h-px w-full border-0 bg-grayscale-20\" />\n            </div>\n\n            <div class=\"side-sheet__body min-h-0 flex-1 overflow-auto\">\n                <ng-container\n                    *ngTemplateOutlet=\"sideSheetService.template(); context: sideSheetService.context()\"\n                ></ng-container>\n            </div>\n        </aside>\n    }\n</div>\n", dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
+            trigger('panelVisibility', [
+                transition('void => push', [
+                    style({ width: 0 }),
+                    animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ width: '*' })),
+                ]),
+                transition('push => void', [
+                    style({ width: '*' }),
+                    animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ width: 0 })),
+                ]),
+                transition('void => overlay', [
+                    style({ transform: 'translateX(100%)' }),
+                    animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ transform: 'translateX(0)' })),
+                ]),
+                transition('overlay => void', [
+                    style({ transform: 'translateX(0)' }),
+                    animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ transform: 'translateX(100%)' })),
+                ]),
+                // Resize cruzando o breakpoint com o painel já aberto: não existe um tween visualmente
+                // coerente entre width:400px/static (push) e width:100%/absolute (overlay) — aplica o
+                // estado final imediatamente, sem transição residual.
+                transition('push => overlay', []),
+                transition('overlay => push', []),
+            ]),
+            trigger('backdropVisibility', [
+                transition(':enter', [style({ opacity: 0 }), animate('300ms ease', style({ opacity: 1 }))]),
+                transition(':leave', [style({ opacity: 1 }), animate('300ms ease', style({ opacity: 0 }))]),
+            ]),
+        ] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SideSheetComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 's-side-sheet', standalone: true, host: {
+                        class: 'block h-full w-full flex-1 min-h-0',
+                    }, imports: [CdkTrapFocus, NgTemplateOutlet], animations: [
+                        trigger('panelVisibility', [
+                            transition('void => push', [
+                                style({ width: 0 }),
+                                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ width: '*' })),
+                            ]),
+                            transition('push => void', [
+                                style({ width: '*' }),
+                                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ width: 0 })),
+                            ]),
+                            transition('void => overlay', [
+                                style({ transform: 'translateX(100%)' }),
+                                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ transform: 'translateX(0)' })),
+                            ]),
+                            transition('overlay => void', [
+                                style({ transform: 'translateX(0)' }),
+                                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ transform: 'translateX(100%)' })),
+                            ]),
+                            // Resize cruzando o breakpoint com o painel já aberto: não existe um tween visualmente
+                            // coerente entre width:400px/static (push) e width:100%/absolute (overlay) — aplica o
+                            // estado final imediatamente, sem transição residual.
+                            transition('push => overlay', []),
+                            transition('overlay => push', []),
+                        ]),
+                        trigger('backdropVisibility', [
+                            transition(':enter', [style({ opacity: 0 }), animate('300ms ease', style({ opacity: 1 }))]),
+                            transition(':leave', [style({ opacity: 1 }), animate('300ms ease', style({ opacity: 0 }))]),
+                        ]),
+                    ], template: "<div class=\"side-sheet relative flex h-full w-full\">\n    <div class=\"side-sheet__content min-w-0 flex-1 overflow-auto\">\n        <ng-content></ng-content>\n    </div>\n\n    @if (sideSheetService.visible()) {\n        @if (isOverlayMode()) {\n            <div class=\"side-sheet__backdrop absolute inset-0 z-20 bg-[rgba(0,0,0,0.5)]\" @backdropVisibility></div>\n        }\n\n        <aside\n            cdkTrapFocus\n            [cdkTrapFocusAutoCapture]=\"isOverlayMode()\"\n            [@panelVisibility]=\"animationMode()\"\n            class=\"side-sheet__panel z-30 flex flex-col gap-4 border-l border-grayscale-20 bg-grayscale-0 p-4 shadow-[0px_2px_4px_rgba(0,0,0,0.2),0px_1px_10px_rgba(0,0,0,0.12),0px_4px_5px_rgba(0,0,0,0.14)] absolute inset-0 w-full [@media(min-width:1024px)]:static [@media(min-width:1024px)]:inset-auto\"\n            [class]=\"panelWidthClasses()\"\n            [class.side-sheet__panel--half]=\"sideSheetService.size() === 'half'\"\n            [attr.role]=\"isOverlayMode() ? 'dialog' : 'complementary'\"\n            [attr.aria-modal]=\"isOverlayMode() ? true : null\"\n            [attr.aria-labelledby]=\"titleId\"\n        >\n            <div class=\"side-sheet__header flex flex-col gap-3\">\n                <div class=\"flex items-center gap-4\">\n                    <h2\n                        #titleRef\n                        [id]=\"titleId\"\n                        tabindex=\"-1\"\n                        class=\"min-w-0 flex-1 break-words font-open-sans text-base font-normal uppercase text-grayscale-90 outline-none\"\n                    >\n                        {{ sideSheetService.header() }}\n                    </h2>\n                    <button\n                        type=\"button\"\n                        class=\"flex shrink-0 cursor-pointer items-center justify-center rounded-medium border-none bg-transparent p-2 outline-none focus-visible:ring-2 focus-visible:ring-primary\"\n                        aria-label=\"Fechar\"\n                        (click)=\"closeSideSheet()\"\n                    >\n                        <i class=\"fas fa-times text-xs\" aria-hidden=\"true\"></i>\n                    </button>\n                </div>\n                <hr class=\"h-px w-full border-0 bg-grayscale-20\" />\n            </div>\n\n            <div class=\"side-sheet__body min-h-0 flex-1 overflow-auto\">\n                <ng-container\n                    *ngTemplateOutlet=\"sideSheetService.template(); context: sideSheetService.context()\"\n                ></ng-container>\n            </div>\n        </aside>\n    }\n</div>\n" }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SideSheetComponent, SideSheetService };
+//# sourceMappingURL=seniorsistemas-angular-components-side-sheet.mjs.map

package/fesm2022/seniorsistemas-angular-components-side-sheet.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"seniorsistemas-angular-components-side-sheet.mjs","sources":["../../projects/angular-components/side-sheet/src/lib/side-sheet/services/side-sheet.service.ts","../../projects/angular-components/side-sheet/src/lib/side-sheet/side-sheet.component.ts","../../projects/angular-components/side-sheet/src/lib/side-sheet/side-sheet.component.html","../../projects/angular-components/side-sheet/src/seniorsistemas-angular-components-side-sheet.ts"],"sourcesContent":["import { Injectable, TemplateRef, inject, isDevMode, signal } from '@angular/core';\nimport { NavigationStart, Router } from '@angular/router';\n\nimport { filter } from 'rxjs';\n\nimport { SideSheetConfig } from '../models/side-sheet-config';\nimport { SideSheetSize } from '../models/side-sheet-size';\n\n/**\n * @description Controla remotamente a única instância de `s-side-sheet` da aplicação —\n * declarada uma vez no shell do app (ex: em `app.component.html`, logo abaixo da topbar), sem\n * nenhum input — a partir de qualquer componente de rota.\n *\n * O componente que solicita a abertura declara seu próprio `<ng-template>` e passa o\n * `TemplateRef` correspondente; o `s-side-sheet` do shell projeta esse template internamente.\n * Fecha automaticamente a cada navegação de rota — tanto por UX (não deixar conteúdo de uma\n * página antiga empurrando uma página nova) quanto por segurança técnica (o `TemplateRef`\n * pertence a um componente que a navegação pode destruir).\n *\n * @example\n * ```typescript\n * private readonly sideSheetService = inject(SideSheetService);\n * private readonly panelBody = viewChild<TemplateRef<unknown>>('panelBody');\n *\n * protected selectOrder(order: Order): void {\n *     this.sideSheetService.open({ header: order.number, template: this.panelBody()! });\n * }\n * ```\n */\n@Injectable({ providedIn: 'root' })\nexport class SideSheetService {\n    private readonly _header = signal('');\n    private readonly _template = signal<TemplateRef<unknown> | null>(null);\n    private readonly _context = signal<unknown>(undefined);\n    private readonly _size = signal<SideSheetSize>('default');\n    private _mountedInstanceCount = 0;\n\n    /** @description Visibilidade do painel. Controlada internamente pelo `s-side-sheet`. */\n    public readonly visible = signal(false);\n    public readonly header = this._header.asReadonly();\n    public readonly template = this._template.asReadonly();\n    public readonly context = this._context.asReadonly();\n    public readonly size = this._size.asReadonly();\n\n    constructor() {\n        const router = inject(Router, { optional: true });\n        router?.events.pipe(filter((event) => event instanceof NavigationStart)).subscribe(() => this.close());\n    }\n\n    /** @description Abre (ou atualiza, se já aberto) o painel com o cabeçalho e o template informados. */\n    public open<T>(config: SideSheetConfig<T>): void {\n        if (this._mountedInstanceCount === 0 && isDevMode()) {\n            console.warn(\n                '[SideSheetService] open() foi chamado, mas nenhum <s-side-sheet> está montado ' +\n                    'no shell do app. Declare um em app.component.html.',\n            );\n        }\n\n        this._header.set(config.header);\n        this._template.set(config.template as TemplateRef<unknown>);\n        this._context.set(config.context);\n        this._size.set(config.size ?? 'default');\n        this.visible.set(true);\n    }\n\n    /** @description Fecha o painel e limpa o cabeçalho, template, contexto e tamanho armazenados. */\n    public close(): void {\n        this.visible.set(false);\n        this._header.set('');\n        this._template.set(null);\n        this._context.set(undefined);\n        this._size.set('default');\n    }\n\n    /** @internal Chamado por SideSheetComponent ao ser criado. */\n    public _registerInstance(): void {\n        if (this._mountedInstanceCount > 0 && isDevMode()) {\n            throw new Error(\n                '[SideSheetComponent] Já existe uma instância montada nesta aplicação. ' +\n                    'Declare <s-side-sheet> uma única vez, no ponto mais alto da árvore ' +\n                    '(ex: app.component.html).',\n            );\n        }\n        this._mountedInstanceCount++;\n    }\n\n    /** @internal Chamado por SideSheetComponent ao ser destruído. */\n    public _unregisterInstance(): void {\n        this._mountedInstanceCount = Math.max(0, this._mountedInstanceCount - 1);\n    }\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport { animate, style, transition, trigger } from '@angular/animations';\nimport { CdkTrapFocus } from '@angular/cdk/a11y';\nimport { Component, DestroyRef, ElementRef, computed, effect, inject, signal, untracked, viewChild } from '@angular/core';\nimport { disableScroll, enableScroll, randomHash } from '@seniorsistemas/angular-components/utils';\n\nimport { SideSheetService } from './services/side-sheet.service';\n\n/** Mantida em sincronia com o breakpoint `[@media(min-width:1024px)]` usado no template e em `panelWidthClasses`. */\nconst OVERLAY_QUERY = '(min-width: 1024px)';\n\n/**\n * @description Painel que empurra o conteúdo adjacente para a esquerda, dividindo o espaço\n * horizontal com ele — sem escurecer a tela e sem sobrepor o conteúdo, no modo desktop\n * (>= 1024px). Abaixo de 1024px o painel passa a funcionar como um overlay em tela cheia,\n * com fundo escurecido, igual a um Drawer.\n *\n * Fecha somente pelo botão de fechar (X) do cabeçalho — não há fechamento por tecla Escape\n * ou clique fora, em nenhuma resolução. Essa é uma decisão de produto deliberada: o conteúdo\n * por trás do painel permanece interativo (filtros, dropdowns, autocomplete) e um atalho\n * global de Escape entraria em conflito com outros overlays já abertos sobre esse conteúdo.\n *\n * Sem inputs: é uma instância **única** por aplicação, declarada uma vez no shell do app (ex:\n * `app.component.html`, logo abaixo da topbar) e controlada remotamente por\n * `SideSheetService.open()`/`close()` a partir de qualquer componente de rota. Uma segunda\n * instância montada simultaneamente lança um erro em modo de desenvolvimento. O conteúdo\n * projetado dentro do `<s-side-sheet>` é o conteúdo principal da página (ex: o\n * `router-outlet`), empurrado pelo painel quando ele abre.\n *\n * @example\n * ```html\n * <!-- app.component.html -->\n * <s-side-sheet>\n *   <router-outlet />\n * </s-side-sheet>\n * ```\n * ```typescript\n * // pedidos.component.ts\n * private readonly sideSheetService = inject(SideSheetService);\n * private readonly panelBody = viewChild<TemplateRef<unknown>>('panelBody');\n *\n * protected selecionarPedido(pedido: Pedido): void {\n *     this.sideSheetService.open({ header: pedido.numero, template: this.panelBody()! });\n * }\n * ```\n *\n * @category Overlay\n */\n@Component({\n    selector: 's-side-sheet',\n    standalone: true,\n    templateUrl: './side-sheet.component.html',\n    host: {\n        class: 'block h-full w-full flex-1 min-h-0',\n    },\n    imports: [CdkTrapFocus, NgTemplateOutlet],\n    animations: [\n        trigger('panelVisibility', [\n            transition('void => push', [\n                style({ width: 0 }),\n                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ width: '*' })),\n            ]),\n            transition('push => void', [\n                style({ width: '*' }),\n                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ width: 0 })),\n            ]),\n            transition('void => overlay', [\n                style({ transform: 'translateX(100%)' }),\n                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ transform: 'translateX(0)' })),\n            ]),\n            transition('overlay => void', [\n                style({ transform: 'translateX(0)' }),\n                animate('300ms cubic-bezier(0.4, 0, 0.2, 1)', style({ transform: 'translateX(100%)' })),\n            ]),\n            // Resize cruzando o breakpoint com o painel já aberto: não existe um tween visualmente\n            // coerente entre width:400px/static (push) e width:100%/absolute (overlay) — aplica o\n            // estado final imediatamente, sem transição residual.\n            transition('push => overlay', []),\n            transition('overlay => push', []),\n        ]),\n        trigger('backdropVisibility', [\n            transition(':enter', [style({ opacity: 0 }), animate('300ms ease', style({ opacity: 1 }))]),\n            transition(':leave', [style({ opacity: 1 }), animate('300ms ease', style({ opacity: 0 }))]),\n        ]),\n    ],\n})\nexport class SideSheetComponent {\n    protected readonly sideSheetService = inject(SideSheetService);\n\n    /** @description Id único usado para associar o título ao painel via `aria-labelledby`. */\n    protected readonly titleId = randomHash('side-sheet-title');\n\n    private readonly titleRef = viewChild<ElementRef<HTMLHeadingElement>>('titleRef');\n    private readonly isDesktopViewport = signal(this._matchesDesktop());\n\n    /** @description `true` quando o painel funciona como overlay em tela cheia (< 1024px). */\n    protected readonly isOverlayMode = computed(() => !this.isDesktopViewport());\n    protected readonly animationMode = computed<'push' | 'overlay'>(() =>\n        this.isOverlayMode() ? 'overlay' : 'push',\n    );\n\n    /**\n     * @description Largura do painel no modo push, por breakpoint. `half` só passa a ser\n     * fluido a partir de 1366px — entre 1024–1365px herda os mesmos 400px do `default`\n     * (conversão de \"Half\" para \"Default\" descrita na especificação de produto).\n     */\n    protected readonly panelWidthClasses = computed(() =>\n        this.sideSheetService.size() === 'half'\n            ? '[@media(min-width:1024px)]:w-[400px] [@media(min-width:1366px)]:w-[max(400px,50vw)]'\n            : '[@media(min-width:1024px)]:w-[400px] [@media(min-width:1920px)]:w-[480px] [@media(min-width:2560px)]:w-[560px] [@media(min-width:3440px)]:w-[640px]',\n    );\n\n    private _elementToRefocus: HTMLElement | null = null;\n\n    constructor() {\n        const destroyRef = inject(DestroyRef);\n\n        this.sideSheetService._registerInstance();\n        destroyRef.onDestroy(() => this.sideSheetService._unregisterInstance());\n\n        if (typeof window !== 'undefined' && typeof window.matchMedia === 'function') {\n            const mediaQueryList = window.matchMedia(OVERLAY_QUERY);\n            const listener = (event: MediaQueryListEvent): void => this.isDesktopViewport.set(event.matches);\n            mediaQueryList.addEventListener('change', listener);\n            destroyRef.onDestroy(() => mediaQueryList.removeEventListener('change', listener));\n        }\n\n        effect(() => {\n            const shouldLockScroll = this.sideSheetService.visible() && this.isOverlayMode();\n            if (shouldLockScroll) {\n                disableScroll();\n            } else {\n                enableScroll();\n            }\n        });\n\n        effect(() => {\n            if (this.sideSheetService.visible()) {\n                this._elementToRefocus = document.activeElement as HTMLElement | null;\n                if (!untracked(this.isOverlayMode)) {\n                    queueMicrotask(() => this.titleRef()?.nativeElement.focus());\n                }\n            } else {\n                this._elementToRefocus?.focus();\n                this._elementToRefocus = null;\n            }\n        });\n\n        destroyRef.onDestroy(() => enableScroll());\n    }\n\n    protected closeSideSheet(): void {\n        this.sideSheetService.close();\n    }\n\n    private _matchesDesktop(): boolean {\n        return typeof window !== 'undefined' && typeof window.matchMedia === 'function'\n            ? window.matchMedia(OVERLAY_QUERY).matches\n            : true;\n    }\n}\n","<div class=\"side-sheet relative flex h-full w-full\">\n    <div class=\"side-sheet__content min-w-0 flex-1 overflow-auto\">\n        <ng-content></ng-content>\n    </div>\n\n    @if (sideSheetService.visible()) {\n        @if (isOverlayMode()) {\n            <div class=\"side-sheet__backdrop absolute inset-0 z-20 bg-[rgba(0,0,0,0.5)]\" @backdropVisibility></div>\n        }\n\n        <aside\n            cdkTrapFocus\n            [cdkTrapFocusAutoCapture]=\"isOverlayMode()\"\n            [@panelVisibility]=\"animationMode()\"\n            class=\"side-sheet__panel z-30 flex flex-col gap-4 border-l border-grayscale-20 bg-grayscale-0 p-4 shadow-[0px_2px_4px_rgba(0,0,0,0.2),0px_1px_10px_rgba(0,0,0,0.12),0px_4px_5px_rgba(0,0,0,0.14)] absolute inset-0 w-full [@media(min-width:1024px)]:static [@media(min-width:1024px)]:inset-auto\"\n            [class]=\"panelWidthClasses()\"\n            [class.side-sheet__panel--half]=\"sideSheetService.size() === 'half'\"\n            [attr.role]=\"isOverlayMode() ? 'dialog' : 'complementary'\"\n            [attr.aria-modal]=\"isOverlayMode() ? true : null\"\n            [attr.aria-labelledby]=\"titleId\"\n        >\n            <div class=\"side-sheet__header flex flex-col gap-3\">\n                <div class=\"flex items-center gap-4\">\n                    <h2\n                        #titleRef\n                        [id]=\"titleId\"\n                        tabindex=\"-1\"\n                        class=\"min-w-0 flex-1 break-words font-open-sans text-base font-normal uppercase text-grayscale-90 outline-none\"\n                    >\n                        {{ sideSheetService.header() }}\n                    </h2>\n                    <button\n                        type=\"button\"\n                        class=\"flex shrink-0 cursor-pointer items-center justify-center rounded-medium border-none bg-transparent p-2 outline-none focus-visible:ring-2 focus-visible:ring-primary\"\n                        aria-label=\"Fechar\"\n                        (click)=\"closeSideSheet()\"\n                    >\n                        <i class=\"fas fa-times text-xs\" aria-hidden=\"true\"></i>\n                    </button>\n                </div>\n                <hr class=\"h-px w-full border-0 bg-grayscale-20\" />\n            </div>\n\n            <div class=\"side-sheet__body min-h-0 flex-1 overflow-auto\">\n                <ng-container\n                    *ngTemplateOutlet=\"sideSheetService.template(); context: sideSheetService.context()\"\n                ></ng-container>\n            </div>\n        </aside>\n    }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/seniorsistemas-angular-components-sidebar.mjs

@@ -1,189 +1,19 @@
-import { trigger, transition, style, animate } from '@angular/animations';
-import { CdkTrapFocus } from '@angular/cdk/a11y';
-import { NgTemplateOutlet } from '@angular/common';
-import * as i0 from '@angular/core';
-import { model, contentChild, effect, Component, ContentChildren, Input, NgModule } from '@angular/core';
-import { FooterComponent } from '@seniorsistemas/angular-components/structure';
-import { TemplateDirective, TemplateModule } from '@seniorsistemas/angular-components/template';
-import { disableScroll, enableScroll } from '@seniorsistemas/angular-components/utils';
+import { DrawerComponent as DrawerComponent$1, DrawerModule as DrawerModule$1 } from '@seniorsistemas/angular-components/drawer';
 
 /**
- * @description Componente de painel lateral deslizante (sidebar) que aparece sobre o conteúdo
- * vindo do lado direito da tela. Suporta templates customizados para cabeçalho, corpo e rodapé
- * via `sTemplate`, bloqueio de scroll automático e confirmação de fechamento.
- *
- * @example
- * ```html
- * <s-sidebar [(visible)]="sidebarOpen" header="Filtros" [closable]="true">
- *   <ng-template sTemplate="body">Conteúdo</ng-template>
- * </s-sidebar>
- * ```
- *
- * @category Overlay
+ * @deprecated Use DrawerComponent from '@seniorsistemas/angular-components/drawer'.
+ * O pacote sidebar será removido na versão 20.0.0.
  */
-class SidebarComponent {
-    templates = null;
-    /**
-     * @description Controla a visibilidade da sidebar. Suporta two-way binding via `[(visible)]`.
-     *
-     * @default false
-     */
-    visible = model(false);
-    /**
-     * @description Quando `true`, exibe o botão de fechar (X) no cabeçalho da sidebar.
-     *
-     * @default true
-     */
-    closable = true;
-    /**
-     * @description Quando `true`, clicar no backdrop (área escurecida fora da sidebar) fecha o painel.
-     *
-     * @default true
-     */
-    dismissible = true;
-    /**
-     * @description Quando `true`, pressionar a tecla Escape fecha a sidebar.
-     *
-     * @default true
-     */
-    closeOnEscape = true;
-    /**
-     * @description Texto exibido no cabeçalho padrão da sidebar.
-     * Pode ser substituído por um template customizado via `sTemplate="header"`.
-     */
-    header;
-    /**
-     * @description Quando `true`, aumenta a largura da sidebar para acomodar mais conteúdo.
-     *
-     * @default false
-     */
-    largeSized = false;
-    /**
-     * @description Quando `true`, mantém o conteúdo da sidebar no DOM mesmo quando oculta,
-     * preservando o estado interno dos componentes filhos.
-     *
-     * @default false
-     */
-    cache = false;
-    /**
-     * @description Função de confirmação chamada antes de fechar a sidebar.
-     * Quando retornar `false`, o fechamento é bloqueado. Útil para validar formulários não salvos.
-     */
-    set registerConfirmClose(fn) {
-        this._confirmClose = fn;
-    }
-    headerTemplate = null;
-    bodyTemplate = null;
-    footerTemplate = null;
-    footerComponent = contentChild(FooterComponent);
-    _confirmClose = () => true;
-    visibleEffect = effect(() => {
-        const visible = this.visible();
-        if (visible) {
-            disableScroll();
-        }
-        else {
-            enableScroll();
-        }
-    });
-    ngAfterContentInit() {
-        this._getTemplates();
-    }
-    ngOnDestroy() {
-        this.visibleEffect.destroy();
-    }
-    closeSidebar() {
-        if (this._confirmClose()) {
-            this.visible.set(false);
-        }
-    }
-    handleEscape() {
-        if (this.closeOnEscape) {
-            this.closeSidebar();
-        }
-    }
-    _getCustomTemplate(type) {
-        return this.templates?.find((template) => template.type === type)?.template ?? null;
-    }
-    getHeaderTemplate() {
-        return this._getCustomTemplate('header') ?? null;
-    }
-    getBodyTemplate() {
-        return this._getCustomTemplate('body') ?? null;
-    }
-    getFooterTemplate() {
-        return this._getCustomTemplate('footer') ?? null;
-    }
-    _getTemplates() {
-        this.headerTemplate = this.getHeaderTemplate();
-        this.bodyTemplate = this.getBodyTemplate();
-        this.footerTemplate = this.getFooterTemplate();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SidebarComponent, isStandalone: true, selector: "s-sidebar", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: false, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: false, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: false, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: false, isRequired: false, transformFunction: null }, largeSized: { classPropertyName: "largeSized", publicName: "largeSized", isSignal: false, isRequired: false, transformFunction: null }, cache: { classPropertyName: "cache", publicName: "cache", isSignal: false, isRequired: false, transformFunction: null }, registerConfirmClose: { classPropertyName: "registerConfirmClose", publicName: "registerConfirmClose", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange" }, host: { listeners: { "document:keydown.escape": "handleEscape()" } }, queries: [{ propertyName: "footerComponent", first: true, predicate: FooterComponent, descendants: true, isSignal: true }, { propertyName: "templates", predicate: TemplateDirective }], ngImport: i0, template: "@if (visible()) {\n    <div\n        class=\"backdrop\"\n        (click)=\"dismissible && closeSidebar()\"\n    ></div>\n}\n\n@if (cache || visible()) {\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"visible()\"\n        [@visibilityChanged]\n        class=\"sidebar\"\n        [class.sidebar--open]=\"visible()\"\n        [class.sidebar--large-size]=\"largeSized\"\n    >\n        <div class=\"sidebar__header\">\n            @if (headerTemplate) {\n                <ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n            } @else {\n                <span class=\"sidebar__header__title\">{{ header }}</span>\n            }\n            @if (closable) {\n                <button\n                    class=\"sidebar__header__close fa-solid fa-xmark\"\n                    (click)=\"closeSidebar()\"\n                ></button>\n            }\n        </div>\n        <div class=\"sidebar__body\">\n            @if (bodyTemplate) {\n                <ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n            } @else {\n                <ng-content select=\":not(s-footer)\"></ng-content>\n            }\n        </div>\n        @if (footerTemplate || footerComponent()) {\n            <div class=\"sidebar__footer\">\n                @if (footerTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n                } @else {\n                    <ng-content select=\"s-footer\"></ng-content>\n                }\n            </div>\n        }\n    </div>\n}\n\n", styles: [".backdrop{background-color:#00000080;height:100%;left:0;position:fixed;top:0;transition:opacity .3s;width:100%;z-index:998}.sidebar{background-color:#fff;box-shadow:0 1px 5px #00000040;display:flex;flex-direction:column;height:100%;right:-100%;padding:1rem;position:fixed;top:0;transition:right .3s;width:100%;z-index:999}.sidebar__header{border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding-bottom:.75rem}.sidebar__header__title{color:#212533;font-family:Inter,sans-serif;font-size:1rem;text-transform:uppercase;-webkit-user-select:none;user-select:none}.sidebar__header__close{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:1rem;padding:.5rem}.sidebar__body{flex-grow:1;overflow:auto;padding:1rem .5rem}.sidebar__footer{border-top:1px solid #dedce5;padding-top:.75rem}.sidebar--open{right:0}@media (min-width: 768px){.sidebar{width:75%}}@media (min-width: 992px){.sidebar{width:50%}}\n"], dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
-            trigger('visibilityChanged', [
-                transition(':enter', [
-                    style({ transform: 'translateX(100%)' }),
-                    animate('300ms', style({ transform: 'translateX(0)' })),
-                ]),
-                transition(':leave', [
-                    style({ transform: 'translateX(0)' }),
-                    animate('300ms', style({ transform: 'translateX(100%)' })),
-                ]),
-            ]),
-        ] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 's-sidebar', host: {
-                        '(document:keydown.escape)': 'handleEscape()',
-                    }, animations: [
-                        trigger('visibilityChanged', [
-                            transition(':enter', [
-                                style({ transform: 'translateX(100%)' }),
-                                animate('300ms', style({ transform: 'translateX(0)' })),
-                            ]),
-                            transition(':leave', [
-                                style({ transform: 'translateX(0)' }),
-                                animate('300ms', style({ transform: 'translateX(100%)' })),
-                            ]),
-                        ]),
-                    ], standalone: true, imports: [CdkTrapFocus, NgTemplateOutlet], template: "@if (visible()) {\n    <div\n        class=\"backdrop\"\n        (click)=\"dismissible && closeSidebar()\"\n    ></div>\n}\n\n@if (cache || visible()) {\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"visible()\"\n        [@visibilityChanged]\n        class=\"sidebar\"\n        [class.sidebar--open]=\"visible()\"\n        [class.sidebar--large-size]=\"largeSized\"\n    >\n        <div class=\"sidebar__header\">\n            @if (headerTemplate) {\n                <ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n            } @else {\n                <span class=\"sidebar__header__title\">{{ header }}</span>\n            }\n            @if (closable) {\n                <button\n                    class=\"sidebar__header__close fa-solid fa-xmark\"\n                    (click)=\"closeSidebar()\"\n                ></button>\n            }\n        </div>\n        <div class=\"sidebar__body\">\n            @if (bodyTemplate) {\n                <ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n            } @else {\n                <ng-content select=\":not(s-footer)\"></ng-content>\n            }\n        </div>\n        @if (footerTemplate || footerComponent()) {\n            <div class=\"sidebar__footer\">\n                @if (footerTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n                } @else {\n                    <ng-content select=\"s-footer\"></ng-content>\n                }\n            </div>\n        }\n    </div>\n}\n\n", styles: [".backdrop{background-color:#00000080;height:100%;left:0;position:fixed;top:0;transition:opacity .3s;width:100%;z-index:998}.sidebar{background-color:#fff;box-shadow:0 1px 5px #00000040;display:flex;flex-direction:column;height:100%;right:-100%;padding:1rem;position:fixed;top:0;transition:right .3s;width:100%;z-index:999}.sidebar__header{border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding-bottom:.75rem}.sidebar__header__title{color:#212533;font-family:Inter,sans-serif;font-size:1rem;text-transform:uppercase;-webkit-user-select:none;user-select:none}.sidebar__header__close{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:1rem;padding:.5rem}.sidebar__body{flex-grow:1;overflow:auto;padding:1rem .5rem}.sidebar__footer{border-top:1px solid #dedce5;padding-top:.75rem}.sidebar--open{right:0}@media (min-width: 768px){.sidebar{width:75%}}@media (min-width: 992px){.sidebar{width:50%}}\n"] }]
-        }], propDecorators: { templates: [{
-                type: ContentChildren,
-                args: [TemplateDirective]
-            }], closable: [{
-                type: Input
-            }], dismissible: [{
-                type: Input
-            }], closeOnEscape: [{
-                type: Input
-            }], header: [{
-                type: Input
-            }], largeSized: [{
-                type: Input
-            }], cache: [{
-                type: Input
-            }], registerConfirmClose: [{
-                type: Input
-            }] } });
-
-class SidebarModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, imports: [SidebarComponent], exports: [SidebarComponent, TemplateModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, imports: [TemplateModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [SidebarComponent],
-                    exports: [SidebarComponent, TemplateModule],
-                }]
-        }] });
+const DrawerComponent = DrawerComponent$1;
+/**
+ * @deprecated Use DrawerModule from '@seniorsistemas/angular-components/drawer'.
+ * O pacote sidebar será removido na versão 20.0.0.
+ */
+const DrawerModule = DrawerModule$1;
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { SidebarComponent, SidebarModule };
+export { DrawerComponent, DrawerModule };
 //# sourceMappingURL=seniorsistemas-angular-components-sidebar.mjs.map

package/fesm2022/seniorsistemas-angular-components-sidebar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"seniorsistemas-angular-components-sidebar.mjs","sources":["../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.component.ts","../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.component.html","../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.module.ts","../../projects/angular-components/sidebar/src/seniorsistemas-angular-components-sidebar.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\r\nimport { CdkTrapFocus } from '@angular/cdk/a11y';\r\nimport { NgTemplateOutlet } from '@angular/common';\r\nimport {\r\n    AfterContentInit,\r\n    Component,\r\n    contentChild,\r\n    ContentChildren,\r\n    effect,\r\n    Input,\r\n    model,\r\n    OnDestroy,\r\n    QueryList,\r\n    TemplateRef,\r\n} from '@angular/core';\r\nimport { FooterComponent } from '@seniorsistemas/angular-components/structure';\r\nimport { TemplateDirective } from '@seniorsistemas/angular-components/template';\r\nimport { disableScroll, enableScroll } from '@seniorsistemas/angular-components/utils';\r\n\r\n/**\r\n * @description Componente de painel lateral deslizante (sidebar) que aparece sobre o conteúdo\r\n * vindo do lado direito da tela. Suporta templates customizados para cabeçalho, corpo e rodapé\r\n * via `sTemplate`, bloqueio de scroll automático e confirmação de fechamento.\r\n *\r\n * @example\r\n * ```html\r\n * <s-sidebar [(visible)]=\"sidebarOpen\" header=\"Filtros\" [closable]=\"true\">\r\n *   <ng-template sTemplate=\"body\">Conteúdo</ng-template>\r\n * </s-sidebar>\r\n * ```\r\n *\r\n * @category Overlay\r\n */\r\n@Component({\r\n    selector: 's-sidebar',\r\n    templateUrl: './sidebar.component.html',\r\n    styleUrls: ['./sidebar.component.scss'],\r\n    host: {\r\n        '(document:keydown.escape)': 'handleEscape()',\r\n    },\r\n    animations: [\r\n        trigger('visibilityChanged', [\r\n            transition(':enter', [\r\n                style({ transform: 'translateX(100%)' }),\r\n                animate('300ms', style({ transform: 'translateX(0)' })),\r\n            ]),\r\n            transition(':leave', [\r\n                style({ transform: 'translateX(0)' }),\r\n                animate('300ms', style({ transform: 'translateX(100%)' })),\r\n            ]),\r\n        ]),\r\n    ],\r\n    standalone: true,\r\n    imports: [CdkTrapFocus, NgTemplateOutlet],\r\n})\r\nexport class SidebarComponent implements AfterContentInit, OnDestroy {\r\n    @ContentChildren(TemplateDirective)\r\n    public templates: QueryList<TemplateDirective> | null = null;\r\n\r\n    /**\r\n     * @description Controla a visibilidade da sidebar. Suporta two-way binding via `[(visible)]`.\r\n     *\r\n     * @default false\r\n     */\r\n    public visible = model<boolean>(false);\r\n\r\n    /**\r\n     * @description Quando `true`, exibe o botão de fechar (X) no cabeçalho da sidebar.\r\n     *\r\n     * @default true\r\n     */\r\n    @Input()\r\n    public closable = true;\r\n\r\n    /**\r\n     * @description Quando `true`, clicar no backdrop (área escurecida fora da sidebar) fecha o painel.\r\n     *\r\n     * @default true\r\n     */\r\n    @Input()\r\n    public dismissible = true;\r\n\r\n    /**\r\n     * @description Quando `true`, pressionar a tecla Escape fecha a sidebar.\r\n     *\r\n     * @default true\r\n     */\r\n    @Input()\r\n    public closeOnEscape = true;\r\n\r\n    /**\r\n     * @description Texto exibido no cabeçalho padrão da sidebar.\r\n     * Pode ser substituído por um template customizado via `sTemplate=\"header\"`.\r\n     */\r\n    @Input()\r\n    public header?: string;\r\n\r\n    /**\r\n     * @description Quando `true`, aumenta a largura da sidebar para acomodar mais conteúdo.\r\n     *\r\n     * @default false\r\n     */\r\n    @Input()\r\n    public largeSized = false;\r\n\r\n    /**\r\n     * @description Quando `true`, mantém o conteúdo da sidebar no DOM mesmo quando oculta,\r\n     * preservando o estado interno dos componentes filhos.\r\n     *\r\n     * @default false\r\n     */\r\n    @Input()\r\n    public cache = false;\r\n\r\n    /**\r\n     * @description Função de confirmação chamada antes de fechar a sidebar.\r\n     * Quando retornar `false`, o fechamento é bloqueado. Útil para validar formulários não salvos.\r\n     */\r\n    @Input()\r\n    public set registerConfirmClose(fn: () => boolean) {\r\n        this._confirmClose = fn;\r\n    }\r\n\r\n    public headerTemplate: TemplateRef<unknown> | null = null;\r\n    public bodyTemplate: TemplateRef<unknown> | null = null;\r\n    public footerTemplate: TemplateRef<unknown> | null = null;\r\n\r\n    protected readonly footerComponent = contentChild(FooterComponent);\r\n\r\n    private _confirmClose = () => true;\r\n\r\n    private readonly visibleEffect = effect(() => {\r\n        const visible = this.visible();\r\n        if (visible) {\r\n            disableScroll();\r\n        } else {\r\n            enableScroll();\r\n        }\r\n    });\r\n\r\n    public ngAfterContentInit(): void {\r\n        this._getTemplates();\r\n    }\r\n\r\n    public ngOnDestroy(): void {\r\n        this.visibleEffect.destroy();\r\n    }\r\n\r\n    public closeSidebar(): void {\r\n        if (this._confirmClose()) {\r\n            this.visible.set(false);\r\n        }\r\n    }\r\n\r\n    public handleEscape(): void {\r\n        if (this.closeOnEscape) {\r\n            this.closeSidebar();\r\n        }\r\n    }\r\n\r\n    private _getCustomTemplate(type: string): TemplateRef<any> | null {\r\n        return this.templates?.find((template: TemplateDirective) => template.type === type)?.template ?? null;\r\n    }\r\n\r\n    private getHeaderTemplate(): TemplateRef<unknown> | null {\r\n        return this._getCustomTemplate('header') ?? null;\r\n    }\r\n\r\n    private getBodyTemplate(): TemplateRef<unknown> | null {\r\n        return this._getCustomTemplate('body') ?? null;\r\n    }\r\n\r\n    private getFooterTemplate(): TemplateRef<unknown> | null {\r\n        return this._getCustomTemplate('footer') ?? null;\r\n    }\r\n\r\n    private _getTemplates(): void {\r\n        this.headerTemplate = this.getHeaderTemplate();\r\n        this.bodyTemplate = this.getBodyTemplate();\r\n        this.footerTemplate = this.getFooterTemplate();\r\n    }\r\n}\r\n","@if (visible()) {\n    <div\n        class=\"backdrop\"\n        (click)=\"dismissible && closeSidebar()\"\n    ></div>\n}\n\n@if (cache || visible()) {\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"visible()\"\n        [@visibilityChanged]\n        class=\"sidebar\"\n        [class.sidebar--open]=\"visible()\"\n        [class.sidebar--large-size]=\"largeSized\"\n    >\n        <div class=\"sidebar__header\">\n            @if (headerTemplate) {\n                <ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n            } @else {\n                <span class=\"sidebar__header__title\">{{ header }}</span>\n            }\n            @if (closable) {\n                <button\n                    class=\"sidebar__header__close fa-solid fa-xmark\"\n                    (click)=\"closeSidebar()\"\n                ></button>\n            }\n        </div>\n        <div class=\"sidebar__body\">\n            @if (bodyTemplate) {\n                <ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n            } @else {\n                <ng-content select=\":not(s-footer)\"></ng-content>\n            }\n        </div>\n        @if (footerTemplate || footerComponent()) {\n            <div class=\"sidebar__footer\">\n                @if (footerTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n                } @else {\n                    <ng-content select=\"s-footer\"></ng-content>\n                }\n            </div>\n        }\n    </div>\n}\n\n","import { NgModule } from '@angular/core';\r\n\r\nimport { SidebarComponent } from './sidebar.component';\r\nimport { TemplateModule } from '@seniorsistemas/angular-components/template';\r\n\r\n@NgModule({\r\n    imports: [SidebarComponent],\r\n    exports: [SidebarComponent, TemplateModule],\r\n})\r\nexport class SidebarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"seniorsistemas-angular-components-sidebar.mjs","sources":["../../projects/angular-components/sidebar/src/public-api.ts","../../projects/angular-components/sidebar/src/seniorsistemas-angular-components-sidebar.ts"],"sourcesContent":["import {\n    DrawerComponent as DrawerComponentOriginal,\n    DrawerModule as DrawerModuleOriginal,\n} from '@seniorsistemas/angular-components/drawer';\n\n/**\n * @deprecated Use DrawerComponent from '@seniorsistemas/angular-components/drawer'.\n * O pacote sidebar será removido na versão 20.0.0.\n */\nexport const DrawerComponent = DrawerComponentOriginal;\n\n/**\n * @deprecated Use DrawerModule from '@seniorsistemas/angular-components/drawer'.\n * O pacote sidebar será removido na versão 20.0.0.\n */\nexport const DrawerModule = DrawerModuleOriginal;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["DrawerComponentOriginal","DrawerModuleOriginal"],"mappings":";;AAKA;;;AAGG;AACI,MAAM,eAAe,GAAGA,kBAAwB;AAEvD;;;AAGG;AACI,MAAM,YAAY,GAAGC;;ACf5B;;AAEG;;;;"}

package/fesm2022/seniorsistemas-angular-components-switch.mjs

@@ -1,6 +1,8 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, forwardRef, Component, Input, Output, ViewChild, HostListener, NgModule } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import * as i1 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
 
 /**
  * @description Componente de chave tipo switch (liga/desliga) que implementa
@@ -80,7 +82,7 @@ class SwitchComponent {
                 useExisting: forwardRef(() => SwitchComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "switchRef", first: true, predicate: ["switch"], descendants: true, static: true }], ngImport: i0, template: "<div\n    #switch\n    class=\"inline-flex items-center\"\n    [class.opacity-50]=\"disabled\"\n    [attr.aria-disabled]=\"disabled || null\"\n>\n    <label class=\"inline-block h-6 m-0 relative w-10\">\n        <input\n            #input\n            [id]=\"inputId\"\n            [name]=\"inputName\"\n            type=\"checkbox\"\n            role=\"switch\"\n            class=\"h-0 opacity-0 w-0\"\n            [attr.aria-checked]=\"value\"\n            [attr.aria-label]=\"label || null\"\n            [checked]=\"value\"\n            [disabled]=\"disabled\"\n            [attr.aria-readonly]=\"readonly || null\"\n            (change)=\"toggleCheck()\"\n        />\n        <span\n            class=\"slider bg-grayscale-40 rounded-[15px] inset-0 absolute cursor-pointer transition-all duration-[400ms]\"\n            aria-hidden=\"true\"\n        ></span>\n    </label>\n    @if (showStatusLabel) {\n        <span class=\"text-grayscale-90 font-open-sans text-sm font-normal leading-[150%] ml-3\">{{ value ? trueLabel : falseLabel }}</span>\n    }\n</div>\n\n", styles: [".slider:before{background-color:#fff;border-radius:50%;bottom:4px;content:\"\";height:16px;left:4px;position:absolute;transition:.4s;width:16px}input:checked+.slider{background-color:#428bca}input:checked+.slider:before{transform:translate(16px)}input:focus-visible+.slider{box-shadow:0 0 0 2px #000;outline:2px solid #000;outline-offset:1px}.switch--focus .slider{box-shadow:0 0 0 2px #428bca80}\n"] });
+        ], viewQueries: [{ propertyName: "switchRef", first: true, predicate: ["switch"], descendants: true, static: true }], ngImport: i0, template: "<div\n    #switch\n    class=\"inline-flex items-center\"\n    role=\"group\"\n    [attr.aria-label]=\"label || ('platform.angular_components.switch_toggle' | translate)\"\n    [class.opacity-50]=\"disabled\"\n    [attr.aria-disabled]=\"disabled || null\"\n>\n    <label class=\"inline-block h-6 m-0 relative w-10\">\n        <span class=\"sr-only\">{{ label || ('platform.angular_components.switch_toggle' | translate) }}</span>\n        <input\n            #input\n            [id]=\"inputId\"\n            [name]=\"inputName\"\n            type=\"checkbox\"\n            role=\"switch\"\n            class=\"h-0 opacity-0 w-0\"\n            [attr.aria-checked]=\"value\"\n            [checked]=\"value\"\n            [disabled]=\"disabled\"\n            [attr.aria-readonly]=\"readonly || null\"\n            (change)=\"toggleCheck()\"\n        />\n        <span\n            class=\"slider bg-grayscale-40 rounded-[15px] inset-0 absolute cursor-pointer transition-all duration-[400ms]\"\n            aria-hidden=\"true\"\n        ></span>\n    </label>\n    @if (showStatusLabel) {\n        <span class=\"text-grayscale-90 font-open-sans text-sm font-normal leading-[150%] ml-3\">{{ value ? trueLabel : falseLabel }}</span>\n    }\n</div>\n\n", styles: [".slider:before{background-color:#fff;border-radius:50%;bottom:4px;content:\"\";height:16px;left:4px;position:absolute;transition:.4s;width:16px}input:checked+.slider{background-color:#428bca}input:checked+.slider:before{transform:translate(16px)}input:focus-visible+.slider{box-shadow:0 0 0 2px #000;outline:2px solid #000;outline-offset:1px}.switch--focus .slider{box-shadow:0 0 0 2px #428bca80}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SwitchComponent, decorators: [{
             type: Component,
@@ -90,7 +92,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                             useExisting: forwardRef(() => SwitchComponent),
                             multi: true,
                         },
-                    ], standalone: true, imports: [], template: "<div\n    #switch\n    class=\"inline-flex items-center\"\n    [class.opacity-50]=\"disabled\"\n    [attr.aria-disabled]=\"disabled || null\"\n>\n    <label class=\"inline-block h-6 m-0 relative w-10\">\n        <input\n            #input\n            [id]=\"inputId\"\n            [name]=\"inputName\"\n            type=\"checkbox\"\n            role=\"switch\"\n            class=\"h-0 opacity-0 w-0\"\n            [attr.aria-checked]=\"value\"\n            [attr.aria-label]=\"label || null\"\n            [checked]=\"value\"\n            [disabled]=\"disabled\"\n            [attr.aria-readonly]=\"readonly || null\"\n            (change)=\"toggleCheck()\"\n        />\n        <span\n            class=\"slider bg-grayscale-40 rounded-[15px] inset-0 absolute cursor-pointer transition-all duration-[400ms]\"\n            aria-hidden=\"true\"\n        ></span>\n    </label>\n    @if (showStatusLabel) {\n        <span class=\"text-grayscale-90 font-open-sans text-sm font-normal leading-[150%] ml-3\">{{ value ? trueLabel : falseLabel }}</span>\n    }\n</div>\n\n", styles: [".slider:before{background-color:#fff;border-radius:50%;bottom:4px;content:\"\";height:16px;left:4px;position:absolute;transition:.4s;width:16px}input:checked+.slider{background-color:#428bca}input:checked+.slider:before{transform:translate(16px)}input:focus-visible+.slider{box-shadow:0 0 0 2px #000;outline:2px solid #000;outline-offset:1px}.switch--focus .slider{box-shadow:0 0 0 2px #428bca80}\n"] }]
+                    ], standalone: true, imports: [TranslateModule], template: "<div\n    #switch\n    class=\"inline-flex items-center\"\n    role=\"group\"\n    [attr.aria-label]=\"label || ('platform.angular_components.switch_toggle' | translate)\"\n    [class.opacity-50]=\"disabled\"\n    [attr.aria-disabled]=\"disabled || null\"\n>\n    <label class=\"inline-block h-6 m-0 relative w-10\">\n        <span class=\"sr-only\">{{ label || ('platform.angular_components.switch_toggle' | translate) }}</span>\n        <input\n            #input\n            [id]=\"inputId\"\n            [name]=\"inputName\"\n            type=\"checkbox\"\n            role=\"switch\"\n            class=\"h-0 opacity-0 w-0\"\n            [attr.aria-checked]=\"value\"\n            [checked]=\"value\"\n            [disabled]=\"disabled\"\n            [attr.aria-readonly]=\"readonly || null\"\n            (change)=\"toggleCheck()\"\n        />\n        <span\n            class=\"slider bg-grayscale-40 rounded-[15px] inset-0 absolute cursor-pointer transition-all duration-[400ms]\"\n            aria-hidden=\"true\"\n        ></span>\n    </label>\n    @if (showStatusLabel) {\n        <span class=\"text-grayscale-90 font-open-sans text-sm font-normal leading-[150%] ml-3\">{{ value ? trueLabel : falseLabel }}</span>\n    }\n</div>\n\n", styles: [".slider:before{background-color:#fff;border-radius:50%;bottom:4px;content:\"\";height:16px;left:4px;position:absolute;transition:.4s;width:16px}input:checked+.slider{background-color:#428bca}input:checked+.slider:before{transform:translate(16px)}input:focus-visible+.slider{box-shadow:0 0 0 2px #000;outline:2px solid #000;outline-offset:1px}.switch--focus .slider{box-shadow:0 0 0 2px #428bca80}\n"] }]
         }], propDecorators: { readonly: [{
                 type: Input
             }], trueLabel: [{
@@ -125,7 +127,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
 class SwitchModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SwitchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SwitchModule, imports: [SwitchComponent], exports: [SwitchComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SwitchModule });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SwitchModule, imports: [SwitchComponent] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SwitchModule, decorators: [{
             type: NgModule,