ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
446 lines (434 loc) • 20.3 kB
TypeScript
import { Observable, BehaviorSubject, Subject } from 'rxjs';
import { NzTreeBaseService, NzTreeNode, NzTreeNodeKey, NzTreeBase } from 'ng-zorro-antd/core/tree';
import { NzSafeAny, NzSizeLDSType, NzVariant, NgStyleInterface, NzStatus, NgClassInterface, NzValidateStatus } from 'ng-zorro-antd/core/types';
import * as i0 from '@angular/core';
import { OnInit, TemplateRef, EventEmitter, OnChanges, ElementRef, QueryList, SimpleChanges } from '@angular/core';
import { Direction } from '@angular/cdk/bidi';
import { CdkConnectedOverlay, ConnectionPositionPair, ConnectedOverlayPositionChange } from '@angular/cdk/overlay';
import { ControlValueAccessor } from '@angular/forms';
import { NzConfigKey } from 'ng-zorro-antd/core/config';
import { NzFormStatusService } from 'ng-zorro-antd/core/form';
import { NzNoAnimationDirective } from 'ng-zorro-antd/core/no-animation';
import { NzCascaderI18nInterface } from 'ng-zorro-antd/i18n';
import { NzSelectSearchComponent } from 'ng-zorro-antd/select';
import * as i1 from 'ng-zorro-antd/space';
interface InternalFieldNames {
label: string;
value: string;
}
declare class NzCascaderTreeService extends NzTreeBaseService {
fieldNames: InternalFieldNames;
treeNodePostProcessor: (node: NzTreeNode) => void;
getOptionValue(node: NzTreeNode): NzSafeAny;
getOptionLabel(node: NzTreeNode): string;
get children(): NzTreeNode[];
set children(value: Array<NzTreeNode | NzSafeAny>);
/**
* Map list of nodes to list of option
*/
toOptions(nodes: NzTreeNode[]): NzCascaderOption[];
getAncestorNodeList(node: NzTreeNode | null): NzTreeNode[];
/**
* Render by nzCheckedKeys
* When keys equals null, just render with checkStrictly
*
* @param paths
* @param checkStrictly
*/
conductCheckPaths(paths: NzTreeNodeKey[][] | null, checkStrictly: boolean): void;
conductSelectedPaths(paths: NzTreeNodeKey[][]): void;
private handleMissingNodeList;
private getMissingNodeList;
private createMissingNode;
static ɵfac: i0.ɵɵFactoryDeclaration<NzCascaderTreeService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<NzCascaderTreeService>;
}
/**
* 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
*/
type NzCascaderExpandTrigger = 'click' | 'hover';
type NzCascaderTriggerType = 'click' | 'hover';
type NzCascaderSize = NzSizeLDSType;
type NzCascaderFilter = (searchValue: string, path: NzCascaderOption[]) => boolean;
type NzCascaderSorter = (a: NzCascaderOption[], b: NzCascaderOption[], inputValue: string) => number;
type NzCascaderPlacement = 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';
interface NzCascaderOption {
value?: NzSafeAny;
label?: string;
title?: string;
disabled?: boolean;
loading?: boolean;
isLeaf?: boolean;
children?: NzCascaderOption[];
disableCheckbox?: boolean;
[key: string]: NzSafeAny;
}
interface NzShowSearchOptions {
filter?: NzCascaderFilter;
sorter?: NzCascaderSorter;
}
declare function isShowSearchObject(options: NzShowSearchOptions | boolean): options is NzShowSearchOptions;
/**
* To avoid circular dependency, provide an interface of `NzCascaderComponent`
* for `NzCascaderService`.
*/
interface NzCascaderComponentAsSource {
inputValue: string;
nzShowSearch: NzShowSearchOptions | boolean;
nzLabelProperty: string;
nzValueProperty: string;
nzChangeOnSelect: boolean;
selectedNodes: NzTreeNode[];
get treeService(): NzCascaderTreeService;
coerceTreeNodes(value: NzSafeAny[]): NzTreeNode[];
updateSelectedNodes(): void;
nzChangeOn?(option: NzCascaderOption, level: number): boolean;
nzLoadData?(node: NzCascaderOption, index: number): PromiseLike<NzSafeAny> | Observable<NzSafeAny>;
}
/**
* 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
*/
declare function isChildNode(node: NzTreeNode): boolean;
declare function isParentNode(node: NzTreeNode): boolean;
/**
* 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
*/
declare class NzCascaderOptionComponent implements OnInit {
private cdr;
optionTemplate: TemplateRef<NzCascaderOption> | null;
node: NzTreeNode;
activated: boolean;
highlightText: string;
nzLabelProperty: string;
columnIndex: number;
expandIcon: string | TemplateRef<void>;
dir: Direction;
checkable?: boolean;
readonly check: EventEmitter<void>;
readonly nativeElement: HTMLElement;
ngOnInit(): void;
get checked(): boolean;
get halfChecked(): boolean;
get disabled(): boolean;
markForCheck(): void;
onCheckboxClick(event: MouseEvent): void;
static ɵfac: i0.ɵɵFactoryDeclaration<NzCascaderOptionComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<NzCascaderOptionComponent, "[nz-cascader-option]", ["nzCascaderOption"], { "optionTemplate": { "alias": "optionTemplate"; "required": false; }; "node": { "alias": "node"; "required": false; }; "activated": { "alias": "activated"; "required": false; }; "highlightText": { "alias": "highlightText"; "required": false; }; "nzLabelProperty": { "alias": "nzLabelProperty"; "required": false; }; "columnIndex": { "alias": "columnIndex"; "required": false; }; "expandIcon": { "alias": "expandIcon"; "required": false; }; "dir": { "alias": "dir"; "required": false; }; "checkable": { "alias": "checkable"; "required": false; }; }, { "check": "check"; }, never, never, true, never>;
static ngAcceptInputType_columnIndex: unknown;
static ngAcceptInputType_checkable: unknown;
}
/**
* All data is stored and parsed in NzCascaderService.
*/
declare class NzCascaderService {
private destroyRef;
/** Activated options in each column. */
activatedNodes: NzTreeNode[];
/** An array to store cascader items arranged in different layers. */
columns: NzTreeNode[][];
/** If user has entered searching mode. */
inSearchingMode: boolean;
values: NzSafeAny[];
/**
* Emit an event when loading state changes.
* Emit true if nzOptions is loading by `nzLoadData`.
*/
readonly $loading: BehaviorSubject<boolean>;
/**
* Emit an event to notify cascader it needs to redraw because activated or
* selected options are changed.
*/
readonly $redraw: Subject<void>;
/**
* Emit an event when an option gets selected.
* Emit true if a leaf options is selected.
*/
readonly $nodeSelected: Subject<NzTreeNode | null>;
/**
* Emit an event to notify cascader it needs to quit searching mode.
* Only emit when user do select a searching option.
*/
readonly $quitSearching: Subject<void>;
/** To hold columns before entering searching mode. */
private columnSnapshot;
private cascaderComponent;
private searchOptionPathMap;
constructor();
/** Return cascader options in the first layer. */
get nzOptions(): NzCascaderOption[];
/**
* Bind cascader component so this service could use inputs.
*/
withComponent(cascaderComponent: NzCascaderComponentAsSource): void;
/**
* Try to set an option as activated.
*
* @param node Cascader option node
* @param columnIndex Of which column this option is in
* @param performSelect Select
* @param multiple Multiple mode
* @param loadingChildren Try to load children asynchronously.
*/
setNodeActivated(node: NzTreeNode, columnIndex: number, performSelect?: boolean, multiple?: boolean, loadingChildren?: boolean): void;
/**
* Set an option as selected.
* @param node
* @param index
* @param multiple
*/
setNodeSelected(node: NzTreeNode, index: number, multiple?: boolean): void;
setNodeDeactivatedSinceColumn(column: number): void;
/**
* Set a searching option as selected, finishing up things.
*
* @param node
* @param multiple
*/
setSearchOptionSelected(node: NzTreeNode, multiple?: boolean): void;
/**
* Reset node's `title` and `disabled` status and clear `searchOptionPathMap`.
*/
private clearSearchOptions;
/**
* Filter cascader options to reset `columns`.
*
* @param searchValue The string user wants to search.
*/
prepareSearchOptions(searchValue: string): void;
/**
* Set searching mode by UI. It deals with things not directly related to UI.
*
* @param toSearching If this cascader is entering searching mode
*/
setSearchingMode(toSearching: boolean): void;
/**
* Clear selected options.
*/
clear(): void;
getOptionLabel(o: NzCascaderOption): string;
getOptionValue(o: NzCascaderOption): NzSafeAny;
/**
* Try to insert options into a column.
*
* @param nodes Options to insert
* @param columnIndex Position
*/
setColumnData(nodes: NzTreeNode[], columnIndex: number): void;
/**
* Set all columns data according to activate option's path
*/
private trackAncestorColumnData;
/**
* Set all ancestor options as activated.
*/
private trackAncestorActivatedNodes;
private dropBehindActivatedNodes;
dropBehindColumns(lastReserveIndex: number): void;
/**
* Load children of an option asynchronously.
*/
loadChildren(node: NzTreeNode | null, columnIndex: number, onLoaded?: (options: NzCascaderOption[]) => void): void;
isLoaded(index: number): boolean;
static ɵfac: i0.ɵɵFactoryDeclaration<NzCascaderService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<NzCascaderService>;
}
declare class NzCascaderComponent extends NzTreeBase implements NzCascaderComponentAsSource, OnInit, OnChanges, ControlValueAccessor {
private ngZone;
private cdr;
private i18nService;
private elementRef;
private renderer;
private directionality;
private destroyRef;
readonly _nzModuleName: NzConfigKey;
selectContainer: ElementRef;
set input(inputComponent: NzSelectSearchComponent | undefined);
get input(): ElementRef<HTMLInputElement> | undefined;
/** Used to store the native `<input type="search" />` element since it might be set asynchronously. */
private input$;
menu: ElementRef;
overlay: CdkConnectedOverlay;
cascaderItems: QueryList<NzCascaderOptionComponent>;
nzOptionRender: TemplateRef<{
$implicit: NzCascaderOption;
index: number;
}> | null;
nzShowInput: boolean;
nzShowArrow: boolean;
nzAllowClear: boolean;
nzAutoFocus: boolean;
nzChangeOnSelect: boolean;
nzDisabled: boolean;
nzColumnClassName?: string;
nzExpandTrigger: NzCascaderExpandTrigger;
nzValueProperty: string;
nzLabelProperty: string;
nzLabelRender: TemplateRef<typeof this.labelRenderContext> | null;
nzVariant: NzVariant;
nzNotFoundContent?: string | TemplateRef<void>;
nzSize: NzCascaderSize;
nzBackdrop: boolean;
nzShowSearch: boolean | NzShowSearchOptions;
nzPlaceHolder: string;
nzMenuClassName?: string;
nzMenuStyle: NgStyleInterface | null;
/**
* Duration in milliseconds before opening the menu when the mouse enters the trigger.
* @default 150
*/
nzMouseLeaveDelay: number;
/**
* Duration in milliseconds before closing the menu when the mouse leaves the trigger.
* @default 150
*/
nzMouseEnterDelay: number;
nzStatus: NzStatus;
nzMultiple: boolean;
nzMaxTagCount: number;
nzPlacement: NzCascaderPlacement;
nzTriggerAction: NzCascaderTriggerType | NzCascaderTriggerType[];
nzChangeOn?: (option: NzCascaderOption, level: number) => boolean;
nzLoadData?: (node: NzCascaderOption, index: number) => PromiseLike<NzSafeAny> | Observable<NzSafeAny>;
nzDisplayWith: (nodes: NzCascaderOption[]) => string | undefined;
nzSuffixIcon: string | TemplateRef<void>;
nzExpandIcon: string | TemplateRef<void>;
get nzOptions(): NzCascaderOption[] | null;
set nzOptions(options: NzCascaderOption[] | null);
get treeService(): NzCascaderTreeService;
readonly nzVisibleChange: EventEmitter<boolean>;
readonly nzSelectionChange: EventEmitter<NzCascaderOption[]>;
readonly nzRemoved: EventEmitter<NzCascaderOption>;
readonly nzClear: EventEmitter<void>;
prefixCls: string;
statusCls: NgClassInterface;
status: NzValidateStatus;
hasFeedback: boolean;
/**
* If the dropdown should show the empty content.
* `true` if there's no options.
*/
shouldShowEmpty: boolean;
el: HTMLElement;
menuVisible: boolean;
isLoading: boolean;
labelRenderText?: string;
labelRenderContext: {};
onChange: Function;
onTouched: Function;
positions: ConnectionPositionPair[];
/**
* Dropdown width in pixel.
*/
dropdownWidthStyle?: string;
dropdownHeightStyle: 'auto' | '';
dropdownPosition: NzCascaderPlacement;
isFocused: boolean;
locale: NzCascaderI18nInterface;
dir: Direction;
isComposing: boolean;
protected get overlayOrigin(): ElementRef;
protected finalSize: i0.Signal<NzSizeLDSType>;
private size;
private compactSize;
private inputString;
private isOpening;
private delayMenuTimer?;
private delaySelectTimer?;
private isNzDisableFirstChange;
selectedNodes: NzTreeNode[];
get inSearchingMode(): boolean;
set inputValue(inputValue: string);
get inputValue(): string;
private get hasInput();
private get hasValue();
get showLabelRender(): boolean;
get showPlaceholder(): boolean;
get clearIconVisible(): boolean;
get isLabelRenderTemplate(): boolean;
noAnimation: NzNoAnimationDirective | null;
nzFormStatusService: NzFormStatusService | null;
private nzFormNoStatusService;
cascaderService: NzCascaderService;
constructor();
ngOnInit(): void;
ngOnChanges(changes: SimpleChanges): void;
registerOnChange(fn: () => {}): void;
registerOnTouched(fn: () => {}): void;
writeValue(value: NzSafeAny): void;
private setupSelectionChangeListener;
delaySetMenuVisible(visible: boolean, delay?: number, setOpening?: boolean): void;
setMenuVisible(visible: boolean): void;
private clearDelayMenuTimer;
clearSelection(event?: Event): void;
clearSelectedNodes(): void;
emitValue(values: NzSafeAny[] | null): void;
focus(): void;
blur(): void;
handleInputBlur(): void;
handleInputFocus(): void;
isComposingChange(isComposing: boolean): void;
onTriggerClick(): void;
onTriggerMouseEnter(): void;
onTriggerMouseLeave(event: MouseEvent): void;
onOptionMouseEnter(node: NzTreeNode, columnIndex: number, event: Event): void;
onOptionMouseLeave(node: NzTreeNode, _columnIndex: number, event: Event): void;
/**
* Get ancestor options of a node
*/
protected getAncestorOptionList(node: NzTreeNode | null): NzCascaderOption[];
updateSelectedNodes(init?: boolean, updateValue?: boolean): void;
onOptionClick(node: NzTreeNode, columnIndex: number, event: Event): void;
onOptionCheck(node: NzTreeNode, columnIndex: number, performActivate?: boolean): void;
removeSelected(node: NzTreeNode, emitEvent?: boolean): void;
onClickOutside(event: MouseEvent): void;
onPositionChange(position: ConnectedOverlayPositionChange): void;
private isActionTrigger;
private onEnter;
private moveUpOrDown;
private moveLeft;
private moveRight;
private clearDelaySelectTimer;
private delaySetOptionActivated;
private toggleSearchingMode;
isOptionActivated(node: NzTreeNode, index: number): boolean;
setDisabledState(isDisabled: boolean): void;
closeMenu(): void;
/**
* Reposition the cascader panel. When a menu opens, the cascader expands
* and may exceed the boundary of browser's window.
*/
private reposition;
/**
* When a cascader options is changed, a child needs to know that it should re-render.
*/
private checkChildren;
private setDisplayLabel;
private setDropdownStyles;
private setStatusStyles;
private setLocale;
private scrollToActivatedOptions;
private setupChangeListener;
private setupFocusListener;
private setupKeydownListener;
static ɵfac: i0.ɵɵFactoryDeclaration<NzCascaderComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<NzCascaderComponent, "nz-cascader, [nz-cascader]", ["nzCascader"], { "nzOptionRender": { "alias": "nzOptionRender"; "required": false; }; "nzShowInput": { "alias": "nzShowInput"; "required": false; }; "nzShowArrow": { "alias": "nzShowArrow"; "required": false; }; "nzAllowClear": { "alias": "nzAllowClear"; "required": false; }; "nzAutoFocus": { "alias": "nzAutoFocus"; "required": false; }; "nzChangeOnSelect": { "alias": "nzChangeOnSelect"; "required": false; }; "nzDisabled": { "alias": "nzDisabled"; "required": false; }; "nzColumnClassName": { "alias": "nzColumnClassName"; "required": false; }; "nzExpandTrigger": { "alias": "nzExpandTrigger"; "required": false; }; "nzValueProperty": { "alias": "nzValueProperty"; "required": false; }; "nzLabelProperty": { "alias": "nzLabelProperty"; "required": false; }; "nzLabelRender": { "alias": "nzLabelRender"; "required": false; }; "nzVariant": { "alias": "nzVariant"; "required": false; }; "nzNotFoundContent": { "alias": "nzNotFoundContent"; "required": false; }; "nzSize": { "alias": "nzSize"; "required": false; }; "nzBackdrop": { "alias": "nzBackdrop"; "required": false; }; "nzShowSearch": { "alias": "nzShowSearch"; "required": false; }; "nzPlaceHolder": { "alias": "nzPlaceHolder"; "required": false; }; "nzMenuClassName": { "alias": "nzMenuClassName"; "required": false; }; "nzMenuStyle": { "alias": "nzMenuStyle"; "required": false; }; "nzMouseLeaveDelay": { "alias": "nzMouseLeaveDelay"; "required": false; }; "nzMouseEnterDelay": { "alias": "nzMouseEnterDelay"; "required": false; }; "nzStatus": { "alias": "nzStatus"; "required": false; }; "nzMultiple": { "alias": "nzMultiple"; "required": false; }; "nzMaxTagCount": { "alias": "nzMaxTagCount"; "required": false; }; "nzPlacement": { "alias": "nzPlacement"; "required": false; }; "nzTriggerAction": { "alias": "nzTriggerAction"; "required": false; }; "nzChangeOn": { "alias": "nzChangeOn"; "required": false; }; "nzLoadData": { "alias": "nzLoadData"; "required": false; }; "nzDisplayWith": { "alias": "nzDisplayWith"; "required": false; }; "nzSuffixIcon": { "alias": "nzSuffixIcon"; "required": false; }; "nzExpandIcon": { "alias": "nzExpandIcon"; "required": false; }; "nzOptions": { "alias": "nzOptions"; "required": false; }; }, { "nzVisibleChange": "nzVisibleChange"; "nzSelectionChange": "nzSelectionChange"; "nzRemoved": "nzRemoved"; "nzClear": "nzClear"; }, never, ["*"], true, [{ directive: typeof i1.NzSpaceCompactItemDirective; inputs: {}; outputs: {}; }]>;
static ngAcceptInputType_nzShowInput: unknown;
static ngAcceptInputType_nzShowArrow: unknown;
static ngAcceptInputType_nzAllowClear: unknown;
static ngAcceptInputType_nzAutoFocus: unknown;
static ngAcceptInputType_nzChangeOnSelect: unknown;
static ngAcceptInputType_nzDisabled: unknown;
static ngAcceptInputType_nzMouseLeaveDelay: unknown;
static ngAcceptInputType_nzMouseEnterDelay: unknown;
static ngAcceptInputType_nzMultiple: unknown;
}
declare class NzCascaderModule {
static ɵfac: i0.ɵɵFactoryDeclaration<NzCascaderModule, never>;
static ɵmod: i0.ɵɵNgModuleDeclaration<NzCascaderModule, never, [typeof NzCascaderComponent], [typeof NzCascaderComponent]>;
static ɵinj: i0.ɵɵInjectorDeclaration<NzCascaderModule>;
}
export { NzCascaderComponent, NzCascaderModule, NzCascaderOptionComponent, NzCascaderService, isChildNode, isParentNode, isShowSearchObject };
export type { NzCascaderComponentAsSource, NzCascaderExpandTrigger, NzCascaderFilter, NzCascaderOption, NzCascaderPlacement, NzCascaderSize, NzCascaderSorter, NzCascaderTriggerType, NzShowSearchOptions };