{"version":3,"file":"seniorsistemas-angular-components-card.mjs","sources":["../../projects/angular-components/card/src/lib/card/card.component.ts","../../projects/angular-components/card/src/lib/card/card.component.html","../../projects/angular-components/card/src/lib/card/card.module.ts","../../projects/angular-components/card/src/seniorsistemas-angular-components-card.ts"],"sourcesContent":["import { AfterContentInit, Component, ContentChildren, Input, QueryList, TemplateRef } from '@angular/core';\r\n\r\nimport { TemplateDirective } from '@seniorsistemas/angular-components/template';\r\nimport { NgStyle, NgTemplateOutlet } from '@angular/common';\r\n\r\n/**\r\n * @description Componente de cartão com suporte a banner, cabeçalho (título, subtítulo e ícone)\r\n * e templates customizáveis para cabeçalho, corpo e rodapé via `TemplateDirective`.\r\n *\r\n * @example\r\n * ```html\r\n * <s-card title=\"Título\" subtitle=\"Subtítulo\">\r\n *   <ng-template sTemplate type=\"body\">Conteúdo</ng-template>\r\n * </s-card>\r\n * ```\r\n *\r\n * @category Structure\r\n */\r\n@Component({\r\n    selector: 's-card',\r\n    templateUrl: './card.component.html',\r\n    standalone: true,\r\n    imports: [NgStyle, NgTemplateOutlet],\r\n})\r\nexport class CardComponent implements AfterContentInit {\r\n    /** @description URL da imagem exibida como banner no topo do card. */\r\n    @Input()\r\n    public bannerImage?: string;\r\n\r\n    /** @description Faz o card ocupar 100% da largura disponível. @default false */\r\n    @Input()\r\n    public fullWidth = false;\r\n\r\n    /** @description Título exibido no cabeçalho do card. @default '' */\r\n    @Input() title = '';\r\n\r\n    /** @description Subtítulo exibido abaixo do título. @default '' */\r\n    @Input() subtitle = '';\r\n\r\n    /** @description Classe do ícone exibido no cabeçalho. @default '' */\r\n    @Input() icon = '';\r\n\r\n    public showBanner = false;\r\n\r\n    @ContentChildren(TemplateDirective)\r\n    public templates?: QueryList<TemplateDirective>;\r\n\r\n    public hasCustomTemplates = false;\r\n    public headerTemplate?: TemplateRef<unknown>;\r\n    public bodyTemplate?: TemplateRef<unknown>;\r\n    public footerTemplate?: TemplateRef<unknown>;\r\n\r\n    public get hasHeader() {\r\n        const headerTemplate = !!this.headerTemplate;\r\n        const hasHeaderAttributes = this.title || this.subtitle || this.icon;\r\n        return headerTemplate || hasHeaderAttributes;\r\n    }\r\n\r\n    public async ngAfterContentInit(): Promise<void> {\r\n        await this._setShowBanner();\r\n        this._setTemplates();\r\n    }\r\n\r\n    private _getHeaderTemplate(): TemplateRef<unknown> | undefined {\r\n        return this._getCustomTemplate('header');\r\n    }\r\n\r\n    private _getBodyTemplate(): TemplateRef<unknown> | undefined {\r\n        return this._getCustomTemplate('body');\r\n    }\r\n\r\n    private _getFooterTemplate(): TemplateRef<unknown> | undefined {\r\n        return this._getCustomTemplate('footer');\r\n    }\r\n\r\n    private _getCustomTemplate(type: string): TemplateRef<unknown> | undefined {\r\n        return this.templates?.find((template: TemplateDirective) => template.type === type)?.template;\r\n    }\r\n\r\n    private _setTemplates(): void {\r\n        this.headerTemplate = this._getHeaderTemplate();\r\n        this.bodyTemplate = this._getBodyTemplate();\r\n        this.footerTemplate = this._getFooterTemplate();\r\n\r\n        this.hasCustomTemplates = !!(this.headerTemplate || this.bodyTemplate || this.footerTemplate);\r\n    }\r\n\r\n    private _setShowBanner() {\r\n        return new Promise<void>((resolve) => {\r\n            if (!this.bannerImage) {\r\n                resolve();\r\n                return;\r\n            }\r\n\r\n            const img = new Image();\r\n            img.src = this.bannerImage;\r\n            img.onload = () => {\r\n                this.showBanner = true;\r\n                resolve();\r\n            };\r\n\r\n            img.onerror = () => {\r\n                this.showBanner = false;\r\n                resolve();\r\n            };\r\n        });\r\n    }\r\n}\r\n","<div\r\n    class=\"inline-flex flex-col bg-grayscale-0 rounded-medium shadow-[0px_1px_5px_0px_#00000040] overflow-hidden\"\r\n    [class.w-full]=\"fullWidth\"\r\n>\r\n    @if (showBanner) {\r\n        <div\r\n            class=\"bg-no-repeat bg-cover h-[150px] w-full\"\r\n            [ngStyle]=\"{ 'background-image': 'url(' + bannerImage + ')' }\"\r\n        ></div>\r\n    }\r\n\r\n    <!-- @if (hasCustomTemplates) {\r\n  @if (headerTemplate) {\r\n    <div class=\"header\">\r\n      <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n    </div>\r\n  }\r\n  @if (bodyTemplate) {\r\n    <div class=\"body\">\r\n      <ng-container *ngTemplateOutlet=\"bodyTemplate\"></ng-container>\r\n    </div>\r\n  }\r\n  @if (footerTemplate) {\r\n    <div class=\"footer\">\r\n      <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n    </div>\r\n  }\r\n} @else {\r\n  <div class=\"body\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  } -->\r\n\r\n    @if (hasHeader) {\r\n        <div class=\"py-4 px-3\">\r\n            @if (headerTemplate) {\r\n                <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n            }\r\n            @if (!headerTemplate) {\r\n                <div class=\"flex gap-3\">\r\n                    @if (icon) {\r\n                        <div class=\"rounded-[50%] bg-grayscale-20 w-[3em] flex items-center justify-center min-h-[3em]\">\r\n                            <i [class]=\"icon\"></i>\r\n                        </div>\r\n                    }\r\n                    <div>\r\n                        @if (title) {\r\n                            <div class=\"text-grayscale-90 text-sm font-bold\">\r\n                                {{ title }}\r\n                            </div>\r\n                        }\r\n                        @if (subtitle) {\r\n                            <div class=\"text-grayscale-60 text-sm font-normal\">\r\n                                {{ subtitle }}\r\n                            </div>\r\n                        }\r\n                    </div>\r\n                </div>\r\n            }\r\n        </div>\r\n    }\r\n    <div class=\"p-4\" [class.border-t]=\"hasHeader\" [class.border-t-grayscale-30]=\"hasHeader\">\r\n        @if (bodyTemplate) {\r\n            <ng-container *ngTemplateOutlet=\"bodyTemplate\"></ng-container>\r\n        } @else {\r\n            <ng-content></ng-content>\r\n        }\r\n    </div>\r\n\r\n    @if (footerTemplate) {\r\n        <div class=\"p-4 border-t border-t-grayscale-30\">\r\n            <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n        </div>\r\n    }\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\n\r\nimport { CardComponent } from './card.component';\r\n\r\n@NgModule({\r\n    imports: [CardComponent],\r\n    exports: [CardComponent],\r\n})\r\nexport class CardModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}