@progress/kendo-vue-tooltip 5.3.0-dev.202410141143 → 5.3.0-develop.2

package/package.json

@@ -1,61 +1,44 @@
 {
   "name": "@progress/kendo-vue-tooltip",
-  "version": "5.3.0-dev.202410141143",
-  "description": "Kendo UI for Vue Tooltip package",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/telerik/kendo-vue.git"
-  },
-  "main": "dist/npm/main.js",
-  "types": "dist/npm/main.d.ts",
-  "module": "dist/es/main.js",
-  "jsnext:main": "dist/es/main.js",
+  "version": "5.3.0-develop.2",
+  "description": "TODO",
+  "author": "Progress",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "homepage": "https://www.telerik.com/kendo-vue-ui",
+  "main": "./index.js",
+  "types": "./index.d.ts",
   "exports": {
-    "node": "./dist/esm/main.js",
-    "import": "./dist/es/main.js",
-    "require": "./dist/npm/main.js",
-    "default": "./dist/npm/main.js"
+    ".": {
+      "import": "./index.mjs",
+      "require": "./index.js"
+    }
   },
-  "scripts": {
-    "build-package": "gulp build-package",
-    "start": "gulp start --notsc",
-    "test": "cd ../../ && npm run test -- --testPathPattern=/packages/tooltip/.*",
-    "e2e": "cd ../../ && npx jest --maxWorkers=4 --config jest.config.e2e.js packages/tooltip"
+  "sideEffects": false,
+  "peerDependencies": {
+    "@progress/kendo-licensing": "^1.3.4",
+    "@progress/kendo-vue-common": "5.3.0-develop.2",
+    "vue": "^3.0.2"
   },
-  "homepage": "https://www.telerik.com/kendo-vue-ui/",
+  "dependencies": {},
   "keywords": [
     "Kendo UI",
     "Vue",
     "Progress",
     "Tooltip",
-    "Kendo UI for Vue",
-    "vuejs",
     "UI",
     "components",
     "Vue component",
     "Telerik"
   ],
-  "peerDependencies": {
-    "@progress/kendo-licensing": "^1.3.0",
-    "vue": "^2.6.12 || ^3.0.2"
-  },
-  "dependencies": {
-    "@progress/kendo-vue-common": "5.3.0-dev.202410141143"
-  },
-  "devDependencies": {
-    "@progress/kendo-licensing": "^1.3.0",
-    "@progress/kendo-vue-buttons": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-dialogs": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-grid": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-intl": "5.3.0-dev.202410141143"
-  },
   "@progress": {
     "friendlyName": "Tooltip",
     "framework": "Kendo UI for Vue"
   },
-  "author": "Progress",
-  "license": "SEE LICENSE IN LICENSE.md",
   "publishConfig": {
     "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/telerik/kendo-react.git"
   }
-}
+}

package/utils.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@progress/kendo-vue-common"),t=10,n=10,w=(i,o,s,r,u)=>{switch(u){case"bottom":return r==="pointer"?i-o/2:s.left-o/2+s.width/2;case"left":return r==="pointer"?i-o-t:s.left-o-t;case"right":return r==="pointer"?i+t:s.right+t;case"top":return r==="pointer"?i-o/2:s.left-o/2+s.width/2;default:return r==="pointer"?c.canUseDOM&&i<window.screen.availWidth/2?i-t:i-o+t:c.canUseDOM&&i<window.screen.availWidth/2?s.left:s.right-o}},d=(i,o,s,r,u)=>{switch(u){case"bottom":return r==="pointer"?i+n:o.bottom+n;case"left":return r==="pointer"?i-s/2:o.top-s/2+o.height/2;case"right":return r==="pointer"?i-s/2:o.top-s/2+o.height/2;case"top":return r==="pointer"?i-s-n:o.top-s-n;default:return r==="pointer"?c.canUseDOM&&i<window.innerHeight/2?i+t:i-s-t:c.canUseDOM&&i<window.innerHeight/2?o.bottom+n:o.top-s-n}},a=i=>i!==null?i.getBoundingClientRect():document.body.getBoundingClientRect(),p=["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"],f=i=>{if(i===null)return!1;let o=i;for(;o;){if(o!==null&&o.classList&&o.classList.contains("k-tooltip"))return!0;o.parentNode!==null?o=o.parentNode:o=!1}return p.filter(s=>s===i.className).length>0};exports.getDomRect=a;exports.getLeftPosition=w;exports.getTopPosition=d;exports.isTooltipElement=f;exports.toolTipSelectors=p;

