You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
791 lines
25 KiB
791 lines
25 KiB
import {
|
|
DEFAULT_TOOLTIP_POSITIONS,
|
|
NzConnectedOverlayDirective,
|
|
NzOverlayModule,
|
|
POSITION_MAP,
|
|
getPlacementName
|
|
} from "./chunk-6RXUTAFR.js";
|
|
import {
|
|
zoomBigMotion
|
|
} from "./chunk-XAGDQPFO.js";
|
|
import {
|
|
NzNoAnimationDirective
|
|
} from "./chunk-55A2ZGND.js";
|
|
import {
|
|
CdkConnectedOverlay,
|
|
OverlayModule
|
|
} from "./chunk-6U656R5M.js";
|
|
import {
|
|
NzOutletModule,
|
|
NzStringTemplateOutletDirective
|
|
} from "./chunk-VOD2PKZN.js";
|
|
import {
|
|
NzConfigService,
|
|
isPresetColor
|
|
} from "./chunk-ZHMJ6SNN.js";
|
|
import {
|
|
Directionality
|
|
} from "./chunk-6NZ2BEBG.js";
|
|
import {
|
|
InputBoolean,
|
|
isNotNil,
|
|
toBoolean
|
|
} from "./chunk-M5GY4FCO.js";
|
|
import {
|
|
NgClass,
|
|
NgStyle
|
|
} from "./chunk-OSQBUYO6.js";
|
|
import {
|
|
ChangeDetectionStrategy,
|
|
ChangeDetectorRef,
|
|
Component,
|
|
Directive,
|
|
ElementRef,
|
|
EventEmitter,
|
|
Host,
|
|
Input,
|
|
NgModule,
|
|
Optional,
|
|
Output,
|
|
Renderer2,
|
|
Subject,
|
|
TemplateRef,
|
|
ViewChild,
|
|
ViewContainerRef,
|
|
ViewEncapsulation$1,
|
|
__decorate,
|
|
asapScheduler,
|
|
delay,
|
|
distinctUntilChanged,
|
|
filter,
|
|
setClassMetadata,
|
|
takeUntil,
|
|
ɵɵInheritDefinitionFeature,
|
|
ɵɵNgOnChangesFeature,
|
|
ɵɵStandaloneFeature,
|
|
ɵɵadvance,
|
|
ɵɵclassProp,
|
|
ɵɵdefineComponent,
|
|
ɵɵdefineDirective,
|
|
ɵɵdefineInjector,
|
|
ɵɵdefineNgModule,
|
|
ɵɵdirectiveInject,
|
|
ɵɵelement,
|
|
ɵɵelementContainerEnd,
|
|
ɵɵelementContainerStart,
|
|
ɵɵelementEnd,
|
|
ɵɵelementStart,
|
|
ɵɵlistener,
|
|
ɵɵloadQuery,
|
|
ɵɵnextContext,
|
|
ɵɵproperty,
|
|
ɵɵqueryRefresh,
|
|
ɵɵtemplate,
|
|
ɵɵtemplateRefExtractor,
|
|
ɵɵtext,
|
|
ɵɵtextInterpolate,
|
|
ɵɵviewQuery
|
|
} from "./chunk-FGESKT7O.js";
|
|
import {
|
|
__spreadProps,
|
|
__spreadValues
|
|
} from "./chunk-HSNDBVJ3.js";
|
|
|
|
// node_modules/ng-zorro-antd/fesm2022/ng-zorro-antd-tooltip.mjs
|
|
var _c0 = ["overlay"];
|
|
function NzToolTipComponent_ng_template_0_ng_container_5_Template(rf, ctx) {
|
|
if (rf & 1) {
|
|
ɵɵelementContainerStart(0);
|
|
ɵɵtext(1);
|
|
ɵɵelementContainerEnd();
|
|
}
|
|
if (rf & 2) {
|
|
const ctx_r2 = ɵɵnextContext(2);
|
|
ɵɵadvance(1);
|
|
ɵɵtextInterpolate(ctx_r2.nzTitle);
|
|
}
|
|
}
|
|
function NzToolTipComponent_ng_template_0_Template(rf, ctx) {
|
|
if (rf & 1) {
|
|
ɵɵelementStart(0, "div", 2)(1, "div", 3)(2, "div", 4);
|
|
ɵɵelement(3, "span", 5);
|
|
ɵɵelementEnd();
|
|
ɵɵelementStart(4, "div", 6);
|
|
ɵɵtemplate(5, NzToolTipComponent_ng_template_0_ng_container_5_Template, 2, 1, "ng-container", 7);
|
|
ɵɵelementEnd()()();
|
|
}
|
|
if (rf & 2) {
|
|
const ctx_r0 = ɵɵnextContext();
|
|
ɵɵclassProp("ant-tooltip-rtl", ctx_r0.dir === "rtl");
|
|
ɵɵproperty("ngClass", ctx_r0._classMap)("ngStyle", ctx_r0.nzOverlayStyle)("@.disabled", !!(ctx_r0.noAnimation == null ? null : ctx_r0.noAnimation.nzNoAnimation))("nzNoAnimation", ctx_r0.noAnimation == null ? null : ctx_r0.noAnimation.nzNoAnimation)("@zoomBigMotion", "active");
|
|
ɵɵadvance(3);
|
|
ɵɵproperty("ngStyle", ctx_r0._contentStyleMap);
|
|
ɵɵadvance(1);
|
|
ɵɵproperty("ngStyle", ctx_r0._contentStyleMap);
|
|
ɵɵadvance(1);
|
|
ɵɵproperty("nzStringTemplateOutlet", ctx_r0.nzTitle)("nzStringTemplateOutletContext", ctx_r0.nzTitleContext);
|
|
}
|
|
}
|
|
var _NzTooltipBaseDirective = class _NzTooltipBaseDirective {
|
|
/**
|
|
* This true title that would be used in other parts on this component.
|
|
*/
|
|
get _title() {
|
|
return this.title || this.directiveTitle || null;
|
|
}
|
|
get _content() {
|
|
return this.content || this.directiveContent || null;
|
|
}
|
|
get _trigger() {
|
|
return typeof this.trigger !== "undefined" ? this.trigger : "hover";
|
|
}
|
|
get _placement() {
|
|
const p = this.placement;
|
|
return Array.isArray(p) && p.length > 0 ? p : typeof p === "string" && p ? [p] : ["top"];
|
|
}
|
|
get _visible() {
|
|
return (typeof this.visible !== "undefined" ? this.visible : this.internalVisible) || false;
|
|
}
|
|
get _mouseEnterDelay() {
|
|
return this.mouseEnterDelay || 0.15;
|
|
}
|
|
get _mouseLeaveDelay() {
|
|
return this.mouseLeaveDelay || 0.1;
|
|
}
|
|
get _overlayClassName() {
|
|
return this.overlayClassName || null;
|
|
}
|
|
get _overlayStyle() {
|
|
return this.overlayStyle || null;
|
|
}
|
|
getProxyPropertyMap() {
|
|
return {
|
|
noAnimation: ["noAnimation", () => !!this.noAnimation]
|
|
};
|
|
}
|
|
constructor(elementRef, hostView, renderer, noAnimation, nzConfigService) {
|
|
this.elementRef = elementRef;
|
|
this.hostView = hostView;
|
|
this.renderer = renderer;
|
|
this.noAnimation = noAnimation;
|
|
this.nzConfigService = nzConfigService;
|
|
this.visibleChange = new EventEmitter();
|
|
this.internalVisible = false;
|
|
this.destroy$ = new Subject();
|
|
this.triggerDisposables = [];
|
|
}
|
|
ngOnChanges(changes) {
|
|
const {
|
|
trigger
|
|
} = changes;
|
|
if (trigger && !trigger.isFirstChange()) {
|
|
this.registerTriggers();
|
|
}
|
|
if (this.component) {
|
|
this.updatePropertiesByChanges(changes);
|
|
}
|
|
}
|
|
ngAfterViewInit() {
|
|
this.createComponent();
|
|
this.registerTriggers();
|
|
}
|
|
ngOnDestroy() {
|
|
this.destroy$.next();
|
|
this.destroy$.complete();
|
|
this.clearTogglingTimer();
|
|
this.removeTriggerListeners();
|
|
}
|
|
show() {
|
|
this.component?.show();
|
|
}
|
|
hide() {
|
|
this.component?.hide();
|
|
}
|
|
/**
|
|
* Force the component to update its position.
|
|
*/
|
|
updatePosition() {
|
|
if (this.component) {
|
|
this.component.updatePosition();
|
|
}
|
|
}
|
|
/**
|
|
* Create a dynamic tooltip component. This method can be override.
|
|
*/
|
|
createComponent() {
|
|
const componentRef = this.componentRef;
|
|
this.component = componentRef.instance;
|
|
this.renderer.removeChild(this.renderer.parentNode(this.elementRef.nativeElement), componentRef.location.nativeElement);
|
|
this.component.setOverlayOrigin(this.origin || this.elementRef);
|
|
this.initProperties();
|
|
const ngVisibleChange$ = this.component.nzVisibleChange.pipe(distinctUntilChanged());
|
|
ngVisibleChange$.pipe(takeUntil(this.destroy$)).subscribe((visible) => {
|
|
this.internalVisible = visible;
|
|
this.visibleChange.emit(visible);
|
|
});
|
|
ngVisibleChange$.pipe(filter((visible) => visible), delay(0, asapScheduler), filter(() => Boolean(this.component?.overlay?.overlayRef)), takeUntil(this.destroy$)).subscribe(() => {
|
|
this.component?.updatePosition();
|
|
});
|
|
}
|
|
registerTriggers() {
|
|
const el = this.elementRef.nativeElement;
|
|
const trigger = this.trigger;
|
|
this.removeTriggerListeners();
|
|
if (trigger === "hover") {
|
|
let overlayElement;
|
|
this.triggerDisposables.push(this.renderer.listen(el, "mouseenter", () => {
|
|
this.delayEnterLeave(true, true, this._mouseEnterDelay);
|
|
}));
|
|
this.triggerDisposables.push(this.renderer.listen(el, "mouseleave", () => {
|
|
this.delayEnterLeave(true, false, this._mouseLeaveDelay);
|
|
if (this.component?.overlay.overlayRef && !overlayElement) {
|
|
overlayElement = this.component.overlay.overlayRef.overlayElement;
|
|
this.triggerDisposables.push(this.renderer.listen(overlayElement, "mouseenter", () => {
|
|
this.delayEnterLeave(false, true, this._mouseEnterDelay);
|
|
}));
|
|
this.triggerDisposables.push(this.renderer.listen(overlayElement, "mouseleave", () => {
|
|
this.delayEnterLeave(false, false, this._mouseLeaveDelay);
|
|
}));
|
|
}
|
|
}));
|
|
} else if (trigger === "focus") {
|
|
this.triggerDisposables.push(this.renderer.listen(el, "focusin", () => this.show()));
|
|
this.triggerDisposables.push(this.renderer.listen(el, "focusout", () => this.hide()));
|
|
} else if (trigger === "click") {
|
|
this.triggerDisposables.push(this.renderer.listen(el, "click", (e) => {
|
|
e.preventDefault();
|
|
this.show();
|
|
}));
|
|
}
|
|
}
|
|
updatePropertiesByChanges(changes) {
|
|
this.updatePropertiesByKeys(Object.keys(changes));
|
|
}
|
|
updatePropertiesByKeys(keys) {
|
|
const mappingProperties = __spreadValues({
|
|
// common mappings
|
|
title: ["nzTitle", () => this._title],
|
|
directiveTitle: ["nzTitle", () => this._title],
|
|
content: ["nzContent", () => this._content],
|
|
directiveContent: ["nzContent", () => this._content],
|
|
trigger: ["nzTrigger", () => this._trigger],
|
|
placement: ["nzPlacement", () => this._placement],
|
|
visible: ["nzVisible", () => this._visible],
|
|
mouseEnterDelay: ["nzMouseEnterDelay", () => this._mouseEnterDelay],
|
|
mouseLeaveDelay: ["nzMouseLeaveDelay", () => this._mouseLeaveDelay],
|
|
overlayClassName: ["nzOverlayClassName", () => this._overlayClassName],
|
|
overlayStyle: ["nzOverlayStyle", () => this._overlayStyle],
|
|
arrowPointAtCenter: ["nzArrowPointAtCenter", () => this.arrowPointAtCenter],
|
|
cdkConnectedOverlayPush: ["cdkConnectedOverlayPush", () => this.cdkConnectedOverlayPush]
|
|
}, this.getProxyPropertyMap());
|
|
(keys || Object.keys(mappingProperties).filter((key) => !key.startsWith("directive"))).forEach((property) => {
|
|
if (mappingProperties[property]) {
|
|
const [name, valueFn] = mappingProperties[property];
|
|
this.updateComponentValue(name, valueFn());
|
|
}
|
|
});
|
|
this.component?.updateByDirective();
|
|
}
|
|
initProperties() {
|
|
this.updatePropertiesByKeys();
|
|
}
|
|
updateComponentValue(key, value) {
|
|
if (typeof value !== "undefined") {
|
|
this.component[key] = value;
|
|
}
|
|
}
|
|
delayEnterLeave(isOrigin, isEnter, delay2 = -1) {
|
|
if (this.delayTimer) {
|
|
this.clearTogglingTimer();
|
|
} else if (delay2 > 0) {
|
|
this.delayTimer = setTimeout(() => {
|
|
this.delayTimer = void 0;
|
|
isEnter ? this.show() : this.hide();
|
|
}, delay2 * 1e3);
|
|
} else {
|
|
isEnter && isOrigin ? this.show() : this.hide();
|
|
}
|
|
}
|
|
removeTriggerListeners() {
|
|
this.triggerDisposables.forEach((dispose) => dispose());
|
|
this.triggerDisposables.length = 0;
|
|
}
|
|
clearTogglingTimer() {
|
|
if (this.delayTimer) {
|
|
clearTimeout(this.delayTimer);
|
|
this.delayTimer = void 0;
|
|
}
|
|
}
|
|
};
|
|
_NzTooltipBaseDirective.ɵfac = function NzTooltipBaseDirective_Factory(t) {
|
|
return new (t || _NzTooltipBaseDirective)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(ViewContainerRef), ɵɵdirectiveInject(Renderer2), ɵɵdirectiveInject(NzNoAnimationDirective), ɵɵdirectiveInject(NzConfigService));
|
|
};
|
|
_NzTooltipBaseDirective.ɵdir = ɵɵdefineDirective({
|
|
type: _NzTooltipBaseDirective,
|
|
features: [ɵɵNgOnChangesFeature]
|
|
});
|
|
var NzTooltipBaseDirective = _NzTooltipBaseDirective;
|
|
(() => {
|
|
(typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(NzTooltipBaseDirective, [{
|
|
type: Directive
|
|
}], () => [{
|
|
type: ElementRef
|
|
}, {
|
|
type: ViewContainerRef
|
|
}, {
|
|
type: Renderer2
|
|
}, {
|
|
type: NzNoAnimationDirective
|
|
}, {
|
|
type: NzConfigService
|
|
}], null);
|
|
})();
|
|
var _NzTooltipBaseComponent = class _NzTooltipBaseComponent {
|
|
set nzVisible(value) {
|
|
const visible = toBoolean(value);
|
|
if (this._visible !== visible) {
|
|
this._visible = visible;
|
|
this.nzVisibleChange.next(visible);
|
|
}
|
|
}
|
|
get nzVisible() {
|
|
return this._visible;
|
|
}
|
|
set nzTrigger(value) {
|
|
this._trigger = value;
|
|
}
|
|
get nzTrigger() {
|
|
return this._trigger;
|
|
}
|
|
set nzPlacement(value) {
|
|
const preferredPosition = value.map((placement) => POSITION_MAP[placement]);
|
|
this._positions = [...preferredPosition, ...DEFAULT_TOOLTIP_POSITIONS];
|
|
}
|
|
constructor(cdr, directionality, noAnimation) {
|
|
this.cdr = cdr;
|
|
this.directionality = directionality;
|
|
this.noAnimation = noAnimation;
|
|
this.nzTitle = null;
|
|
this.nzContent = null;
|
|
this.nzArrowPointAtCenter = false;
|
|
this.nzOverlayStyle = {};
|
|
this.nzBackdrop = false;
|
|
this.cdkConnectedOverlayPush = true;
|
|
this.nzVisibleChange = new Subject();
|
|
this._visible = false;
|
|
this._trigger = "hover";
|
|
this.preferredPlacement = "top";
|
|
this.dir = "ltr";
|
|
this._classMap = {};
|
|
this._prefix = "ant-tooltip";
|
|
this._positions = [...DEFAULT_TOOLTIP_POSITIONS];
|
|
this.destroy$ = new Subject();
|
|
}
|
|
ngOnInit() {
|
|
this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
|
|
this.dir = direction;
|
|
this.cdr.detectChanges();
|
|
});
|
|
this.dir = this.directionality.value;
|
|
}
|
|
ngOnDestroy() {
|
|
this.nzVisibleChange.complete();
|
|
this.destroy$.next();
|
|
this.destroy$.complete();
|
|
}
|
|
show() {
|
|
if (this.nzVisible) {
|
|
return;
|
|
}
|
|
if (!this.isEmpty()) {
|
|
this.nzVisible = true;
|
|
this.nzVisibleChange.next(true);
|
|
this.cdr.detectChanges();
|
|
}
|
|
if (this.origin && this.overlay && this.overlay.overlayRef && this.overlay.overlayRef.getDirection() === "rtl") {
|
|
this.overlay.overlayRef.setDirection("ltr");
|
|
}
|
|
}
|
|
hide() {
|
|
if (!this.nzVisible) {
|
|
return;
|
|
}
|
|
this.nzVisible = false;
|
|
this.nzVisibleChange.next(false);
|
|
this.cdr.detectChanges();
|
|
}
|
|
updateByDirective() {
|
|
this.updateStyles();
|
|
this.cdr.detectChanges();
|
|
Promise.resolve().then(() => {
|
|
this.updatePosition();
|
|
this.updateVisibilityByTitle();
|
|
});
|
|
}
|
|
/**
|
|
* Force the component to update its position.
|
|
*/
|
|
updatePosition() {
|
|
if (this.origin && this.overlay && this.overlay.overlayRef) {
|
|
this.overlay.overlayRef.updatePosition();
|
|
}
|
|
}
|
|
onPositionChange(position) {
|
|
this.preferredPlacement = getPlacementName(position);
|
|
this.updateStyles();
|
|
this.cdr.detectChanges();
|
|
}
|
|
setOverlayOrigin(origin) {
|
|
this.origin = origin;
|
|
this.cdr.markForCheck();
|
|
}
|
|
onClickOutside(event) {
|
|
if (!this.origin.nativeElement.contains(event.target) && this.nzTrigger !== null) {
|
|
this.hide();
|
|
}
|
|
}
|
|
/**
|
|
* Hide the component while the content is empty.
|
|
*/
|
|
updateVisibilityByTitle() {
|
|
if (this.isEmpty()) {
|
|
this.hide();
|
|
}
|
|
}
|
|
updateStyles() {
|
|
this._classMap = {
|
|
[this.nzOverlayClassName]: true,
|
|
[`${this._prefix}-placement-${this.preferredPlacement}`]: true
|
|
};
|
|
}
|
|
};
|
|
_NzTooltipBaseComponent.ɵfac = function NzTooltipBaseComponent_Factory(t) {
|
|
return new (t || _NzTooltipBaseComponent)(ɵɵdirectiveInject(ChangeDetectorRef), ɵɵdirectiveInject(Directionality, 8), ɵɵdirectiveInject(NzNoAnimationDirective));
|
|
};
|
|
_NzTooltipBaseComponent.ɵdir = ɵɵdefineDirective({
|
|
type: _NzTooltipBaseComponent,
|
|
viewQuery: function NzTooltipBaseComponent_Query(rf, ctx) {
|
|
if (rf & 1) {
|
|
ɵɵviewQuery(_c0, 5);
|
|
}
|
|
if (rf & 2) {
|
|
let _t;
|
|
ɵɵqueryRefresh(_t = ɵɵloadQuery()) && (ctx.overlay = _t.first);
|
|
}
|
|
}
|
|
});
|
|
var NzTooltipBaseComponent = _NzTooltipBaseComponent;
|
|
(() => {
|
|
(typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(NzTooltipBaseComponent, [{
|
|
type: Directive
|
|
}], () => [{
|
|
type: ChangeDetectorRef
|
|
}, {
|
|
type: Directionality,
|
|
decorators: [{
|
|
type: Optional
|
|
}]
|
|
}, {
|
|
type: NzNoAnimationDirective
|
|
}], {
|
|
overlay: [{
|
|
type: ViewChild,
|
|
args: ["overlay", {
|
|
static: false
|
|
}]
|
|
}]
|
|
});
|
|
})();
|
|
function isTooltipEmpty(value) {
|
|
return value instanceof TemplateRef ? false : value === "" || !isNotNil(value);
|
|
}
|
|
var _NzTooltipDirective = class _NzTooltipDirective extends NzTooltipBaseDirective {
|
|
constructor(elementRef, hostView, renderer, noAnimation) {
|
|
super(elementRef, hostView, renderer, noAnimation);
|
|
this.titleContext = null;
|
|
this.trigger = "hover";
|
|
this.placement = "top";
|
|
this.cdkConnectedOverlayPush = true;
|
|
this.visibleChange = new EventEmitter();
|
|
this.componentRef = this.hostView.createComponent(NzToolTipComponent);
|
|
}
|
|
getProxyPropertyMap() {
|
|
return __spreadProps(__spreadValues({}, super.getProxyPropertyMap()), {
|
|
nzTooltipColor: ["nzColor", () => this.nzTooltipColor],
|
|
titleContext: ["nzTitleContext", () => this.titleContext]
|
|
});
|
|
}
|
|
};
|
|
_NzTooltipDirective.ɵfac = function NzTooltipDirective_Factory(t) {
|
|
return new (t || _NzTooltipDirective)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(ViewContainerRef), ɵɵdirectiveInject(Renderer2), ɵɵdirectiveInject(NzNoAnimationDirective, 9));
|
|
};
|
|
_NzTooltipDirective.ɵdir = ɵɵdefineDirective({
|
|
type: _NzTooltipDirective,
|
|
selectors: [["", "nz-tooltip", ""]],
|
|
hostVars: 2,
|
|
hostBindings: function NzTooltipDirective_HostBindings(rf, ctx) {
|
|
if (rf & 2) {
|
|
ɵɵclassProp("ant-tooltip-open", ctx.visible);
|
|
}
|
|
},
|
|
inputs: {
|
|
title: ["nzTooltipTitle", "title"],
|
|
titleContext: ["nzTooltipTitleContext", "titleContext"],
|
|
directiveTitle: ["nz-tooltip", "directiveTitle"],
|
|
trigger: ["nzTooltipTrigger", "trigger"],
|
|
placement: ["nzTooltipPlacement", "placement"],
|
|
origin: ["nzTooltipOrigin", "origin"],
|
|
visible: ["nzTooltipVisible", "visible"],
|
|
mouseEnterDelay: ["nzTooltipMouseEnterDelay", "mouseEnterDelay"],
|
|
mouseLeaveDelay: ["nzTooltipMouseLeaveDelay", "mouseLeaveDelay"],
|
|
overlayClassName: ["nzTooltipOverlayClassName", "overlayClassName"],
|
|
overlayStyle: ["nzTooltipOverlayStyle", "overlayStyle"],
|
|
arrowPointAtCenter: ["nzTooltipArrowPointAtCenter", "arrowPointAtCenter"],
|
|
cdkConnectedOverlayPush: "cdkConnectedOverlayPush",
|
|
nzTooltipColor: "nzTooltipColor"
|
|
},
|
|
outputs: {
|
|
visibleChange: "nzTooltipVisibleChange"
|
|
},
|
|
exportAs: ["nzTooltip"],
|
|
standalone: true,
|
|
features: [ɵɵInheritDefinitionFeature]
|
|
});
|
|
var NzTooltipDirective = _NzTooltipDirective;
|
|
__decorate([InputBoolean()], NzTooltipDirective.prototype, "arrowPointAtCenter", void 0);
|
|
__decorate([InputBoolean()], NzTooltipDirective.prototype, "cdkConnectedOverlayPush", void 0);
|
|
(() => {
|
|
(typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(NzTooltipDirective, [{
|
|
type: Directive,
|
|
args: [{
|
|
selector: "[nz-tooltip]",
|
|
exportAs: "nzTooltip",
|
|
host: {
|
|
"[class.ant-tooltip-open]": "visible"
|
|
},
|
|
standalone: true
|
|
}]
|
|
}], () => [{
|
|
type: ElementRef
|
|
}, {
|
|
type: ViewContainerRef
|
|
}, {
|
|
type: Renderer2
|
|
}, {
|
|
type: NzNoAnimationDirective,
|
|
decorators: [{
|
|
type: Host
|
|
}, {
|
|
type: Optional
|
|
}]
|
|
}], {
|
|
title: [{
|
|
type: Input,
|
|
args: ["nzTooltipTitle"]
|
|
}],
|
|
titleContext: [{
|
|
type: Input,
|
|
args: ["nzTooltipTitleContext"]
|
|
}],
|
|
directiveTitle: [{
|
|
type: Input,
|
|
args: ["nz-tooltip"]
|
|
}],
|
|
trigger: [{
|
|
type: Input,
|
|
args: ["nzTooltipTrigger"]
|
|
}],
|
|
placement: [{
|
|
type: Input,
|
|
args: ["nzTooltipPlacement"]
|
|
}],
|
|
origin: [{
|
|
type: Input,
|
|
args: ["nzTooltipOrigin"]
|
|
}],
|
|
visible: [{
|
|
type: Input,
|
|
args: ["nzTooltipVisible"]
|
|
}],
|
|
mouseEnterDelay: [{
|
|
type: Input,
|
|
args: ["nzTooltipMouseEnterDelay"]
|
|
}],
|
|
mouseLeaveDelay: [{
|
|
type: Input,
|
|
args: ["nzTooltipMouseLeaveDelay"]
|
|
}],
|
|
overlayClassName: [{
|
|
type: Input,
|
|
args: ["nzTooltipOverlayClassName"]
|
|
}],
|
|
overlayStyle: [{
|
|
type: Input,
|
|
args: ["nzTooltipOverlayStyle"]
|
|
}],
|
|
arrowPointAtCenter: [{
|
|
type: Input,
|
|
args: ["nzTooltipArrowPointAtCenter"]
|
|
}],
|
|
cdkConnectedOverlayPush: [{
|
|
type: Input
|
|
}],
|
|
nzTooltipColor: [{
|
|
type: Input
|
|
}],
|
|
visibleChange: [{
|
|
type: Output,
|
|
args: ["nzTooltipVisibleChange"]
|
|
}]
|
|
});
|
|
})();
|
|
var _NzToolTipComponent = class _NzToolTipComponent extends NzTooltipBaseComponent {
|
|
constructor(cdr, directionality, noAnimation) {
|
|
super(cdr, directionality, noAnimation);
|
|
this.nzTitle = null;
|
|
this.nzTitleContext = null;
|
|
this._contentStyleMap = {};
|
|
}
|
|
isEmpty() {
|
|
return isTooltipEmpty(this.nzTitle);
|
|
}
|
|
updateStyles() {
|
|
const isColorPreset = this.nzColor && isPresetColor(this.nzColor);
|
|
this._classMap = {
|
|
[this.nzOverlayClassName]: true,
|
|
[`${this._prefix}-placement-${this.preferredPlacement}`]: true,
|
|
[`${this._prefix}-${this.nzColor}`]: isColorPreset
|
|
};
|
|
this._contentStyleMap = {
|
|
backgroundColor: !!this.nzColor && !isColorPreset ? this.nzColor : null,
|
|
"--color": this.nzColor
|
|
};
|
|
}
|
|
};
|
|
_NzToolTipComponent.ɵfac = function NzToolTipComponent_Factory(t) {
|
|
return new (t || _NzToolTipComponent)(ɵɵdirectiveInject(ChangeDetectorRef), ɵɵdirectiveInject(Directionality, 8), ɵɵdirectiveInject(NzNoAnimationDirective, 9));
|
|
};
|
|
_NzToolTipComponent.ɵcmp = ɵɵdefineComponent({
|
|
type: _NzToolTipComponent,
|
|
selectors: [["nz-tooltip"]],
|
|
exportAs: ["nzTooltipComponent"],
|
|
standalone: true,
|
|
features: [ɵɵInheritDefinitionFeature, ɵɵStandaloneFeature],
|
|
decls: 2,
|
|
vars: 5,
|
|
consts: [["cdkConnectedOverlay", "", "nzConnectedOverlay", "", 3, "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPush", "nzArrowPointAtCenter", "overlayOutsideClick", "detach", "positionChange"], ["overlay", "cdkConnectedOverlay"], [1, "ant-tooltip", 3, "ngClass", "ngStyle", "nzNoAnimation"], [1, "ant-tooltip-content"], [1, "ant-tooltip-arrow"], [1, "ant-tooltip-arrow-content", 3, "ngStyle"], [1, "ant-tooltip-inner", 3, "ngStyle"], [4, "nzStringTemplateOutlet", "nzStringTemplateOutletContext"]],
|
|
template: function NzToolTipComponent_Template(rf, ctx) {
|
|
if (rf & 1) {
|
|
ɵɵtemplate(0, NzToolTipComponent_ng_template_0_Template, 6, 11, "ng-template", 0, 1, ɵɵtemplateRefExtractor);
|
|
ɵɵlistener("overlayOutsideClick", function NzToolTipComponent_Template_ng_template_overlayOutsideClick_0_listener($event) {
|
|
return ctx.onClickOutside($event);
|
|
})("detach", function NzToolTipComponent_Template_ng_template_detach_0_listener() {
|
|
return ctx.hide();
|
|
})("positionChange", function NzToolTipComponent_Template_ng_template_positionChange_0_listener($event) {
|
|
return ctx.onPositionChange($event);
|
|
});
|
|
}
|
|
if (rf & 2) {
|
|
ɵɵproperty("cdkConnectedOverlayOrigin", ctx.origin)("cdkConnectedOverlayOpen", ctx._visible)("cdkConnectedOverlayPositions", ctx._positions)("cdkConnectedOverlayPush", ctx.cdkConnectedOverlayPush)("nzArrowPointAtCenter", ctx.nzArrowPointAtCenter);
|
|
}
|
|
},
|
|
dependencies: [OverlayModule, CdkConnectedOverlay, NgClass, NgStyle, NzNoAnimationDirective, NzOutletModule, NzStringTemplateOutletDirective, NzOverlayModule, NzConnectedOverlayDirective],
|
|
encapsulation: 2,
|
|
data: {
|
|
animation: [zoomBigMotion]
|
|
},
|
|
changeDetection: 0
|
|
});
|
|
var NzToolTipComponent = _NzToolTipComponent;
|
|
(() => {
|
|
(typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(NzToolTipComponent, [{
|
|
type: Component,
|
|
args: [{
|
|
selector: "nz-tooltip",
|
|
exportAs: "nzTooltipComponent",
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
encapsulation: ViewEncapsulation$1.None,
|
|
animations: [zoomBigMotion],
|
|
template: `
|
|
<ng-template
|
|
#overlay="cdkConnectedOverlay"
|
|
cdkConnectedOverlay
|
|
nzConnectedOverlay
|
|
[cdkConnectedOverlayOrigin]="origin"
|
|
[cdkConnectedOverlayOpen]="_visible"
|
|
[cdkConnectedOverlayPositions]="_positions"
|
|
[cdkConnectedOverlayPush]="cdkConnectedOverlayPush"
|
|
[nzArrowPointAtCenter]="nzArrowPointAtCenter"
|
|
(overlayOutsideClick)="onClickOutside($event)"
|
|
(detach)="hide()"
|
|
(positionChange)="onPositionChange($event)"
|
|
>
|
|
<div
|
|
class="ant-tooltip"
|
|
[class.ant-tooltip-rtl]="dir === 'rtl'"
|
|
[ngClass]="_classMap"
|
|
[ngStyle]="nzOverlayStyle"
|
|
[@.disabled]="!!noAnimation?.nzNoAnimation"
|
|
[nzNoAnimation]="noAnimation?.nzNoAnimation"
|
|
[@zoomBigMotion]="'active'"
|
|
>
|
|
<div class="ant-tooltip-content">
|
|
<div class="ant-tooltip-arrow">
|
|
<span class="ant-tooltip-arrow-content" [ngStyle]="_contentStyleMap"></span>
|
|
</div>
|
|
<div class="ant-tooltip-inner" [ngStyle]="_contentStyleMap">
|
|
<ng-container *nzStringTemplateOutlet="nzTitle; context: nzTitleContext">{{ nzTitle }}</ng-container>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</ng-template>
|
|
`,
|
|
preserveWhitespaces: false,
|
|
imports: [OverlayModule, NgClass, NgStyle, NzNoAnimationDirective, NzOutletModule, NzOverlayModule],
|
|
standalone: true
|
|
}]
|
|
}], () => [{
|
|
type: ChangeDetectorRef
|
|
}, {
|
|
type: Directionality,
|
|
decorators: [{
|
|
type: Optional
|
|
}]
|
|
}, {
|
|
type: NzNoAnimationDirective,
|
|
decorators: [{
|
|
type: Host
|
|
}, {
|
|
type: Optional
|
|
}]
|
|
}], null);
|
|
})();
|
|
var _NzToolTipModule = class _NzToolTipModule {
|
|
};
|
|
_NzToolTipModule.ɵfac = function NzToolTipModule_Factory(t) {
|
|
return new (t || _NzToolTipModule)();
|
|
};
|
|
_NzToolTipModule.ɵmod = ɵɵdefineNgModule({
|
|
type: _NzToolTipModule,
|
|
imports: [NzToolTipComponent, NzTooltipDirective],
|
|
exports: [NzToolTipComponent, NzTooltipDirective]
|
|
});
|
|
_NzToolTipModule.ɵinj = ɵɵdefineInjector({
|
|
imports: [NzToolTipComponent]
|
|
});
|
|
var NzToolTipModule = _NzToolTipModule;
|
|
(() => {
|
|
(typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(NzToolTipModule, [{
|
|
type: NgModule,
|
|
args: [{
|
|
imports: [NzToolTipComponent, NzTooltipDirective],
|
|
exports: [NzToolTipComponent, NzTooltipDirective]
|
|
}]
|
|
}], null, null);
|
|
})();
|
|
|
|
export {
|
|
NzTooltipDirective,
|
|
NzToolTipModule
|
|
};
|
|
//# sourceMappingURL=chunk-5MZJ5XYV.js.map
|
|
|