@progress/kendo-vue-tooltip 8.0.3-develop.1 → 8.0.3-develop.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/Tooltip.d.ts +158 -0
  2. package/TooltipProps.d.ts +107 -0
  3. package/dist/cdn/js/kendo-vue-tooltip.js +1 -1
  4. package/events.d.ts +41 -0
  5. package/index.d.mts +5 -299
  6. package/index.d.ts +5 -299
  7. package/package-metadata.d.ts +12 -0
  8. package/package-metadata.js +1 -1
  9. package/package-metadata.mjs +2 -2
  10. package/package.json +11 -5
  11. package/utils.d.ts +31 -0
package/Tooltip.d.ts ADDED
@@ -0,0 +1,158 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { PropType } from 'vue';
9
+ /**
10
+ * @hidden
11
+ */
12
+ declare const Tooltip: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
13
+ showCallout: {
14
+ type: PropType<boolean>;
15
+ default: boolean;
16
+ };
17
+ setCalloutOnPositionAuto: {
18
+ type: PropType<any>;
19
+ default: any;
20
+ };
21
+ anchorElement: {
22
+ type: PropType<string>;
23
+ default: string;
24
+ validator: (value: string) => any;
25
+ };
26
+ content: PropType<any>;
27
+ filter: PropType<(target: HTMLElement) => void>;
28
+ openDelay: {
29
+ type: PropType<number>;
30
+ default: number;
31
+ };
32
+ open: {
33
+ type: PropType<boolean>;
34
+ default: any;
35
+ };
36
+ position: {
37
+ type: PropType<String | import('./utils').TooltipPosition>;
38
+ default: string;
39
+ validator: (value: string) => any;
40
+ };
41
+ updatePosition: {
42
+ type: PropType<(event: import('./events').TooltipPositionEvent) => {
43
+ top: number;
44
+ left: number;
45
+ }>;
46
+ default: any;
47
+ };
48
+ updateInterval: PropType<number>;
49
+ className: PropType<string>;
50
+ wrapperStyle: PropType<object>;
51
+ tooltipClassName: PropType<string>;
52
+ tooltipStyle: PropType<any>;
53
+ targetElement: {
54
+ type: PropType<any>;
55
+ };
56
+ parentTitle: {
57
+ type: PropType<boolean>;
58
+ default: boolean;
59
+ };
60
+ }>, {}, {
61
+ top: number;
62
+ left: number;
63
+ currentTargetElement: any;
64
+ currentOpen: boolean;
65
+ title: string;
66
+ }, {
67
+ wrapperClass(): {
68
+ [x: number]: boolean;
69
+ 'k-animation-container': boolean;
70
+ 'k-animation-container-fixed': boolean;
71
+ 'k-animation-container-shown': boolean;
72
+ };
73
+ computedTarget(): any;
74
+ computedOpen(): any;
75
+ }, {
76
+ destroyElement(): void;
77
+ handleTooltipMouseOut(event: any): void;
78
+ handleMouseOut(event: any): void;
79
+ handleMouseOver(event: any): void;
80
+ handleBodyMousemove(event: any): void;
81
+ onClose(event: any): void;
82
+ showToolTip(event: any): void;
83
+ setUpdateInterval(): void;
84
+ onIntervalUpdate(): void;
85
+ resetPosition(): void;
86
+ isVisible(element: any): any;
87
+ setPosition(element: HTMLElement): {
88
+ left: any;
89
+ top: any;
90
+ };
91
+ getTitle(element: HTMLElement | null): {
92
+ title: string;
93
+ element: HTMLElement;
94
+ };
95
+ calloutClassName(): "k-callout k-callout-n" | "k-callout k-callout-e" | "k-callout k-callout-w" | "k-callout k-callout-s";
96
+ getCurrentZIndex(): number;
97
+ }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
98
+ showCallout: {
99
+ type: PropType<boolean>;
100
+ default: boolean;
101
+ };
102
+ setCalloutOnPositionAuto: {
103
+ type: PropType<any>;
104
+ default: any;
105
+ };
106
+ anchorElement: {
107
+ type: PropType<string>;
108
+ default: string;
109
+ validator: (value: string) => any;
110
+ };
111
+ content: PropType<any>;
112
+ filter: PropType<(target: HTMLElement) => void>;
113
+ openDelay: {
114
+ type: PropType<number>;
115
+ default: number;
116
+ };
117
+ open: {
118
+ type: PropType<boolean>;
119
+ default: any;
120
+ };
121
+ position: {
122
+ type: PropType<String | import('./utils').TooltipPosition>;
123
+ default: string;
124
+ validator: (value: string) => any;
125
+ };
126
+ updatePosition: {
127
+ type: PropType<(event: import('./events').TooltipPositionEvent) => {
128
+ top: number;
129
+ left: number;
130
+ }>;
131
+ default: any;
132
+ };
133
+ updateInterval: PropType<number>;
134
+ className: PropType<string>;
135
+ wrapperStyle: PropType<object>;
136
+ tooltipClassName: PropType<string>;
137
+ tooltipStyle: PropType<any>;
138
+ targetElement: {
139
+ type: PropType<any>;
140
+ };
141
+ parentTitle: {
142
+ type: PropType<boolean>;
143
+ default: boolean;
144
+ };
145
+ }>> & Readonly<{}>, {
146
+ position: String | import('./utils').TooltipPosition;
147
+ showCallout: boolean;
148
+ setCalloutOnPositionAuto: any;
149
+ anchorElement: string;
150
+ openDelay: number;
151
+ open: boolean;
152
+ updatePosition: (event: import('./events').TooltipPositionEvent) => {
153
+ top: number;
154
+ left: number;
155
+ };
156
+ parentTitle: boolean;
157
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
158
+ export { Tooltip };
package/TooltipProps.d.ts ADDED
@@ -0,0 +1,107 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TooltipEvent, TooltipPositionEvent } from './events';
9
+ import { TooltipPosition } from './utils';
10
+ /**
11
+ * Represents the props of the [Kendo UI for Vue Tooltip component]({% slug overview_tooltip %}).
12
+ */
13
+ export interface TooltipProps {
14
+ /**
15
+ * Sets the anchor element of the Tooltip.
16
+ *
17
+ * The available options are:
18
+ * - (Default) `pointer`&mdash;Shows a Tooltip where the cursor is located.
19
+ * - `target`&mdash;Positions the Tooltip based on the anchor element.
20
+ */
21
+ anchorElement?: string;
22
+ /**
23
+ * Defines the container to which the Tooltip will be appended. Defaults to [`body`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body).
24
+ */
25
+ appendTo?: HTMLElement | null;
26
+ /**
27
+ * Sets the position of the Tooltip ([see example]({% slug positioning_tooltip %})).
28
+ *
29
+ * The available options are:
30
+ * - (Default) `auto`&mdash;Positions the Tooltip depending on the available space.
31
+ * - `right`&mdash;Positions the Tooltip to the right side of the element.
32
+ * - `left`&mdash;Positions the Tooltip to the left side of the element.
33
+ * - `bottom`&mdash;Positions the Tooltip at the bottom of the element.
34
+ * - `top`&mdash;Positions the Tooltip at the top of the element.
35
+ */
36
+ position?: TooltipPosition | String;
37
+ /**
38
+ * Sets a class of the Tooltip animation container.
39
+ */
40
+ className?: string;
41
+ /**
42
+ * Sets a class of the Tooltip animation container.
43
+ */
44
+ wrapperStyle?: object;
45
+ /**
46
+ * Sets the content of the Tooltip ([see example]({% slug templates_tooltip %})).
47
+ */
48
+ content?: any;
49
+ /**
50
+ * Specifies if the Tooltip will be open.
51
+ * Sets the Tooltip in its controlled mode ([see example]({% slug controlledmode_tooltip %})).
52
+ * Requires you to set the `targetElement` property.
53
+ */
54
+ open?: boolean;
55
+ /**
56
+ * Sets a delay in milliseconds.
57
+ */
58
+ openDelay?: number;
59
+ /**
60
+ * If any of the parent elements has a title, displays a Tooltip.
61
+ */
62
+ parentTitle?: boolean;
63
+ /**
64
+ * Specifies if the Tooltip callout will be displayed.
65
+ */
66
+ showCallout?: boolean;
67
+ /**
68
+ * When the position is set to `auto`, sets the start point of the Tooltip callout (in pixels).
69
+ */
70
+ setCalloutOnPositionAuto?: any;
71
+ /**
72
+ * Sets the Tooltip target element. You have to use it with the `open` property.
73
+ */
74
+ targetElement?: any;
75
+ /**
76
+ * Specifies the CSS class names which are set to the Tooltip DOM element.
77
+ */
78
+ tooltipClassName?: string;
79
+ /**
80
+ * Specifies the styles which are set to the Tooltip DOM element.
81
+ */
82
+ tooltipStyle?: any;
83
+ /**
84
+ * Callback called when the Tooltip calculates it's position. Useful to modify the default position behavior.
85
+ * Require to return the `top` and `left` position of the Tooltip.
86
+ */
87
+ updatePosition?: (event: TooltipPositionEvent) => {
88
+ top: number;
89
+ left: number;
90
+ };
91
+ /**
92
+ * Fires when the Tooltip is shown.
93
+ */
94
+ onOpen?: (event: TooltipEvent) => void;
95
+ /**
96
+ * Fires when the Tooltip is hidden.
97
+ */
98
+ onClose?: (event: TooltipEvent) => void;
99
+ /**
100
+ * Represents a callback function which determines if a Tooltip will be displayed ([see example]({% slug filter_elements_tooltip %})).
101
+ */
102
+ filter?: (target: HTMLElement) => void;
103
+ /**
104
+ * The milliseconds interval on which the Tooltip will check for title change. By default the Tooltip does not track for title updates.
105
+ */
106
+ updateInterval?: number;
107
+ }
package/dist/cdn/js/kendo-vue-tooltip.js CHANGED
@@ -12,4 +12,4 @@
12
12
  * Licensed under commercial license. See LICENSE.md in the package root for more information