package/utils.mjs

@@ -0,0 +1,52 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { canUseDOM as c } from "@progress/kendo-vue-common";
+const n = 10, u = 10, d = (i, o, r, s, t) => {
+  switch (t) {
+    case "bottom":
+      return s === "pointer" ? i - o / 2 : r.left - o / 2 + r.width / 2;
+    case "left":
+      return s === "pointer" ? i - o - n : r.left - o - n;
+    case "right":
+      return s === "pointer" ? i + n : r.right + n;
+    case "top":
+      return s === "pointer" ? i - o / 2 : r.left - o / 2 + r.width / 2;
+    default:
+      return s === "pointer" ? c && i < window.screen.availWidth / 2 ? i - n : i - o + n : c && i < window.screen.availWidth / 2 ? r.left : r.right - o;
+  }
+}, f = (i, o, r, s, t) => {
+  switch (t) {
+    case "bottom":
+      return s === "pointer" ? i + u : o.bottom + u;
+    case "left":
+      return s === "pointer" ? i - r / 2 : o.top - r / 2 + o.height / 2;
+    case "right":
+      return s === "pointer" ? i - r / 2 : o.top - r / 2 + o.height / 2;
+    case "top":
+      return s === "pointer" ? i - r - u : o.top - r - u;
+    default:
+      return s === "pointer" ? c && i < window.innerHeight / 2 ? i + n : i - r - n : c && i < window.innerHeight / 2 ? o.bottom + u : o.top - r - u;
+  }
+}, k = (i) => i !== null ? i.getBoundingClientRect() : document.body.getBoundingClientRect(), p = ["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 = (i) => {
+  if (i === null)
+    return !1;
+  let o = i;
+  for (; o; ) {
+    if (o !== null && o.classList && o.classList.contains("k-tooltip"))
+      return !0;
+    o.parentNode !== null ? o = o.parentNode : o = !1;
+  }
+  return p.filter((r) => r === i.className).length > 0;
+};
+export {
+  k as getDomRect,
+  d as getLeftPosition,
+  f as getTopPosition,
+  a as isTooltipElement,
+  p as toolTipSelectors
+};

package/dist/es/Tooltip.d.ts

@@ -1,52 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from './additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-import { TooltipProps } from './TooltipProps';
-/**
- * @hidden
- */
-interface TooltipData {
-    targetElement: HTMLElement | null;
-    open: boolean;
-    title: string;
-}
-/**
- * @hidden
- */
-export interface TooltipComputed {
-    [key: string]: any;
-    computedTarget: any;
-    computedOpen: any;
-}
-/**
- * @hidden
- */
-export interface TooltipMethods {
-    [key: string]: any;
-}
-/**
- * @hidden
- */
-export interface TooltipState {
-    top: number;
-    left: number;
-    openTimeoutId?: any;
-    updateIntervalId?: any;
-    willOpen: boolean;
-}
-/**
- * @hidden
- */
-export interface TooltipAll extends Vue2type, TooltipMethods, TooltipData, TooltipComputed, TooltipState {
-}
-/**
- * @hidden
- */
-declare let TooltipVue2: ComponentOptions<TooltipAll, DefaultData<TooltipData>, DefaultMethods<TooltipAll>, TooltipComputed, RecordPropsDefinition<TooltipProps>>;
-/**
- * @hidden
- */
-declare const Tooltip: DefineComponent<TooltipProps, any, TooltipData, TooltipComputed, TooltipMethods, {}, {}, {}, string, TooltipProps, TooltipProps, {}>;
-export { Tooltip, TooltipVue2 };

package/dist/es/Tooltip.js

