@progress/kendo-angular-tooltip 4.0.0 → 4.0.2-dev.202209020954

package/README.md

@@ -2,28 +2,52 @@
 <img width="631" src="https://www.telerik.com/kendo-angular-ui/npm-banner.svg">
 </a>
 
-## Kendo UI for Angular Tooltip Component
+## Kendo UI for Angular Tooltips Component
 
 > **Important**
-> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;a commercial library.
+> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;a commercial library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
 > * You will need to install a license key when adding the package to your project. For more information, please refer to the [Kendo UI for Angular My License page](https://www.telerik.com/kendo-angular-ui/my-license?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip).
 > * To receive a license key, you need to either [purchase a license](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip). Doing so indicates that you [accept the Kendo UI for Angular License Agreement](https://www.telerik.com/purchase/license-agreement/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip).
 > * The 30-day free trial gives you access to all the Kendo UI for Angular components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the Kendo UI for Angular dev team!
 >
 > [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip) and speed up your development process!
 
-Kendo UI for Angular is a commercial UI library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
+The [Kendo UI for Angular Tooltips Package](https://www.telerik.com/kendo-angular-ui/components/tooltips/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip) contains two components, the Angular Tooltip and the Angular Popover. They both render popups with information related to UI elements and can be displayed when the element is focused or hovered over (or clicked in the Popover case). With tons of configuration options, they allow building custom tooltips in Angular.
+
+## Angular Tooltip Component 
+
+The [Angular Tooltip Component](https://www.telerik.com/kendo-angular-ui/components/tooltips/tooltip/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip) renders a customizable tooltip that can be used stand alone of with other Kendo UI for Angular components. 
+
+<img src="https://d585tldpucybw.cloudfront.net/sfimages/default-source/component-pages/angular/angular-tooltip-overview.jpg" alt="Component for creating custom tooltips in Angular">
+
+* [Anchor Elements](https://www.telerik.com/kendo-angular-ui/components/tooltips/tooltip/anchor-elements/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Specify which elements (anchors) will render a tooltip.
+* [Programtic Opening](https://www.telerik.com/kendo-angular-ui/components/tooltips/tooltip/opening/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;The Tooltip provides options for consuming its API programmatically.
+* [Closable](https://www.telerik.com/kendo-angular-ui/components/tooltips/tooltip/closable-tooltip/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Optionally add a close button.
+* [Positioning](https://www.telerik.com/kendo-angular-ui/components/tooltips/tooltip/positioning/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Choose the position on the screen that the Tooltip appears.
+* [Templates](https://www.telerik.com/kendo-angular-ui/components/tooltips/tooltip/templates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Provide your own layout and style templates for the Tooltop content.
+
+## Angular Popover Component
+
+The [Angular Popover Component](https://www.telerik.com/kendo-angular-ui/components/tooltips/popover/) is nearly identical to the Angular Tooltip component, except it is designed to display richer content and it can be opened via click. For example, it is possible to host a calendar or a grid in the Popover while the Tooltop is designed mostly for text. 
+
+<img src="https://d585tldpucybw.cloudfront.net/sfimages/default-source/component-pages/common/popover/popover_component_overview.jpg" alt="Angular Popover Example">
+
+* [Single or Multiple Anchor Elements](https://www.telerik.com/kendo-angular-ui/components/tooltips/popover/configuration/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Associate the Popover with a single element or associate one Popover with multiple elements.
+* [Programitic Control](https://www.telerik.com/kendo-angular-ui/components/tooltips/popover/programmatic-control/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;The Popover provides options for consuming its API programmatically.
+* [Positioning](https://www.telerik.com/kendo-angular-ui/components/tooltips/popover/positioning/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Choose the position on the screen that the Popover appears.
+* [Templates](https://www.telerik.com/kendo-angular-ui/components/tooltips/popover/templates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Provide your own layout and style templates for the Popover content.
+* [Animations](https://www.telerik.com/kendo-angular-ui/components/tooltips/popover/animations/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)&mdash;Enable animations that will be applied on the opening of the Popover.
 
 ## Resources
 
-* [Get Started with Kendo UI for Angular (requires trial registration)](https://www.telerik.com/kendo-angular-ui/getting-started)
-* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components)
+* [Get Started with Kendo UI for Angular (requires trial registration)](https://www.telerik.com/kendo-angular-ui/getting-started?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)
+* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)
 * [Blogs](http://www.telerik.com/blogs/kendo-ui)
-* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui)
+* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)
 
 ## Questions and Feedback
 
-* [Official Forums](https://www.telerik.com/forums/kendo-angular-ui)
+* [Official Forums](https://www.telerik.com/forums/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-tooltip)
 * [GitHub Issues](https://github.com/telerik/kendo-angular/issues)
 * [Feedback Portal](https://feedback.telerik.com/kendo-angular-ui)
 * [StackOverflow](https://stackoverflow.com/questions/tagged/kendo-ui-angular2)

package/bundles/kendo-angular-tooltip.umd.js

@@ -2,4 +2,4 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("rxjs/operators"),require("rxjs"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("@angular/common"),require("@progress/kendo-angular-popup"),require("@progress/kendo-angular-common")):"function"==typeof define&&define.amd?define("KendoAngularTooltip",["exports","@angular/core","rxjs/operators","rxjs","@progress/kendo-licensing","@progress/kendo-angular-l10n","@angular/common","@progress/kendo-angular-popup","@progress/kendo-angular-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularTooltip={},e.ng.core,e.rxjs.operators,e.rxjs,e.KendoLicensing,e.KendoAngularL10N,e.ng.common,e.KendoAngularPopup,e.KendoAngularCommon)}(this,function(e,p,a,l,x,t,o,n,s){"use strict";function i(o){if(o&&o.__esModule)return o;var n=Object.create(null);return o&&Object.keys(o).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(o,e),Object.defineProperty(n,e,t.get?t:{enumerable:!0,get:function(){return o[e]}}))}),n.default=o,Object.freeze(n)}var r=i(p),c=i(t),u=i(o),h=i(n),j={name:"@progress/kendo-angular-tooltip",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1650441036,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},H=new p.InjectionToken("kendo-ui-tooltip-settings"),d=function(){};function N(e,t){var o={},n={},i={};switch(e){case"top":o={horizontal:"center",vertical:"top"},n={horizontal:"center",vertical:"bottom"},i={horizontal:0,vertical:t};break;case"bottom":o={horizontal:"center",vertical:"bottom"},n={horizontal:"center",vertical:"top"},i={horizontal:0,vertical:t};break;case"right":o={horizontal:"right",vertical:"center"},n={horizontal:"left",vertical:"center"},i={horizontal:t,vertical:0};break;case"left":o={horizontal:"left",vertical:"center"},n={horizontal:"right",vertical:"center"},i={horizontal:t,vertical:0}}return{anchorAlign:o,popupAlign:n,popupMargin:i}}function F(e){return 9===e.nodeType}function f(e,t){if(e.closest)return e.closest(t);for(var o=Element.prototype.matches?function(e,t){return e.matches(t)}:function(e,t){return e.msMatchesSelector(t)},n=e;n&&!F(n);){if(o(n,t))return n;n=n.parentNode}}function z(e,t){return e&&(!F(e)&&(e.contains?e.contains(t):e.compareDocumentPosition&&e.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_CONTAINED_BY))}d.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:d,deps:[],target:r.ɵɵFactoryTarget.Injectable}),d.ɵprov=r.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:d}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:d,decorators:[{type:p.Injectable}],ctorParameters:function(){return[]}});function Z(e,t,o){e=e.getBoundingClientRect();return e[t]+e[o]/2}function B(e,t){return-1!==e.indexOf(t)}var W=function(e,t){return(W=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])})(e,t)};function g(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function o(){this.constructor=e}W(e,t),e.prototype=null===t?Object.create(t):(o.prototype=t.prototype,new o)}Object.create;function m(e,t){var o="function"==typeof Symbol&&e[Symbol.iterator];if(!o)return e;var n,i,r=o.call(e),s=[];try{for(;(void 0===t||0<t--)&&!(n=r.next()).done;)s.push(n.value)}catch(e){i={error:e}}finally{try{n&&!n.done&&(o=r.return)&&o.call(r)}finally{if(i)throw i.error}}return s}function v(e,t,o){if(o||2===arguments.length)for(var n,i=0,r=t.length;i<r;i++)!n&&i in t||((n=n||Array.prototype.slice.call(t,0,i))[i]=t[i]);return e.concat(n||Array.prototype.slice.call(t))}Object.create;g(q,$=t.ComponentMessages);var $,y=q;function q(e){var t=$.call(this)||this;return t.service=e,t}y.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:y,deps:[{token:c.LocalizationService}],target:r.ɵɵFactoryTarget.Directive}),y.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:y,selector:"[kendoTooltipLocalizedMessages]",inputs:{closeTitle:"closeTitle"},providers:[{provide:t.ComponentMessages,useExisting:p.forwardRef(function(){return y})}],usesInheritance:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:y,decorators:[{type:p.Directive,args:[{providers:[{provide:t.ComponentMessages,useExisting:p.forwardRef(function(){return y})}],selector:"[kendoTooltipLocalizedMessages]"}]}],ctorParameters:function(){return[{type:c.LocalizationService}]},propDecorators:{closeTitle:[{type:p.Input}]}});Object.defineProperty(T.prototype,"cssClasses",{get:function(){return"k-widget k-tooltip"},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"className",{get:function(){return this.closable},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"cssPosition",{get:function(){return"relative"},enumerable:!1,configurable:!0}),T.prototype.ngOnInit=function(){var t=this;this.dynamicRTLSubscription=this.localizationService.changes.subscribe(function(e){e=e.rtl;return t.direction=e?"rtl":"ltr"})},T.prototype.ngOnDestroy=function(){this.dynamicRTLSubscription&&this.dynamicRTLSubscription.unsubscribe()},Object.defineProperty(T.prototype,"closeButtonTitle",{get:function(){return this.closeTitle||this.localizationService.get("closeTitle")},enumerable:!1,configurable:!0}),T.prototype.calloutPositionClass=function(){return{top:"k-callout-s",left:"k-callout-e",bottom:"k-callout-n",right:"k-callout-w"}[this.position]},T.prototype.onCloseClick=function(e){e.preventDefault(),this.close.emit()},T.prototype.updateCalloutPosition=function(e,t){var o,n,i,r,s,p,a;this.callout&&(p=(n="top"===e||"bottom"===e)?"width":"height",s=n?"left":"top",n=n?"marginLeft":"marginTop",i=(o=this.content.nativeElement.querySelector(".k-callout")).getBoundingClientRect()[p],r=Z(this.anchor.nativeElement,s,p),s=Z(this.content.nativeElement,s,p),(1<(p=Math.abs(s-r))||0===p||0===Math.round(p))&&(o.style[n]=-(s-r+i/2)+"px"),a=this.calloutStyles(e,i,t),Object.keys(a).forEach(function(e){o.style[e]=a[e]}))};var b=T;function T(e,t){this.content=e,this.localizationService=t,this.close=new p.EventEmitter,this.tooltipWidth=null,this.tooltipHeight=null,this.callout=!0,this.calloutStyles=function(e,t,o){var n={},i="top"===e||"bottom"===e;return o?("top"===e?n.bottom="unset":"bottom"===e?n.top="unset":"left"===e?n.right="unset":"right"===e&&(n.left="unset"),n[e]=-t+"px",n.transform=i?"rotateX(180deg)":"rotateY(180deg)"):n.transform=i?"rotateX(0deg)":"rotateY(0deg)",n},this.direction=t.rtl?"rtl":"ltr"}b.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:b,deps:[{token:r.ElementRef},{token:c.LocalizationService}],target:r.ɵɵFactoryTarget.Component}),b.ɵcmp=r.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:b,selector:"kendo-tooltip",inputs:{tooltipWidth:"tooltipWidth",tooltipHeight:"tooltipHeight",titleTemplate:"titleTemplate",anchor:"anchor",closable:"closable",templateRef:"templateRef",templateString:"templateString"},outputs:{close:"close"},host:{properties:{"attr.dir":"this.direction",class:"this.cssClasses","class.k-tooltip-closable":"this.className","style.position":"this.cssPosition","style.width.px":"this.tooltipWidth","style.height.px":"this.tooltipHeight"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.tooltip"}],ngImport:r,template:'\n        <ng-container kendoTooltipLocalizedMessages\n            i18n-closeTitle="kendo.tooltip.closeTitle|The title of the close button"\n            closeTitle="Close"\n        >\n        </ng-container>\n\n        <div class="k-tooltip-content">\n            <div class="k-tooltip-title" *ngIf="titleTemplate">\n                <ng-template\n                    [ngIf]="titleTemplate"\n                    [ngTemplateOutlet]="titleTemplate"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n                </ng-template>\n            </div>\n\n            <ng-template\n                [ngIf]="templateRef"\n                [ngTemplateOutlet]="templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n            </ng-template>\n            <ng-template\n                [ngIf]="templateString">\n                {{ templateString }}\n            </ng-template>\n        </div>\n\n        <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">\n            <a href="#" class="k-icon k-i-close" [attr.title]="closeButtonTitle"></a>\n        </div>\n\n        <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>\n    ',isInline:!0,directives:[{type:y,selector:"[kendoTooltipLocalizedMessages]",inputs:["closeTitle"]},{type:u.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:u.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]},{type:u.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]}]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:b,decorators:[{type:p.Component,args:[{selector:"kendo-tooltip",template:'\n        <ng-container kendoTooltipLocalizedMessages\n            i18n-closeTitle="kendo.tooltip.closeTitle|The title of the close button"\n            closeTitle="Close"\n        >\n        </ng-container>\n\n        <div class="k-tooltip-content">\n            <div class="k-tooltip-title" *ngIf="titleTemplate">\n                <ng-template\n                    [ngIf]="titleTemplate"\n                    [ngTemplateOutlet]="titleTemplate"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n                </ng-template>\n            </div>\n\n            <ng-template\n                [ngIf]="templateRef"\n                [ngTemplateOutlet]="templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n            </ng-template>\n            <ng-template\n                [ngIf]="templateString">\n                {{ templateString }}\n            </ng-template>\n        </div>\n\n        <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">\n            <a href="#" class="k-icon k-i-close" [attr.title]="closeButtonTitle"></a>\n        </div>\n\n        <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>\n    ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.tooltip"}]}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:c.LocalizationService}]},propDecorators:{direction:[{type:p.HostBinding,args:["attr.dir"]}],close:[{type:p.Output}],cssClasses:[{type:p.HostBinding,args:["class"]}],className:[{type:p.HostBinding,args:["class.k-tooltip-closable"]}],cssPosition:[{type:p.HostBinding,args:["style.position"]}],tooltipWidth:[{type:p.HostBinding,args:["style.width.px"]},{type:p.Input}],tooltipHeight:[{type:p.HostBinding,args:["style.height.px"]},{type:p.Input}],titleTemplate:[{type:p.Input}],anchor:[{type:p.Input}],closable:[{type:p.Input}],templateRef:[{type:p.Input}],templateString:[{type:p.Input}]}});Object.defineProperty(I.prototype,"tooltipTemplate",{get:function(){return this.template},set:function(e){this.template=e},enumerable:!1,configurable:!0}),I.prototype.show=function(e){var t=this;this.popupRef||(e instanceof Element&&(e={nativeElement:e}),this.anchor=e,"hover"===this.showOn?this.popupRef||(clearTimeout(this.showTimeout),this.showTimeout=window.setTimeout(function(){return t.showContent(t.anchor)},this.showAfter)):(this.hideElementTitle(this.anchor),this.showContent(this.anchor)))},I.prototype.hide=function(){clearTimeout(this.showTimeout);var e=this.anchor&&this.anchor.nativeElement;e&&e.getAttribute("data-title")&&(!e.getAttribute("title")&&e.hasAttribute("title")&&e.setAttribute("title",e.getAttribute("data-title")),e.setAttribute("data-title","")),this.popupMouseOutSubscription&&this.popupMouseOutSubscription.unsubscribe(),this.closeClickSubscription&&this.closeClickSubscription.unsubscribe(),this.closePopup()},I.prototype.toggle=function(e,t){var o=this.anchor&&this.anchor.nativeElement;o!==(e=e instanceof Element?{nativeElement:e}:e).nativeElement&&this.hide(),o===e.nativeElement&&"click"===this.showOn&&this.hide(),(t=void 0===t?!this.popupRef:t)?this.show(e):this.hide()},I.prototype.ngOnInit=function(){void 0===this.showOn&&(this.showOn="hover"),this.verifyProperties()},I.prototype.ngOnChanges=function(e){e.showOn&&this.subscribeClick()},I.prototype.ngAfterViewChecked=function(){this.popupRef&&this.anchor&&!function(e,t){for(;e&&e!==t;)e=e.parentNode;return e}(this.anchor.nativeElement||this.anchor,this.tooltipWrapper.nativeElement)&&(this.anchor=null,this.hide())},I.prototype.ngOnDestroy=function(){this.hide(),this.template=null,this.anchorTitleSubscription.unsubscribe(),this.mouseOverSubscription.unsubscribe(),this.mouseOutSubscription.unsubscribe(),this.mouseClickSubscription&&this.mouseClickSubscription.unsubscribe(),this.popupPositionChangeSubscription&&this.popupPositionChangeSubscription.unsubscribe(),this.popupMouseOutSubscription&&this.popupMouseOutSubscription.unsubscribe()},I.prototype.showContent=function(e){var t=this;(e.nativeElement.getAttribute("data-title")||this.template)&&(this.ngZone.run(function(){t.openPopup(e),t.bindContent(t.popupRef.content,e)}),this.popupRef.popupAnchorViewportLeave.pipe(a.take(1)).subscribe(function(){return t.hide()}))},I.prototype.bindContent=function(e,t){var o=this,e=e.instance;this.closeClickSubscription=e.close.subscribe(function(){o.hide()}),this.template?e.templateRef=this.template:e.templateString=this.anchor.nativeElement.getAttribute("data-title"),this.titleTemplate&&(e.titleTemplate=this.titleTemplate),e.closeTitle=this.closeTitle,e.anchor=t,e.callout=this.callout,e.closable=this.closable,e.position=this.position,e.tooltipWidth=this.tooltipWidth,e.tooltipHeight=this.tooltipHeight,this.popupRef.content.changeDetectorRef.detectChanges()},I.prototype.hideElementTitle=function(e){e=e.nativeElement;e.getAttribute("title")&&(e.setAttribute("data-title",e.getAttribute("title")),e.setAttribute("title",""))},I.prototype.openPopup=function(e){var t=this,o=N(this.position,this.offset),n=o.anchorAlign,i=o.popupAlign,o=o.popupMargin,r=(this.popupRef=this.popupService.open({anchor:e,anchorAlign:n,animate:!1,content:b,collision:(e=this.collision,n=this.position,e||("top"===n||"bottom"===n?{horizontal:"fit",vertical:"flip"}:{horizontal:"flip",vertical:"fit"})),margin:o,popupAlign:i,popupClass:"k-popup-transparent"}),this.renderer.addClass(this.popupRef.popupElement,"k-tooltip-wrapper"),this.tooltipClass&&this.renderer.addClass(this.popupRef.popupElement,this.tooltipClass),this.popupRef.content.instance);r.callout&&(this.popupPositionChangeSubscription=this.popupRef.popupPositionChange.subscribe(function(e){e=e.flip,e=!0===e.horizontal||!0===e.vertical;r.updateCalloutPosition(t.position,e)})),"hover"===this.showOn&&this.ngZone.runOutsideAngular(function(){var e=t.popupRef.popupElement;t.popupMouseOutSubscription=l.fromEvent(e,"mouseout").subscribe(function(e){return t.onMouseOut(e)})})},I.prototype.closePopup=function(){this.popupRef&&(this.popupRef.close(),this.popupRef=null),this.popupPositionChangeSubscription&&this.popupPositionChangeSubscription.unsubscribe()},I.prototype.subscribeClick=function(){var t=this;this.mouseClickSubscription&&this.mouseClickSubscription.unsubscribe(),"click"===this.showOn&&(this.mouseClickSubscription=l.fromEvent(document,"click").pipe(a.filter(function(){return""!==t.filter})).subscribe(function(e){return t.onMouseClick(e,t.tooltipWrapper.nativeElement)}))},I.prototype.onMouseClick=function(e,t){var e=e.target,o=f(e,this.filter),n=this.popupRef&&this.popupRef.popupElement;if(n){if(n.contains(e))return;if(this.closable)return}t.contains(e)&&o?this.toggle(o,!0):n&&this.hide()},I.prototype.onMouseOver=function(e){e=f(e.target,this.filter);"hover"===this.showOn&&e&&this.toggle(e,!0)},I.prototype.onMouseOut=function(e){var t;"hover"!==this.showOn||this.closable||(t=this.popupRef&&this.popupRef.popupElement,(e=e.relatedTarget)&&this.anchor&&z(this.anchor.nativeElement,e)||e&&z(t,e)||this.hide())},I.prototype.verifyProperties=function(){if(p.isDevMode()){if(!B(this.validPositions,this.position))throw new Error("Invalid value provided for position property.The available options are 'top', 'bottom', 'left', or 'right'.");if(!B(this.validShowOptions,this.showOn))throw new Error("Invalid value provided for showOn property.The available options are 'hover' or 'none'.")}};var k=I;function I(e,t,o,n,i,r){var s=this;this.tooltipWrapper=e,this.ngZone=t,this.renderer=o,this.popupService=n,this.filter="[title]",this.position="top",this.showAfter=100,this.callout=!0,this.closable=!1,this.offset=6,this.anchor=null,this.validPositions=["top","bottom","right","left"],this.validShowOptions=["hover","click","none"],x.validatePackage(j),Object.assign(this,i,r),this.ngZone.runOutsideAngular(function(){var e=s.tooltipWrapper.nativeElement;s.anchorTitleSubscription=l.fromEvent(e,"mouseover").pipe(a.filter(function(){return""!==s.filter})).subscribe(function(e){e=f(e.target,s.filter);e&&s.hideElementTitle({nativeElement:e})}),s.mouseOverSubscription=l.fromEvent(e,"mouseover").pipe(a.debounceTime(100),a.filter(function(){return""!==s.filter})).subscribe(function(e){return s.onMouseOver(e)}),s.mouseOutSubscription=l.fromEvent(e,"mouseout").pipe(a.debounceTime(100)).subscribe(function(e){return s.onMouseOut(e)})})}k.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:k,deps:[{token:r.ElementRef},{token:r.NgZone},{token:r.Renderer2},{token:h.PopupService},{token:d,optional:!0},{token:H,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),k.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:k,selector:"[kendoTooltip]",inputs:{filter:"filter",position:"position",titleTemplate:"titleTemplate",showOn:"showOn",showAfter:"showAfter",callout:"callout",closable:"closable",offset:"offset",tooltipWidth:"tooltipWidth",tooltipHeight:"tooltipHeight",tooltipClass:"tooltipClass",collision:"collision",closeTitle:"closeTitle",tooltipTemplate:"tooltipTemplate"},exportAs:["kendoTooltip"],usesOnChanges:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:k,decorators:[{type:p.Directive,args:[{selector:"[kendoTooltip]",exportAs:"kendoTooltip"}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:r.NgZone},{type:r.Renderer2},{type:h.PopupService},{type:d,decorators:[{type:p.Optional}]},{type:d,decorators:[{type:p.Optional},{type:p.Inject,args:[H]}]}]},propDecorators:{filter:[{type:p.Input}],position:[{type:p.Input}],titleTemplate:[{type:p.Input}],showOn:[{type:p.Input}],showAfter:[{type:p.Input}],callout:[{type:p.Input}],closable:[{type:p.Input}],offset:[{type:p.Input}],tooltipWidth:[{type:p.Input}],tooltipHeight:[{type:p.Input}],tooltipClass:[{type:p.Input}],collision:[{type:p.Input}],closeTitle:[{type:p.Input}],tooltipTemplate:[{type:p.Input}]}});var K="Invalid value provided for the 'popover' property. The accepted data types are 'PopoverComponent' or 'PopoverFn'.",U="templateData must be a function, but received",X="Invalid value provided for the 'showOn' property. The available options are 'click', 'hover', 'focus' or 'none'.",O=function(e){this.templateRef=e},P=(O.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:O,deps:[{token:r.TemplateRef,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),O.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:O,selector:"[kendoPopoverTitleTemplate]",ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:O,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverTitleTemplate]"}]}],ctorParameters:function(){return[{type:r.TemplateRef,decorators:[{type:p.Optional}]}]}}),function(e){this.templateRef=e}),C=(P.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:P,deps:[{token:r.TemplateRef,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),P.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:P,selector:"[kendoPopoverBodyTemplate]",ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:P,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverBodyTemplate]"}]}],ctorParameters:function(){return[{type:r.TemplateRef,decorators:[{type:p.Optional}]}]}}),function(e){this.templateRef=e}),w=(C.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:C,deps:[{token:r.TemplateRef,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),C.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"[kendoPopoverActionsTemplate]",ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:C,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverActionsTemplate]"}]}],ctorParameters:function(){return[{type:r.TemplateRef,decorators:[{type:p.Optional}]}]}}),Object.defineProperty(E.prototype,"offset",{get:function(){return this.callout?14+this._offset:this._offset},set:function(e){this._offset=e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"width",{get:function(){return this._width},set:function(e){this._width="number"==typeof e?e+"px":e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"height",{get:function(){return this._height},set:function(e){this._height="number"==typeof e?e+"px":e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"templateData",{get:function(){return this._templateData},set:function(e){if(p.isDevMode&&"function"!=typeof e)throw new Error(U+" "+JSON.stringify(e)+".");this._templateData=e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"isHidden",{get:function(){return!this.visible},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"hasAttributeHidden",{get:function(){return!this.visible},enumerable:!1,configurable:!0}),E.prototype.ngOnInit=function(){var t=this;this.subs.add(this.localization.changes.subscribe(function(e){e=e.rtl;t.direction=e?"rtl":"ltr"}))},E.prototype.ngOnDestroy=function(){this.subs.unsubscribe()},E.prototype.getCalloutPosition=function(){switch(this.position){case"top":return{"k-callout-s":!0};case"bottom":return{"k-callout-n":!0};case"left":return{"k-callout-e":!0};case"right":return{"k-callout-w":!0};default:return{"k-callout-s":!0}}},E);function E(e){this.localization=e,this.position="right",this.callout=!0,this.animation=!1,this.visible=!1,this.show=new p.EventEmitter,this.shown=new p.EventEmitter,this.hide=new p.EventEmitter,this.hidden=new p.EventEmitter,this._width="auto",this._height="auto",this._offset=6,this.subs=new l.Subscription,this._templateData=function(){return null},x.validatePackage(j)}w.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:w,deps:[{token:c.LocalizationService}],target:r.ɵɵFactoryTarget.Component}),w.ɵcmp=r.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"kendo-popover",inputs:{position:"position",offset:"offset",width:"width",height:"height",title:"title",subtitle:"subtitle",body:"body",callout:"callout",animation:"animation",templateData:"templateData"},outputs:{show:"show",shown:"shown",hide:"hide",hidden:"hidden"},host:{properties:{"attr.dir":"this.direction","class.k-hidden":"this.isHidden","attr.aria-hidden":"this.hasAttributeHidden","style.width":"this._width","style.height":"this._height"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.popover"}],queries:[{propertyName:"titleTemplate",first:!0,predicate:O,descendants:!0},{propertyName:"bodyTemplate",first:!0,predicate:P,descendants:!0},{propertyName:"actionsTemplate",first:!0,predicate:C,descendants:!0}],ngImport:r,template:'\n    <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{\'width\': width, \'height\': height}">\n        <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>\n\n        <div *ngIf="titleTemplate || title" class="k-popover-header">\n            <ng-template *ngIf="titleTemplate"\n                [ngTemplateOutlet]="titleTemplate?.templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n            </ng-template>\n            <ng-container *ngIf="title && !titleTemplate">\n                {{ title }}\n            </ng-container>\n        </div>\n\n        <div *ngIf="bodyTemplate || body" class="k-popover-body">\n            <ng-template *ngIf="bodyTemplate"\n                [ngTemplateOutlet]="bodyTemplate?.templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n            </ng-template>\n            <ng-container *ngIf="body && !bodyTemplate">\n                {{ body }}\n            </ng-container>\n        </div>\n\n        <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">\n            <ng-template *ngIf="actionsTemplate"\n                [ngTemplateOutlet]="actionsTemplate?.templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n            </ng-template>\n        </div>\n    </div>\n    ',isInline:!0,directives:[{type:u.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:u.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:u.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:u.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]}]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:w,decorators:[{type:p.Component,args:[{selector:"kendo-popover",providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.popover"}],template:'\n    <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{\'width\': width, \'height\': height}">\n        <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>\n\n        <div *ngIf="titleTemplate || title" class="k-popover-header">\n            <ng-template *ngIf="titleTemplate"\n                [ngTemplateOutlet]="titleTemplate?.templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n            </ng-template>\n            <ng-container *ngIf="title && !titleTemplate">\n                {{ title }}\n            </ng-container>\n        </div>\n\n        <div *ngIf="bodyTemplate || body" class="k-popover-body">\n            <ng-template *ngIf="bodyTemplate"\n                [ngTemplateOutlet]="bodyTemplate?.templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n            </ng-template>\n            <ng-container *ngIf="body && !bodyTemplate">\n                {{ body }}\n            </ng-container>\n        </div>\n\n        <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">\n            <ng-template *ngIf="actionsTemplate"\n                [ngTemplateOutlet]="actionsTemplate?.templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n            </ng-template>\n        </div>\n    </div>\n    '}]}],ctorParameters:function(){return[{type:c.LocalizationService}]},propDecorators:{position:[{type:p.Input}],offset:[{type:p.Input}],width:[{type:p.Input}],height:[{type:p.Input}],direction:[{type:p.HostBinding,args:["attr.dir"]}],title:[{type:p.Input}],subtitle:[{type:p.Input}],body:[{type:p.Input}],callout:[{type:p.Input}],animation:[{type:p.Input}],templateData:[{type:p.Input}],isHidden:[{type:p.HostBinding,args:["class.k-hidden"]}],hasAttributeHidden:[{type:p.HostBinding,args:["attr.aria-hidden"]}],show:[{type:p.Output}],shown:[{type:p.Output}],hide:[{type:p.Output}],hidden:[{type:p.Output}],titleTemplate:[{type:p.ContentChild,args:[O,{static:!1}]}],bodyTemplate:[{type:p.ContentChild,args:[P,{static:!1}]}],actionsTemplate:[{type:p.ContentChild,args:[C,{static:!1}]}],_width:[{type:p.HostBinding,args:["style.width"]}],_height:[{type:p.HostBinding,args:["style.height"]}]}});g(J,Y=s.PreventableEvent);var Y,G=J;function J(e){var t=Y.call(this)||this;return t.anchor=e,t}g(te,Q=s.PreventableEvent);var Q,ee=te;function te(e,t){var o=Q.call(this)||this;return o.anchor=e,o.popover=t,o}var oe=function(e,t){this.anchor=e,this.popover=t},ne=function(e){this.anchor=e},ie=["hover","click","none","focus"],u=(Object.defineProperty(S.prototype,"popover",{get:function(){return this._popover},set:function(e){if(e instanceof w||"function"==typeof e)this._popover=e;else if(p.isDevMode)throw new Error(K)},enumerable:!1,configurable:!0}),Object.defineProperty(S.prototype,"showOn",{get:function(){return this._showOn},set:function(e){if(p.isDevMode&&!B(ie,e))throw new Error(X);this._showOn=e},enumerable:!1,configurable:!0}),S.prototype.ngAfterViewInit=function(){var e=this;s.isDocumentAvailable()&&this.ngZone.runOutsideAngular(function(){switch(e.showOn){case"hover":e.subscribeToEvents([{name:"mouseenter",handler:e.mouseenterHandler},{name:"mouseleave",handler:e.mouseleaveHandler}]);break;case"focus":e.subscribeToEvents([{name:"focus",handler:e.focusHandler},{name:"blur",handler:e.blurHandler}]);break;case"click":e.subscribeClick()}})},S.prototype.ngOnDestroy=function(){this.closePopup(),this.disposeHoverOverListener&&this.disposeHoverOverListener(),this.disposeHoverOutListener&&this.disposeHoverOutListener(),this.disposeClickListener&&this.disposeClickListener(),this._focusInsideSub&&this._focusInsideSub.unsubscribe(),this._hideSub&&this._hideSub.unsubscribe(),this.subs&&this.subs.unsubscribe(),this._popupOpenSub&&this._popupOpenSub.unsubscribe(),this._popupCloseSub&&this._popupCloseSub.unsubscribe()},S.prototype.hide=function(){this.closePopup()},S.prototype.closePopup=function(){this.popupRef&&(this.popupRef.close(),this.popupRef=null,this.disposePopupHoverOutListener&&this.disposePopupHoverOutListener(),this.disposePopupHoverInListener&&this.disposePopupHoverInListener(),this.disposePopupFocusOutListener&&this.disposePopupFocusOutListener())},S.prototype.openPopup=function(e){var t=e instanceof p.ElementRef?e.nativeElement:e,o=this.popover instanceof w?this.popover:this.popover(t),n=N(o.position,o.offset),i=n.anchorAlign,r=n.popupAlign,n=n.popupMargin,s=o.animation;this.popupRef=this.popupService.open({anchor:{nativeElement:t},animate:s,content:w,popupAlign:r,anchorAlign:i,margin:n,popupClass:"k-popup-transparent",collision:{horizontal:"fit",vertical:"fit"}}),this.applySettings(this.popupRef.content,o,e),this.monitorPopup(),this.initializeCompletionEvents(o,t)},S.prototype.isPrevented=function(e,t){var o=this.popover instanceof w?this.popover:this.popover(e);return this.initializeEvents(o,void 0,t,e).isDefaultPrevented()},S.prototype.monitorPopup=function(){var t=this;"hover"===this.showOn&&this.ngZone.runOutsideAngular(function(){var e=t.popupRef.popupElement;t.disposePopupHoverInListener=t.renderer.listen(e,"mouseenter",function(e){t.ngZone.run(function(e){return t._popoverService.emitPopoverState(!0)})}),t.disposePopupHoverOutListener=t.renderer.listen(e,"mouseleave",function(e){t.ngZone.run(function(e){return t._popoverService.emitPopoverState(!1)})})}),"focus"===this.showOn&&this.ngZone.runOutsideAngular(function(){var e=t.popupRef.popupElement;t.disposePopupFocusOutListener=t.renderer.listen(e,"focusout",function(e){s.closest(e.relatedTarget,function(e){return e.classList&&e.classList.contains("k-popover")})||t.ngZone.run(function(e){return t._popoverService.emitFocusInsidePopover(!1)})})})},S.prototype.applySettings=function(e,t,o){e=e.instance,o=o instanceof p.ElementRef?o.nativeElement:o;e.visible=!0,e.anchor=o,e.position=t.position,e.offset=t.offset,e.width=t.width,e.height=t.height,e.title=t.title,e.body=t.body,e.callout=t.callout,e.animation=t.animation,e.contextData=t.templateData(o),e.titleTemplate=t.titleTemplate,e.bodyTemplate=t.bodyTemplate,e.actionsTemplate=t.actionsTemplate,this.popupRef.content.changeDetectorRef.detectChanges()},S.prototype.initializeEvents=function(e,t,o,n){return o?(t=new G(n),this.shouldEmitEvent(!!this.popupRef,"show",e)&&this.ngZone.run(function(){return e.show.emit(t)})):(t=new ee(n,this.popupRef),this.shouldEmitEvent(!!this.popupRef,"hide",e)&&this.ngZone.run(function(){return e.hide.emit(t)})),t},S.prototype.initializeCompletionEvents=function(o,n){var t=this;this.shouldEmitCompletionEvents("shown",o)&&this.popupRef.popupOpen.subscribe(function(){var e=new oe(n,t.popupRef);o.shown.emit(e)}),this.shouldEmitCompletionEvents("hidden",o)&&this.popupRef.popupClose.subscribe(function(){t.ngZone.run(function(e){var t=new ne(n);o.hidden.emit(t)})})},S.prototype.shouldEmitEvent=function(e,t,o){return!!("show"===t&&!e&&s.hasObservers(o[t])||"hide"===t&&e&&s.hasObservers(o[t]))},S.prototype.shouldEmitCompletionEvents=function(e,t){return!!(s.hasObservers(t[e])&&!this._popupOpenSub||s.hasObservers(t[e])&&!this._popupCloseSub)},S);function S(e,t,o){this.ngZone=e,this.popupService=t,this.renderer=o,this.subs=new l.Subscription,this._showOn="click"}u.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,deps:[{token:r.NgZone},{token:h.PopupService},{token:r.Renderer2}],target:r.ɵɵFactoryTarget.Directive}),u.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:u,inputs:{popover:"popover",showOn:"showOn"},ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,decorators:[{type:p.Directive,args:[{}]}],ctorParameters:function(){return[{type:r.NgZone},{type:h.PopupService},{type:r.Renderer2}]},propDecorators:{popover:[{type:p.Input}],showOn:[{type:p.Input}]}});R.prototype.ngOnDestroy=function(){this.subs.unsubscribe()},Object.defineProperty(R.prototype,"isPopoverHovered",{get:function(){return this._pointerOverPopup.asObservable()},enumerable:!1,configurable:!0}),R.prototype.emitPopoverState=function(t){var o=this;this.ngZone.run(function(e){return o._pointerOverPopup.next(t)})},Object.defineProperty(R.prototype,"isAnchorHovered",{get:function(){return this._pointerOverAnchor.asObservable()},enumerable:!1,configurable:!0}),R.prototype.emitAnchorState=function(t,e){var o=this;this._isOrigin=this.originAnchor===e,this.currentAnchor=e,t&&(this.originAnchor=e),this.ngZone.run(function(e){return o._pointerOverAnchor.next(t)})},Object.defineProperty(R.prototype,"isFocusInsidePopover",{get:function(){return this._focusInsidePopover.asObservable()},enumerable:!1,configurable:!0}),R.prototype.emitFocusInsidePopover=function(t){var o=this;this.ngZone.run(function(e){return o._focusInsidePopover.next(t)}),this._focusInsidePopover.next(null)},Object.defineProperty(R.prototype,"hidePopover",{get:function(){return this._hidePopover.asObservable()},enumerable:!1,configurable:!0}),R.prototype.monitor=function(){var o=this;this.subs.add(l.combineLatest(this.isPopoverHovered,this.isAnchorHovered).pipe(a.auditTime(20)).subscribe(function(e){var e=m(e,2),t=e[0],e=e[1];o._hidePopover.next([t,e,o._isOrigin,o.currentAnchor])}))};var D=R;function R(e){this.ngZone=e,this._pointerOverPopup=new l.BehaviorSubject(null),this._pointerOverAnchor=new l.BehaviorSubject(null),this._focusInsidePopover=new l.BehaviorSubject(null),this._hidePopover=new l.Subject,this.subs=new l.Subscription,this.monitor()}D.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:D,deps:[{token:r.NgZone}],target:r.ɵɵFactoryTarget.Injectable}),D.ɵprov=r.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:D}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:D,decorators:[{type:p.Injectable}],ctorParameters:function(){return[{type:r.NgZone}]}});g(A,re=u),A.prototype.show=function(e){var t=this;this.popupRef||(this.ngZone.run(function(){t.openPopup(e)}),this.popupRef.popupAnchorViewportLeave.pipe(a.take(1)).subscribe(function(){return t.hide()}))},A.prototype.toggle=function(e){var t=this.popupRef&&this.popupRef.content.instance.anchor;this.popupRef?(this.hide(),t!==e&&this.show(e)):this.show(e)},A.prototype.subscribeClick=function(){var o=this;this.disposeClickListener&&this.disposeClickListener(),this.disposeClickListener=this.renderer.listen(document,"click",function(e){var t=f(e.target,o.filter);o.clickHandler(t,e)})},A.prototype.subscribeToEvents=function(o){var n=this;Array.from(document.querySelectorAll(this.filter)).forEach(function(t){n.subs.add(n.renderer.listen(t,o[0].name,function(){n.popoverService.emitAnchorState(!0,t),o[0].handler(t)})),n.subs.add(n.renderer.listen(t,o[1].name,function(e){n.popoverService.emitAnchorState(!1,null),o[1].handler({anchor:t,domEvent:e})}))})},A.prototype.clickHandler=function(t,e){var o=!!s.closest(e.target,function(e){return e.classList&&e.classList.contains("k-popup")}),n=this.popupRef&&this.popupRef.content.instance.anchor,e=!!s.closest(e.target,function(e){return e===(n||t)});"click"!==this.showOn||o||this.popupRef&&e||(!t&&this.popupRef?this.controlVisibility(t,!1):e?this.controlVisibility(t,!0):this.popupRef&&(this.controlVisibility(t,!1),this.controlVisibility(t,!0)))},A.prototype.controlVisibility=function(e,t){this.isPrevented(e,t)||(t?this.show(e):this.hide())};var re,t=A;function A(e,t,o,n,i){var r=re.call(this,t,o,n)||this;return r.wrapperEl=e,r.ngZone=t,r.popupService=o,r.renderer=n,r.popoverService=i,r.mouseenterHandler=function(e){r.controlVisibility(e,!0)},r.mouseleaveHandler=function(e){e=e.anchor;r.isPrevented(e,!1)||r._hideSub||(r._hideSub=r.popoverService.hidePopover.subscribe(function(e){var e=m(e,4),t=e[0],o=e[2],e=e[3];t||o||(r.hide(),!o&&e&&r.show(e))}))},r.focusHandler=function(e){r.controlVisibility(e,!0)},r.blurHandler=function(e){var t,o=e.anchor,e=e.domEvent;r.isPrevented(o,!1)||((t=!!s.closest(e.relatedTarget,function(e){return e.classList&&e.classList.contains("k-popover")}))||r.hide(),r._focusInsideSub||(r._focusInsideSub=r.popoverService.isFocusInsidePopover.pipe(a.filter(function(e){return null!==e})).subscribe(function(e){e||t||r.hide()})))},r._popoverService=r.popoverService,r}t.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:t,deps:[{token:r.ElementRef},{token:r.NgZone},{token:h.PopupService},{token:r.Renderer2},{token:D}],target:r.ɵɵFactoryTarget.Directive}),t.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:t,selector:"[kendoPopoverContainer]",inputs:{filter:"filter"},providers:[D],exportAs:["kendoPopoverContainer"],usesInheritance:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:t,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverContainer]",exportAs:"kendoPopoverContainer",providers:[D]}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:r.NgZone},{type:h.PopupService},{type:r.Renderer2},{type:D}]},propDecorators:{filter:[{type:p.Input}]}});g(_,se=u),_.prototype.show=function(){var e=this;this.popupRef||(this.ngZone.run(function(){e.openPopup(e.hostEl)}),this.popupRef.popupAnchorViewportLeave.pipe(a.take(1)).subscribe(function(){return e.hide()}))},_.prototype.toggle=function(){this.popupRef?this.hide():this.show()},_.prototype.subscribeToEvents=function(t){var o=this;this.subs.add(this.renderer.listen(this.hostEl.nativeElement,t[0].name,function(){o.popoverService.emitAnchorState(!0,o.hostEl.nativeElement),t[0].handler()})),this.subs.add(this.renderer.listen(this.hostEl.nativeElement,t[1].name,function(e){o.popoverService.emitAnchorState(!1,null),t[1].handler({domEvent:e})}))},_.prototype.subscribeClick=function(){var t=this;this.disposeClickListener&&this.disposeClickListener(),this.disposeClickListener=this.renderer.listen(document,"click",function(e){t.onClick(e)})},_.prototype.onClick=function(e){var t=this,o=!!s.closest(e.target,function(e){return e.classList&&e.classList.contains("k-popup")}),e=!!s.closest(e.target,function(e){return e===t.hostEl.nativeElement});o||this.popupRef&&e||(e?this.controlVisibility(this.hostEl.nativeElement,!0):this.controlVisibility(this.hostEl.nativeElement,!1))},_.prototype.controlVisibility=function(e,t){this.isPrevented(e,t)||(t?this.show():this.hide())};var se,u=_;function _(e,t,o,n,i){var r=se.call(this,t,o,n)||this;return r.hostEl=e,r.ngZone=t,r.popupService=o,r.renderer=n,r.popoverService=i,r.mouseenterHandler=function(){r.controlVisibility(r.hostEl.nativeElement,!0)},r.mouseleaveHandler=function(){r.isPrevented(r.hostEl.nativeElement,!1)||r._hideSub||(r._hideSub=r.popoverService.hidePopover.subscribe(function(e){var e=m(e,2),t=e[0],e=e[1];t||e||r.hide()}))},r.focusHandler=function(){r.controlVisibility(r.hostEl.nativeElement,!0)},r.blurHandler=function(e){e=e.domEvent;r.isPrevented(r.hostEl.nativeElement,!1)||(s.closest(e.relatedTarget,function(e){return e.classList&&e.classList.contains("k-popover")})||r.hide(),r._focusInsideSub||(r._focusInsideSub=r.popoverService.isFocusInsidePopover.pipe(a.filter(function(e){return null!==e})).subscribe(function(e){e||r.hide()})))},r._popoverService=r.popoverService,r}u.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,deps:[{token:r.ElementRef},{token:r.NgZone},{token:h.PopupService},{token:r.Renderer2},{token:D}],target:r.ɵɵFactoryTarget.Directive}),u.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:u,selector:"[kendoPopoverAnchor]",providers:[D],exportAs:["kendoPopoverAnchor"],usesInheritance:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverAnchor]",exportAs:"kendoPopoverAnchor",providers:[D]}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:r.NgZone},{type:h.PopupService},{type:r.Renderer2},{type:D}]}});var M=[k,b,y],V=[n.PopupModule],L=function(){},V=(L.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,deps:[],target:r.ɵɵFactoryTarget.NgModule}),L.ɵmod=r.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,declarations:[k,b,y],imports:[o.CommonModule,n.PopupModule],exports:[k,b,y]}),L.ɵinj=r.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,imports:[v([o.CommonModule],m(V))]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,decorators:[{type:p.NgModule,args:[{declarations:[M],entryComponents:[b],imports:v([o.CommonModule],m(V)),exports:[M]}]}]}),[C,P,O,u,t]),M=function(){},V=(M.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,deps:[],target:r.ɵɵFactoryTarget.NgModule}),M.ɵmod=r.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,declarations:[C,P,O,u,t,w],imports:[o.CommonModule,n.PopupModule],exports:[C,P,O,u,t,w]}),M.ɵinj=r.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,imports:[[o.CommonModule,n.PopupModule]]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,decorators:[{type:p.NgModule,args:[{declarations:v(v([],m(V)),[w]),entryComponents:[w],exports:v(v([],m(V)),[w]),imports:[o.CommonModule,n.PopupModule]}]}]}),function(){});V.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,deps:[],target:r.ɵɵFactoryTarget.NgModule}),V.ɵmod=r.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,exports:[L,M]}),V.ɵinj=r.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,imports:[L,M]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,decorators:[{type:p.NgModule,args:[{exports:[L,M]}]}]}),e.LocalizedMessagesDirective=y,e.PopoverActionsTemplateDirective=C,e.PopoverAnchorDirective=u,e.PopoverBodyTemplateDirective=P,e.PopoverComponent=w,e.PopoverContainerDirective=t,e.PopoverHiddenEvent=ne,e.PopoverHideEvent=ee,e.PopoverModule=M,e.PopoverShowEvent=G,e.PopoverShownEvent=oe,e.PopoverTitleTemplateDirective=O,e.TOOLTIP_SETTINGS=H,e.TooltipContentComponent=b,e.TooltipDirective=k,e.TooltipModule=L,e.TooltipSettings=d,e.TooltipsModule=V,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("rxjs/operators"),require("rxjs"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("@angular/common"),require("@progress/kendo-angular-popup"),require("@progress/kendo-angular-common")):"function"==typeof define&&define.amd?define("KendoAngularTooltip",["exports","@angular/core","rxjs/operators","rxjs","@progress/kendo-licensing","@progress/kendo-angular-l10n","@angular/common","@progress/kendo-angular-popup","@progress/kendo-angular-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularTooltip={},e.ng.core,e.rxjs.operators,e.rxjs,e.KendoLicensing,e.KendoAngularL10N,e.ng.common,e.KendoAngularPopup,e.KendoAngularCommon)}(this,function(e,p,a,l,x,t,o,n,s){"use strict";function i(o){var n;return o&&o.__esModule?o:(n=Object.create(null),o&&Object.keys(o).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(o,e),Object.defineProperty(n,e,t.get?t:{enumerable:!0,get:function(){return o[e]}}))}),n.default=o,Object.freeze(n))}var r=i(p),c=i(t),u=i(o),h=i(n),j={name:"@progress/kendo-angular-tooltip",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1662112459,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},H=new p.InjectionToken("kendo-ui-tooltip-settings"),d=function(){};function N(e,t){var o={},n={},i={};switch(e){case"top":o={horizontal:"center",vertical:"top"},n={horizontal:"center",vertical:"bottom"},i={horizontal:0,vertical:t};break;case"bottom":o={horizontal:"center",vertical:"bottom"},n={horizontal:"center",vertical:"top"},i={horizontal:0,vertical:t};break;case"right":o={horizontal:"right",vertical:"center"},n={horizontal:"left",vertical:"center"},i={horizontal:t,vertical:0};break;case"left":o={horizontal:"left",vertical:"center"},n={horizontal:"right",vertical:"center"},i={horizontal:t,vertical:0}}return{anchorAlign:o,popupAlign:n,popupMargin:i}}function F(e){return 9===e.nodeType}function g(e,t){if(e.closest)return e.closest(t);for(var o=Element.prototype.matches?function(e,t){return e.matches(t)}:function(e,t){return e.msMatchesSelector(t)},n=e;n&&!F(n);){if(o(n,t))return n;n=n.parentNode}}function z(e,t){return e&&(!F(e)&&(e.contains?e.contains(t):e.compareDocumentPosition&&e.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_CONTAINED_BY))}d.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:d,deps:[],target:r.ɵɵFactoryTarget.Injectable}),d.ɵprov=r.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:d}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:d,decorators:[{type:p.Injectable}],ctorParameters:function(){return[]}});function Z(e,t,o){e=e.getBoundingClientRect();return e[t]+e[o]/2}function B(e,t){return-1!==e.indexOf(t)}var W=function(e,t){return(W=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])})(e,t)};function f(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function o(){this.constructor=e}W(e,t),e.prototype=null===t?Object.create(t):(o.prototype=t.prototype,new o)}Object.create;function m(e,t){var o="function"==typeof Symbol&&e[Symbol.iterator];if(!o)return e;var n,i,r=o.call(e),s=[];try{for(;(void 0===t||0<t--)&&!(n=r.next()).done;)s.push(n.value)}catch(e){i={error:e}}finally{try{n&&!n.done&&(o=r.return)&&o.call(r)}finally{if(i)throw i.error}}return s}function v(e,t,o){if(o||2===arguments.length)for(var n,i=0,r=t.length;i<r;i++)!n&&i in t||((n=n||Array.prototype.slice.call(t,0,i))[i]=t[i]);return e.concat(n||Array.prototype.slice.call(t))}Object.create;f(q,$=t.ComponentMessages);var $,y=q;function q(e){var t=$.call(this)||this;return t.service=e,t}y.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:y,deps:[{token:c.LocalizationService}],target:r.ɵɵFactoryTarget.Directive}),y.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:y,selector:"[kendoTooltipLocalizedMessages]",inputs:{closeTitle:"closeTitle"},providers:[{provide:t.ComponentMessages,useExisting:p.forwardRef(function(){return y})}],usesInheritance:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:y,decorators:[{type:p.Directive,args:[{providers:[{provide:t.ComponentMessages,useExisting:p.forwardRef(function(){return y})}],selector:"[kendoTooltipLocalizedMessages]"}]}],ctorParameters:function(){return[{type:c.LocalizationService}]},propDecorators:{closeTitle:[{type:p.Input}]}});Object.defineProperty(T.prototype,"cssClasses",{get:function(){return"k-widget k-tooltip"},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"className",{get:function(){return this.closable},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"cssPosition",{get:function(){return"relative"},enumerable:!1,configurable:!0}),T.prototype.ngOnInit=function(){var t=this;this.dynamicRTLSubscription=this.localizationService.changes.subscribe(function(e){e=e.rtl;return t.direction=e?"rtl":"ltr"})},T.prototype.ngOnDestroy=function(){this.dynamicRTLSubscription&&this.dynamicRTLSubscription.unsubscribe()},Object.defineProperty(T.prototype,"closeButtonTitle",{get:function(){return this.closeTitle||this.localizationService.get("closeTitle")},enumerable:!1,configurable:!0}),T.prototype.calloutPositionClass=function(){return{top:"k-callout-s",left:"k-callout-e",bottom:"k-callout-n",right:"k-callout-w"}[this.position]},T.prototype.onCloseClick=function(e){e.preventDefault(),this.close.emit()},T.prototype.updateCalloutPosition=function(e,t){var o,n,i,r,s,p,a;this.callout&&(p=(n="top"===e||"bottom"===e)?"width":"height",s=n?"left":"top",n=n?"marginLeft":"marginTop",i=(o=this.content.nativeElement.querySelector(".k-callout")).getBoundingClientRect()[p],r=Z(this.anchor.nativeElement,s,p),s=Z(this.content.nativeElement,s,p),(1<(p=Math.abs(s-r))||0===p||0===Math.round(p))&&(o.style[n]=-(s-r+i/2)+"px"),a=this.calloutStyles(e,i,t),Object.keys(a).forEach(function(e){o.style[e]=a[e]}))};var b=T;function T(e,t){this.content=e,this.localizationService=t,this.close=new p.EventEmitter,this.tooltipWidth=null,this.tooltipHeight=null,this.callout=!0,this.calloutStyles=function(e,t,o){var n={},i="top"===e||"bottom"===e;return o?("top"===e?n.bottom="unset":"bottom"===e?n.top="unset":"left"===e?n.right="unset":"right"===e&&(n.left="unset"),n[e]=-t+"px",n.transform=i?"rotateX(180deg)":"rotateY(180deg)"):n.transform=i?"rotateX(0deg)":"rotateY(0deg)",n},this.direction=t.rtl?"rtl":"ltr"}b.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:b,deps:[{token:r.ElementRef},{token:c.LocalizationService}],target:r.ɵɵFactoryTarget.Component}),b.ɵcmp=r.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:b,selector:"kendo-tooltip",inputs:{tooltipWidth:"tooltipWidth",tooltipHeight:"tooltipHeight",titleTemplate:"titleTemplate",anchor:"anchor",closable:"closable",templateRef:"templateRef",templateString:"templateString"},outputs:{close:"close"},host:{properties:{"attr.dir":"this.direction",class:"this.cssClasses","class.k-tooltip-closable":"this.className","style.position":"this.cssPosition","style.width.px":"this.tooltipWidth","style.height.px":"this.tooltipHeight"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.tooltip"}],ngImport:r,template:'\n        <ng-container kendoTooltipLocalizedMessages\n            i18n-closeTitle="kendo.tooltip.closeTitle|The title of the close button"\n            closeTitle="Close"\n        >\n        </ng-container>\n\n        <div class="k-tooltip-content">\n            <div class="k-tooltip-title" *ngIf="titleTemplate">\n                <ng-template\n                    [ngIf]="titleTemplate"\n                    [ngTemplateOutlet]="titleTemplate"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n                </ng-template>\n            </div>\n\n            <ng-template\n                [ngIf]="templateRef"\n                [ngTemplateOutlet]="templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n            </ng-template>\n            <ng-template\n                [ngIf]="templateString">\n                {{ templateString }}\n            </ng-template>\n        </div>\n\n        <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">\n            <a href="#" class="k-icon k-i-x" [attr.title]="closeButtonTitle"></a>\n        </div>\n\n        <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>\n    ',isInline:!0,directives:[{type:y,selector:"[kendoTooltipLocalizedMessages]",inputs:["closeTitle"]},{type:u.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:u.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]},{type:u.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]}]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:b,decorators:[{type:p.Component,args:[{selector:"kendo-tooltip",template:'\n        <ng-container kendoTooltipLocalizedMessages\n            i18n-closeTitle="kendo.tooltip.closeTitle|The title of the close button"\n            closeTitle="Close"\n        >\n        </ng-container>\n\n        <div class="k-tooltip-content">\n            <div class="k-tooltip-title" *ngIf="titleTemplate">\n                <ng-template\n                    [ngIf]="titleTemplate"\n                    [ngTemplateOutlet]="titleTemplate"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n                </ng-template>\n            </div>\n\n            <ng-template\n                [ngIf]="templateRef"\n                [ngTemplateOutlet]="templateRef"\n                [ngTemplateOutletContext]="{ $implicit: anchor, anchor: anchor }">\n            </ng-template>\n            <ng-template\n                [ngIf]="templateString">\n                {{ templateString }}\n            </ng-template>\n        </div>\n\n        <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">\n            <a href="#" class="k-icon k-i-x" [attr.title]="closeButtonTitle"></a>\n        </div>\n\n        <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>\n    ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.tooltip"}]}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:c.LocalizationService}]},propDecorators:{direction:[{type:p.HostBinding,args:["attr.dir"]}],close:[{type:p.Output}],cssClasses:[{type:p.HostBinding,args:["class"]}],className:[{type:p.HostBinding,args:["class.k-tooltip-closable"]}],cssPosition:[{type:p.HostBinding,args:["style.position"]}],tooltipWidth:[{type:p.HostBinding,args:["style.width.px"]},{type:p.Input}],tooltipHeight:[{type:p.HostBinding,args:["style.height.px"]},{type:p.Input}],titleTemplate:[{type:p.Input}],anchor:[{type:p.Input}],closable:[{type:p.Input}],templateRef:[{type:p.Input}],templateString:[{type:p.Input}]}});Object.defineProperty(I.prototype,"tooltipTemplate",{get:function(){return this.template},set:function(e){this.template=e},enumerable:!1,configurable:!0}),I.prototype.show=function(e){var t=this;this.popupRef||(e instanceof Element&&(e={nativeElement:e}),this.anchor=e,"hover"===this.showOn?this.popupRef||(clearTimeout(this.showTimeout),this.showTimeout=window.setTimeout(function(){return t.showContent(t.anchor)},this.showAfter)):(this.hideElementTitle(this.anchor),this.showContent(this.anchor)))},I.prototype.hide=function(){clearTimeout(this.showTimeout);var e=this.anchor&&this.anchor.nativeElement;e&&e.getAttribute("data-title")&&(!e.getAttribute("title")&&e.hasAttribute("title")&&e.setAttribute("title",e.getAttribute("data-title")),e.setAttribute("data-title","")),this.popupMouseOutSubscription&&this.popupMouseOutSubscription.unsubscribe(),this.closeClickSubscription&&this.closeClickSubscription.unsubscribe(),this.closePopup()},I.prototype.toggle=function(e,t){var o=this.anchor&&this.anchor.nativeElement;o!==(e=e instanceof Element?{nativeElement:e}:e).nativeElement&&this.hide(),o===e.nativeElement&&"click"===this.showOn&&this.hide(),(t=void 0===t?!this.popupRef:t)?this.show(e):this.hide()},I.prototype.ngOnInit=function(){void 0===this.showOn&&(this.showOn="hover"),this.verifyProperties()},I.prototype.ngOnChanges=function(e){e.showOn&&this.subscribeClick()},I.prototype.ngAfterViewChecked=function(){this.popupRef&&this.anchor&&!function(e,t){for(;e&&e!==t;)e=e.parentNode;return e}(this.anchor.nativeElement||this.anchor,this.tooltipWrapper.nativeElement)&&(this.anchor=null,this.hide())},I.prototype.ngOnDestroy=function(){this.hide(),this.template=null,this.anchorTitleSubscription.unsubscribe(),this.mouseOverSubscription.unsubscribe(),this.mouseOutSubscription.unsubscribe(),this.mouseClickSubscription&&this.mouseClickSubscription.unsubscribe(),this.popupPositionChangeSubscription&&this.popupPositionChangeSubscription.unsubscribe(),this.popupMouseOutSubscription&&this.popupMouseOutSubscription.unsubscribe()},I.prototype.showContent=function(e){var t=this;(e.nativeElement.getAttribute("data-title")||this.template)&&(this.ngZone.run(function(){t.openPopup(e),t.bindContent(t.popupRef.content,e)}),this.popupRef.popupAnchorViewportLeave.pipe(a.take(1)).subscribe(function(){return t.hide()}))},I.prototype.bindContent=function(e,t){var o=this,e=e.instance;this.closeClickSubscription=e.close.subscribe(function(){o.hide()}),this.template?e.templateRef=this.template:e.templateString=this.anchor.nativeElement.getAttribute("data-title"),this.titleTemplate&&(e.titleTemplate=this.titleTemplate),e.closeTitle=this.closeTitle,e.anchor=t,e.callout=this.callout,e.closable=this.closable,e.position=this.position,e.tooltipWidth=this.tooltipWidth,e.tooltipHeight=this.tooltipHeight,this.popupRef.content.changeDetectorRef.detectChanges()},I.prototype.hideElementTitle=function(e){e=e.nativeElement;e.getAttribute("title")&&(e.setAttribute("data-title",e.getAttribute("title")),e.setAttribute("title",""))},I.prototype.openPopup=function(e){var t=this,o=N(this.position,this.offset),n=o.anchorAlign,i=o.popupAlign,o=o.popupMargin,r=(this.popupRef=this.popupService.open({anchor:e,anchorAlign:n,animate:!1,content:b,collision:(e=this.collision,n=this.position,e||("top"===n||"bottom"===n?{horizontal:"fit",vertical:"flip"}:{horizontal:"flip",vertical:"fit"})),margin:o,popupAlign:i,popupClass:"k-popup-transparent"}),this.renderer.addClass(this.popupRef.popupElement,"k-tooltip-wrapper"),this.tooltipClass&&this.renderer.addClass(this.popupRef.popupElement,this.tooltipClass),this.popupRef.content.instance);r.callout&&(this.popupPositionChangeSubscription=this.popupRef.popupPositionChange.subscribe(function(e){e=e.flip,e=!0===e.horizontal||!0===e.vertical;r.updateCalloutPosition(t.position,e)})),"hover"===this.showOn&&this.ngZone.runOutsideAngular(function(){var e=t.popupRef.popupElement;t.popupMouseOutSubscription=l.fromEvent(e,"mouseout").subscribe(function(e){return t.onMouseOut(e)})})},I.prototype.closePopup=function(){this.popupRef&&(this.popupRef.close(),this.popupRef=null),this.popupPositionChangeSubscription&&this.popupPositionChangeSubscription.unsubscribe()},I.prototype.subscribeClick=function(){var t=this;this.mouseClickSubscription&&this.mouseClickSubscription.unsubscribe(),"click"===this.showOn&&(this.mouseClickSubscription=l.fromEvent(document,"click").pipe(a.filter(function(){return""!==t.filter})).subscribe(function(e){return t.onMouseClick(e,t.tooltipWrapper.nativeElement)}))},I.prototype.onMouseClick=function(e,t){var e=e.target,o=g(e,this.filter),n=this.popupRef&&this.popupRef.popupElement;if(n){if(n.contains(e))return;if(this.closable)return}t.contains(e)&&o?this.toggle(o,!0):n&&this.hide()},I.prototype.onMouseOver=function(e){e=g(e.target,this.filter);"hover"===this.showOn&&e&&this.toggle(e,!0)},I.prototype.onMouseOut=function(e){var t;"hover"!==this.showOn||this.closable||(t=this.popupRef&&this.popupRef.popupElement,(e=e.relatedTarget)&&this.anchor&&z(this.anchor.nativeElement,e)||e&&z(t,e)||this.hide())},I.prototype.verifyProperties=function(){if(p.isDevMode()){if(!B(this.validPositions,this.position))throw new Error("Invalid value provided for position property.The available options are 'top', 'bottom', 'left', or 'right'.");if(!B(this.validShowOptions,this.showOn))throw new Error("Invalid value provided for showOn property.The available options are 'hover' or 'none'.")}};var k=I;function I(e,t,o,n,i,r){var s=this;this.tooltipWrapper=e,this.ngZone=t,this.renderer=o,this.popupService=n,this.filter="[title]",this.position="top",this.showAfter=100,this.callout=!0,this.closable=!1,this.offset=6,this.anchor=null,this.validPositions=["top","bottom","right","left"],this.validShowOptions=["hover","click","none"],x.validatePackage(j),Object.assign(this,i,r),this.ngZone.runOutsideAngular(function(){var e=s.tooltipWrapper.nativeElement;s.anchorTitleSubscription=l.fromEvent(e,"mouseover").pipe(a.filter(function(){return""!==s.filter})).subscribe(function(e){e=g(e.target,s.filter);e&&s.hideElementTitle({nativeElement:e})}),s.mouseOverSubscription=l.fromEvent(e,"mouseover").pipe(a.debounceTime(100),a.filter(function(){return""!==s.filter})).subscribe(function(e){return s.onMouseOver(e)}),s.mouseOutSubscription=l.fromEvent(e,"mouseout").subscribe(function(e){return s.onMouseOut(e)})})}k.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:k,deps:[{token:r.ElementRef},{token:r.NgZone},{token:r.Renderer2},{token:h.PopupService},{token:d,optional:!0},{token:H,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),k.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:k,selector:"[kendoTooltip]",inputs:{filter:"filter",position:"position",titleTemplate:"titleTemplate",showOn:"showOn",showAfter:"showAfter",callout:"callout",closable:"closable",offset:"offset",tooltipWidth:"tooltipWidth",tooltipHeight:"tooltipHeight",tooltipClass:"tooltipClass",collision:"collision",closeTitle:"closeTitle",tooltipTemplate:"tooltipTemplate"},exportAs:["kendoTooltip"],usesOnChanges:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:k,decorators:[{type:p.Directive,args:[{selector:"[kendoTooltip]",exportAs:"kendoTooltip"}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:r.NgZone},{type:r.Renderer2},{type:h.PopupService},{type:d,decorators:[{type:p.Optional}]},{type:d,decorators:[{type:p.Optional},{type:p.Inject,args:[H]}]}]},propDecorators:{filter:[{type:p.Input}],position:[{type:p.Input}],titleTemplate:[{type:p.Input}],showOn:[{type:p.Input}],showAfter:[{type:p.Input}],callout:[{type:p.Input}],closable:[{type:p.Input}],offset:[{type:p.Input}],tooltipWidth:[{type:p.Input}],tooltipHeight:[{type:p.Input}],tooltipClass:[{type:p.Input}],collision:[{type:p.Input}],closeTitle:[{type:p.Input}],tooltipTemplate:[{type:p.Input}]}});var K="Invalid value provided for the 'popover' property. The accepted data types are 'PopoverComponent' or 'PopoverFn'.",U="templateData must be a function, but received",X="Invalid value provided for the 'showOn' property. The available options are 'click', 'hover', 'focus' or 'none'.",O=function(e){this.templateRef=e},C=(O.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:O,deps:[{token:r.TemplateRef,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),O.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:O,selector:"[kendoPopoverTitleTemplate]",ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:O,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverTitleTemplate]"}]}],ctorParameters:function(){return[{type:r.TemplateRef,decorators:[{type:p.Optional}]}]}}),function(e){this.templateRef=e}),P=(C.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:C,deps:[{token:r.TemplateRef,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),C.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"[kendoPopoverBodyTemplate]",ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:C,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverBodyTemplate]"}]}],ctorParameters:function(){return[{type:r.TemplateRef,decorators:[{type:p.Optional}]}]}}),function(e){this.templateRef=e}),w=(P.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:P,deps:[{token:r.TemplateRef,optional:!0}],target:r.ɵɵFactoryTarget.Directive}),P.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:P,selector:"[kendoPopoverActionsTemplate]",ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:P,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverActionsTemplate]"}]}],ctorParameters:function(){return[{type:r.TemplateRef,decorators:[{type:p.Optional}]}]}}),Object.defineProperty(E.prototype,"offset",{get:function(){return this.callout?14+this._offset:this._offset},set:function(e){this._offset=e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"width",{get:function(){return this._width},set:function(e){this._width="number"==typeof e?e+"px":e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"height",{get:function(){return this._height},set:function(e){this._height="number"==typeof e?e+"px":e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"templateData",{get:function(){return this._templateData},set:function(e){if(p.isDevMode&&"function"!=typeof e)throw new Error(U+" "+JSON.stringify(e)+".");this._templateData=e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"isHidden",{get:function(){return!this.visible},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"hasAttributeHidden",{get:function(){return!this.visible},enumerable:!1,configurable:!0}),E.prototype.ngOnInit=function(){var t=this;this.subs.add(this.localization.changes.subscribe(function(e){e=e.rtl;t.direction=e?"rtl":"ltr"}))},E.prototype.ngOnDestroy=function(){this.subs.unsubscribe()},E.prototype.getCalloutPosition=function(){switch(this.position){case"top":return{"k-callout-s":!0};case"bottom":return{"k-callout-n":!0};case"left":return{"k-callout-e":!0};case"right":return{"k-callout-w":!0};default:return{"k-callout-s":!0}}},E);function E(e){this.localization=e,this.position="right",this.callout=!0,this.animation=!1,this.visible=!1,this.show=new p.EventEmitter,this.shown=new p.EventEmitter,this.hide=new p.EventEmitter,this.hidden=new p.EventEmitter,this._width="auto",this._height="auto",this._offset=6,this.subs=new l.Subscription,this._templateData=function(){return null},x.validatePackage(j)}w.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:w,deps:[{token:c.LocalizationService}],target:r.ɵɵFactoryTarget.Component}),w.ɵcmp=r.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"kendo-popover",inputs:{position:"position",offset:"offset",width:"width",height:"height",title:"title",subtitle:"subtitle",body:"body",callout:"callout",animation:"animation",templateData:"templateData"},outputs:{show:"show",shown:"shown",hide:"hide",hidden:"hidden"},host:{properties:{"attr.dir":"this.direction","class.k-hidden":"this.isHidden","attr.aria-hidden":"this.hasAttributeHidden","style.width":"this._width","style.height":"this._height"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.popover"}],queries:[{propertyName:"titleTemplate",first:!0,predicate:O,descendants:!0},{propertyName:"bodyTemplate",first:!0,predicate:C,descendants:!0},{propertyName:"actionsTemplate",first:!0,predicate:P,descendants:!0}],ngImport:r,template:'\n    <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{\'width\': width, \'height\': height}">\n        <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>\n\n        <div class="k-popover-inner" *ngIf="callout; else noCallout">\n            <ng-container *ngTemplateOutlet="noCallout"></ng-container>\n        </div>\n\n        <ng-template #noCallout>\n            <div *ngIf="titleTemplate || title" class="k-popover-header">\n                <ng-template *ngIf="titleTemplate"\n                    [ngTemplateOutlet]="titleTemplate?.templateRef"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n                </ng-template>\n                <ng-container *ngIf="title && !titleTemplate">\n                    {{ title }}\n                </ng-container>\n            </div>\n\n            <div *ngIf="bodyTemplate || body" class="k-popover-body">\n                <ng-template *ngIf="bodyTemplate"\n                    [ngTemplateOutlet]="bodyTemplate?.templateRef"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n                </ng-template>\n                <ng-container *ngIf="body && !bodyTemplate">\n                    {{ body }}\n                </ng-container>\n            </div>\n\n            <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">\n                <ng-template *ngIf="actionsTemplate"\n                    [ngTemplateOutlet]="actionsTemplate?.templateRef"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n                </ng-template>\n            </div>\n        </ng-template>\n    </div>\n    ',isInline:!0,directives:[{type:u.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:u.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:u.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:u.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]}]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:w,decorators:[{type:p.Component,args:[{selector:"kendo-popover",providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.popover"}],template:'\n    <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{\'width\': width, \'height\': height}">\n        <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>\n\n        <div class="k-popover-inner" *ngIf="callout; else noCallout">\n            <ng-container *ngTemplateOutlet="noCallout"></ng-container>\n        </div>\n\n        <ng-template #noCallout>\n            <div *ngIf="titleTemplate || title" class="k-popover-header">\n                <ng-template *ngIf="titleTemplate"\n                    [ngTemplateOutlet]="titleTemplate?.templateRef"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n                </ng-template>\n                <ng-container *ngIf="title && !titleTemplate">\n                    {{ title }}\n                </ng-container>\n            </div>\n\n            <div *ngIf="bodyTemplate || body" class="k-popover-body">\n                <ng-template *ngIf="bodyTemplate"\n                    [ngTemplateOutlet]="bodyTemplate?.templateRef"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n                </ng-template>\n                <ng-container *ngIf="body && !bodyTemplate">\n                    {{ body }}\n                </ng-container>\n            </div>\n\n            <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">\n                <ng-template *ngIf="actionsTemplate"\n                    [ngTemplateOutlet]="actionsTemplate?.templateRef"\n                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">\n                </ng-template>\n            </div>\n        </ng-template>\n    </div>\n    '}]}],ctorParameters:function(){return[{type:c.LocalizationService}]},propDecorators:{position:[{type:p.Input}],offset:[{type:p.Input}],width:[{type:p.Input}],height:[{type:p.Input}],direction:[{type:p.HostBinding,args:["attr.dir"]}],title:[{type:p.Input}],subtitle:[{type:p.Input}],body:[{type:p.Input}],callout:[{type:p.Input}],animation:[{type:p.Input}],templateData:[{type:p.Input}],isHidden:[{type:p.HostBinding,args:["class.k-hidden"]}],hasAttributeHidden:[{type:p.HostBinding,args:["attr.aria-hidden"]}],show:[{type:p.Output}],shown:[{type:p.Output}],hide:[{type:p.Output}],hidden:[{type:p.Output}],titleTemplate:[{type:p.ContentChild,args:[O,{static:!1}]}],bodyTemplate:[{type:p.ContentChild,args:[C,{static:!1}]}],actionsTemplate:[{type:p.ContentChild,args:[P,{static:!1}]}],_width:[{type:p.HostBinding,args:["style.width"]}],_height:[{type:p.HostBinding,args:["style.height"]}]}});f(J,Y=s.PreventableEvent);var Y,G=J;function J(e){var t=Y.call(this)||this;return t.anchor=e,t}f(te,Q=s.PreventableEvent);var Q,ee=te;function te(e,t){var o=Q.call(this)||this;return o.anchor=e,o.popover=t,o}var oe=function(e,t){this.anchor=e,this.popover=t},ne=function(e){this.anchor=e},ie=["hover","click","none","focus"],u=(Object.defineProperty(S.prototype,"popover",{get:function(){return this._popover},set:function(e){if(e instanceof w||"function"==typeof e)this._popover=e;else if(p.isDevMode)throw new Error(K)},enumerable:!1,configurable:!0}),Object.defineProperty(S.prototype,"showOn",{get:function(){return this._showOn},set:function(e){if(p.isDevMode&&!B(ie,e))throw new Error(X);this._showOn=e},enumerable:!1,configurable:!0}),S.prototype.ngAfterViewInit=function(){var e=this;s.isDocumentAvailable()&&this.ngZone.runOutsideAngular(function(){switch(e.showOn){case"hover":e.subscribeToEvents([{name:"mouseenter",handler:e.mouseenterHandler},{name:"mouseleave",handler:e.mouseleaveHandler}]);break;case"focus":e.subscribeToEvents([{name:"focus",handler:e.focusHandler},{name:"blur",handler:e.blurHandler}]);break;case"click":e.subscribeClick()}})},S.prototype.ngOnDestroy=function(){this.closePopup(),this.disposeHoverOverListener&&this.disposeHoverOverListener(),this.disposeHoverOutListener&&this.disposeHoverOutListener(),this.disposeClickListener&&this.disposeClickListener(),this._focusInsideSub&&this._focusInsideSub.unsubscribe(),this._hideSub&&this._hideSub.unsubscribe(),this.subs&&this.subs.unsubscribe(),this._popupOpenSub&&this._popupOpenSub.unsubscribe(),this._popupCloseSub&&this._popupCloseSub.unsubscribe()},S.prototype.hide=function(){this.closePopup()},S.prototype.closePopup=function(){this.popupRef&&(this.popupRef.close(),this.popupRef=null,this.disposePopupHoverOutListener&&this.disposePopupHoverOutListener(),this.disposePopupHoverInListener&&this.disposePopupHoverInListener(),this.disposePopupFocusOutListener&&this.disposePopupFocusOutListener())},S.prototype.openPopup=function(e){var t=e instanceof p.ElementRef?e.nativeElement:e,o=this.popover instanceof w?this.popover:this.popover(t),n=N(o.position,o.offset),i=n.anchorAlign,r=n.popupAlign,n=n.popupMargin,s=o.animation;this.popupRef=this.popupService.open({anchor:{nativeElement:t},animate:s,content:w,popupAlign:r,anchorAlign:i,margin:n,popupClass:"k-popup-transparent",collision:{horizontal:"fit",vertical:"fit"}}),this.applySettings(this.popupRef.content,o,e),this.monitorPopup(),this.initializeCompletionEvents(o,t)},S.prototype.isPrevented=function(e,t){var o=this.popover instanceof w?this.popover:this.popover(e);return this.initializeEvents(o,void 0,t,e).isDefaultPrevented()},S.prototype.monitorPopup=function(){var t=this;"hover"===this.showOn&&this.ngZone.runOutsideAngular(function(){var e=t.popupRef.popupElement;t.disposePopupHoverInListener=t.renderer.listen(e,"mouseenter",function(e){t.ngZone.run(function(e){return t._popoverService.emitPopoverState(!0)})}),t.disposePopupHoverOutListener=t.renderer.listen(e,"mouseleave",function(e){t.ngZone.run(function(e){return t._popoverService.emitPopoverState(!1)})})}),"focus"===this.showOn&&this.ngZone.runOutsideAngular(function(){var e=t.popupRef.popupElement;t.disposePopupFocusOutListener=t.renderer.listen(e,"focusout",function(e){s.closest(e.relatedTarget,function(e){return e.classList&&e.classList.contains("k-popover")})||t.ngZone.run(function(e){return t._popoverService.emitFocusInsidePopover(!1)})})})},S.prototype.applySettings=function(e,t,o){e=e.instance,o=o instanceof p.ElementRef?o.nativeElement:o;e.visible=!0,e.anchor=o,e.position=t.position,e.offset=t.offset,e.width=t.width,e.height=t.height,e.title=t.title,e.body=t.body,e.callout=t.callout,e.animation=t.animation,e.contextData=t.templateData(o),e.titleTemplate=t.titleTemplate,e.bodyTemplate=t.bodyTemplate,e.actionsTemplate=t.actionsTemplate,this.popupRef.content.changeDetectorRef.detectChanges()},S.prototype.initializeEvents=function(e,t,o,n){return o?(t=new G(n),this.shouldEmitEvent(!!this.popupRef,"show",e)&&this.ngZone.run(function(){return e.show.emit(t)})):(t=new ee(n,this.popupRef),this.shouldEmitEvent(!!this.popupRef,"hide",e)&&this.ngZone.run(function(){return e.hide.emit(t)})),t},S.prototype.initializeCompletionEvents=function(o,n){var t=this;this.shouldEmitCompletionEvents("shown",o)&&this.popupRef.popupOpen.subscribe(function(){var e=new oe(n,t.popupRef);o.shown.emit(e)}),this.shouldEmitCompletionEvents("hidden",o)&&this.popupRef.popupClose.subscribe(function(){t.ngZone.run(function(e){var t=new ne(n);o.hidden.emit(t)})})},S.prototype.shouldEmitEvent=function(e,t,o){return!!("show"===t&&!e&&s.hasObservers(o[t])||"hide"===t&&e&&s.hasObservers(o[t]))},S.prototype.shouldEmitCompletionEvents=function(e,t){return!!(s.hasObservers(t[e])&&!this._popupOpenSub||s.hasObservers(t[e])&&!this._popupCloseSub)},S);function S(e,t,o){this.ngZone=e,this.popupService=t,this.renderer=o,this.subs=new l.Subscription,this._showOn="click"}u.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,deps:[{token:r.NgZone},{token:h.PopupService},{token:r.Renderer2}],target:r.ɵɵFactoryTarget.Directive}),u.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:u,inputs:{popover:"popover",showOn:"showOn"},ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,decorators:[{type:p.Directive,args:[{}]}],ctorParameters:function(){return[{type:r.NgZone},{type:h.PopupService},{type:r.Renderer2}]},propDecorators:{popover:[{type:p.Input}],showOn:[{type:p.Input}]}});R.prototype.ngOnDestroy=function(){this.subs.unsubscribe()},Object.defineProperty(R.prototype,"isPopoverHovered",{get:function(){return this._pointerOverPopup.asObservable()},enumerable:!1,configurable:!0}),R.prototype.emitPopoverState=function(t){var o=this;this.ngZone.run(function(e){return o._pointerOverPopup.next(t)})},Object.defineProperty(R.prototype,"isAnchorHovered",{get:function(){return this._pointerOverAnchor.asObservable()},enumerable:!1,configurable:!0}),R.prototype.emitAnchorState=function(t,e){var o=this;this._isOrigin=this.originAnchor===e,this.currentAnchor=e,t&&(this.originAnchor=e),this.ngZone.run(function(e){return o._pointerOverAnchor.next(t)})},Object.defineProperty(R.prototype,"isFocusInsidePopover",{get:function(){return this._focusInsidePopover.asObservable()},enumerable:!1,configurable:!0}),R.prototype.emitFocusInsidePopover=function(t){var o=this;this.ngZone.run(function(e){return o._focusInsidePopover.next(t)}),this._focusInsidePopover.next(null)},Object.defineProperty(R.prototype,"hidePopover",{get:function(){return this._hidePopover.asObservable()},enumerable:!1,configurable:!0}),R.prototype.monitor=function(){var o=this;this.subs.add(l.combineLatest(this.isPopoverHovered,this.isAnchorHovered).pipe(a.auditTime(20)).subscribe(function(e){var e=m(e,2),t=e[0],e=e[1];o._hidePopover.next([t,e,o._isOrigin,o.currentAnchor])}))};var D=R;function R(e){this.ngZone=e,this._pointerOverPopup=new l.BehaviorSubject(null),this._pointerOverAnchor=new l.BehaviorSubject(null),this._focusInsidePopover=new l.BehaviorSubject(null),this._hidePopover=new l.Subject,this.subs=new l.Subscription,this.monitor()}D.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:D,deps:[{token:r.NgZone}],target:r.ɵɵFactoryTarget.Injectable}),D.ɵprov=r.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:D}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:D,decorators:[{type:p.Injectable}],ctorParameters:function(){return[{type:r.NgZone}]}});f(A,re=u),A.prototype.show=function(e){var t=this;this.popupRef||(this.ngZone.run(function(){t.openPopup(e)}),this.popupRef.popupAnchorViewportLeave.pipe(a.take(1)).subscribe(function(){return t.hide()}))},A.prototype.toggle=function(e){var t=this.popupRef&&this.popupRef.content.instance.anchor;this.popupRef&&(this.hide(),t===e)||this.show(e)},A.prototype.subscribeClick=function(){var o=this;this.disposeClickListener&&this.disposeClickListener(),this.disposeClickListener=this.renderer.listen(document,"click",function(e){var t=g(e.target,o.filter);o.clickHandler(t,e)})},A.prototype.subscribeToEvents=function(o){var n=this;Array.from(document.querySelectorAll(this.filter)).forEach(function(t){n.subs.add(n.renderer.listen(t,o[0].name,function(){n.popoverService.emitAnchorState(!0,t),o[0].handler(t)})),n.subs.add(n.renderer.listen(t,o[1].name,function(e){n.popoverService.emitAnchorState(!1,null),o[1].handler({anchor:t,domEvent:e})}))})},A.prototype.clickHandler=function(t,e){var o=!!s.closest(e.target,function(e){return e.classList&&e.classList.contains("k-popup")}),n=this.popupRef&&this.popupRef.content.instance.anchor,e=!!s.closest(e.target,function(e){return e===(n||t)});"click"!==this.showOn||o||this.popupRef&&e||(!t&&this.popupRef?this.controlVisibility(t,!1):e?this.controlVisibility(t,!0):this.popupRef&&(this.controlVisibility(t,!1),this.controlVisibility(t,!0)))},A.prototype.controlVisibility=function(e,t){this.isPrevented(e,t)||(t?this.show(e):this.hide())};var re,t=A;function A(e,t,o,n,i){var r=re.call(this,t,o,n)||this;return r.wrapperEl=e,r.ngZone=t,r.popupService=o,r.renderer=n,r.popoverService=i,r.mouseenterHandler=function(e){r.controlVisibility(e,!0)},r.mouseleaveHandler=function(e){e=e.anchor;r.isPrevented(e,!1)||r._hideSub||(r._hideSub=r.popoverService.hidePopover.subscribe(function(e){var e=m(e,4),t=e[0],o=e[2],e=e[3];t||o||(r.hide(),!o&&e&&r.show(e))}))},r.focusHandler=function(e){r.controlVisibility(e,!0)},r.blurHandler=function(e){var t,o=e.anchor,e=e.domEvent;r.isPrevented(o,!1)||((t=!!s.closest(e.relatedTarget,function(e){return e.classList&&e.classList.contains("k-popover")}))||r.hide(),r._focusInsideSub||(r._focusInsideSub=r.popoverService.isFocusInsidePopover.pipe(a.filter(function(e){return null!==e})).subscribe(function(e){e||t||r.hide()})))},r._popoverService=r.popoverService,r}t.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:t,deps:[{token:r.ElementRef},{token:r.NgZone},{token:h.PopupService},{token:r.Renderer2},{token:D}],target:r.ɵɵFactoryTarget.Directive}),t.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:t,selector:"[kendoPopoverContainer]",inputs:{filter:"filter"},providers:[D],exportAs:["kendoPopoverContainer"],usesInheritance:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:t,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverContainer]",exportAs:"kendoPopoverContainer",providers:[D]}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:r.NgZone},{type:h.PopupService},{type:r.Renderer2},{type:D}]},propDecorators:{filter:[{type:p.Input}]}});f(_,se=u),_.prototype.show=function(){var e=this;this.popupRef||(this.ngZone.run(function(){e.openPopup(e.hostEl)}),this.popupRef.popupAnchorViewportLeave.pipe(a.take(1)).subscribe(function(){return e.hide()}))},_.prototype.toggle=function(){this.popupRef?this.hide():this.show()},_.prototype.subscribeToEvents=function(t){var o=this;this.subs.add(this.renderer.listen(this.hostEl.nativeElement,t[0].name,function(){o.popoverService.emitAnchorState(!0,o.hostEl.nativeElement),t[0].handler()})),this.subs.add(this.renderer.listen(this.hostEl.nativeElement,t[1].name,function(e){o.popoverService.emitAnchorState(!1,null),t[1].handler({domEvent:e})}))},_.prototype.subscribeClick=function(){var t=this;this.disposeClickListener&&this.disposeClickListener(),this.disposeClickListener=this.renderer.listen(document,"click",function(e){t.onClick(e)})},_.prototype.onClick=function(e){var t=this,o=!!s.closest(e.target,function(e){return e.classList&&e.classList.contains("k-popup")}),e=!!s.closest(e.target,function(e){return e===t.hostEl.nativeElement});o||this.popupRef&&e||(e?this.controlVisibility(this.hostEl.nativeElement,!0):this.controlVisibility(this.hostEl.nativeElement,!1))},_.prototype.controlVisibility=function(e,t){this.isPrevented(e,t)||(t?this.show():this.hide())};var se,u=_;function _(e,t,o,n,i){var r=se.call(this,t,o,n)||this;return r.hostEl=e,r.ngZone=t,r.popupService=o,r.renderer=n,r.popoverService=i,r.mouseenterHandler=function(){r.controlVisibility(r.hostEl.nativeElement,!0)},r.mouseleaveHandler=function(){r.isPrevented(r.hostEl.nativeElement,!1)||r._hideSub||(r._hideSub=r.popoverService.hidePopover.subscribe(function(e){var e=m(e,2),t=e[0],e=e[1];t||e||r.hide()}))},r.focusHandler=function(){r.controlVisibility(r.hostEl.nativeElement,!0)},r.blurHandler=function(e){e=e.domEvent;r.isPrevented(r.hostEl.nativeElement,!1)||(s.closest(e.relatedTarget,function(e){return e.classList&&e.classList.contains("k-popover")})||r.hide(),r._focusInsideSub||(r._focusInsideSub=r.popoverService.isFocusInsidePopover.pipe(a.filter(function(e){return null!==e})).subscribe(function(e){e||r.hide()})))},r._popoverService=r.popoverService,r}u.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,deps:[{token:r.ElementRef},{token:r.NgZone},{token:h.PopupService},{token:r.Renderer2},{token:D}],target:r.ɵɵFactoryTarget.Directive}),u.ɵdir=r.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:u,selector:"[kendoPopoverAnchor]",providers:[D],exportAs:["kendoPopoverAnchor"],usesInheritance:!0,ngImport:r}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:u,decorators:[{type:p.Directive,args:[{selector:"[kendoPopoverAnchor]",exportAs:"kendoPopoverAnchor",providers:[D]}]}],ctorParameters:function(){return[{type:r.ElementRef},{type:r.NgZone},{type:h.PopupService},{type:r.Renderer2},{type:D}]}});var M=[k,b,y],V=[n.PopupModule],L=function(){},V=(L.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,deps:[],target:r.ɵɵFactoryTarget.NgModule}),L.ɵmod=r.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,declarations:[k,b,y],imports:[o.CommonModule,n.PopupModule],exports:[k,b,y]}),L.ɵinj=r.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,imports:[v([o.CommonModule],m(V))]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:L,decorators:[{type:p.NgModule,args:[{declarations:[M],entryComponents:[b],imports:v([o.CommonModule],m(V)),exports:[M]}]}]}),[P,C,O,u,t]),M=function(){},V=(M.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,deps:[],target:r.ɵɵFactoryTarget.NgModule}),M.ɵmod=r.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,declarations:[P,C,O,u,t,w],imports:[o.CommonModule,n.PopupModule],exports:[P,C,O,u,t,w]}),M.ɵinj=r.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,imports:[[o.CommonModule,n.PopupModule]]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:M,decorators:[{type:p.NgModule,args:[{declarations:v(v([],m(V)),[w]),entryComponents:[w],exports:v(v([],m(V)),[w]),imports:[o.CommonModule,n.PopupModule]}]}]}),function(){});V.ɵfac=r.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,deps:[],target:r.ɵɵFactoryTarget.NgModule}),V.ɵmod=r.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,exports:[L,M]}),V.ɵinj=r.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,imports:[L,M]}),r.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:r,type:V,decorators:[{type:p.NgModule,args:[{exports:[L,M]}]}]}),e.LocalizedMessagesDirective=y,e.PopoverActionsTemplateDirective=P,e.PopoverAnchorDirective=u,e.PopoverBodyTemplateDirective=C,e.PopoverComponent=w,e.PopoverContainerDirective=t,e.PopoverHiddenEvent=ne,e.PopoverHideEvent=ee,e.PopoverModule=M,e.PopoverShowEvent=G,e.PopoverShownEvent=oe,e.PopoverTitleTemplateDirective=O,e.TOOLTIP_SETTINGS=H,e.TooltipContentComponent=b,e.TooltipDirective=k,e.TooltipModule=L,e.TooltipSettings=d,e.TooltipsModule=V,Object.defineProperty(e,"__esModule",{value:!0})});

package/esm2015/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-tooltip',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1650441036,
+    publishDate: 1662112459,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2015/popover/popover.component.js

@@ -187,32 +187,38 @@ PopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
     <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{'width': width, 'height': height}">
         <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>
 
-        <div *ngIf="titleTemplate || title" class="k-popover-header">
-            <ng-template *ngIf="titleTemplate"
-                [ngTemplateOutlet]="titleTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="title && !titleTemplate">
-                {{ title }}
-            </ng-container>
+        <div class="k-popover-inner" *ngIf="callout; else noCallout">
+            <ng-container *ngTemplateOutlet="noCallout"></ng-container>
         </div>
 
-        <div *ngIf="bodyTemplate || body" class="k-popover-body">
-            <ng-template *ngIf="bodyTemplate"
-                [ngTemplateOutlet]="bodyTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="body && !bodyTemplate">
-                {{ body }}
-            </ng-container>
-        </div>
+        <ng-template #noCallout>
+            <div *ngIf="titleTemplate || title" class="k-popover-header">
+                <ng-template *ngIf="titleTemplate"
+                    [ngTemplateOutlet]="titleTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="title && !titleTemplate">
+                    {{ title }}
+                </ng-container>
+            </div>
 
-        <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
-            <ng-template *ngIf="actionsTemplate"
-                [ngTemplateOutlet]="actionsTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-        </div>
+            <div *ngIf="bodyTemplate || body" class="k-popover-body">
+                <ng-template *ngIf="bodyTemplate"
+                    [ngTemplateOutlet]="bodyTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="body && !bodyTemplate">
+                    {{ body }}
+                </ng-container>
+            </div>
+
+            <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
+                <ng-template *ngIf="actionsTemplate"
+                    [ngTemplateOutlet]="actionsTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+            </div>
+        </ng-template>
     </div>
     `, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopoverComponent, decorators: [{
@@ -230,32 +236,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
     <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{'width': width, 'height': height}">
         <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>
 
-        <div *ngIf="titleTemplate || title" class="k-popover-header">
-            <ng-template *ngIf="titleTemplate"
-                [ngTemplateOutlet]="titleTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="title && !titleTemplate">
-                {{ title }}
-            </ng-container>
+        <div class="k-popover-inner" *ngIf="callout; else noCallout">
+            <ng-container *ngTemplateOutlet="noCallout"></ng-container>
         </div>
 
-        <div *ngIf="bodyTemplate || body" class="k-popover-body">
-            <ng-template *ngIf="bodyTemplate"
-                [ngTemplateOutlet]="bodyTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="body && !bodyTemplate">
-                {{ body }}
-            </ng-container>
-        </div>
+        <ng-template #noCallout>
+            <div *ngIf="titleTemplate || title" class="k-popover-header">
+                <ng-template *ngIf="titleTemplate"
+                    [ngTemplateOutlet]="titleTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="title && !titleTemplate">
+                    {{ title }}
+                </ng-container>
+            </div>
 
-        <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
-            <ng-template *ngIf="actionsTemplate"
-                [ngTemplateOutlet]="actionsTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-        </div>
+            <div *ngIf="bodyTemplate || body" class="k-popover-body">
+                <ng-template *ngIf="bodyTemplate"
+                    [ngTemplateOutlet]="bodyTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="body && !bodyTemplate">
+                    {{ body }}
+                </ng-container>
+            </div>
+
+            <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
+                <ng-template *ngIf="actionsTemplate"
+                    [ngTemplateOutlet]="actionsTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+            </div>
+        </ng-template>
     </div>
     `
                 }]

package/esm2015/tooltip/tooltip.content.component.js

@@ -138,7 +138,7 @@ TooltipContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
         </div>
 
         <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">
-            <a href="#" class="k-icon k-i-close" [attr.title]="closeButtonTitle"></a>
+            <a href="#" class="k-icon k-i-x" [attr.title]="closeButtonTitle"></a>
         </div>
 
         <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>
@@ -175,7 +175,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
 
         <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">
-            <a href="#" class="k-icon k-i-close" [attr.title]="closeButtonTitle"></a>
+            <a href="#" class="k-icon k-i-x" [attr.title]="closeButtonTitle"></a>
         </div>
 
         <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>

package/esm2015/tooltip/tooltip.directive.js

@@ -94,7 +94,6 @@ export class TooltipDirective {
                 .pipe(debounceTime(100), filter(() => this.filter !== ''))
                 .subscribe(e => this.onMouseOver(e));
             this.mouseOutSubscription = fromEvent(wrapper, 'mouseout')
-                .pipe(debounceTime(100))
                 .subscribe(e => this.onMouseOut(e));
         });
     }

package/fesm2015/kendo-angular-tooltip.js

@@ -22,7 +22,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-tooltip',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1650441036,
+    publishDate: 1662112459,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
@@ -339,7 +339,7 @@ TooltipContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
         </div>
 
         <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">
-            <a href="#" class="k-icon k-i-close" [attr.title]="closeButtonTitle"></a>
+            <a href="#" class="k-icon k-i-x" [attr.title]="closeButtonTitle"></a>
         </div>
 
         <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>
@@ -376,7 +376,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
 
         <div *ngIf="closable" class="k-tooltip-button" (click)="onCloseClick($event)">
-            <a href="#" class="k-icon k-i-close" [attr.title]="closeButtonTitle"></a>
+            <a href="#" class="k-icon k-i-x" [attr.title]="closeButtonTitle"></a>
         </div>
 
         <div class="k-callout" *ngIf="callout" [ngClass]="calloutPositionClass()"></div>
@@ -506,7 +506,6 @@ class TooltipDirective {
                 .pipe(debounceTime(100), filter(() => this.filter !== ''))
                 .subscribe(e => this.onMouseOver(e));
             this.mouseOutSubscription = fromEvent(wrapper, 'mouseout')
-                .pipe(debounceTime(100))
                 .subscribe(e => this.onMouseOut(e));
         });
     }
@@ -1076,32 +1075,38 @@ PopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
     <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{'width': width, 'height': height}">
         <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>
 
-        <div *ngIf="titleTemplate || title" class="k-popover-header">
-            <ng-template *ngIf="titleTemplate"
-                [ngTemplateOutlet]="titleTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="title && !titleTemplate">
-                {{ title }}
-            </ng-container>
+        <div class="k-popover-inner" *ngIf="callout; else noCallout">
+            <ng-container *ngTemplateOutlet="noCallout"></ng-container>
         </div>
 
-        <div *ngIf="bodyTemplate || body" class="k-popover-body">
-            <ng-template *ngIf="bodyTemplate"
-                [ngTemplateOutlet]="bodyTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="body && !bodyTemplate">
-                {{ body }}
-            </ng-container>
-        </div>
+        <ng-template #noCallout>
+            <div *ngIf="titleTemplate || title" class="k-popover-header">
+                <ng-template *ngIf="titleTemplate"
+                    [ngTemplateOutlet]="titleTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="title && !titleTemplate">
+                    {{ title }}
+                </ng-container>
+            </div>
 
-        <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
-            <ng-template *ngIf="actionsTemplate"
-                [ngTemplateOutlet]="actionsTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-        </div>
+            <div *ngIf="bodyTemplate || body" class="k-popover-body">
+                <ng-template *ngIf="bodyTemplate"
+                    [ngTemplateOutlet]="bodyTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="body && !bodyTemplate">
+                    {{ body }}
+                </ng-container>
+            </div>
+
+            <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
+                <ng-template *ngIf="actionsTemplate"
+                    [ngTemplateOutlet]="actionsTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+            </div>
+        </ng-template>
     </div>
     `, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopoverComponent, decorators: [{
@@ -1119,32 +1124,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
     <div *ngIf="visible" role="tooltip" class="k-popover" [ngStyle]="{'width': width, 'height': height}">
         <div class="k-popover-callout" [ngClass]="getCalloutPosition()" *ngIf="callout"></div>
 
-        <div *ngIf="titleTemplate || title" class="k-popover-header">
-            <ng-template *ngIf="titleTemplate"
-                [ngTemplateOutlet]="titleTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="title && !titleTemplate">
-                {{ title }}
-            </ng-container>
+        <div class="k-popover-inner" *ngIf="callout; else noCallout">
+            <ng-container *ngTemplateOutlet="noCallout"></ng-container>
         </div>
 
-        <div *ngIf="bodyTemplate || body" class="k-popover-body">
-            <ng-template *ngIf="bodyTemplate"
-                [ngTemplateOutlet]="bodyTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-            <ng-container *ngIf="body && !bodyTemplate">
-                {{ body }}
-            </ng-container>
-        </div>
+        <ng-template #noCallout>
+            <div *ngIf="titleTemplate || title" class="k-popover-header">
+                <ng-template *ngIf="titleTemplate"
+                    [ngTemplateOutlet]="titleTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="title && !titleTemplate">
+                    {{ title }}
+                </ng-container>
+            </div>
 
-        <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
-            <ng-template *ngIf="actionsTemplate"
-                [ngTemplateOutlet]="actionsTemplate?.templateRef"
-                [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
-            </ng-template>
-        </div>
+            <div *ngIf="bodyTemplate || body" class="k-popover-body">
+                <ng-template *ngIf="bodyTemplate"
+                    [ngTemplateOutlet]="bodyTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+                <ng-container *ngIf="body && !bodyTemplate">
+                    {{ body }}
+                </ng-container>
+            </div>
+
+            <div *ngIf="actionsTemplate" class="k-popover-actions k-actions k-hstack k-justify-content-between">
+                <ng-template *ngIf="actionsTemplate"
+                    [ngTemplateOutlet]="actionsTemplate?.templateRef"
+                    [ngTemplateOutletContext]="{ $implicit: anchor, data: contextData }">
+                </ng-template>
+            </div>
+        </ng-template>
     </div>
     `
                 }]

package/models/functions.model.d.ts

@@ -6,12 +6,12 @@ import { PopoverComponent } from "../popover/popover.component";
 /**
  * Represents a callback that is used by the [popover]({% slug api_tooltip_popoveranchordirective %}#toc-popover) property.
  * It returns the popover instance to be displayed.
- * ([see example]({% slug callbacks_popover %}#toc-popoverfn))
+ * ([see example]({% slug configuration_popover %}#toc-popover-callback))
  */
 export declare type PopoverFn = (anchor: Element) => PopoverComponent;
 /**
- * Represents the callback that is used by the [`templateData`]({% slug api_popovercomponent %}#toc-templateData) property.
+ * Represents the callback that is used by the [`templateData`]({% slug api_tooltip_popovercomponent %}#toc-templateData) property.
  * It returns the custom data that will be passed to the popover templates.
- * ([see example]({% slug callbacks_popover %}#toc-popoverdatafn))
+ * ([see example]({% slug templates_popover %}#toc-passing-data-to-templates))
  */
 export declare type PopoverDataFn = (anchor: Element) => any;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-angular-tooltip",
-  "version": "4.0.0",
-  "description": "Kendo UI Tooltip for Angular",
+  "version": "4.0.2-dev.202209020954",
+  "description": "Kendo UI Tooltip for Angular - A highly customizable and easily themeable tooltip from the creators developers trust for professional Angular components.",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
   "homepage": "https://www.telerik.com/kendo-angular-ui/components/",
@@ -16,7 +16,9 @@
     "Angular",
     "Kendo UI",
     "Progress",
-    "Tooltip"
+    "Tooltip",
+    "Tooltips",
+    "Popover"
   ],
   "@progress": {
     "friendlyName": "Tooltip"
@@ -66,11 +68,11 @@
     "fallbackTags": {
       "dev": "latest"
     },
-    "analyzeCommits": "@telerik/semantic-prerelease/analyzeCommits",
+    "analyzeCommits": "@progress/semantic-prerelease/analyzeCommits",
     "generateNotes": "@progress/kendo-angular-tasks/lib/generateNotes",
-    "getLastRelease": "@telerik/semantic-prerelease/getLastRelease",
-    "verifyConditions": "@telerik/semantic-prerelease/verifyConditions",
-    "verifyRelease": "@telerik/semantic-prerelease/verifyRelease"
+    "getLastRelease": "@progress/semantic-prerelease/getLastRelease",
+    "verifyConditions": "@progress/semantic-prerelease/verifyConditions",
+    "verifyRelease": "@progress/semantic-prerelease/verifyRelease"
   },
   "main": "bundles/kendo-angular-tooltip.umd.js",
   "module": "fesm2015/kendo-angular-tooltip.js",