13
13
  *-------------------------------------------------------------------------------------------
14
14
  */
15
- !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("vue"),require("@progress/kendo-vue-common")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-vue-common"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).KendoVueTooltip={},t.Vue,t.KendoVueCommon)}(this,(function(t,e,o){"use strict";const i=10,n=10,s=(t,e,n,s,l)=>{switch(l){case"bottom":case"top":return"pointer"===s?t-e/2:n.left-e/2+n.width/2;case"left":return"pointer"===s?t-e-i:n.left-e-i;case"right":return"pointer"===s?t+i:n.right+i;default:return"pointer"===s?o.canUseDOM&&t<window.screen.availWidth/2?t-i:t-e+i:o.canUseDOM&&t<window.screen.availWidth/2?n.left:n.right-e}},l=(t,e,s,l,r)=>{switch(r){case"bottom":return"pointer"===l?t+n:e.bottom+n;case"left":case"right":return"pointer"===l?t-s/2:e.top-s/2+e.height/2;case"top":return"pointer"===l?t-s-n:e.top-s-n;default:return"pointer"===l?o.canUseDOM&&t<window.innerHeight/2?t+i:t-s-i:o.canUseDOM&&t<window.innerHeight/2?e.bottom+n:e.top-s-n}},r=["k-tooltip-content","k-animation-container","k-tooltip","k-tooltip-title","k-tooltip k-tooltip-closable","k-icon k-i-x","k-svg-icon k-svg-i-x"],a=t=>{if(null===t)return!1;let e=t;for(;e;){if(null!==e&&e.classList&&e.classList.contains("k-tooltip"))return!0;e=null!==e.parentNode&&e.parentNode}return r.filter((e=>e===t.className)).length>0},p={name:"@progress/kendo-vue-tooltip",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate:1639571344,version:"8.0.3-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"},u="_tb_active",h=e.defineComponent({name:"KendoTooltip",inheritAttrs:!1,props:{showCallout:{type:Boolean,default:!0},setCalloutOnPositionAuto:{type:String,default:void 0},anchorElement:{type:String,default:"pointer",validator:function(t){return["pointer","target"].includes(t)}},content:[String,Object,Function],filter:Function,openDelay:{type:Number,default:400},open:{type:Boolean,default:void 0},position:{type:String,default:"auto",validator:function(t){return["right","left","top","bottom","auto"].includes(t)}},updatePosition:{type:Function,default:void 0},updateInterval:Number,className:String,wrapperStyle:Object,tooltipClassName:String,tooltipStyle:Object,targetElement:{type:void 0},parentTitle:{type:Boolean,default:!1}},data:()=>({top:0,left:0,currentTargetElement:null,currentOpen:!1,title:""}),computed:{wrapperClass(){return{"k-animation-container":!0,"k-animation-container-fixed":!0,"k-animation-container-shown":!0,[this.$props.className]:!0}},computedTarget(){return void 0!==this.targetElement?this.targetElement:this.currentTargetElement},computedOpen(){return void 0!==this.open?this.open:this.currentOpen}},inject:{kCurrentZIndex:{default:null}},created(){o.validatePackage(p),this.top=0,this.left=0,this.willOpen=!1},mounted(){this.element=o.getRef(this,"element"),document&&document.body.addEventListener("mousemove",this.handleBodyMousemove)},unmounted(){this.destroyElement()},updated(){if(this.$props.open&&this.$props.targetElement&&this.showToolTip({target:this.$props.targetElement}),this.element=o.getRef(this,"element"),this.element){if(this.resetPosition(),this.computedTarget){const t=this.$props.appendTo?this.$props.appendTo:this.computedTarget.ownerDocument.body;this.element.parentElement!==t&&this.computedTarget.ownerDocument.body.append(this.element)}this.callout=this.calloutRef,this.callout&&(this.callout.className=this.calloutClassName(),"auto"===this.$props.position&&o.canUseDOM&&(this.left<window.screen.availWidth/2?this.callout.style.left=this.$props.setCalloutOnPositionAuto||"25%":this.callout.style.left=this.$props.setCalloutOnPositionAuto||"75%"))}},render(){const t=o.getDefaultSlots(this),i=this.getCurrentZIndex(),n=this.$props.content?o.templateRendering.call(this,this.$props.content,o.getListeners.call(this)):void 0,s=this.title;let l=o.guid()+u;this.computedTarget&&(this.computedTarget.hasAttribute("id")&&(l=this.computedTarget.getAttribute("id")+u),this.computedTarget.setAttribute("aria-describedby",l));const r=o.getTemplate.call(this,{h:e.h,template:n,defaultRendering:s,additionalProps:{title:this.title,target:this.computedTarget}}),a=this.computedOpen&&e.createVNode("div",{class:o.classNames("k-tooltip",this.$props.tooltipClassName),role:"tooltip",id:l,style:{position:"relative",...this.$props.tooltipStyle}},[e.createVNode("div",{class:"k-tooltip-content"},[r]),this.$props.showCallout&&e.createVNode("div",{ref:o.setRef(this,"callout")},null)]),p=this.computedTarget&&this.title&&this.computedTarget.ownerDocument&&e.createVNode("div",{ref:o.setRef(this,"element"),class:this.wrapperClass,style:{zIndex:i,...this.$props.wrapperStyle},tabindex:0,onMouseleave:this.handleTooltipMouseOut},[e.createVNode("div",{class:"k-child-animation-container"},[a])]);return t?e.createVNode("div",{onMouseover:this.handleMouseOver,onMouseout:this.handleMouseOut},[p,t]):p},methods:{destroyElement(){clearTimeout(this.openTimeoutId),clearInterval(this.updateIntervalId),document&&document.body.removeEventListener("mousemove",this.handleBodyMousemove),this.element&&this.element.remove()},handleTooltipMouseOut(t){this.onClose(t)},handleMouseOut(t){const e=this.computedTarget?this.computedTarget.ownerDocument:document;let o=e&&e.elementFromPoint(t.clientX,t.clientY);this.willOpen=!1,!a(o)&&this.computedTarget===t.target&&(this.$props.open||(clearInterval(this.updateIntervalId),this.onClose(t)))},handleMouseOver(t){const e=t.target;!this.isVisible(e)||a(e)||e===this.computedTarget||this.showToolTip(t)},handleBodyMousemove(t){this.top=t.clientY,this.left=t.clientX},onClose(t){this.$emit("close",{event:t,component:this}),this.computedTarget.removeAttribute("aria-describedby"),this.currentTargetElement=null,this.currentOpen=!1,this.title=""},showToolTip(t){clearTimeout(this.openTimeoutId),clearInterval(this.updateIntervalId),t.target.hasChildNodes()&&t.target.childNodes.forEach((e=>{"title"===e.nodeName&&(t.target.titleExpando=e.innerHTML,e.remove())}));const e=this.computedTarget||t.target;let i=this.getTitle(e);i.title?(i.element&&(i.element.titleExpando=i.title,i.element.title=""),this.willOpen=!0,this.$props.openDelay?o.canUseDOM&&(this.openTimeoutId=window.setTimeout((()=>{this.willOpen&&(this.currentTargetElement=e,this.currentOpen=!0,this.title=i.title,this.setUpdateInterval())}),this.$props.openDelay)):(this.currentTargetElement=e,this.currentOpen=!0,this.title=i.title,this.setUpdateInterval()),this.title!==i.title&&this.$emit("open",{event:t,compoponent:this})):this.computedOpen&&this.onClose(t)},setUpdateInterval(){this.$props.updateInterval&&(this.updateIntervalId=setInterval(this.onIntervalUpdate,this.$props.updateInterval))},onIntervalUpdate(){const t=this.computedTarget;t&&(null===t.parentElement?this.onClose({target:t}):this.showToolTip({target:t}))},resetPosition(){if(this.element){let t=this.setPosition(this.element);this.$props.updatePosition&&(t=this.$props.updatePosition({element:this.element,targetElement:this.computedTarget,mouseTop:this.top,mouseLeft:this.left,anchorElement:this.$props.anchorElement,position:this.$props.position,target:this,defaultPosition:t})),this.element.style.left=t.left+"px",this.element.style.top=t.top+"px"}},isVisible(t){return!this.$props.filter||this.$props.filter(t)},setPosition(t){let e=(t=>null!==t?t.getBoundingClientRect():document.body.getBoundingClientRect())(this.parentTitle?this.getTitle(this.computedTarget).element:this.computedTarget);return{left:s(this.left,t.offsetWidth,e,this.$props.anchorElement,this.$props.position),top:l(this.top,e,t.offsetHeight,this.$props.anchorElement,this.$props.position)}},getTitle(t){for(;t;){if(null!==t.getAttribute("title")||t.titleExpando)return{title:t.getAttribute("title")||t.titleExpando,element:t};t=this.$props.parentTitle&&t.parentElement||null}return{title:"",element:t}},calloutClassName(){switch(this.$props.position){case"bottom":return"k-callout k-callout-n";case"left":return"k-callout k-callout-e";case"right":return"k-callout k-callout-w";case"top":return"k-callout k-callout-s";default:return o.canUseDOM&&this.top<window.innerHeight/2?"k-callout k-callout-n":"k-callout k-callout-s"}},getCurrentZIndex(){return this.kCurrentZIndex?this.kCurrentZIndex:100}}});t.Tooltip=h}));
15
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("vue"),require("@progress/kendo-vue-common")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-vue-common"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).KendoVueTooltip={},t.Vue,t.KendoVueCommon)}(this,function(t,e,o){"use strict";const i=10,n=10,s=(t,e,n,s,l)=>{switch(l){case"bottom":case"top":return"pointer"===s?t-e/2:n.left-e/2+n.width/2;case"left":return"pointer"===s?t-e-i:n.left-e-i;case"right":return"pointer"===s?t+i:n.right+i;default:return"pointer"===s?o.canUseDOM&&t<window.screen.availWidth/2?t-i:t-e+i:o.canUseDOM&&t<window.screen.availWidth/2?n.left:n.right-e}},l=(t,e,s,l,r)=>{switch(r){case"bottom":return"pointer"===l?t+n:e.bottom+n;case"left":case"right":return"pointer"===l?t-s/2:e.top-s/2+e.height/2;case"top":return"pointer"===l?t-s-n:e.top-s-n;default:return"pointer"===l?o.canUseDOM&&t<window.innerHeight/2?t+i:t-s-i:o.canUseDOM&&t<window.innerHeight/2?e.bottom+n:e.top-s-n}},r=["k-tooltip-content","k-animation-container","k-tooltip","k-tooltip-title","k-tooltip k-tooltip-closable","k-icon k-i-x","k-svg-icon k-svg-i-x"],a=t=>{if(null===t)return!1;let e=t;for(;e;){if(null!==e&&e.classList&&e.classList.contains("k-tooltip"))return!0;e=null!==e.parentNode&&e.parentNode}return r.filter(e=>e===t.className).length>0},p={name:"@progress/kendo-vue-tooltip",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate:1639571344,version:"8.0.3-develop.3",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"},u="_tb_active",h=e.defineComponent({name:"KendoTooltip",inheritAttrs:!1,props:{showCallout:{type:Boolean,default:!0},setCalloutOnPositionAuto:{type:String,default:void 0},anchorElement:{type:String,default:"pointer",validator:function(t){return["pointer","target"].includes(t)}},content:[String,Object,Function],filter:Function,openDelay:{type:Number,default:400},open:{type:Boolean,default:void 0},position:{type:String,default:"auto",validator:function(t){return["right","left","top","bottom","auto"].includes(t)}},updatePosition:{type:Function,default:void 0},updateInterval:Number,className:String,wrapperStyle:Object,tooltipClassName:String,tooltipStyle:Object,targetElement:{type:void 0},parentTitle:{type:Boolean,default:!1}},data:()=>({top:0,left:0,currentTargetElement:null,currentOpen:!1,title:""}),computed:{wrapperClass(){return{"k-animation-container":!0,"k-animation-container-fixed":!0,"k-animation-container-shown":!0,[this.$props.className]:!0}},computedTarget(){return void 0!==this.targetElement?this.targetElement:this.currentTargetElement},computedOpen(){return void 0!==this.open?this.open:this.currentOpen}},inject:{kCurrentZIndex:{default:null}},created(){o.validatePackage(p),this.top=0,this.left=0,this.willOpen=!1},mounted(){this.element=o.getRef(this,"element"),document&&document.body.addEventListener("mousemove",this.handleBodyMousemove)},unmounted(){this.destroyElement()},updated(){if(this.$props.open&&this.$props.targetElement&&this.showToolTip({target:this.$props.targetElement}),this.element=o.getRef(this,"element"),this.element){if(this.resetPosition(),this.computedTarget){const t=this.$props.appendTo?this.$props.appendTo:this.computedTarget.ownerDocument.body;this.element.parentElement!==t&&this.computedTarget.ownerDocument.body.append(this.element)}this.callout=this.calloutRef,this.callout&&(this.callout.className=this.calloutClassName(),"auto"===this.$props.position&&o.canUseDOM&&(this.left<window.screen.availWidth/2?this.callout.style.left=this.$props.setCalloutOnPositionAuto||"25%":this.callout.style.left=this.$props.setCalloutOnPositionAuto||"75%"))}},render(){const t=o.getDefaultSlots(this),i=this.getCurrentZIndex(),n=this.$props.content?o.templateRendering.call(this,this.$props.content,o.getListeners.call(this)):void 0,s=this.title;let l=o.guid()+u;this.computedTarget&&(this.computedTarget.hasAttribute("id")&&(l=this.computedTarget.getAttribute("id")+u),this.computedTarget.setAttribute("aria-describedby",l));const r=o.getTemplate.call(this,{h:e.h,template:n,defaultRendering:s,additionalProps:{title:this.title,target:this.computedTarget}}),a=this.computedOpen&&e.createVNode("div",{class:o.classNames("k-tooltip",this.$props.tooltipClassName),role:"tooltip",id:l,style:{position:"relative",...this.$props.tooltipStyle}},[e.createVNode("div",{class:"k-tooltip-content"},[r]),this.$props.showCallout&&e.createVNode("div",{ref:o.setRef(this,"callout")},null)]),p=this.computedTarget&&this.title&&this.computedTarget.ownerDocument&&e.createVNode("div",{ref:o.setRef(this,"element"),class:this.wrapperClass,style:{zIndex:i,...this.$props.wrapperStyle},tabindex:0,onMouseleave:this.handleTooltipMouseOut},[e.createVNode("div",{class:"k-child-animation-container"},[a])]);return t?e.createVNode("div",{onMouseover:this.handleMouseOver,onMouseout:this.handleMouseOut},[p,t]):p},methods:{destroyElement(){clearTimeout(this.openTimeoutId),clearInterval(this.updateIntervalId),document&&document.body.removeEventListener("mousemove",this.handleBodyMousemove),this.element&&this.element.remove()},handleTooltipMouseOut(t){this.onClose(t)},handleMouseOut(t){const e=this.computedTarget?this.computedTarget.ownerDocument:document;let o=e&&e.elementFromPoint(t.clientX,t.clientY);this.willOpen=!1,!a(o)&&this.computedTarget===t.target&&(this.$props.open||(clearInterval(this.updateIntervalId),this.onClose(t)))},handleMouseOver(t){const e=t.target;!this.isVisible(e)||a(e)||e===this.computedTarget||this.showToolTip(t)},handleBodyMousemove(t){this.top=t.clientY,this.left=t.clientX},onClose(t){this.$emit("close",{event:t,component:this}),this.computedTarget.removeAttribute("aria-describedby"),this.currentTargetElement=null,this.currentOpen=!1,this.title=""},showToolTip(t){clearTimeout(this.openTimeoutId),clearInterval(this.updateIntervalId),t.target.hasChildNodes()&&t.target.childNodes.forEach(e=>{"title"===e.nodeName&&(t.target.titleExpando=e.innerHTML,e.remove())});const e=this.computedTarget||t.target;let i=this.getTitle(e);i.title?(i.element&&(i.element.titleExpando=i.title,i.element.title=""),this.willOpen=!0,this.$props.openDelay?o.canUseDOM&&(this.openTimeoutId=window.setTimeout(()=>{this.willOpen&&(this.currentTargetElement=e,this.currentOpen=!0,this.title=i.title,this.setUpdateInterval())},this.$props.openDelay)):(this.currentTargetElement=e,this.currentOpen=!0,this.title=i.title,this.setUpdateInterval()),this.title!==i.title&&this.$emit("open",{event:t,compoponent:this})):this.computedOpen&&this.onClose(t)},setUpdateInterval(){this.$props.updateInterval&&(this.updateIntervalId=setInterval(this.onIntervalUpdate,this.$props.updateInterval))},onIntervalUpdate(){const t=this.computedTarget;t&&(null===t.parentElement?this.onClose({target:t}):this.showToolTip({target:t}))},resetPosition(){if(this.element){let t=this.setPosition(this.element);this.$props.updatePosition&&(t=this.$props.updatePosition({element:this.element,targetElement:this.computedTarget,mouseTop:this.top,mouseLeft:this.left,anchorElement:this.$props.anchorElement,position:this.$props.position,target:this,defaultPosition:t})),this.element.style.left=t.left+"px",this.element.style.top=t.top+"px"}},isVisible(t){return!this.$props.filter||this.$props.filter(t)},setPosition(t){let e=(t=>null!==t?t.getBoundingClientRect():document.body.getBoundingClientRect())(this.parentTitle?this.getTitle(this.computedTarget).element:this.computedTarget);return{left:s(this.left,t.offsetWidth,e,this.$props.anchorElement,this.$props.position),top:l(this.top,e,t.offsetHeight,this.$props.anchorElement,this.$props.position)}},getTitle(t){for(;t;){if(null!==t.getAttribute("title")||t.titleExpando)return{title:t.getAttribute("title")||t.titleExpando,element:t};t=this.$props.parentTitle&&t.parentElement||null}return{title:"",element:t}},calloutClassName(){switch(this.$props.position){case"bottom":return"k-callout k-callout-n";case"left":return"k-callout k-callout-e";case"right":return"k-callout k-callout-w";case"top":return"k-callout k-callout-s";default:return o.canUseDOM&&this.top<window.innerHeight/2?"k-callout k-callout-n":"k-callout k-callout-s"}},getCurrentZIndex(){return this.kCurrentZIndex?this.kCurrentZIndex:100}}});t.Tooltip=h});
package/events.d.ts ADDED
@@ -0,0 +1,41 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TooltipPosition } from './utils';
9
+ export interface TooltipEvent {
10
+ event: any;
11
+ }
12
+ export interface TooltipPositionEvent {
13
+ /**
14
+ * The Tooltip element. Useful to get the actual `width` and `height` of rendered Tooltip.
15
+ */
16
+ element: HTMLDivElement;
17
+ /**
18
+ * The current target element. Useful to calculate `top` and `left` position of the Tooltip element.
19
+ */
20
+ targetElement: HTMLElement | null;
21
+ /**
22
+ * The current mouse `top` position;
23
+ */
24
+ mouseTop: number;
25
+ /**
26
+ * The current mouse `left` position.
27
+ */
28
+ mouseLeft: number;
29
+ /**
30
+ * The Tooltip anchor element prop.
31
+ */
32
+ anchorElement?: string;
33
+ /**
34
+ * The Tooltip position prop.
35
+ */
36
+ position?: TooltipPosition;
37
+ /**
38
+ * The Tooltip default calculated position.
39
+ */
40
+ defaultPosition?: TooltipPosition;
41
+ }
package/index.d.mts CHANGED
@@ -5,302 +5,8 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- import { ComponentOptionsMixin } from 'vue';
9
- import { ComponentProvideOptions } from 'vue';
10
- import { DefineComponent } from 'vue';
11
- import { ExtractPropTypes } from 'vue';
12
- import { PropType } from 'vue';
13
- import { PublicProps } from 'vue';
14
- import { TooltipPosition as TooltipPosition_2 } from './utils';
15
- import { TooltipPositionEvent as TooltipPositionEvent_2 } from './events';
16
-
17
- /**
18
- * @hidden
19
- */
20
- export declare const Tooltip: DefineComponent<ExtractPropTypes< {
21
- showCallout: {
22
- type: PropType<boolean>;
23
- default: boolean;
24
- };
25
- setCalloutOnPositionAuto: {
26
- type: PropType<any>;
27
- default: any;
28
- };
29
- anchorElement: {
30
- type: PropType<string>;
31
- default: string;
32
- validator: (value: string) => any;
33
- };
34
- content: PropType<any>;
35
- filter: PropType<(target: HTMLElement) => void>;
36
- openDelay: {
37
- type: PropType<number>;
38
- default: number;
39
- };
40
- open: {
41
- type: PropType<boolean>;
42
- default: any;
43
- };
44
- position: {
45
- type: PropType<String | TooltipPosition_2>;
46
- default: string;
47
- validator: (value: string) => any;
48
- };
49
- updatePosition: {
50
- type: PropType<(event: TooltipPositionEvent_2) => {
51
- top: number;
52
- left: number;
53
- }>;
54
- default: any;
55
- };
56
- updateInterval: PropType<number>;
57
- className: PropType<string>;
58
- wrapperStyle: PropType<object>;
59
- tooltipClassName: PropType<string>;
60
- tooltipStyle: PropType<any>;
61
- targetElement: {
62
- type: PropType<any>;
63
- };
64
- parentTitle: {
65
- type: PropType<boolean>;
66
- default: boolean;
67
- };
68
- }>, {}, {
69
- top: number;
70
- left: number;
71
- currentTargetElement: any;
72
- currentOpen: boolean;
73
- title: string;
74
- }, {
75
- wrapperClass(): {
76
- [x: number]: boolean;
77
- 'k-animation-container': boolean;
78
- 'k-animation-container-fixed': boolean;
79
- 'k-animation-container-shown': boolean;
80
- };
81
- computedTarget(): any;
82
- computedOpen(): any;
83
- }, {
84
- destroyElement(): void;
85
- handleTooltipMouseOut(event: any): void;
86
- handleMouseOut(event: any): void;
87
- handleMouseOver(event: any): void;
88
- handleBodyMousemove(event: any): void;
89
- onClose(event: any): void;
90
- showToolTip(event: any): void;
91
- setUpdateInterval(): void;
92
- onIntervalUpdate(): void;
93
- resetPosition(): void;
94
- isVisible(element: any): any;
95
- setPosition(element: HTMLElement): {
96
- left: any;
97
- top: any;
98
- };
99
- getTitle(element: HTMLElement | null): {
100
- title: string;
101
- element: HTMLElement;
102
- };
103
- calloutClassName(): "k-callout k-callout-n" | "k-callout k-callout-e" | "k-callout k-callout-w" | "k-callout k-callout-s";
104
- getCurrentZIndex(): number;
105
- }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes< {
106
- showCallout: {
107
- type: PropType<boolean>;
108
- default: boolean;
109
- };
110
- setCalloutOnPositionAuto: {
111
- type: PropType<any>;
112
- default: any;
113
- };
114
- anchorElement: {
115
- type: PropType<string>;
116
- default: string;
117
- validator: (value: string) => any;
118
- };
119
- content: PropType<any>;
120
- filter: PropType<(target: HTMLElement) => void>;
121
- openDelay: {
122
- type: PropType<number>;
123
- default: number;
124
- };
125
- open: {
126
- type: PropType<boolean>;
127
- default: any;
128
- };
129
- position: {
130
- type: PropType<String | TooltipPosition_2>;
131
- default: string;
132
- validator: (value: string) => any;
133
- };
134
- updatePosition: {
135
- type: PropType<(event: TooltipPositionEvent_2) => {
136
- top: number;
137
- left: number;
138
- }>;
139
- default: any;
140
- };
141
- updateInterval: PropType<number>;
142
- className: PropType<string>;
143
- wrapperStyle: PropType<object>;
144
- tooltipClassName: PropType<string>;
145
- tooltipStyle: PropType<any>;
146
- targetElement: {
147
- type: PropType<any>;
148
- };
149
- parentTitle: {
150
- type: PropType<boolean>;
151
- default: boolean;
152
- };
153
- }>> & Readonly<{}>, {
154
- position: String | TooltipPosition_2;
155
- showCallout: boolean;
156
- setCalloutOnPositionAuto: any;
157
- anchorElement: string;
158
- openDelay: number;
159
- open: boolean;
160
- updatePosition: (event: TooltipPositionEvent_2) => {
161
- top: number;
162
- left: number;
163
- };
164
- parentTitle: boolean;
165
- }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
166
-
167
- export declare interface TooltipEvent {
168
- event: any;
169
- }
170
-
171
- /**
172
- * @hidden
173
- */
174
- export declare type TooltipPosition = 'right' | 'left' | 'bottom' | 'top' | 'auto';
175
-
176
- export declare interface TooltipPositionEvent {
177
- /**
178
- * The Tooltip element. Useful to get the actual `width` and `height` of rendered Tooltip.
179
- */
180
- element: HTMLDivElement;
181
- /**
182
- * The current target element. Useful to calculate `top` and `left` position of the Tooltip element.
183
- */
184
- targetElement: HTMLElement | null;
185
- /**
186
- * The current mouse `top` position;
187
- */
188
- mouseTop: number;
189
- /**
190
- * The current mouse `left` position.
191
- */
192
- mouseLeft: number;
193
- /**
194
- * The Tooltip anchor element prop.
195
- */
196
- anchorElement?: string;
197
- /**
198
- * The Tooltip position prop.
199
- */
200
- position?: TooltipPosition;
201
- /**
202
- * The Tooltip default calculated position.
203
- */
204
- defaultPosition?: TooltipPosition;
205
- }
206
-
207
- /**
208
- * Represents the props of the [Kendo UI for Vue Tooltip component]({% slug overview_tooltip %}).
209
- */
210
- export declare interface TooltipProps {
211
- /**
212
- * Sets the anchor element of the Tooltip.
213
- *
214
- * The available options are:
215
- * - (Default) `pointer`&mdash;Shows a Tooltip where the cursor is located.
216
- * - `target`&mdash;Positions the Tooltip based on the anchor element.
217
- */
218
- anchorElement?: string;
219
- /**
220
- * Defines the container to which the Tooltip will be appended. Defaults to [`body`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body).
221
- */
222
- appendTo?: HTMLElement | null;
223
- /**
224
- * Sets the position of the Tooltip ([see example]({% slug positioning_tooltip %})).
225
- *
226
- * The available options are:
227
- * - (Default) `auto`&mdash;Positions the Tooltip depending on the available space.
228
- * - `right`&mdash;Positions the Tooltip to the right side of the element.
229
- * - `left`&mdash;Positions the Tooltip to the left side of the element.
230
- * - `bottom`&mdash;Positions the Tooltip at the bottom of the element.
231
- * - `top`&mdash;Positions the Tooltip at the top of the element.
232
- */
233
- position?: TooltipPosition | String;
234
- /**
235
- * Sets a class of the Tooltip animation container.
236
- */
237
- className?: string;
238
- /**
239
- * Sets a class of the Tooltip animation container.
240
- */
241
- wrapperStyle?: object;
242
- /**
243
- * Sets the content of the Tooltip ([see example]({% slug templates_tooltip %})).
244
- */
245
- content?: any;
246
- /**
247
- * Specifies if the Tooltip will be open.
248
- * Sets the Tooltip in its controlled mode ([see example]({% slug controlledmode_tooltip %})).
249
- * Requires you to set the `targetElement` property.
250
- */
251
- open?: boolean;
252
- /**
253
- * Sets a delay in milliseconds.
254
- */
255
- openDelay?: number;
256
- /**
257
- * If any of the parent elements has a title, displays a Tooltip.
258
- */
259
- parentTitle?: boolean;
260
- /**
261
- * Specifies if the Tooltip callout will be displayed.
262
- */
263
- showCallout?: boolean;
264
- /**
265
- * When the position is set to `auto`, sets the start point of the Tooltip callout (in pixels).
266
- */
267
- setCalloutOnPositionAuto?: any;
268
- /**
269
- * Sets the Tooltip target element. You have to use it with the `open` property.
270
- */
271
- targetElement?: any;
272
- /**
273
- * Specifies the CSS class names which are set to the Tooltip DOM element.
274
- */
275
- tooltipClassName?: string;
276
- /**
277
- * Specifies the styles which are set to the Tooltip DOM element.
278
- */
279
- tooltipStyle?: any;
280
- /**
281
- * Callback called when the Tooltip calculates it's position. Useful to modify the default position behavior.
282
- * Require to return the `top` and `left` position of the Tooltip.
283
- */
284
- updatePosition?: (event: TooltipPositionEvent) => {
285
- top: number;
286
- left: number;
287
- };
288
- /**
289
- * Fires when the Tooltip is shown.
290
- */
291
- onOpen?: (event: TooltipEvent) => void;
292
- /**
293
- * Fires when the Tooltip is hidden.
294
- */
295
- onClose?: (event: TooltipEvent) => void;
296
- /**
297
- * Represents a callback function which determines if a Tooltip will be displayed ([see example]({% slug filter_elements_tooltip %})).
298
- */
299
- filter?: (target: HTMLElement) => void;
300
- /**
301
- * The milliseconds interval on which the Tooltip will check for title change. By default the Tooltip does not track for title updates.
302
- */
303
- updateInterval?: number;
304
- }
305
-
306
- export { }
8
+ import { Tooltip } from './Tooltip.js';
9
+ import { TooltipProps } from './TooltipProps.js';
10
+ import { TooltipEvent, TooltipPositionEvent } from './events.js';
11
+ import { TooltipPosition } from './utils.js';
12
+ export { Tooltip, type TooltipEvent, type TooltipPositionEvent, type TooltipProps, type TooltipPosition };
package/index.d.ts CHANGED
@@ -5,302 +5,8 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- import { ComponentOptionsMixin } from 'vue';
9
- import { ComponentProvideOptions } from 'vue';
10
- import { DefineComponent } from 'vue';
11
- import { ExtractPropTypes } from 'vue';
12
- import { PropType } from 'vue';
13
- import { PublicProps } from 'vue';
14
- import { TooltipPosition as TooltipPosition_2 } from './utils';
15
- import { TooltipPositionEvent as TooltipPositionEvent_2 } from './events';
16
-
17
- /**
18
- * @hidden
19
- */
20
- export declare const Tooltip: DefineComponent<ExtractPropTypes< {
21
- showCallout: {
22
- type: PropType<boolean>;
23
- default: boolean;
24
- };
25
- setCalloutOnPositionAuto: {
26
- type: PropType<any>;
27
- default: any;
28
- };
29
- anchorElement: {
30
- type: PropType<string>;
31
- default: string;
32
- validator: (value: string) => any;
33
- };
34
- content: PropType<any>;
35
- filter: PropType<(target: HTMLElement) => void>;
36
- openDelay: {
37
- type: PropType<number>;
38
- default: number;
39
- };
40
- open: {
41
- type: PropType<boolean>;
42
- default: any;
43
- };
44
- position: {
45
- type: PropType<String | TooltipPosition_2>;
46
- default: string;
47
- validator: (value: string) => any;
48
- };
49
- updatePosition: {
50
- type: PropType<(event: TooltipPositionEvent_2) => {
51
- top: number;
52
- left: number;
53
- }>;
54
- default: any;
55
- };
56
- updateInterval: PropType<number>;
57
- className: PropType<string>;
58
- wrapperStyle: PropType<object>;
59
- tooltipClassName: PropType<string>;
60
- tooltipStyle: PropType<any>;
61
- targetElement: {
62
- type: PropType<any>;
63
- };
64
- parentTitle: {
65
- type: PropType<boolean>;
66
- default: boolean;
67
- };
68
- }>, {}, {
69
- top: number;
70
- left: number;
71
- currentTargetElement: any;
72
- currentOpen: boolean;
73
- title: string;
74
- }, {
75
- wrapperClass(): {
76
- [x: number]: boolean;
77
- 'k-animation-container': boolean;
78
- 'k-animation-container-fixed': boolean;
79
- 'k-animation-container-shown': boolean;
80
- };
81
- computedTarget(): any;
82
- computedOpen(): any;
83
- }, {
84
- destroyElement(): void;
85
- handleTooltipMouseOut(event: any): void;
86
- handleMouseOut(event: any): void;
87
- handleMouseOver(event: any): void;
88
- handleBodyMousemove(event: any): void;
89
- onClose(event: any): void;
90
- showToolTip(event: any): void;
91
- setUpdateInterval(): void;
92
- onIntervalUpdate(): void;
93
- resetPosition(): void;
94
- isVisible(element: any): any;
95
- setPosition(element: HTMLElement): {
96
- left: any;
97
- top: any;
98
- };
99
- getTitle(element: HTMLElement | null): {
100
- title: string;
101
- element: HTMLElement;
102
- };
103
- calloutClassName(): "k-callout k-callout-n" | "k-callout k-callout-e" | "k-callout k-callout-w" | "k-callout k-callout-s";
104
- getCurrentZIndex(): number;
105
- }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes< {
106
- showCallout: {
107
- type: PropType<boolean>;
108
- default: boolean;
109
- };
110
- setCalloutOnPositionAuto: {
111
- type: PropType<any>;
112
- default: any;
113
- };
114
- anchorElement: {
115
- type: PropType<string>;
116
- default: string;
117
- validator: (value: string) => any;
118
- };
119
- content: PropType<any>;
120
- filter: PropType<(target: HTMLElement) => void>;
121
- openDelay: {
122
- type: PropType<number>;
123
- default: number;
124
- };
125
- open: {
126
- type: PropType<boolean>;
127
- default: any;
128
- };
129
- position: {
130
- type: PropType<String | TooltipPosition_2>;
131
- default: string;
132
- validator: (value: string) => any;
133
- };
134
- updatePosition: {
135
- type: PropType<(event: TooltipPositionEvent_2) => {
136
- top: number;
137
- left: number;
138
- }>;
139
- default: any;
140
- };
141
- updateInterval: PropType<number>;
142
- className: PropType<string>;
143
- wrapperStyle: PropType<object>;
144
- tooltipClassName: PropType<string>;
145
- tooltipStyle: PropType<any>;
146
- targetElement: {
147
- type: PropType<any>;
148
- };
149
- parentTitle: {
150
- type: PropType<boolean>;
151
- default: boolean;
152
- };
153
- }>> & Readonly<{}>, {
154
- position: String | TooltipPosition_2;
155
- showCallout: boolean;
156
- setCalloutOnPositionAuto: any;
157
- anchorElement: string;
158
- openDelay: number;
159
- open: boolean;
160
- updatePosition: (event: TooltipPositionEvent_2) => {
161
- top: number;
162
- left: number;
163
- };
164
- parentTitle: boolean;
165
- }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
166
-
167
- export declare interface TooltipEvent {
168
- event: any;
169
- }
170
-
171
- /**
172
- * @hidden
173
- */
174
- export declare type TooltipPosition = 'right' | 'left' | 'bottom' | 'top' | 'auto';
175
-
176
- export declare interface TooltipPositionEvent {
177
- /**
178
- * The Tooltip element. Useful to get the actual `width` and `height` of rendered Tooltip.
179
- */
180
- element: HTMLDivElement;
181
- /**
182
- * The current target element. Useful to calculate `top` and `left` position of the Tooltip element.
183
- */
184
- targetElement: HTMLElement | null;
185
- /**
186
- * The current mouse `top` position;
187
- */
188
- mouseTop: number;
189
- /**
190
- * The current mouse `left` position.
191
- */
192
- mouseLeft: number;
193
- /**
194
- * The Tooltip anchor element prop.
195
- */
196
- anchorElement?: string;
197
- /**
198
- * The Tooltip position prop.
199
- */
200
- position?: TooltipPosition;
201
- /**
202
- * The Tooltip default calculated position.
203
- */
204
- defaultPosition?: TooltipPosition;
205
- }
206
-
207
- /**
208
- * Represents the props of the [Kendo UI for Vue Tooltip component]({% slug overview_tooltip %}).
209
- */
210
- export declare interface TooltipProps {
211
- /**
212
- * Sets the anchor element of the Tooltip.
213
- *
214
- * The available options are:
215
- * - (Default) `pointer`&mdash;Shows a Tooltip where the cursor is located.
216
- * - `target`&mdash;Positions the Tooltip based on the anchor element.
217
- */
218
- anchorElement?: string;
219
- /**
220
- * Defines the container to which the Tooltip will be appended. Defaults to [`body`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body).
221
- */
222
- appendTo?: HTMLElement | null;
223
- /**
224
- * Sets the position of the Tooltip ([see example]({% slug positioning_tooltip %})).
225
- *
226
- * The available options are:
227
- * - (Default) `auto`&mdash;Positions the Tooltip depending on the available space.
228
- * - `right`&mdash;Positions the Tooltip to the right side of the element.
229
- * - `left`&mdash;Positions the Tooltip to the left side of the element.
230
- * - `bottom`&mdash;Positions the Tooltip at the bottom of the element.
231
- * - `top`&mdash;Positions the Tooltip at the top of the element.
232
- */
233
- position?: TooltipPosition | String;
234
- /**
235
- * Sets a class of the Tooltip animation container.
236
- */
237
- className?: string;
238
- /**
239
- * Sets a class of the Tooltip animation container.
240
- */
241
- wrapperStyle?: object;
242
- /**
243
- * Sets the content of the Tooltip ([see example]({% slug templates_tooltip %})).
244
- */
245
- content?: any;
246
- /**
247
- * Specifies if the Tooltip will be open.
248
- * Sets the Tooltip in its controlled mode ([see example]({% slug controlledmode_tooltip %})).
249
- * Requires you to set the `targetElement` property.
250
- */
251
- open?: boolean;
252
- /**
253
- * Sets a delay in milliseconds.
254
- */
255
- openDelay?: number;
256
- /**
257
- * If any of the parent elements has a title, displays a Tooltip.
258
- */
259
- parentTitle?: boolean;
260
- /**
261
- * Specifies if the Tooltip callout will be displayed.
262
- */
263
- showCallout?: boolean;
264
- /**
265
- * When the position is set to `auto`, sets the start point of the Tooltip callout (in pixels).
266
- */
267
- setCalloutOnPositionAuto?: any;
268
- /**
269
- * Sets the Tooltip target element. You have to use it with the `open` property.
270
- */
271
- targetElement?: any;
272
- /**
273
- * Specifies the CSS class names which are set to the Tooltip DOM element.
274
- */
275
- tooltipClassName?: string;
276
- /**
277
- * Specifies the styles which are set to the Tooltip DOM element.
278
- */
279
- tooltipStyle?: any;
280
- /**
281
- * Callback called when the Tooltip calculates it's position. Useful to modify the default position behavior.
282
- * Require to return the `top` and `left` position of the Tooltip.
283
- */
284
- updatePosition?: (event: TooltipPositionEvent) => {
285
- top: number;
286
- left: number;
287
- };
288
- /**
289
- * Fires when the Tooltip is shown.
290
- */
291
- onOpen?: (event: TooltipEvent) => void;
292
- /**
293
- * Fires when the Tooltip is hidden.
294
- */
295
- onClose?: (event: TooltipEvent) => void;
296
- /**
297
- * Represents a callback function which determines if a Tooltip will be displayed ([see example]({% slug filter_elements_tooltip %})).
298
- */
299
- filter?: (target: HTMLElement) => void;
300
- /**
301
- * The milliseconds interval on which the Tooltip will check for title change. By default the Tooltip does not track for title updates.
302
- */
303
- updateInterval?: number;
304
- }
305
-
306
- export { }
8
+ import { Tooltip } from './Tooltip';
9
+ import { TooltipProps } from './TooltipProps';
10
+ import { TooltipEvent, TooltipPositionEvent } from './events';
11
+ import { TooltipPosition } from './utils';
12
+ export { Tooltip, type TooltipEvent, type TooltipPositionEvent, type TooltipProps, type TooltipPosition };
package/package-metadata.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { PackageMetadata } from '@progress/kendo-licensing';
9
+ /**
10
+ * @hidden
11
+ */
12
+ export declare const packageMetadata: PackageMetadata;
package/package-metadata.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-tooltip",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1772733900,version:"8.0.3-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"};exports.packageMetadata=e;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-tooltip",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1773401771,version:"8.0.3-develop.3",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"};exports.packageMetadata=e;
package/package-metadata.mjs CHANGED
@@ -10,8 +10,8 @@ const e = {
10
10
  productName: "Kendo UI for Vue",
11
11
  productCode: "KENDOUIVUE",
12
12
  productCodes: ["KENDOUIVUE"],
13
- publishDate: 1772733900,
14
- version: "8.0.3-develop.1",
13
+ publishDate: 1773401771,
14
+ version: "8.0.3-develop.3",
15
15
  licensingDocsUrl: "https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"
16
16
  };
