ngx-obelisco-example
Version:
Componentes funcionales y reutilizables para Angular.
141 lines (132 loc) • 12.7 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, Input, ElementRef, ContentChild, NgModule } from '@angular/core';
import { OCustomContentDirective } from 'ngx-obelisco-example/directives';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
class OModalTitleComponent {
constructor() {
this.customClasses = '';
}
}
OModalTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OModalTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OModalTitleComponent, selector: "o-modal-title", inputs: { customClasses: "customClasses" }, ngImport: i0, template: "<h4 class=\"modal-title\" [ngClass]=\"customClasses\"><ng-content></ng-content></h4>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalTitleComponent, decorators: [{
type: Component,
args: [{ selector: 'o-modal-title', template: "<h4 class=\"modal-title\" [ngClass]=\"customClasses\"><ng-content></ng-content></h4>\r\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { customClasses: [{
type: Input
}] } });
class OModalFooterComponent {
constructor() {
this.customClasses = '';
}
}
OModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OModalFooterComponent, selector: "o-modal-footer", inputs: { customClasses: "customClasses" }, ngImport: i0, template: "<div class=\"modal-footer\" [ngClass]=\"customClasses\">\r\n <ng-content></ng-content>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalFooterComponent, decorators: [{
type: Component,
args: [{ selector: 'o-modal-footer', template: "<div class=\"modal-footer\" [ngClass]=\"customClasses\">\r\n <ng-content></ng-content>\r\n</div>\r\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { customClasses: [{
type: Input
}] } });
class OModalComponent {
constructor() {
this.isHeaderUnbordered = false;
this.size = 'sm';
this.isScrollable = false;
this.isOnTop = false;
this.customClasses = '';
}
}
OModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OModalComponent, selector: "o-modal", inputs: { dataTarget: "dataTarget", title: "title", subtitle: "subtitle", description: "description", isHeaderUnbordered: "isHeaderUnbordered", size: "size", isScrollable: "isScrollable", isOnTop: "isOnTop", customClasses: "customClasses" }, queries: [{ propertyName: "oCustomContent", first: true, predicate: OCustomContentDirective, descendants: true, static: true }, { propertyName: "children", first: true, predicate: ["children"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"modal fade\" tabindex=\"-1\" role=\"dialog\" [attr.id]=\"dataTarget\" [ngClass]=\"customClasses\">\r\n <div\r\n class=\"modal-dialog\"\r\n [ngClass]=\"[\r\n size === 'sm' ? 'modal-sm' : size === 'lg' ? 'modal-lg' : size === 'xl' ? 'modal-xl' : '',\r\n isScrollable ? 'modal-dialog-scrollable' : '',\r\n isOnTop ? '' : 'modal-dialog-centered'\r\n ]\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n <ng-container *ngIf=\"!oCustomContent\">\r\n <div class=\"modal-header\" [ngClass]=\"{ unbordered: isHeaderUnbordered }\" *ngIf=\"title || subtitle\">\r\n <small *ngIf=\"subtitle\">{{ subtitle }}</small>\r\n <o-modal-title *ngIf=\"title\">{{ title }}</o-modal-title>\r\n </div>\r\n <ng-content select=\"o-modal-header\"></ng-content>\r\n\r\n <div class=\"modal-body\" *ngIf=\"description\">\r\n <p>{{ description }}</p>\r\n </div>\r\n <ng-content select=\"o-modal-content\"></ng-content>\r\n\r\n <o-modal-footer *ngIf=\"children\"><ng-content></ng-content></o-modal-footer>\r\n <ng-content select=\"o-modal-footer\"></ng-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"oCustomContent\" [ngTemplateOutlet]=\"oCustomContent.template\"> </ng-container>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .modal-footer>*{margin:0}\n"], 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"] }, { kind: "component", type: OModalTitleComponent, selector: "o-modal-title", inputs: ["customClasses"] }, { kind: "component", type: OModalFooterComponent, selector: "o-modal-footer", inputs: ["customClasses"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalComponent, decorators: [{
type: Component,
args: [{ selector: 'o-modal', template: "<div class=\"modal fade\" tabindex=\"-1\" role=\"dialog\" [attr.id]=\"dataTarget\" [ngClass]=\"customClasses\">\r\n <div\r\n class=\"modal-dialog\"\r\n [ngClass]=\"[\r\n size === 'sm' ? 'modal-sm' : size === 'lg' ? 'modal-lg' : size === 'xl' ? 'modal-xl' : '',\r\n isScrollable ? 'modal-dialog-scrollable' : '',\r\n isOnTop ? '' : 'modal-dialog-centered'\r\n ]\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n <ng-container *ngIf=\"!oCustomContent\">\r\n <div class=\"modal-header\" [ngClass]=\"{ unbordered: isHeaderUnbordered }\" *ngIf=\"title || subtitle\">\r\n <small *ngIf=\"subtitle\">{{ subtitle }}</small>\r\n <o-modal-title *ngIf=\"title\">{{ title }}</o-modal-title>\r\n </div>\r\n <ng-content select=\"o-modal-header\"></ng-content>\r\n\r\n <div class=\"modal-body\" *ngIf=\"description\">\r\n <p>{{ description }}</p>\r\n </div>\r\n <ng-content select=\"o-modal-content\"></ng-content>\r\n\r\n <o-modal-footer *ngIf=\"children\"><ng-content></ng-content></o-modal-footer>\r\n <ng-content select=\"o-modal-footer\"></ng-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"oCustomContent\" [ngTemplateOutlet]=\"oCustomContent.template\"> </ng-container>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .modal-footer>*{margin:0}\n"] }]
}], propDecorators: { dataTarget: [{
type: Input
}], title: [{
type: Input
}], subtitle: [{
type: Input
}], description: [{
type: Input
}], isHeaderUnbordered: [{
type: Input
}], size: [{
type: Input
}], isScrollable: [{
type: Input
}], isOnTop: [{
type: Input
}], customClasses: [{
type: Input
}], oCustomContent: [{
type: ContentChild,
args: [OCustomContentDirective, { static: true }]
}], children: [{
type: ContentChild,
args: ['children', { read: ElementRef }]
}] } });
class OModalContentComponent {
constructor() {
this.customClasses = '';
}
}
OModalContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OModalContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OModalContentComponent, selector: "o-modal-content", inputs: { customClasses: "customClasses" }, ngImport: i0, template: "<div class=\"modal-body\" [ngClass]=\"customClasses\">\r\n <ng-content></ng-content>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalContentComponent, decorators: [{
type: Component,
args: [{ selector: 'o-modal-content', template: "<div class=\"modal-body\" [ngClass]=\"customClasses\">\r\n <ng-content></ng-content>\r\n</div>\r\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { customClasses: [{
type: Input
}] } });
class OModalHeaderComponent {
constructor() {
this.isUnbordered = false;
this.customClasses = '';
}
getClassNames() {
const unborderedClass = this.isUnbordered ? ' unbordered' : '';
const customClass = this.customClasses ? ' ' + this.customClasses : '';
return unborderedClass + customClass;
}
}
OModalHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OModalHeaderComponent, selector: "o-modal-header", inputs: { isUnbordered: "isUnbordered", customClasses: "customClasses" }, ngImport: i0, template: "<div class=\"modal-header\" [ngClass]=\"getClassNames()\">\r\n <ng-content></ng-content>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalHeaderComponent, decorators: [{
type: Component,
args: [{ selector: 'o-modal-header', template: "<div class=\"modal-header\" [ngClass]=\"getClassNames()\">\r\n <ng-content></ng-content>\r\n</div>\r\n" }]
}], ctorParameters: function () { return []; }, propDecorators: { isUnbordered: [{
type: Input
}], customClasses: [{
type: Input
}] } });
class OModalModule {
}
OModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
OModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: OModalModule, declarations: [OModalComponent,
OModalContentComponent,
OModalHeaderComponent,
OModalTitleComponent,
OModalFooterComponent], imports: [CommonModule], exports: [OModalComponent, OModalContentComponent, OModalHeaderComponent, OModalTitleComponent, OModalFooterComponent] });
OModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalModule, imports: [CommonModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OModalModule, decorators: [{
type: NgModule,
args: [{
declarations: [
OModalComponent,
OModalContentComponent,
OModalHeaderComponent,
OModalTitleComponent,
OModalFooterComponent
],
imports: [CommonModule],
exports: [OModalComponent, OModalContentComponent, OModalHeaderComponent, OModalTitleComponent, OModalFooterComponent]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { OModalComponent, OModalContentComponent, OModalFooterComponent, OModalHeaderComponent, OModalModule, OModalTitleComponent };
//# sourceMappingURL=ngx-obelisco-example-modal.mjs.map