ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
294 lines (278 loc) • 10.6 kB
TypeScript
import { Direction } from '@angular/cdk/bidi';
import * as i0 from '@angular/core';
import { OnInit, OnChanges, ChangeDetectorRef, ElementRef, SimpleChanges, EventEmitter } from '@angular/core';
import { NzConfigService, NzConfigKey } from 'ng-zorro-antd/core/config';
import { OverlayRef } from '@angular/cdk/overlay';
import { AnimationEvent } from '@angular/animations';
import { CdkDragEnd } from '@angular/cdk/drag-drop';
import { SafeResourceUrl } from '@angular/platform-browser';
/**
* 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 ImageStatusType = 'error' | 'loading' | 'normal';
type NzImageUrl = string;
type NzImageScaleStep = number;
declare class NzImageDirective implements OnInit, OnChanges {
private document;
nzConfigService: NzConfigService;
private elementRef;
private nzImageService;
protected cdr: ChangeDetectorRef;
private directionality;
private destroyRef;
readonly _nzModuleName: NzConfigKey;
nzSrc: string;
nzSrcset: string;
nzDisablePreview: boolean;
nzFallback: string | null;
nzPlaceholder: string | null;
nzScaleStep: number | null;
dir?: Direction;
backLoadImage: HTMLImageElement;
status: ImageStatusType;
private backLoadDestroy$;
private parentGroup;
get previewable(): boolean;
ngOnInit(): void;
onPreview(): void;
getElement(): ElementRef<HTMLImageElement>;
ngOnChanges(changes: SimpleChanges): void;
/**
* use internal Image object handle fallback & placeholder
*
* @private
*/
private backLoad;
static ɵfac: i0.ɵɵFactoryDeclaration<NzImageDirective, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<NzImageDirective, "img[nz-image]", ["nzImage"], { "nzSrc": { "alias": "nzSrc"; "required": false; }; "nzSrcset": { "alias": "nzSrcset"; "required": false; }; "nzDisablePreview": { "alias": "nzDisablePreview"; "required": false; }; "nzFallback": { "alias": "nzFallback"; "required": false; }; "nzPlaceholder": { "alias": "nzPlaceholder"; "required": false; }; "nzScaleStep": { "alias": "nzScaleStep"; "required": false; }; }, {}, never, never, true, never>;
static ngAcceptInputType_nzDisablePreview: unknown;
}
/**
* 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 NzImagePreviewOptions {
nzKeyboard?: boolean;
nzNoAnimation?: boolean;
nzMaskClosable?: boolean;
nzCloseOnNavigation?: boolean;
nzZIndex?: number;
nzZoom?: number;
nzRotate?: number;
nzFlipHorizontally?: boolean;
nzFlipVertically?: boolean;
nzScaleStep?: number;
nzDirection?: Direction;
}
interface NzImage {
src: string;
srcset?: string;
alt?: string;
width?: string | number;
height?: string | number;
}
/**
* 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
*/
interface NzImageContainerOperation {
icon: string;
type: string;
rotate?: number;
onClick(): void;
}
declare const NZ_DEFAULT_SCALE_STEP = 0.5;
declare class NzImagePreviewComponent implements OnInit {
private document;
private ngZone;
private cdr;
nzConfigService: NzConfigService;
config: NzImagePreviewOptions;
private sanitizer;
private destroyRef;
readonly _defaultNzZoom = 1;
readonly _defaultNzScaleStep = 0.5;
readonly _defaultNzRotate = 0;
images: NzImage[];
index: number;
isDragging: boolean;
visible: boolean;
animationStateChanged: EventEmitter<AnimationEvent>;
scaleStepMap: Map<NzImageUrl, NzImageScaleStep>;
previewImageTransform: string;
previewImageWrapperTransform: string;
operations: NzImageContainerOperation[];
zoomOutDisabled: boolean;
position: {
x: number;
y: number;
};
previewRef: NzImagePreviewRef;
closeClick: EventEmitter<void>;
imageRef: ElementRef<HTMLImageElement>;
imagePreviewWrapper: ElementRef<HTMLElement>;
private zoom;
private rotate;
private scaleStep;
private flipHorizontally;
private flipVertically;
get animationDisabled(): boolean;
get maskClosable(): boolean;
constructor();
ngOnInit(): void;
setImages(images: NzImage[], scaleStepMap?: Map<string, number>): void;
switchTo(index: number): void;
next(): void;
prev(): void;
markForCheck(): void;
onClose(): void;
onZoomIn(): void;
onZoomOut(): void;
onRotateRight(): void;
onRotateLeft(): void;
onSwitchLeft(event: MouseEvent): void;
onSwitchRight(event: MouseEvent): void;
onHorizontalFlip(): void;
onVerticalFlip(): void;
wheelZoomEventHandler(event: WheelEvent): void;
onAnimationStart(event: AnimationEvent): void;
onAnimationDone(event: AnimationEvent): void;
onDragEnd(event: CdkDragEnd): void;
sanitizerResourceUrl(url: string): SafeResourceUrl;
private updatePreviewImageTransform;
private updatePreviewImageWrapperTransform;
private updateZoomOutDisabled;
private handlerImageTransformationWhileZoomingWithMouse;
private handleImageScaleWhileZoomingWithMouse;
private isZoomedInWithMouseWheel;
private reset;
private reCenterImage;
static ɵfac: i0.ɵɵFactoryDeclaration<NzImagePreviewComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<NzImagePreviewComponent, "nz-image-preview", ["nzImagePreview"], {}, {}, never, never, true, never>;
}
/**
* 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 NzImagePreviewRef {
previewInstance: NzImagePreviewComponent;
private config;
private overlayRef;
private destroy$;
constructor(previewInstance: NzImagePreviewComponent, config: NzImagePreviewOptions, overlayRef: OverlayRef);
switchTo(index: number): void;
next(): void;
prev(): void;
close(): void;
}
interface NzImageService {
preview(images: NzImage[], option?: NzImagePreviewOptions): NzImagePreviewRef;
}
declare class NzImageService {
private overlay;
private injector;
private nzConfigService;
private directionality;
private display;
private attachPreviewComponent;
private createOverlay;
static ɵfac: i0.ɵɵFactoryDeclaration<NzImageService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<NzImageService>;
}
/**
* 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 const NZ_CONFIG_MODULE_NAME: NzConfigKey;
declare class NzImageGroupComponent {
nzScaleStep: number | null;
images: NzImageDirective[];
addImage(image: NzImageDirective): void;
static ɵfac: i0.ɵɵFactoryDeclaration<NzImageGroupComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<NzImageGroupComponent, "nz-image-group", ["nzImageGroup"], { "nzScaleStep": { "alias": "nzScaleStep"; "required": false; }; }, {}, never, ["*"], true, never>;
}
declare class NzImageModule {
static ɵfac: i0.ɵɵFactoryDeclaration<NzImageModule, never>;
static ɵmod: i0.ɵɵNgModuleDeclaration<NzImageModule, never, [typeof NzImageDirective, typeof NzImagePreviewComponent, typeof NzImageGroupComponent], [typeof NzImageDirective, typeof NzImagePreviewComponent, typeof NzImageGroupComponent]>;
static ɵinj: i0.ɵɵInjectorDeclaration<NzImageModule>;
}
/**
* 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
*/
/**
* fit content details: https://github.com/NG-ZORRO/ng-zorro-antd/pull/6154#issuecomment-745025554
*
* calc position x,y point
*
* CASE (width <= clientWidth && height <= clientHeight):
*
* ------------- clientWidth -------------
* | |
* | ------ width ------ |
* | | | |
* | | | |
* client height | |
* Height | | |
* | | | |
* | ------------------- |
* | |
* | |
* ---------------------------------------
* fixedPosition = { x: 0, y: 0 }
*
*
*
* CASE (width > clientWidth || height > clientHeight):
*
* ------------- clientWidth -------------
* | | |
* | top |
* | | |
* |--left--|--------------- width -----------------
* | | |
* client | |
* Height | |
* | | |
* | | |
* | height |
* | | |
* ---------| |
* | |
* | |
* | |
* ----------------------------------------
*
*
* - left || top > 0
* left -> 0 || top -> 0
*
* - (left + width) < clientWidth || (top + height) < clientHeight
* - left | top + width | height < clientWidth | clientHeight -> Back left | top + width | height === clientWidth | clientHeight
*
* DEFAULT:
* - hold position
*
*/
declare function getFitContentPosition(params: {
width: number;
height: number;
left: number;
top: number;
clientWidth: number;
clientHeight: number;
}): {
x?: number;
y?: number;
};
declare function getOffset(node: HTMLElement): {
left: number;
top: number;
};
declare function getClientSize(): {
width: number;
height: number;
};
export { NZ_CONFIG_MODULE_NAME, NZ_DEFAULT_SCALE_STEP, NzImageDirective, NzImageGroupComponent, NzImageModule, NzImagePreviewComponent, NzImagePreviewOptions, NzImagePreviewRef, NzImageService, getClientSize, getFitContentPosition, getOffset };
export type { ImageStatusType, NzImage, NzImageContainerOperation, NzImageScaleStep, NzImageUrl };