@@ -1,420 +0,0 @@
-var __assign = this && this.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) {
-        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-import { classNames, validatePackage, getDefaultSlots, getListeners, templateRendering, getTemplate, setRef, getRef, canUseDOM, guid } from '@progress/kendo-vue-common';
-import { getLeftPosition, getTopPosition, getDomRect, isTooltipElement } from './utils';
-import { packageMetadata } from './package-metadata';
-var DEFAULT_TOOLTIP_ZINDEX = 100;
-var ARIAIDSUFFIX = '_tb_active';
-/**
- * @hidden
- */
-var TooltipVue2 = {
-  name: 'KendoTooltip',
-  inheritAttrs: false,
-  props: {
-    showCallout: {
-      type: Boolean,
-      default: true
-    },
-    setCalloutOnPositionAuto: {
-      type: String,
-      default: undefined
-    },
-    anchorElement: {
-      type: String,
-      default: 'pointer',
-      validator: function validator(value) {
-        return ['pointer', 'target'].includes(value);
-      }
-    },
-    content: [String, Object, Function],
-    filter: Function,
-    openDelay: {
-      type: Number,
-      default: 400
-    },
-    open: {
-      type: Boolean,
-      default: undefined
-    },
-    position: {
-      type: String,
-      default: 'auto',
-      validator: function validator(value) {
-        return ['right', 'left', 'top', 'bottom', 'auto'].includes(value);
-      }
-    },
-    updatePosition: {
-      type: Function,
-      default: undefined
-    },
-    updateInterval: Number,
-    className: String,
-    wrapperStyle: Object,
-    tooltipClassName: String,
-    tooltipStyle: Object,
-    targetElement: {
-      type: undefined
-    },
-    parentTitle: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data: function data() {
-    return {
-      top: 0,
-      left: 0,
-      currentTargetElement: null,
-      currentOpen: false,
-      title: ''
-    };
-  },
-  computed: {
-    wrapperClass: function wrapperClass() {
-      var _a;
-      return _a = {
-        'k-animation-container': true,
-        'k-animation-container-fixed': true,
-        'k-animation-container-shown': true
-      }, _a[this.$props.className] = true, _a;
-    },
-    computedTarget: function computedTarget() {
-      return this.targetElement !== undefined ? this.targetElement : this.currentTargetElement;
-    },
-    computedOpen: function computedOpen() {
-      return this.open !== undefined ? this.open : this.currentOpen;
-    }
-  },
-  inject: {
-    kCurrentZIndex: {
-      default: null
-    }
-  },
-  created: function created() {
-    validatePackage(packageMetadata);
-    this.top = 0;
-    this.left = 0;
-    this.willOpen = false;
-  },
-  mounted: function mounted() {
-    this.element = getRef(this, 'element');
-    if (document) {
-      document.body.addEventListener('mousemove', this.handleBodyMousemove);
-    }
-  },
-  destroyed: !!isV3 ? undefined : function () {
-    this.destroyElement();
-  },
-  // @ts-ignore
-  unmounted: function unmounted() {
-    this.destroyElement();
-  },
-  updated: function updated() {
-    if (this.$props.open && this.$props.targetElement) {
-      this.showToolTip({
-        target: this.$props.targetElement
-      });
-    }
-    this.element = getRef(this, 'element');
-    if (!this.element) {
-      return;
-    }
-    this.resetPosition();
-    if (this.computedTarget) {
-      var appendToElement = this.$props.appendTo ? this.$props.appendTo : this.computedTarget.ownerDocument.body;
-      if (this.element.parentElement !== appendToElement) {
-        this.computedTarget.ownerDocument.body.append(this.element);
-      }
-    }
-    this.callout = this.v3 ? this.calloutRef : this.$refs.callout;
-    if (!this.callout) {
-      return;
-    }
-    this.callout.className = this.calloutClassName();
-    if (this.$props.position === 'auto' && canUseDOM) {
-      this.left < window.screen.availWidth / 2 ? this.callout.style.left = this.$props.setCalloutOnPositionAuto || '25%' : this.callout.style.left = this.$props.setCalloutOnPositionAuto || '75%';
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    return {
-      v3: v3
-    };
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var defaultSlot = getDefaultSlots(this);
-    var currentZIndex = this.getCurrentZIndex();
-    var content = this.$props.content ? templateRendering.call(this, this.$props.content, getListeners.call(this)) : undefined;
-    var contentDefaultRendering = this.title;
-    var ariaId = guid() + ARIAIDSUFFIX;
-    if (this.computedTarget) {
-      if (this.computedTarget.hasAttribute('id')) {
-        ariaId = this.computedTarget.getAttribute('id') + ARIAIDSUFFIX;
-      }
-      this.computedTarget.setAttribute('aria-describedby', ariaId);
-    }
-    var contentRendering = getTemplate.call(this, {
-      h: h,
-      template: content,
-      defaultRendering: contentDefaultRendering,
-      additionalProps: {
-        title: this.title,
-        target: this.computedTarget
-      }
-    });
-    var innerToolTip = this.computedOpen && h("div", {
-      "class": classNames('k-tooltip', this.$props.tooltipClassName),
-      role: 'tooltip',
-      attrs: this.v3 ? undefined : {
-        role: 'tooltip',
-        id: ariaId
-      },
-      id: ariaId,
-      style: __assign({
-        position: 'relative'
-      }, this.$props.tooltipStyle)
-    }, [h("div", {
-      "class": "k-tooltip-content"
-    }, [contentRendering]), this.$props.showCallout && h("div", {
-      ref: setRef(this, 'callout')
-    })]);
-    var tooltip = this.computedTarget && this.title && this.computedTarget.ownerDocument && h("div", {
-      ref: setRef(this, 'element'),
-      "class": this.wrapperClass,
-      style: __assign({
-        zIndex: currentZIndex
-      }, this.$props.wrapperStyle),
-      tabindex: 0,
-      attrs: this.v3 ? undefined : {
-        tabindex: 0
-      },
-      onMouseleave: this.handleTooltipMouseOut,
-      on: this.v3 ? undefined : {
-        "mouseleave": this.handleTooltipMouseOut
-      }
-    }, [h("div", {
-      "class": "k-child-animation-container"
-    }, [innerToolTip])]);
-    if (defaultSlot) {
-      return h("div", {
-        onMouseover: this.handleMouseOver,
-        on: this.v3 ? undefined : {
-          "mouseover": this.handleMouseOver,
-          "mouseout": this.handleMouseOut
-        },
-        onMouseout: this.handleMouseOut
-      }, [tooltip, defaultSlot]);
-    } else {
-      return tooltip;
-    }
-  },
-  methods: {
-    destroyElement: function destroyElement() {
-      clearTimeout(this.openTimeoutId);
-      clearInterval(this.updateIntervalId);
-      if (document) {
-        document.body.removeEventListener('mousemove', this.handleBodyMousemove);
-      }
-      if (this.element) {
-        this.element.remove();
-      }
-    },
-    handleTooltipMouseOut: function handleTooltipMouseOut(event) {
-      this.onClose(event);
-    },
-    handleMouseOut: function handleMouseOut(event) {
-      var currentDocument = this.computedTarget ? this.computedTarget.ownerDocument : document;
-      var element = currentDocument && currentDocument.elementFromPoint(event.clientX, event.clientY);
-      this.willOpen = false;
-      if (isTooltipElement(element) || this.computedTarget !== event.target) {
-        return;
-      }
-      if (this.$props.open) {
-        return;
-      }
-      clearInterval(this.updateIntervalId);
-      this.onClose(event);
-    },
-    handleMouseOver: function handleMouseOver(event) {
-      var target = event.target;
-      if (!this.isVisible(target) || isTooltipElement(target) || target === this.computedTarget) {
-        return;
-      }
-      this.showToolTip(event);
-    },
-    handleBodyMousemove: function handleBodyMousemove(event) {
-      this.top = event.clientY;
-      this.left = event.clientX;
-    },
-    onClose: function onClose(event) {
-      this.$emit('close', {
-        event: event,
-        component: this
-      });
-      this.computedTarget.removeAttribute('aria-describedby');
-      this.currentTargetElement = null;
-      this.currentOpen = false;
-      this.title = '';
-    },
-    showToolTip: function showToolTip(event) {
-      var _this = this;
-      clearTimeout(this.openTimeoutId);
-      clearInterval(this.updateIntervalId);
-      if (event.target.hasChildNodes()) {
-        event.target.childNodes.forEach(function (childElement) {
-          if (childElement.nodeName === 'title') {
-            event.target.titleExpando = childElement.innerHTML;
-            childElement.remove();
-          }
-        });
-      }
-      var target = this.computedTarget || event.target;
-      var titleResult = this.getTitle(target);
-      if (!titleResult.title) {
-        if (this.computedOpen) {
-          this.onClose(event);
-        }
-        return;
-      }
-      if (titleResult.element) {
-        titleResult.element.titleExpando = titleResult.title;
-        titleResult.element.title = '';
-      }
-      this.willOpen = true;
-      if (!this.$props.openDelay) {
-        this.currentTargetElement = target;
-        this.currentOpen = true;
-        this.title = titleResult.title;
-        this.setUpdateInterval();
-      } else {
-        if (canUseDOM) {
-          this.openTimeoutId = window.setTimeout(function () {
-            if (_this.willOpen) {
-              _this.currentTargetElement = target;
-              _this.currentOpen = true;
-              _this.title = titleResult.title;
-              _this.setUpdateInterval();
-            }
-          }, this.$props.openDelay);
-        }
-      }
-      if (this.title !== titleResult.title) {
-        this.$emit('open', {
-          event: event,
-          compoponent: this
-        });
-      }
-    },
-    setUpdateInterval: function setUpdateInterval() {
-      if (this.$props.updateInterval) {
-        this.updateIntervalId = setInterval(this.onIntervalUpdate, this.$props.updateInterval);
-      }
-    },
-    onIntervalUpdate: function onIntervalUpdate() {
-      var target = this.computedTarget;
-      if (!target) {
-        return;
-      }
-      if (target.parentElement === null) {
-        // Getting element from previous target coordinates will cause reflow which is performance hit.
-        // Also remount case can be avoided easily
-        this.onClose({
-          target: target
-        });
-      } else {
-        this.showToolTip({
-          target: target
-        });
-      }
-    },
-    resetPosition: function resetPosition() {
-      if (this.element) {
-        var position = this.setPosition(this.element);
-        if (this.$props.updatePosition) {
-          position = 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: position
-          });
-        }
-        this.element.style.left = position.left + 'px';
-        this.element.style.top = position.top + 'px';
-      }
-    },
-    isVisible: function isVisible(element) {
-      return !this.$props.filter || this.$props.filter(element);
-    },
-    setPosition: function setPosition(element) {
-      var target = this.parentTitle ? this.getTitle(this.computedTarget).element : this.computedTarget;
-      var domRect = getDomRect(target);
-      var left = getLeftPosition(this.left, element.offsetWidth, domRect, this.$props.anchorElement, this.$props.position);
-      var top = getTopPosition(this.top, domRect, element.offsetHeight, this.$props.anchorElement, this.$props.position);
-      return {
-        left: left,
-        top: top
-      };
-    },
-    getTitle: function getTitle(element) {
-      while (element) {
-        if (element.getAttribute('title') !== null || element.titleExpando) {
-          var title = element.getAttribute('title') || element.titleExpando;
-          return {
-            title: title,
-            element: element
-          };
-        }
-        element = this.$props.parentTitle && element.parentElement || null;
-      }
-      return {
-        title: '',
-        element: element
-      };
-    },
-    calloutClassName: function 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 canUseDOM && this.top < window.innerHeight / 2 ? 'k-callout k-callout-n' : 'k-callout k-callout-s';
-      }
-    },
-    getCurrentZIndex: function getCurrentZIndex() {
-      return this.kCurrentZIndex ? this.kCurrentZIndex : DEFAULT_TOOLTIP_ZINDEX;
-    }
-  }
-};
-/**
- * @hidden
- */
-var Tooltip = TooltipVue2;
-export { Tooltip, TooltipVue2 };