ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
134 lines (132 loc) • 14.1 kB
JavaScript
import { __decorate } from "tslib";
/**
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/
import { ChangeDetectionStrategy, Component, ContentChild, HostBinding, Input, ViewEncapsulation } from '@angular/core';
import { InputBoolean } from 'ng-zorro-antd/core/util';
import { NzListItemExtraComponent } from './list-item-cell';
import * as i0 from "@angular/core";
import * as i1 from "./list.component";
import * as i2 from "@angular/common";
import * as i3 from "ng-zorro-antd/core/outlet";
import * as i4 from "./list-item-cell";
export class NzListItemComponent {
get isVerticalAndExtra() {
return this.itemLayout === 'vertical' && (!!this.listItemExtraDirective || !!this.nzExtra);
}
constructor(parentComp, cdr) {
this.parentComp = parentComp;
this.cdr = cdr;
this.nzActions = [];
this.nzExtra = null;
this.nzNoFlex = false;
}
ngAfterViewInit() {
this.itemLayout$ = this.parentComp.itemLayoutNotify$.subscribe(val => {
this.itemLayout = val;
this.cdr.detectChanges();
});
}
ngOnDestroy() {
if (this.itemLayout$) {
this.itemLayout$.unsubscribe();
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.3", ngImport: i0, type: NzListItemComponent, deps: [{ token: i1.NzListComponent }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.3", type: NzListItemComponent, selector: "nz-list-item, [nz-list-item]", inputs: { nzActions: "nzActions", nzContent: "nzContent", nzExtra: "nzExtra", nzNoFlex: "nzNoFlex" }, host: { properties: { "class.ant-list-item-no-flex": "this.nzNoFlex" }, classAttribute: "ant-list-item" }, queries: [{ propertyName: "listItemExtraDirective", first: true, predicate: NzListItemExtraComponent, descendants: true }], exportAs: ["nzListItem"], ngImport: i0, template: `
<ng-template #actionsTpl>
<ul nz-list-item-actions *ngIf="nzActions && nzActions.length > 0" [nzActions]="nzActions"></ul>
<ng-content select="nz-list-item-actions, [nz-list-item-actions]"></ng-content>
</ng-template>
<ng-template #contentTpl>
<ng-content select="nz-list-item-meta, [nz-list-item-meta]"></ng-content>
<ng-content></ng-content>
<ng-container *ngIf="nzContent">
<ng-container *nzStringTemplateOutlet="nzContent">{{ nzContent }}</ng-container>
</ng-container>
</ng-template>
<ng-template #extraTpl>
<ng-content select="nz-list-item-extra, [nz-list-item-extra]"></ng-content>
</ng-template>
<ng-template #simpleTpl>
<ng-template [ngTemplateOutlet]="contentTpl"></ng-template>
<ng-template [ngTemplateOutlet]="nzExtra"></ng-template>
<ng-template [ngTemplateOutlet]="extraTpl"></ng-template>
<ng-template [ngTemplateOutlet]="actionsTpl"></ng-template>
</ng-template>
<ng-container *ngIf="isVerticalAndExtra; else simpleTpl">
<div class="ant-list-item-main">
<ng-template [ngTemplateOutlet]="contentTpl"></ng-template>
<ng-template [ngTemplateOutlet]="actionsTpl"></ng-template>
</div>
<nz-list-item-extra *ngIf="nzExtra">
<ng-template [ngTemplateOutlet]="nzExtra"></ng-template>
</nz-list-item-extra>
<ng-template [ngTemplateOutlet]="extraTpl"></ng-template>
</ng-container>
`, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NzStringTemplateOutletDirective, selector: "[nzStringTemplateOutlet]", inputs: ["nzStringTemplateOutletContext", "nzStringTemplateOutlet"], exportAs: ["nzStringTemplateOutlet"] }, { kind: "component", type: i4.NzListItemActionsComponent, selector: "ul[nz-list-item-actions]", inputs: ["nzActions"], exportAs: ["nzListItemActions"] }, { kind: "component", type: i4.NzListItemExtraComponent, selector: "nz-list-item-extra, [nz-list-item-extra]", exportAs: ["nzListItemExtra"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
__decorate([
InputBoolean()
], NzListItemComponent.prototype, "nzNoFlex", void 0);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.3", ngImport: i0, type: NzListItemComponent, decorators: [{
type: Component,
args: [{
selector: 'nz-list-item, [nz-list-item]',
exportAs: 'nzListItem',
template: `
<ng-template #actionsTpl>
<ul nz-list-item-actions *ngIf="nzActions && nzActions.length > 0" [nzActions]="nzActions"></ul>
<ng-content select="nz-list-item-actions, [nz-list-item-actions]"></ng-content>
</ng-template>
<ng-template #contentTpl>
<ng-content select="nz-list-item-meta, [nz-list-item-meta]"></ng-content>
<ng-content></ng-content>
<ng-container *ngIf="nzContent">
<ng-container *nzStringTemplateOutlet="nzContent">{{ nzContent }}</ng-container>
</ng-container>
</ng-template>
<ng-template #extraTpl>
<ng-content select="nz-list-item-extra, [nz-list-item-extra]"></ng-content>
</ng-template>
<ng-template #simpleTpl>
<ng-template [ngTemplateOutlet]="contentTpl"></ng-template>
<ng-template [ngTemplateOutlet]="nzExtra"></ng-template>
<ng-template [ngTemplateOutlet]="extraTpl"></ng-template>
<ng-template [ngTemplateOutlet]="actionsTpl"></ng-template>
</ng-template>
<ng-container *ngIf="isVerticalAndExtra; else simpleTpl">
<div class="ant-list-item-main">
<ng-template [ngTemplateOutlet]="contentTpl"></ng-template>
<ng-template [ngTemplateOutlet]="actionsTpl"></ng-template>
</div>
<nz-list-item-extra *ngIf="nzExtra">
<ng-template [ngTemplateOutlet]="nzExtra"></ng-template>
</nz-list-item-extra>
<ng-template [ngTemplateOutlet]="extraTpl"></ng-template>
</ng-container>
`,
preserveWhitespaces: false,
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
host: {
class: 'ant-list-item'
}
}]
}], ctorParameters: () => [{ type: i1.NzListComponent }, { type: i0.ChangeDetectorRef }], propDecorators: { nzActions: [{
type: Input
}], nzContent: [{
type: Input
}], nzExtra: [{
type: Input
}], nzNoFlex: [{
type: Input
}, {
type: HostBinding,
args: ['class.ant-list-item-no-flex']
}], listItemExtraDirective: [{
type: ContentChild,
args: [NzListItemExtraComponent]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvbGlzdC9saXN0LWl0ZW0uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQTs7O0dBR0c7QUFFSCxPQUFPLEVBRUwsdUJBQXVCLEVBRXZCLFNBQVMsRUFDVCxZQUFZLEVBQ1osV0FBVyxFQUNYLEtBQUssRUFHTCxpQkFBaUIsRUFDbEIsTUFBTSxlQUFlLENBQUM7QUFJdkIsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRXZELE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLGtCQUFrQixDQUFDOzs7Ozs7QUE4QzVELE1BQU0sT0FBTyxtQkFBbUI7SUFhOUIsSUFBSSxrQkFBa0I7UUFDcEIsT0FBTyxJQUFJLENBQUMsVUFBVSxLQUFLLFVBQVUsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsc0JBQXNCLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUM3RixDQUFDO0lBRUQsWUFBb0IsVUFBMkIsRUFBVSxHQUFzQjtRQUEzRCxlQUFVLEdBQVYsVUFBVSxDQUFpQjtRQUFVLFFBQUcsR0FBSCxHQUFHLENBQW1CO1FBZHRFLGNBQVMsR0FBNkIsRUFBRSxDQUFDO1FBRXpDLFlBQU8sR0FBNkIsSUFBSSxDQUFDO1FBQ21CLGFBQVEsR0FBWSxLQUFLLENBQUM7SUFXYixDQUFDO0lBRW5GLGVBQWU7UUFDYixJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsaUJBQWlCLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxFQUFFO1lBQ25FLElBQUksQ0FBQyxVQUFVLEdBQUcsR0FBRyxDQUFDO1lBQ3RCLElBQUksQ0FBQyxHQUFHLENBQUMsYUFBYSxFQUFFLENBQUM7UUFDM0IsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUNwQixJQUFJLENBQUMsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQ2hDO0lBQ0gsQ0FBQzs4R0E5QlUsbUJBQW1CO2tHQUFuQixtQkFBbUIseVVBUWhCLHdCQUF3QiwwRUFoRDVCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQWdDVDs7QUFjb0U7SUFBM0QsWUFBWSxFQUFFO3FEQUF1RTsyRkFOcEYsbUJBQW1CO2tCQTNDL0IsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsOEJBQThCO29CQUN4QyxRQUFRLEVBQUUsWUFBWTtvQkFDdEIsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQWdDVDtvQkFDRCxtQkFBbUIsRUFBRSxLQUFLO29CQUMxQixhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTtvQkFDckMsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07b0JBQy9DLElBQUksRUFBRTt3QkFDSixLQUFLLEVBQUUsZUFBZTtxQkFDdkI7aUJBQ0Y7b0hBSVUsU0FBUztzQkFBakIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDK0QsUUFBUTtzQkFBNUUsS0FBSzs7c0JBQW9CLFdBQVc7dUJBQUMsNkJBQTZCO2dCQUUzQixzQkFBc0I7c0JBQTdELFlBQVk7dUJBQUMsd0JBQXdCIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBVc2Ugb2YgdGhpcyBzb3VyY2UgY29kZSBpcyBnb3Zlcm5lZCBieSBhbiBNSVQtc3R5bGUgbGljZW5zZSB0aGF0IGNhbiBiZVxuICogZm91bmQgaW4gdGhlIExJQ0VOU0UgZmlsZSBhdCBodHRwczovL2dpdGh1Yi5jb20vTkctWk9SUk8vbmctem9ycm8tYW50ZC9ibG9iL21hc3Rlci9MSUNFTlNFXG4gKi9cblxuaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBDb21wb25lbnQsXG4gIENvbnRlbnRDaGlsZCxcbiAgSG9zdEJpbmRpbmcsXG4gIElucHV0LFxuICBPbkRlc3Ryb3ksXG4gIFRlbXBsYXRlUmVmLFxuICBWaWV3RW5jYXBzdWxhdGlvblxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFN1YnNjcmlwdGlvbiB9IGZyb20gJ3J4anMnO1xuXG5pbXBvcnQgeyBCb29sZWFuSW5wdXQsIE56RGlyZWN0aW9uVkhUeXBlIH0gZnJvbSAnbmctem9ycm8tYW50ZC9jb3JlL3R5cGVzJztcbmltcG9ydCB7IElucHV0Qm9vbGVhbiB9IGZyb20gJ25nLXpvcnJvLWFudGQvY29yZS91dGlsJztcblxuaW1wb3J0IHsgTnpMaXN0SXRlbUV4dHJhQ29tcG9uZW50IH0gZnJvbSAnLi9saXN0LWl0ZW0tY2VsbCc7XG5pbXBvcnQgeyBOekxpc3RDb21wb25lbnQgfSBmcm9tICcuL2xpc3QuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbnotbGlzdC1pdGVtLCBbbnotbGlzdC1pdGVtXScsXG4gIGV4cG9ydEFzOiAnbnpMaXN0SXRlbScsXG4gIHRlbXBsYXRlOiBgXG4gICAgPG5nLXRlbXBsYXRlICNhY3Rpb25zVHBsPlxuICAgICAgPHVsIG56LWxpc3QtaXRlbS1hY3Rpb25zICpuZ0lmPVwibnpBY3Rpb25zICYmIG56QWN0aW9ucy5sZW5ndGggPiAwXCIgW256QWN0aW9uc109XCJuekFjdGlvbnNcIj48L3VsPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwibnotbGlzdC1pdGVtLWFjdGlvbnMsIFtuei1saXN0LWl0ZW0tYWN0aW9uc11cIj48L25nLWNvbnRlbnQ+XG4gICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8bmctdGVtcGxhdGUgI2NvbnRlbnRUcGw+XG4gICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJuei1saXN0LWl0ZW0tbWV0YSwgW256LWxpc3QtaXRlbS1tZXRhXVwiPjwvbmctY29udGVudD5cbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJuekNvbnRlbnRcIj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbnpTdHJpbmdUZW1wbGF0ZU91dGxldD1cIm56Q29udGVudFwiPnt7IG56Q29udGVudCB9fTwvbmctY29udGFpbmVyPlxuICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8bmctdGVtcGxhdGUgI2V4dHJhVHBsPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwibnotbGlzdC1pdGVtLWV4dHJhLCBbbnotbGlzdC1pdGVtLWV4dHJhXVwiPjwvbmctY29udGVudD5cbiAgICA8L25nLXRlbXBsYXRlPlxuICAgIDxuZy10ZW1wbGF0ZSAjc2ltcGxlVHBsPlxuICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImNvbnRlbnRUcGxcIj48L25nLXRlbXBsYXRlPlxuICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cIm56RXh0cmFcIj48L25nLXRlbXBsYXRlPlxuICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImV4dHJhVHBsXCI+PC9uZy10ZW1wbGF0ZT5cbiAgICAgIDxuZy10ZW1wbGF0ZSBbbmdUZW1wbGF0ZU91dGxldF09XCJhY3Rpb25zVHBsXCI+PC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLXRlbXBsYXRlPlxuXG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImlzVmVydGljYWxBbmRFeHRyYTsgZWxzZSBzaW1wbGVUcGxcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJhbnQtbGlzdC1pdGVtLW1haW5cIj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImNvbnRlbnRUcGxcIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8bmctdGVtcGxhdGUgW25nVGVtcGxhdGVPdXRsZXRdPVwiYWN0aW9uc1RwbFwiPjwvbmctdGVtcGxhdGU+XG4gICAgICA8L2Rpdj5cbiAgICAgIDxuei1saXN0LWl0ZW0tZXh0cmEgKm5nSWY9XCJuekV4dHJhXCI+XG4gICAgICAgIDxuZy10ZW1wbGF0ZSBbbmdUZW1wbGF0ZU91dGxldF09XCJuekV4dHJhXCI+PC9uZy10ZW1wbGF0ZT5cbiAgICAgIDwvbnotbGlzdC1pdGVtLWV4dHJhPlxuICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImV4dHJhVHBsXCI+PC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgYCxcbiAgcHJlc2VydmVXaGl0ZXNwYWNlczogZmFsc2UsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdhbnQtbGlzdC1pdGVtJ1xuICB9XG59KVxuZXhwb3J0IGNsYXNzIE56TGlzdEl0ZW1Db21wb25lbnQgaW1wbGVtZW50cyBPbkRlc3Ryb3ksIEFmdGVyVmlld0luaXQge1xuICBzdGF0aWMgbmdBY2NlcHRJbnB1dFR5cGVfbnpOb0ZsZXg6IEJvb2xlYW5JbnB1dDtcblxuICBASW5wdXQoKSBuekFjdGlvbnM6IEFycmF5PFRlbXBsYXRlUmVmPHZvaWQ+PiA9IFtdO1xuICBASW5wdXQoKSBuekNvbnRlbnQ/OiBzdHJpbmcgfCBUZW1wbGF0ZVJlZjx2b2lkPjtcbiAgQElucHV0KCkgbnpFeHRyYTogVGVtcGxhdGVSZWY8dm9pZD4gfCBudWxsID0gbnVsbDtcbiAgQElucHV0KCkgQElucHV0Qm9vbGVhbigpIEBIb3N0QmluZGluZygnY2xhc3MuYW50LWxpc3QtaXRlbS1uby1mbGV4JykgbnpOb0ZsZXg6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBAQ29udGVudENoaWxkKE56TGlzdEl0ZW1FeHRyYUNvbXBvbmVudCkgbGlzdEl0ZW1FeHRyYURpcmVjdGl2ZT86IE56TGlzdEl0ZW1FeHRyYUNvbXBvbmVudDtcblxuICBwcml2YXRlIGl0ZW1MYXlvdXQ/OiBOekRpcmVjdGlvblZIVHlwZTtcbiAgcHJpdmF0ZSBpdGVtTGF5b3V0JD86IFN1YnNjcmlwdGlvbjtcblxuICBnZXQgaXNWZXJ0aWNhbEFuZEV4dHJhKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLml0ZW1MYXlvdXQgPT09ICd2ZXJ0aWNhbCcgJiYgKCEhdGhpcy5saXN0SXRlbUV4dHJhRGlyZWN0aXZlIHx8ICEhdGhpcy5uekV4dHJhKTtcbiAgfVxuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcGFyZW50Q29tcDogTnpMaXN0Q29tcG9uZW50LCBwcml2YXRlIGNkcjogQ2hhbmdlRGV0ZWN0b3JSZWYpIHt9XG5cbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgIHRoaXMuaXRlbUxheW91dCQgPSB0aGlzLnBhcmVudENvbXAuaXRlbUxheW91dE5vdGlmeSQuc3Vic2NyaWJlKHZhbCA9PiB7XG4gICAgICB0aGlzLml0ZW1MYXlvdXQgPSB2YWw7XG4gICAgICB0aGlzLmNkci5kZXRlY3RDaGFuZ2VzKCk7XG4gICAgfSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5pdGVtTGF5b3V0JCkge1xuICAgICAgdGhpcy5pdGVtTGF5b3V0JC51bnN1YnNjcmliZSgpO1xuICAgIH1cbiAgfVxufVxuIl19