17
17
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-vue-tooltip",
3
- "version": "8.0.3-develop.1",
3
+ "version": "8.0.3-develop.3",
4
4
  "description": "TODO",
5
5
  "author": "Progress",
6
6
  "license": "SEE LICENSE IN LICENSE.md",
@@ -9,8 +9,14 @@
9
9
  "types": "./index.d.ts",
10
10
  "exports": {
11
11
  ".": {
12
- "import": "./index.mjs",
13
- "require": "./index.js"
12
+ "import": {
13
+ "types": "./index.d.mts",
14
+ "default": "./index.mjs"
15
+ },
16
+ "require": {
17
+ "types": "./index.d.ts",
18
+ "default": "./index.js"
19
+ }
14
20
  },
15
21
  "./package.json": {
16
22
  "default": "./package.json"
@@ -19,7 +25,7 @@
19
25
  "sideEffects": false,
20
26
  "peerDependencies": {
21
27
  "@progress/kendo-licensing": "^1.7.2",
22
- "@progress/kendo-vue-common": "8.0.3-develop.1",
28
+ "@progress/kendo-vue-common": "8.0.3-develop.3",
23
29
  "vue": "^3.0.2"
24
30
  },
25
31
  "dependencies": {},
@@ -39,7 +45,7 @@
39
45
  "package": {
40
46
  "productName": "Kendo UI for Vue",
41
47
  "productCode": "KENDOUIVUE",
42
- "publishDate": 1772733900,
48
+ "publishDate": 1773401771,
43
49
  "licensingDocsUrl": "https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"
44
50
  }
45
51
  },
package/utils.d.ts ADDED
@@ -0,0 +1,31 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ /**
9
+ * @hidden
10
+ */
11
+ export type TooltipPosition = 'right' | 'left' | 'bottom' | 'top' | 'auto';
12
+ /**
13
+ * @hidden
14
+ */
15
+ export declare const getLeftPosition: (left: any, elementWidth: any, targetElement: any, anchorElement: any, position: any) => any;
16
+ /**
17
+ * @hidden
18
+ */
19
+ export declare const getTopPosition: (top: any, targetElement: any, elementHeight: any, anchorElement: any, position: any) => any;
20
+ /**
21
+ * @hidden
22
+ */
23
+ export declare const getDomRect: (currentTarget: any) => any;
24
+ /**
25
+ * @hidden
26
+ */
27
+ export declare const toolTipSelectors: string[];
28
+ /**
29
+ * @hidden
30
+ */
31
+ export declare const isTooltipElement: (element: any) => boolean;