gnezim
124 lines
4.3 KiB
JavaScript
124 lines
4.3 KiB
JavaScript
import { Component, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, ChangeDetectorRef, Input, ContentChildren, Output, NgModule } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { ButtonModule } from 'primeng/button';
|
|
import { PrimeTemplate } from 'primeng/api';
|
|
|
|
class InplaceDisplay {
|
|
}
|
|
InplaceDisplay.decorators = [
|
|
{ type: Component, args: [{
|
|
selector: 'p-inplaceDisplay',
|
|
template: '<ng-content></ng-content>'
|
|
},] }
|
|
];
|
|
class InplaceContent {
|
|
}
|
|
InplaceContent.decorators = [
|
|
{ type: Component, args: [{
|
|
selector: 'p-inplaceContent',
|
|
template: '<ng-content></ng-content>'
|
|
},] }
|
|
];
|
|
class Inplace {
|
|
constructor(cd) {
|
|
this.cd = cd;
|
|
this.closeIcon = 'pi pi-times';
|
|
this.onActivate = new EventEmitter();
|
|
this.onDeactivate = new EventEmitter();
|
|
}
|
|
ngAfterContentInit() {
|
|
this.templates.forEach((item) => {
|
|
switch (item.getType()) {
|
|
case 'display':
|
|
this.displayTemplate = item.template;
|
|
break;
|
|
case 'content':
|
|
this.contentTemplate = item.template;
|
|
break;
|
|
}
|
|
});
|
|
}
|
|
onActivateClick(event) {
|
|
if (!this.preventClick)
|
|
this.activate(event);
|
|
}
|
|
onDeactivateClick(event) {
|
|
if (!this.preventClick)
|
|
this.deactivate(event);
|
|
}
|
|
activate(event) {
|
|
if (!this.disabled) {
|
|
this.active = true;
|
|
this.onActivate.emit(event);
|
|
this.cd.markForCheck();
|
|
}
|
|
}
|
|
deactivate(event) {
|
|
if (!this.disabled) {
|
|
this.active = false;
|
|
this.hover = false;
|
|
this.onDeactivate.emit(event);
|
|
this.cd.markForCheck();
|
|
}
|
|
}
|
|
onKeydown(event) {
|
|
if (event.which === 13) {
|
|
this.activate(event);
|
|
event.preventDefault();
|
|
}
|
|
}
|
|
}
|
|
Inplace.decorators = [
|
|
{ type: Component, args: [{
|
|
selector: 'p-inplace',
|
|
template: `
|
|
<div [ngClass]="{'p-inplace p-component': true, 'p-inplace-closable': closable}" [ngStyle]="style" [class]="styleClass">
|
|
<div class="p-inplace-display" (click)="onActivateClick($event)" tabindex="0" (keydown)="onKeydown($event)"
|
|
[ngClass]="{'p-disabled':disabled}" *ngIf="!active">
|
|
<ng-content select="[pInplaceDisplay]"></ng-content>
|
|
<ng-container *ngTemplateOutlet="displayTemplate"></ng-container>
|
|
</div>
|
|
<div class="p-inplace-content" *ngIf="active">
|
|
<ng-content select="[pInplaceContent]"></ng-content>
|
|
<ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
|
|
<button type="button" [icon]="closeIcon" pButton (click)="onDeactivateClick($event)" *ngIf="closable"></button>
|
|
</div>
|
|
</div>
|
|
`,
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
encapsulation: ViewEncapsulation.None,
|
|
styles: [".p-inplace .p-inplace-display{cursor:pointer;display:inline}.p-inplace .p-inplace-content{display:inline}.p-fluid .p-inplace.p-inplace-closable .p-inplace-content{display:-ms-flexbox;display:flex}.p-fluid .p-inplace.p-inplace-closable .p-inplace-content>.p-inputtext{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}"]
|
|
},] }
|
|
];
|
|
Inplace.ctorParameters = () => [
|
|
{ type: ChangeDetectorRef }
|
|
];
|
|
Inplace.propDecorators = {
|
|
active: [{ type: Input }],
|
|
closable: [{ type: Input }],
|
|
disabled: [{ type: Input }],
|
|
preventClick: [{ type: Input }],
|
|
style: [{ type: Input }],
|
|
styleClass: [{ type: Input }],
|
|
closeIcon: [{ type: Input }],
|
|
templates: [{ type: ContentChildren, args: [PrimeTemplate,] }],
|
|
onActivate: [{ type: Output }],
|
|
onDeactivate: [{ type: Output }]
|
|
};
|
|
class InplaceModule {
|
|
}
|
|
InplaceModule.decorators = [
|
|
{ type: NgModule, args: [{
|
|
imports: [CommonModule, ButtonModule],
|
|
exports: [Inplace, InplaceDisplay, InplaceContent, ButtonModule],
|
|
declarations: [Inplace, InplaceDisplay, InplaceContent]
|
|
},] }
|
|
];
|
|
|
|
/**
|
|
* Generated bundle index. Do not edit.
|
|
*/
|
|
|
|
export { Inplace, InplaceContent, InplaceDisplay, InplaceModule };
|
|
//# sourceMappingURL=primeng-inplace.js.map
|