ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
205 lines (196 loc) • 7.79 kB
JavaScript
import { BidiModule } from '@angular/cdk/bidi';
import { CommonModule } from '@angular/common';
import { Component, ChangeDetectionStrategy, Renderer2, ElementRef, Directive, ChangeDetectorRef, Input, ContentChildren, TemplateRef, NgModule } from '@angular/core';
import { __decorate, __metadata } from 'tslib';
import { NzConfigService, WithConfig } from 'ng-zorro-antd/core/config';
import { warnDeprecation } from 'ng-zorro-antd/core/logger';
import { InputBoolean } from 'ng-zorro-antd/core/util';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
/**
* 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
*/
/**
* @deprecated NzSpaceItemLegacyComponent will be removed on 12.0.0.
* @breaking-change 12.0.0
*/
class NzSpaceItemLegacyComponent {
constructor(renderer, elementRef) {
this.renderer = renderer;
this.elementRef = elementRef;
}
setDirectionAndSize(direction, size) {
if (direction === 'horizontal') {
this.renderer.removeStyle(this.elementRef.nativeElement, 'margin-bottom');
this.renderer.setStyle(this.elementRef.nativeElement, 'margin-right', `${size}px`);
}
else {
this.renderer.removeStyle(this.elementRef.nativeElement, 'margin-right');
this.renderer.setStyle(this.elementRef.nativeElement, 'margin-bottom', `${size}px`);
}
}
ngOnInit() { }
}
NzSpaceItemLegacyComponent.decorators = [
{ type: Component, args: [{
selector: 'nz-space-item, [nz-space-item]',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `
<ng-content></ng-content>
`,
host: {
class: 'ant-space-item'
}
},] }
];
NzSpaceItemLegacyComponent.ctorParameters = () => [
{ type: Renderer2 },
{ type: ElementRef }
];
/**
* 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
*/
class NzSpaceItemDirective {
constructor() { }
}
NzSpaceItemDirective.decorators = [
{ type: Directive, args: [{
selector: '[nzSpaceItem]'
},] }
];
NzSpaceItemDirective.ctorParameters = () => [];
/**
* 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
*/
const NZ_CONFIG_MODULE_NAME = 'space';
const SPACE_SIZE = {
small: 8,
middle: 16,
large: 24
};
class NzSpaceComponent {
constructor(nzConfigService, cdr) {
this.nzConfigService = nzConfigService;
this.cdr = cdr;
this._nzModuleName = NZ_CONFIG_MODULE_NAME;
this.nzDirection = 'horizontal';
this.nzSplit = null;
this.nzWrap = false;
this.nzSize = 'small';
this.spaceSize = SPACE_SIZE.small;
this.destroy$ = new Subject();
}
updateSpaceItems() {
var _a;
const numberSize = typeof this.nzSize === 'string' ? SPACE_SIZE[this.nzSize] : this.nzSize;
this.spaceSize = numberSize / (!!this.nzSplit ? 2 : 1);
if ((_a = this.nzSpaceItemComponents) === null || _a === void 0 ? void 0 : _a.length) {
warnDeprecation('`nz-space-item` in `nz-space` will be removed in 12.0.0, please use `*nzSpaceItem` instead.');
this.nzSpaceItemComponents.forEach(item => {
item.setDirectionAndSize(this.nzDirection, this.spaceSize);
});
}
this.cdr.markForCheck();
}
ngOnChanges() {
this.updateSpaceItems();
this.mergedAlign = this.nzAlign === undefined && this.nzDirection === 'horizontal' ? 'center' : this.nzAlign;
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
ngAfterContentInit() {
this.updateSpaceItems();
this.nzSpaceItemComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => {
this.updateSpaceItems();
});
}
}
NzSpaceComponent.decorators = [
{ type: Component, args: [{
selector: 'nz-space, [nz-space]',
exportAs: 'NzSpace',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `
<ng-content></ng-content>
<ng-template ngFor let-item let-last="last" let-index="index" [ngForOf]="items">
<div
class="ant-space-item"
[style.margin-bottom.px]="nzDirection === 'vertical' ? (last ? null : spaceSize) : null"
[style.margin-right.px]="nzDirection === 'horizontal' ? (last ? null : spaceSize) : null"
>
<ng-container [ngTemplateOutlet]="item"></ng-container>
</div>
<span
*ngIf="nzSplit && !last"
class="ant-space-split"
[style.margin-bottom.px]="nzDirection === 'vertical' ? (last ? null : spaceSize) : null"
[style.margin-right.px]="nzDirection === 'horizontal' ? (last ? null : spaceSize) : null"
>
<ng-template [ngTemplateOutlet]="nzSplit" [ngTemplateOutletContext]="{ $implicit: index }"></ng-template>
</span>
</ng-template>
`,
host: {
class: 'ant-space',
'[class.ant-space-horizontal]': 'nzDirection === "horizontal"',
'[class.ant-space-vertical]': 'nzDirection === "vertical"',
'[class.ant-space-align-start]': 'mergedAlign === "start"',
'[class.ant-space-align-end]': 'mergedAlign === "end"',
'[class.ant-space-align-center]': 'mergedAlign === "center"',
'[class.ant-space-align-baseline]': 'mergedAlign === "baseline"',
'[style.flex-wrap]': 'nzWrap ? "wrap" : null'
}
},] }
];
NzSpaceComponent.ctorParameters = () => [
{ type: NzConfigService },
{ type: ChangeDetectorRef }
];
NzSpaceComponent.propDecorators = {
nzDirection: [{ type: Input }],
nzAlign: [{ type: Input }],
nzSplit: [{ type: Input }],
nzWrap: [{ type: Input }],
nzSize: [{ type: Input }],
nzSpaceItemComponents: [{ type: ContentChildren, args: [NzSpaceItemLegacyComponent,] }],
items: [{ type: ContentChildren, args: [NzSpaceItemDirective, { read: TemplateRef },] }]
};
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], NzSpaceComponent.prototype, "nzWrap", void 0);
__decorate([
WithConfig(),
__metadata("design:type", Object)
], NzSpaceComponent.prototype, "nzSize", void 0);
/**
* 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
*/
class NzSpaceModule {
}
NzSpaceModule.decorators = [
{ type: NgModule, args: [{
declarations: [NzSpaceComponent, NzSpaceItemLegacyComponent, NzSpaceItemDirective],
exports: [NzSpaceComponent, NzSpaceItemLegacyComponent, NzSpaceItemDirective],
imports: [BidiModule, CommonModule]
},] }
];
/**
* 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
*/
/**
* 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
*/
/**
* Generated bundle index. Do not edit.
*/
export { NzSpaceComponent, NzSpaceItemDirective, NzSpaceItemLegacyComponent, NzSpaceModule };
//# sourceMappingURL=ng-zorro-antd-space.js.map