ngx-obelisco-example
Version:
Componentes funcionales y reutilizables para Angular.
75 lines (70 loc) • 7.05 kB
JavaScript
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { Component, Input, ContentChild, NgModule } from '@angular/core';
import { OCustomContentDirective, ODefaultImageDirective } from 'ngx-obelisco-example/directives';
class OPanelSmallComponent {
constructor() {
this.isBgWhite = false;
this.isBgLight = false;
this.isVertical = false;
this.customClasses = '';
this.sizeToPx = (size) => {
switch (size) {
case 'lg':
return 154;
case 'md':
return 104;
case 'sm':
return 104;
}
};
}
}
OPanelSmallComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OPanelSmallComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OPanelSmallComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OPanelSmallComponent, selector: "o-panel-small", inputs: { title: "title", description: "description", image: "image", isBgWhite: "isBgWhite", isBgLight: "isBgLight", isVertical: "isVertical", customClasses: "customClasses" }, queries: [{ propertyName: "oCustomContent", first: true, predicate: OCustomContentDirective, descendants: true, static: true }, { propertyName: "listLinkContent", first: true, predicate: ["listLinkContent"], descendants: true, static: true }, { propertyName: "panelFooterContent", first: true, predicate: ["panelFooterContent"], descendants: true, static: true }], ngImport: i0, template: "<ng-template #smallPanelContent>\r\n <img\r\n *ngIf=\"image\"\r\n [src]=\"image.src\"\r\n [alt]=\"image.alt\"\r\n class=\"rounded-lg\"\r\n [width]=\"image.size ? sizeToPx(image.size) : sizeToPx('md')\"\r\n [height]=\"image.size ? sizeToPx(image.size) : sizeToPx('md')\"\r\n />\r\n <div class=\"card-body\">\r\n <ng-container *ngIf=\"!oCustomContent\">\r\n <h3 class=\"card-title\">{{ title }}</h3>\r\n <p class=\"card-text\">\r\n {{ description }}\r\n </p>\r\n </ng-container>\r\n <ng-container *ngIf=\"oCustomContent\" [ngTemplateOutlet]=\"oCustomContent.template\"> </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<div *ngIf=\"!isVertical\" class=\"card card-simple panel-sm-horizontal\" [ngClass]=\"customClasses\">\r\n <ng-container *ngTemplateOutlet=\"smallPanelContent\"></ng-container>\r\n</div>\r\n\r\n<div\r\n *ngIf=\"isVertical\"\r\n class=\"card card-simple\"\r\n [class.panel-list-link]=\"listLinkContent\"\r\n [class.panel-sm]=\"!listLinkContent\"\r\n [class.bg-white]=\"isBgWhite\"\r\n [class.bg-light]=\"isBgLight\"\r\n [ngClass]=\"customClasses\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"smallPanelContent\"></ng-container>\r\n\r\n <div [ngClass]=\"{ 'panel-footer': panelFooterContent, 'list-link': listLinkContent }\">\r\n <ng-content></ng-content>\r\n </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OPanelSmallComponent, decorators: [{
type: Component,
args: [{ selector: 'o-panel-small', template: "<ng-template #smallPanelContent>\r\n <img\r\n *ngIf=\"image\"\r\n [src]=\"image.src\"\r\n [alt]=\"image.alt\"\r\n class=\"rounded-lg\"\r\n [width]=\"image.size ? sizeToPx(image.size) : sizeToPx('md')\"\r\n [height]=\"image.size ? sizeToPx(image.size) : sizeToPx('md')\"\r\n />\r\n <div class=\"card-body\">\r\n <ng-container *ngIf=\"!oCustomContent\">\r\n <h3 class=\"card-title\">{{ title }}</h3>\r\n <p class=\"card-text\">\r\n {{ description }}\r\n </p>\r\n </ng-container>\r\n <ng-container *ngIf=\"oCustomContent\" [ngTemplateOutlet]=\"oCustomContent.template\"> </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<div *ngIf=\"!isVertical\" class=\"card card-simple panel-sm-horizontal\" [ngClass]=\"customClasses\">\r\n <ng-container *ngTemplateOutlet=\"smallPanelContent\"></ng-container>\r\n</div>\r\n\r\n<div\r\n *ngIf=\"isVertical\"\r\n class=\"card card-simple\"\r\n [class.panel-list-link]=\"listLinkContent\"\r\n [class.panel-sm]=\"!listLinkContent\"\r\n [class.bg-white]=\"isBgWhite\"\r\n [class.bg-light]=\"isBgLight\"\r\n [ngClass]=\"customClasses\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"smallPanelContent\"></ng-container>\r\n\r\n <div [ngClass]=\"{ 'panel-footer': panelFooterContent, 'list-link': listLinkContent }\">\r\n <ng-content></ng-content>\r\n </div>\r\n</div>\r\n" }]
}], propDecorators: { title: [{
type: Input
}], description: [{
type: Input
}], image: [{
type: Input
}], isBgWhite: [{
type: Input
}], isBgLight: [{
type: Input
}], isVertical: [{
type: Input
}], customClasses: [{
type: Input
}], oCustomContent: [{
type: ContentChild,
args: [OCustomContentDirective, { static: true }]
}], listLinkContent: [{
type: ContentChild,
args: ['listLinkContent', { static: true }]
}], panelFooterContent: [{
type: ContentChild,
args: ['panelFooterContent', { static: true }]
}] } });
class OPanelModule {
}
OPanelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
OPanelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: OPanelModule, declarations: [OPanelSmallComponent], imports: [CommonModule, ODefaultImageDirective], exports: [OPanelSmallComponent] });
OPanelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OPanelModule, imports: [CommonModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OPanelModule, decorators: [{
type: NgModule,
args: [{
declarations: [OPanelSmallComponent],
imports: [CommonModule, ODefaultImageDirective],
exports: [OPanelSmallComponent]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { OPanelModule, OPanelSmallComponent };
//# sourceMappingURL=ngx-obelisco-example-panel.mjs.map