ng-zorro-antd-tooltip.mjs 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620
  1. import * as i1 from '@angular/cdk/overlay';
  2. import { OverlayModule } from '@angular/cdk/overlay';
  3. import * as i0 from '@angular/core';
  4. import { EventEmitter, inject, ElementRef, ViewContainerRef, Renderer2, PLATFORM_ID, Directive, ChangeDetectorRef, ViewChild, TemplateRef, booleanAttribute, Output, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
  5. import { zoomBigMotion } from 'ng-zorro-antd/core/animation';
  6. import { isPresetColor } from 'ng-zorro-antd/core/color';
  7. import { NzNoAnimationDirective } from 'ng-zorro-antd/core/no-animation';
  8. import * as i2 from 'ng-zorro-antd/core/outlet';
  9. import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
  10. import * as i3 from 'ng-zorro-antd/core/overlay';
  11. import { POSITION_MAP, DEFAULT_TOOLTIP_POSITIONS, getPlacementName, NzOverlayModule } from 'ng-zorro-antd/core/overlay';
  12. import { Directionality } from '@angular/cdk/bidi';
  13. import { _getEventTarget } from '@angular/cdk/platform';
  14. import { isPlatformBrowser } from '@angular/common';
  15. import { Subject, asapScheduler } from 'rxjs';
  16. import { distinctUntilChanged, takeUntil, filter, delay } from 'rxjs/operators';
  17. import { NzConfigService } from 'ng-zorro-antd/core/config';
  18. import { toBoolean, isNotNil } from 'ng-zorro-antd/core/util';
  19. /**
  20. * Use of this source code is governed by an MIT-style license that can be
  21. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  22. */
  23. class NzTooltipBaseDirective {
  24. componentType;
  25. config;
  26. cdkConnectedOverlayPush;
  27. visibleChange = new EventEmitter();
  28. /**
  29. * This true title that would be used in other parts on this component.
  30. */
  31. get _title() {
  32. return this.title || this.directiveTitle || null;
  33. }
  34. get _content() {
  35. return this.content || this.directiveContent || null;
  36. }
  37. get _trigger() {
  38. return typeof this.trigger !== 'undefined' ? this.trigger : 'hover';
  39. }
  40. get _placement() {
  41. const p = this.placement;
  42. return Array.isArray(p) && p.length > 0 ? p : typeof p === 'string' && p ? [p] : ['top'];
  43. }
  44. get _visible() {
  45. return (typeof this.visible !== 'undefined' ? this.visible : this.internalVisible) || false;
  46. }
  47. get _mouseEnterDelay() {
  48. return this.mouseEnterDelay || 0.15;
  49. }
  50. get _mouseLeaveDelay() {
  51. return this.mouseLeaveDelay || 0.1;
  52. }
  53. get _overlayClassName() {
  54. return this.overlayClassName || null;
  55. }
  56. get _overlayStyle() {
  57. return this.overlayStyle || null;
  58. }
  59. get _overlayClickable() {
  60. return this.overlayClickable ?? true;
  61. }
  62. internalVisible = false;
  63. getProxyPropertyMap() {
  64. return {
  65. noAnimation: ['noAnimation', () => !!this.noAnimation]
  66. };
  67. }
  68. component;
  69. destroy$ = new Subject();
  70. triggerDisposables = [];
  71. delayTimer;
  72. elementRef = inject(ElementRef);
  73. hostView = inject(ViewContainerRef);
  74. renderer = inject(Renderer2);
  75. noAnimation = inject(NzNoAnimationDirective, { host: true, optional: true });
  76. nzConfigService = inject(NzConfigService);
  77. platformId = inject(PLATFORM_ID);
  78. constructor(componentType) {
  79. this.componentType = componentType;
  80. }
  81. ngAfterViewInit() {
  82. if (isPlatformBrowser(this.platformId)) {
  83. this.createComponent();
  84. this.registerTriggers();
  85. }
  86. }
  87. ngOnChanges(changes) {
  88. const { trigger } = changes;
  89. if (trigger && !trigger.isFirstChange()) {
  90. this.registerTriggers();
  91. }
  92. if (this.component) {
  93. this.updatePropertiesByChanges(changes);
  94. }
  95. }
  96. ngOnDestroy() {
  97. this.destroy$.next();
  98. this.destroy$.complete();
  99. // Clear toggling timer. Issue #3875 #4317 #4386
  100. this.clearTogglingTimer();
  101. this.removeTriggerListeners();
  102. }
  103. show() {
  104. this.component?.show();
  105. }
  106. hide() {
  107. this.component?.hide();
  108. }
  109. /**
  110. * Force the component to update its position.
  111. */
  112. updatePosition() {
  113. if (this.component) {
  114. this.component.updatePosition();
  115. }
  116. }
  117. /**
  118. * Create a dynamic tooltip component. This method can be override.
  119. */
  120. createComponent() {
  121. const componentRef = this.hostView.createComponent(this.componentType);
  122. this.component = componentRef.instance;
  123. // Remove the component's DOM because it should be in the overlay container.
  124. this.renderer.removeChild(this.renderer.parentNode(this.elementRef.nativeElement), componentRef.location.nativeElement);
  125. this.component.setOverlayOrigin(this.origin || this.elementRef);
  126. this.initProperties();
  127. const ngVisibleChange$ = this.component.nzVisibleChange.pipe(distinctUntilChanged());
  128. ngVisibleChange$.pipe(takeUntil(this.destroy$)).subscribe((visible) => {
  129. this.internalVisible = visible;
  130. this.visibleChange.emit(visible);
  131. });
  132. // In some cases, the rendering takes into account the height at which the `arrow` is in wrong place,
  133. // so `cdk` sets the container position incorrectly.
  134. // To avoid this, after placing the `arrow` in the correct position, we should `re-calculate` the position of the `overlay`.
  135. ngVisibleChange$
  136. .pipe(filter((visible) => visible), delay(0, asapScheduler), filter(() => Boolean(this.component?.overlay?.overlayRef)), takeUntil(this.destroy$))
  137. .subscribe(() => {
  138. this.component?.updatePosition();
  139. });
  140. }
  141. registerTriggers() {
  142. // When the method gets invoked, all properties has been synced to the dynamic component.
  143. // After removing the old API, we can just check the directive's own `nzTrigger`.
  144. const el = this.elementRef.nativeElement;
  145. const trigger = this.trigger;
  146. this.removeTriggerListeners();
  147. if (trigger === 'hover') {
  148. let overlayElement;
  149. this.triggerDisposables.push(this.renderer.listen(el, 'mouseenter', () => {
  150. this.delayEnterLeave(true, true, this._mouseEnterDelay);
  151. }));
  152. this.triggerDisposables.push(this.renderer.listen(el, 'mouseleave', () => {
  153. this.delayEnterLeave(true, false, this._mouseLeaveDelay);
  154. if (this.component?.overlay.overlayRef && !overlayElement) {
  155. overlayElement = this.component.overlay.overlayRef.overlayElement;
  156. this.triggerDisposables.push(this.renderer.listen(overlayElement, 'mouseenter', () => {
  157. this.delayEnterLeave(false, true, this._mouseEnterDelay);
  158. }));
  159. this.triggerDisposables.push(this.renderer.listen(overlayElement, 'mouseleave', () => {
  160. this.delayEnterLeave(false, false, this._mouseLeaveDelay);
  161. }));
  162. }
  163. }));
  164. }
  165. else if (trigger === 'focus') {
  166. this.triggerDisposables.push(this.renderer.listen(el, 'focusin', () => this.show()));
  167. this.triggerDisposables.push(this.renderer.listen(el, 'focusout', () => this.hide()));
  168. }
  169. else if (trigger === 'click') {
  170. this.triggerDisposables.push(this.renderer.listen(el, 'click', (e) => {
  171. e.preventDefault();
  172. this.show();
  173. }));
  174. }
  175. // Else do nothing because user wants to control the visibility programmatically.
  176. }
  177. updatePropertiesByChanges(changes) {
  178. this.updatePropertiesByKeys(Object.keys(changes));
  179. }
  180. updatePropertiesByKeys(keys) {
  181. const mappingProperties = {
  182. // common mappings
  183. title: ['nzTitle', () => this._title],
  184. directiveTitle: ['nzTitle', () => this._title],
  185. content: ['nzContent', () => this._content],
  186. directiveContent: ['nzContent', () => this._content],
  187. trigger: ['nzTrigger', () => this._trigger],
  188. placement: ['nzPlacement', () => this._placement],
  189. visible: ['nzVisible', () => this._visible],
  190. mouseEnterDelay: ['nzMouseEnterDelay', () => this._mouseEnterDelay],
  191. mouseLeaveDelay: ['nzMouseLeaveDelay', () => this._mouseLeaveDelay],
  192. overlayClassName: ['nzOverlayClassName', () => this._overlayClassName],
  193. overlayStyle: ['nzOverlayStyle', () => this._overlayStyle],
  194. overlayClickable: ['nzOverlayClickable', () => this._overlayClickable],
  195. arrowPointAtCenter: ['nzArrowPointAtCenter', () => this.arrowPointAtCenter],
  196. cdkConnectedOverlayPush: ['cdkConnectedOverlayPush', () => this.cdkConnectedOverlayPush],
  197. ...this.getProxyPropertyMap()
  198. };
  199. (keys || Object.keys(mappingProperties).filter(key => !key.startsWith('directive'))).forEach((property) => {
  200. if (mappingProperties[property]) {
  201. const [name, valueFn] = mappingProperties[property];
  202. this.updateComponentValue(name, valueFn());
  203. }
  204. });
  205. this.component?.updateByDirective();
  206. }
  207. initProperties() {
  208. this.updatePropertiesByKeys();
  209. }
  210. updateComponentValue(key, value) {
  211. if (typeof value !== 'undefined') {
  212. // @ts-ignore
  213. this.component[key] = value;
  214. }
  215. }
  216. delayEnterLeave(isOrigin, isEnter, delay = -1) {
  217. if (this.delayTimer) {
  218. this.clearTogglingTimer();
  219. }
  220. else if (delay > 0) {
  221. this.delayTimer = setTimeout(() => {
  222. this.delayTimer = undefined;
  223. isEnter ? this.show() : this.hide();
  224. }, delay * 1000);
  225. }
  226. else {
  227. // `isOrigin` is used due to the tooltip will not hide immediately
  228. // (may caused by the fade-out animation).
  229. isEnter && isOrigin ? this.show() : this.hide();
  230. }
  231. }
  232. removeTriggerListeners() {
  233. this.triggerDisposables.forEach(dispose => dispose());
  234. this.triggerDisposables.length = 0;
  235. }
  236. clearTogglingTimer() {
  237. if (this.delayTimer) {
  238. clearTimeout(this.delayTimer);
  239. this.delayTimer = undefined;
  240. }
  241. }
  242. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTooltipBaseDirective, deps: [{ token: i0.Type }], target: i0.ɵɵFactoryTarget.Directive });
  243. static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.2", type: NzTooltipBaseDirective, isStandalone: true, usesOnChanges: true, ngImport: i0 });
  244. }
  245. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTooltipBaseDirective, decorators: [{
  246. type: Directive
  247. }], ctorParameters: () => [{ type: i0.Type }] });
  248. class NzTooltipBaseComponent {
  249. overlay;
  250. noAnimation = inject(NzNoAnimationDirective, { host: true, optional: true });
  251. cdr = inject(ChangeDetectorRef);
  252. directionality = inject(Directionality);
  253. nzTitle = null;
  254. nzContent = null;
  255. nzArrowPointAtCenter = false;
  256. nzOverlayClassName;
  257. nzOverlayStyle = {};
  258. nzOverlayClickable = true;
  259. nzBackdrop = false;
  260. nzMouseEnterDelay;
  261. nzMouseLeaveDelay;
  262. cdkConnectedOverlayPush = true;
  263. nzVisibleChange = new Subject();
  264. set nzVisible(value) {
  265. const visible = toBoolean(value);
  266. if (this._visible !== visible) {
  267. this._visible = visible;
  268. this.nzVisibleChange.next(visible);
  269. }
  270. }
  271. get nzVisible() {
  272. return this._visible;
  273. }
  274. _visible = false;
  275. set nzTrigger(value) {
  276. this._trigger = value;
  277. }
  278. get nzTrigger() {
  279. return this._trigger;
  280. }
  281. _trigger = 'hover';
  282. set nzPlacement(value) {
  283. const preferredPosition = value.map(placement => POSITION_MAP[placement]);
  284. this._positions = [...preferredPosition, ...DEFAULT_TOOLTIP_POSITIONS];
  285. }
  286. preferredPlacement = 'top';
  287. origin;
  288. dir = 'ltr';
  289. _classMap = {};
  290. _prefix = 'ant-tooltip';
  291. _positions = [...DEFAULT_TOOLTIP_POSITIONS];
  292. destroy$ = new Subject();
  293. ngOnInit() {
  294. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  295. this.dir = direction;
  296. this.cdr.detectChanges();
  297. });
  298. this.dir = this.directionality.value;
  299. }
  300. ngOnDestroy() {
  301. this.nzVisibleChange.complete();
  302. this.destroy$.next();
  303. this.destroy$.complete();
  304. }
  305. show() {
  306. if (this.nzVisible) {
  307. return;
  308. }
  309. if (!this.isEmpty()) {
  310. this.nzVisible = true;
  311. this.nzVisibleChange.next(true);
  312. this.cdr.detectChanges();
  313. }
  314. // for ltr for overlay to display tooltip in correct placement in rtl direction.
  315. if (this.origin && this.overlay && this.overlay.overlayRef && this.overlay.overlayRef.getDirection() === 'rtl') {
  316. this.overlay.overlayRef.setDirection('ltr');
  317. }
  318. }
  319. hide() {
  320. if (!this.nzVisible) {
  321. return;
  322. }
  323. this.nzVisible = false;
  324. this.nzVisibleChange.next(false);
  325. this.cdr.detectChanges();
  326. }
  327. updateByDirective() {
  328. this.updateStyles();
  329. this.cdr.detectChanges();
  330. Promise.resolve().then(() => {
  331. this.updatePosition();
  332. this.updateVisibilityByTitle();
  333. });
  334. }
  335. /**
  336. * Force the component to update its position.
  337. */
  338. updatePosition() {
  339. if (this.origin && this.overlay && this.overlay.overlayRef) {
  340. this.overlay.overlayRef.updatePosition();
  341. }
  342. }
  343. onPositionChange(position) {
  344. this.preferredPlacement = getPlacementName(position);
  345. this.updateStyles();
  346. // We have to trigger immediate change detection or the element would blink.
  347. this.cdr.detectChanges();
  348. }
  349. setOverlayOrigin(origin) {
  350. this.origin = origin;
  351. this.cdr.markForCheck();
  352. }
  353. onClickOutside(event) {
  354. if (!this.nzOverlayClickable) {
  355. return;
  356. }
  357. const target = _getEventTarget(event);
  358. if (!this.origin.nativeElement.contains(target) && this.nzTrigger !== null) {
  359. this.hide();
  360. }
  361. }
  362. /**
  363. * Hide the component while the content is empty.
  364. */
  365. updateVisibilityByTitle() {
  366. if (this.isEmpty()) {
  367. this.hide();
  368. }
  369. }
  370. updateStyles() {
  371. this._classMap = {
  372. ...this.transformClassListToMap(this.nzOverlayClassName),
  373. [`${this._prefix}-placement-${this.preferredPlacement}`]: true
  374. };
  375. }
  376. transformClassListToMap(klass) {
  377. const result = {};
  378. /**
  379. * @see https://github.com/angular/angular/blob/f6e97763cfab9fa2bea6e6b1303b64f1b499c3ef/packages/common/src/directives/ng_class.ts#L92
  380. */
  381. const classes = klass !== null ? klass.split(/\s+/) : [];
  382. classes.forEach(className => (result[className] = true));
  383. return result;
  384. }
  385. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTooltipBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
  386. static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.2", type: NzTooltipBaseComponent, isStandalone: true, viewQueries: [{ propertyName: "overlay", first: true, predicate: ["overlay"], descendants: true }], ngImport: i0 });
  387. }
  388. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTooltipBaseComponent, decorators: [{
  389. type: Directive
  390. }], propDecorators: { overlay: [{
  391. type: ViewChild,
  392. args: ['overlay', { static: false }]
  393. }] } });
  394. function isTooltipEmpty(value) {
  395. return value instanceof TemplateRef ? false : value === '' || !isNotNil(value);
  396. }
  397. /**
  398. * Use of this source code is governed by an MIT-style license that can be
  399. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  400. */
  401. class NzTooltipDirective extends NzTooltipBaseDirective {
  402. /* eslint-disable @angular-eslint/no-input-rename, @angular-eslint/no-output-rename */
  403. title;
  404. titleContext = null;
  405. directiveTitle;
  406. trigger = 'hover';
  407. placement = 'top';
  408. origin;
  409. visible;
  410. mouseEnterDelay;
  411. mouseLeaveDelay;
  412. overlayClassName;
  413. overlayStyle;
  414. arrowPointAtCenter;
  415. cdkConnectedOverlayPush = true;
  416. nzTooltipColor;
  417. directiveContent = null;
  418. content = null;
  419. overlayClickable;
  420. visibleChange = new EventEmitter();
  421. constructor() {
  422. super(NzToolTipComponent);
  423. }
  424. getProxyPropertyMap() {
  425. return {
  426. ...super.getProxyPropertyMap(),
  427. nzTooltipColor: ['nzColor', () => this.nzTooltipColor],
  428. titleContext: ['nzTitleContext', () => this.titleContext]
  429. };
  430. }
  431. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
  432. static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.2.2", type: NzTooltipDirective, isStandalone: true, selector: "[nz-tooltip]", 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", booleanAttribute], cdkConnectedOverlayPush: ["cdkConnectedOverlayPush", "cdkConnectedOverlayPush", booleanAttribute], nzTooltipColor: "nzTooltipColor" }, outputs: { visibleChange: "nzTooltipVisibleChange" }, host: { properties: { "class.ant-tooltip-open": "visible" } }, exportAs: ["nzTooltip"], usesInheritance: true, ngImport: i0 });
  433. }
  434. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTooltipDirective, decorators: [{
  435. type: Directive,
  436. args: [{
  437. selector: '[nz-tooltip]',
  438. exportAs: 'nzTooltip',
  439. host: {
  440. '[class.ant-tooltip-open]': 'visible'
  441. }
  442. }]
  443. }], ctorParameters: () => [], propDecorators: { title: [{
  444. type: Input,
  445. args: ['nzTooltipTitle']
  446. }], titleContext: [{
  447. type: Input,
  448. args: ['nzTooltipTitleContext']
  449. }], directiveTitle: [{
  450. type: Input,
  451. args: ['nz-tooltip']
  452. }], trigger: [{
  453. type: Input,
  454. args: ['nzTooltipTrigger']
  455. }], placement: [{
  456. type: Input,
  457. args: ['nzTooltipPlacement']
  458. }], origin: [{
  459. type: Input,
  460. args: ['nzTooltipOrigin']
  461. }], visible: [{
  462. type: Input,
  463. args: ['nzTooltipVisible']
  464. }], mouseEnterDelay: [{
  465. type: Input,
  466. args: ['nzTooltipMouseEnterDelay']
  467. }], mouseLeaveDelay: [{
  468. type: Input,
  469. args: ['nzTooltipMouseLeaveDelay']
  470. }], overlayClassName: [{
  471. type: Input,
  472. args: ['nzTooltipOverlayClassName']
  473. }], overlayStyle: [{
  474. type: Input,
  475. args: ['nzTooltipOverlayStyle']
  476. }], arrowPointAtCenter: [{
  477. type: Input,
  478. args: [{ alias: 'nzTooltipArrowPointAtCenter', transform: booleanAttribute }]
  479. }], cdkConnectedOverlayPush: [{
  480. type: Input,
  481. args: [{ transform: booleanAttribute }]
  482. }], nzTooltipColor: [{
  483. type: Input
  484. }], visibleChange: [{
  485. type: Output,
  486. args: ['nzTooltipVisibleChange']
  487. }] } });
  488. class NzToolTipComponent extends NzTooltipBaseComponent {
  489. nzTitle = null;
  490. nzTitleContext = null;
  491. nzColor;
  492. _contentStyleMap = {};
  493. isEmpty() {
  494. return isTooltipEmpty(this.nzTitle);
  495. }
  496. updateStyles() {
  497. const isColorPreset = this.nzColor && isPresetColor(this.nzColor);
  498. this._classMap = {
  499. ...this.transformClassListToMap(this.nzOverlayClassName),
  500. [`${this._prefix}-placement-${this.preferredPlacement}`]: true,
  501. [`${this._prefix}-${this.nzColor}`]: isColorPreset
  502. };
  503. this._contentStyleMap = {
  504. backgroundColor: !!this.nzColor && !isColorPreset ? this.nzColor : null,
  505. '--antd-arrow-background-color': this.nzColor
  506. };
  507. }
  508. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzToolTipComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
  509. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: NzToolTipComponent, isStandalone: true, selector: "nz-tooltip", exportAs: ["nzTooltipComponent"], usesInheritance: true, ngImport: i0, template: `
  510. <ng-template
  511. #overlay="cdkConnectedOverlay"
  512. cdkConnectedOverlay
  513. nzConnectedOverlay
  514. [cdkConnectedOverlayOrigin]="origin"
  515. [cdkConnectedOverlayOpen]="_visible"
  516. [cdkConnectedOverlayPositions]="_positions"
  517. [cdkConnectedOverlayPush]="cdkConnectedOverlayPush"
  518. [nzArrowPointAtCenter]="nzArrowPointAtCenter"
  519. (overlayOutsideClick)="onClickOutside($event)"
  520. (detach)="hide()"
  521. (positionChange)="onPositionChange($event)"
  522. >
  523. <div
  524. class="ant-tooltip"
  525. [class.ant-tooltip-rtl]="dir === 'rtl'"
  526. [class]="_classMap"
  527. [style]="nzOverlayStyle"
  528. [@.disabled]="!!noAnimation?.nzNoAnimation"
  529. [nzNoAnimation]="noAnimation?.nzNoAnimation"
  530. [@zoomBigMotion]="'active'"
  531. >
  532. <div class="ant-tooltip-content">
  533. <div class="ant-tooltip-arrow">
  534. <span class="ant-tooltip-arrow-content" [style]="_contentStyleMap"></span>
  535. </div>
  536. <div class="ant-tooltip-inner" [style]="_contentStyleMap">
  537. <ng-container *nzStringTemplateOutlet="nzTitle; context: nzTitleContext">{{ nzTitle }}</ng-container>
  538. </div>
  539. </div>
  540. </div>
  541. </ng-template>
  542. `, isInline: true, dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NzNoAnimationDirective, selector: "[nzNoAnimation]", inputs: ["nzNoAnimation"], exportAs: ["nzNoAnimation"] }, { kind: "ngmodule", type: NzOutletModule }, { kind: "directive", type: i2.NzStringTemplateOutletDirective, selector: "[nzStringTemplateOutlet]", inputs: ["nzStringTemplateOutletContext", "nzStringTemplateOutlet"], exportAs: ["nzStringTemplateOutlet"] }, { kind: "ngmodule", type: NzOverlayModule }, { kind: "directive", type: i3.NzConnectedOverlayDirective, selector: "[cdkConnectedOverlay][nzConnectedOverlay]", inputs: ["nzArrowPointAtCenter"], exportAs: ["nzConnectedOverlay"] }], animations: [zoomBigMotion], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  543. }
  544. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzToolTipComponent, decorators: [{
  545. type: Component,
  546. args: [{
  547. selector: 'nz-tooltip',
  548. exportAs: 'nzTooltipComponent',
  549. changeDetection: ChangeDetectionStrategy.OnPush,
  550. encapsulation: ViewEncapsulation.None,
  551. animations: [zoomBigMotion],
  552. template: `
  553. <ng-template
  554. #overlay="cdkConnectedOverlay"
  555. cdkConnectedOverlay
  556. nzConnectedOverlay
  557. [cdkConnectedOverlayOrigin]="origin"
  558. [cdkConnectedOverlayOpen]="_visible"
  559. [cdkConnectedOverlayPositions]="_positions"
  560. [cdkConnectedOverlayPush]="cdkConnectedOverlayPush"
  561. [nzArrowPointAtCenter]="nzArrowPointAtCenter"
  562. (overlayOutsideClick)="onClickOutside($event)"
  563. (detach)="hide()"
  564. (positionChange)="onPositionChange($event)"
  565. >
  566. <div
  567. class="ant-tooltip"
  568. [class.ant-tooltip-rtl]="dir === 'rtl'"
  569. [class]="_classMap"
  570. [style]="nzOverlayStyle"
  571. [@.disabled]="!!noAnimation?.nzNoAnimation"
  572. [nzNoAnimation]="noAnimation?.nzNoAnimation"
  573. [@zoomBigMotion]="'active'"
  574. >
  575. <div class="ant-tooltip-content">
  576. <div class="ant-tooltip-arrow">
  577. <span class="ant-tooltip-arrow-content" [style]="_contentStyleMap"></span>
  578. </div>
  579. <div class="ant-tooltip-inner" [style]="_contentStyleMap">
  580. <ng-container *nzStringTemplateOutlet="nzTitle; context: nzTitleContext">{{ nzTitle }}</ng-container>
  581. </div>
  582. </div>
  583. </div>
  584. </ng-template>
  585. `,
  586. preserveWhitespaces: false,
  587. imports: [OverlayModule, NzNoAnimationDirective, NzOutletModule, NzOverlayModule]
  588. }]
  589. }] });
  590. /**
  591. * Use of this source code is governed by an MIT-style license that can be
  592. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  593. */
  594. class NzToolTipModule {
  595. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzToolTipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
  596. static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.2", ngImport: i0, type: NzToolTipModule, imports: [NzToolTipComponent, NzTooltipDirective], exports: [NzToolTipComponent, NzTooltipDirective] });
  597. static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzToolTipModule, imports: [NzToolTipComponent] });
  598. }
  599. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzToolTipModule, decorators: [{
  600. type: NgModule,
  601. args: [{
  602. imports: [NzToolTipComponent, NzTooltipDirective],
  603. exports: [NzToolTipComponent, NzTooltipDirective]
  604. }]
  605. }] });
  606. /**
  607. * Use of this source code is governed by an MIT-style license that can be
  608. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  609. */
  610. /**
  611. * Generated bundle index. Do not edit.
  612. */
  613. export { NzToolTipComponent, NzToolTipModule, NzTooltipBaseComponent, NzTooltipBaseDirective, NzTooltipDirective, isTooltipEmpty };
  614. //# sourceMappingURL=ng-zorro-antd-tooltip.mjs.map