243 lines
14 KiB
JavaScript
243 lines
14 KiB
JavaScript
import { __esDecorate, __runInitializers } from 'tslib';
|
|
import { Directionality } from '@angular/cdk/bidi';
|
|
import * as i0 from '@angular/core';
|
|
import { inject, ElementRef, ChangeDetectorRef, Renderer2, DestroyRef, signal, computed, contentChild, viewChild, afterEveryRender, booleanAttribute, Input, ContentChild, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
|
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
import { Subject } from 'rxjs';
|
|
import { startWith, filter } from 'rxjs/operators';
|
|
import { WithConfig, onConfigChangeEventForComponent } from 'ng-zorro-antd/core/config';
|
|
import { fromEventOutsideAngular } from 'ng-zorro-antd/core/util';
|
|
import * as i2 from 'ng-zorro-antd/icon';
|
|
import { NzIconDirective, NzIconModule } from 'ng-zorro-antd/icon';
|
|
import * as i1 from 'ng-zorro-antd/space';
|
|
import { NZ_SPACE_COMPACT_SIZE, NZ_SPACE_COMPACT_ITEM_TYPE, NzSpaceCompactItemDirective } from 'ng-zorro-antd/space';
|
|
import { ɵNzTransitionPatchModule as _NzTransitionPatchModule } from 'ng-zorro-antd/core/transition-patch';
|
|
import { NzWaveModule } from 'ng-zorro-antd/core/wave';
|
|
|
|
const NZ_CONFIG_MODULE_NAME = 'button';
|
|
let NzButtonComponent = (() => {
|
|
let _nzSize_decorators;
|
|
let _nzSize_initializers = [];
|
|
let _nzSize_extraInitializers = [];
|
|
return class NzButtonComponent {
|
|
static {
|
|
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
|
|
_nzSize_decorators = [WithConfig()];
|
|
__esDecorate(null, null, _nzSize_decorators, { kind: "field", name: "nzSize", static: false, private: false, access: { has: obj => "nzSize" in obj, get: obj => obj.nzSize, set: (obj, value) => { obj.nzSize = value; } }, metadata: _metadata }, _nzSize_initializers, _nzSize_extraInitializers);
|
|
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
}
|
|
elementRef = inject(ElementRef);
|
|
cdr = inject(ChangeDetectorRef);
|
|
renderer = inject(Renderer2);
|
|
directionality = inject(Directionality);
|
|
destroyRef = inject(DestroyRef);
|
|
_nzModuleName = NZ_CONFIG_MODULE_NAME;
|
|
nzIconDirectiveElement;
|
|
nzBlock = false;
|
|
nzGhost = false;
|
|
/**
|
|
* @deprecated Will be removed in v22.0.0. Please use `nz-input-search` instead.
|
|
*/
|
|
nzSearch = false;
|
|
nzLoading = false;
|
|
nzDanger = false;
|
|
disabled = false;
|
|
tabIndex = null;
|
|
nzType = null;
|
|
nzShape = null;
|
|
nzSize = __runInitializers(this, _nzSize_initializers, 'default');
|
|
dir = (__runInitializers(this, _nzSize_extraInitializers), 'ltr');
|
|
elementOnly = signal(false, ...(ngDevMode ? [{ debugName: "elementOnly" }] : []));
|
|
size = signal(this.nzSize, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
compactSize = inject(NZ_SPACE_COMPACT_SIZE, { optional: true });
|
|
loading$ = new Subject();
|
|
finalSize = computed(() => {
|
|
if (this.compactSize) {
|
|
return this.compactSize();
|
|
}
|
|
return this.size();
|
|
}, ...(ngDevMode ? [{ debugName: "finalSize" }] : []));
|
|
iconDir = contentChild(NzIconDirective, ...(ngDevMode ? [{ debugName: "iconDir" }] : []));
|
|
loadingIconDir = viewChild(NzIconDirective, ...(ngDevMode ? [{ debugName: "loadingIconDir" }] : []));
|
|
iconOnly = computed(() => this.elementOnly() && (!!this.iconDir() || !!this.loadingIconDir()), ...(ngDevMode ? [{ debugName: "iconOnly" }] : []));
|
|
insertSpan(nodes, renderer) {
|
|
nodes.forEach(node => {
|
|
if (node.nodeType === Node.TEXT_NODE && node.textContent.trim().length > 0) {
|
|
const span = renderer.createElement('span');
|
|
const parent = renderer.parentNode(node);
|
|
renderer.insertBefore(parent, span, node);
|
|
renderer.appendChild(span, node);
|
|
}
|
|
});
|
|
}
|
|
constructor() {
|
|
onConfigChangeEventForComponent(NZ_CONFIG_MODULE_NAME, () => {
|
|
this.size.set(this.nzSize);
|
|
this.cdr.markForCheck();
|
|
});
|
|
let elementOnly = false;
|
|
afterEveryRender({
|
|
read: () => {
|
|
const { childNodes, children } = this.elementRef.nativeElement;
|
|
const hasText = Array.from(childNodes).some(node => node.nodeType === Node.TEXT_NODE && node.textContent.trim().length > 0);
|
|
const visibleElementCount = Array.from(children).filter(element => element.style.display !== 'none').length;
|
|
elementOnly = !hasText && visibleElementCount === 1;
|
|
},
|
|
write: () => this.elementOnly.set(elementOnly)
|
|
});
|
|
}
|
|
ngOnInit() {
|
|
this.size.set(this.nzSize);
|
|
this.directionality.change?.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((direction) => {
|
|
this.dir = direction;
|
|
this.cdr.detectChanges();
|
|
});
|
|
this.dir = this.directionality.value;
|
|
// Caretaker note: this event listener could've been added through `host.click` or `HostListener`.
|
|
// The compiler generates the `ɵɵlistener` instruction which wraps the actual listener internally into the
|
|
// function, which runs `markDirty()` before running the actual listener (the decorated class method).
|
|
// Since we're preventing the default behavior and stopping event propagation this doesn't require Angular to run the change detection.
|
|
fromEventOutsideAngular(this.elementRef.nativeElement, 'click', { capture: true })
|
|
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
.subscribe(event => {
|
|
if ((this.disabled && event.target?.tagName === 'A') || this.nzLoading) {
|
|
event.preventDefault();
|
|
event.stopImmediatePropagation();
|
|
}
|
|
});
|
|
}
|
|
ngOnChanges({ nzLoading, nzSize }) {
|
|
if (nzLoading) {
|
|
this.loading$.next(this.nzLoading);
|
|
}
|
|
if (nzSize) {
|
|
this.size.set(nzSize.currentValue);
|
|
}
|
|
}
|
|
ngAfterViewInit() {
|
|
this.insertSpan(this.elementRef.nativeElement.childNodes, this.renderer);
|
|
}
|
|
ngAfterContentInit() {
|
|
this.loading$
|
|
.pipe(startWith(this.nzLoading), filter(() => !!this.nzIconDirectiveElement), takeUntilDestroyed(this.destroyRef))
|
|
.subscribe(loading => {
|
|
const nativeElement = this.nzIconDirectiveElement.nativeElement;
|
|
if (loading) {
|
|
this.renderer.setStyle(nativeElement, 'display', 'none');
|
|
}
|
|
else {
|
|
this.renderer.removeStyle(nativeElement, 'display');
|
|
}
|
|
});
|
|
}
|
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: NzButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.0", type: NzButtonComponent, isStandalone: true, selector: "button[nz-button], a[nz-button]", inputs: { nzBlock: ["nzBlock", "nzBlock", booleanAttribute], nzGhost: ["nzGhost", "nzGhost", booleanAttribute], nzSearch: ["nzSearch", "nzSearch", booleanAttribute], nzLoading: ["nzLoading", "nzLoading", booleanAttribute], nzDanger: ["nzDanger", "nzDanger", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], tabIndex: "tabIndex", nzType: "nzType", nzShape: "nzShape", nzSize: "nzSize" }, host: { properties: { "class.ant-btn-default": "nzType === 'default'", "class.ant-btn-primary": "nzType === 'primary'", "class.ant-btn-dashed": "nzType === 'dashed'", "class.ant-btn-link": "nzType === 'link'", "class.ant-btn-text": "nzType === 'text'", "class.ant-btn-circle": "nzShape === 'circle'", "class.ant-btn-round": "nzShape === 'round'", "class.ant-btn-lg": "finalSize() === 'large'", "class.ant-btn-sm": "finalSize() === 'small'", "class.ant-btn-dangerous": "nzDanger", "class.ant-btn-loading": "nzLoading", "class.ant-btn-background-ghost": "nzGhost", "class.ant-btn-block": "nzBlock", "class.ant-input-search-button": "nzSearch", "class.ant-btn-rtl": "dir === 'rtl'", "class.ant-btn-icon-only": "iconOnly()", "attr.tabindex": "disabled ? -1 : (tabIndex === null ? null : tabIndex)", "attr.disabled": "disabled || null" }, classAttribute: "ant-btn" }, providers: [{ provide: NZ_SPACE_COMPACT_ITEM_TYPE, useValue: 'btn' }], queries: [{ propertyName: "iconDir", first: true, predicate: NzIconDirective, descendants: true, isSignal: true }, { propertyName: "nzIconDirectiveElement", first: true, predicate: NzIconDirective, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "loadingIconDir", first: true, predicate: NzIconDirective, descendants: true, isSignal: true }], exportAs: ["nzButton"], usesOnChanges: true, hostDirectives: [{ directive: i1.NzSpaceCompactItemDirective }], ngImport: i0, template: `
|
|
@if (nzLoading) {
|
|
<span class="ant-btn-icon ant-btn-loading-icon">
|
|
<nz-icon nzType="loading" />
|
|
</span>
|
|
}
|
|
<ng-content></ng-content>
|
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i2.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
};
|
|
})();
|
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: NzButtonComponent, decorators: [{
|
|
type: Component,
|
|
args: [{
|
|
selector: 'button[nz-button], a[nz-button]',
|
|
exportAs: 'nzButton',
|
|
imports: [NzIconModule],
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
encapsulation: ViewEncapsulation.None,
|
|
template: `
|
|
@if (nzLoading) {
|
|
<span class="ant-btn-icon ant-btn-loading-icon">
|
|
<nz-icon nzType="loading" />
|
|
</span>
|
|
}
|
|
<ng-content></ng-content>
|
|
`,
|
|
host: {
|
|
class: 'ant-btn',
|
|
'[class.ant-btn-default]': `nzType === 'default'`,
|
|
'[class.ant-btn-primary]': `nzType === 'primary'`,
|
|
'[class.ant-btn-dashed]': `nzType === 'dashed'`,
|
|
'[class.ant-btn-link]': `nzType === 'link'`,
|
|
'[class.ant-btn-text]': `nzType === 'text'`,
|
|
'[class.ant-btn-circle]': `nzShape === 'circle'`,
|
|
'[class.ant-btn-round]': `nzShape === 'round'`,
|
|
'[class.ant-btn-lg]': `finalSize() === 'large'`,
|
|
'[class.ant-btn-sm]': `finalSize() === 'small'`,
|
|
'[class.ant-btn-dangerous]': `nzDanger`,
|
|
'[class.ant-btn-loading]': `nzLoading`,
|
|
'[class.ant-btn-background-ghost]': `nzGhost`,
|
|
'[class.ant-btn-block]': `nzBlock`,
|
|
'[class.ant-input-search-button]': `nzSearch`,
|
|
'[class.ant-btn-rtl]': `dir === 'rtl'`,
|
|
'[class.ant-btn-icon-only]': `iconOnly()`,
|
|
'[attr.tabindex]': 'disabled ? -1 : (tabIndex === null ? null : tabIndex)',
|
|
'[attr.disabled]': 'disabled || null'
|
|
},
|
|
hostDirectives: [NzSpaceCompactItemDirective],
|
|
providers: [{ provide: NZ_SPACE_COMPACT_ITEM_TYPE, useValue: 'btn' }]
|
|
}]
|
|
}], ctorParameters: () => [], propDecorators: { nzIconDirectiveElement: [{
|
|
type: ContentChild,
|
|
args: [NzIconDirective, { read: ElementRef }]
|
|
}], nzBlock: [{
|
|
type: Input,
|
|
args: [{ transform: booleanAttribute }]
|
|
}], nzGhost: [{
|
|
type: Input,
|
|
args: [{ transform: booleanAttribute }]
|
|
}], nzSearch: [{
|
|
type: Input,
|
|
args: [{ transform: booleanAttribute }]
|
|
}], nzLoading: [{
|
|
type: Input,
|
|
args: [{ transform: booleanAttribute }]
|
|
}], nzDanger: [{
|
|
type: Input,
|
|
args: [{ transform: booleanAttribute }]
|
|
}], disabled: [{
|
|
type: Input,
|
|
args: [{ transform: booleanAttribute }]
|
|
}], tabIndex: [{
|
|
type: Input
|
|
}], nzType: [{
|
|
type: Input
|
|
}], nzShape: [{
|
|
type: Input
|
|
}], nzSize: [{
|
|
type: Input
|
|
}] } });
|
|
|
|
/**
|
|
* 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 NzButtonModule {
|
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: NzButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: NzButtonModule, imports: [NzButtonComponent], exports: [NzButtonComponent, _NzTransitionPatchModule, NzWaveModule] });
|
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: NzButtonModule, imports: [NzButtonComponent, _NzTransitionPatchModule, NzWaveModule] });
|
|
}
|
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: NzButtonModule, decorators: [{
|
|
type: NgModule,
|
|
args: [{
|
|
imports: [NzButtonComponent],
|
|
exports: [NzButtonComponent, _NzTransitionPatchModule, NzWaveModule]
|
|
}]
|
|
}] });
|
|
|
|
/**
|
|
* 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 { NzButtonComponent, NzButtonModule };
|
|
//# sourceMappingURL=ng-zorro-antd-button.mjs.map
|