@progress/kendo-vue-popup 10.2.0-develop.10 → 10.2.0-develop.12

package/Popup.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("vue"),b=require("@progress/kendo-popup-common"),m=require("./util.js"),C=require("./services/alignService.js"),E=require("./services/domService.js"),P=require("./services/positionService.js"),v=require("@progress/kendo-vue-common"),T=require("./package-metadata.js"),D=100,S=1,w={left:-1e3,top:0},$="k-animation-container-shown",O="k-popup",k={margin:"0"},M=f.defineComponent({name:"Popup",emits:["open","close","position","keydown","mousedownoutside"],props:{appendTo:{type:[String,Object],default:""},anchor:{type:[String,Object],default:""},className:[String,Array,Object],id:String,popupClass:[String,Array,Object],collision:{type:Object,default:function(){return{horizontal:m.CollisionType.fit,vertical:m.CollisionType.flip}}},anchorAlign:{type:Object,default:function(){return{horizontal:m.AlignPoint.left,vertical:m.AlignPoint.bottom}}},popupAlign:{type:Object,default:function(){return{horizontal:m.AlignPoint.left,vertical:m.AlignPoint.top}}},offset:{type:Object,default:function(){return w}},show:{type:Boolean,default:!1},animate:{type:[Boolean,Object],default:!0},direction:{type:String,default:"down"},margin:Object,positionMode:String,scale:Number,role:String,ariaLabelledBy:String,ariaDescribedBy:String,onOpen:Function,onClose:Function,onPosition:Function,onMousedownoutside:Function},inject:{kCurrentZIndex:{default:null}},data(){return{hasMounted:!1,animationOpen:!1}},watch:{anchor(e){!this.hasMounted||!v.canUseDOM||(this.mountedAnchor=e?this.getParentRef(e,!0):document.body,this.reposition())},appendTo(e){!this.hasMounted||!v.canUseDOM||(this.mountedAppendTo=e?this.getParentRef(e):document.body,this.$el.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(this.$el),this.reposition())},show(e,i){if(i&&!e)if(this._cancelPendingAnimations(),this._opened&&(this._opened=!1,this.onClosing()),this.transitionDuration().exit===0)this.onClosed();else{this._exitingAnimation=!0;const n=this._animationGeneration;this.$nextTick(()=>{if(n!==this._animationGeneration)return;const o=this.$el;if(!o||!this._exitingAnimation){this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed();return}const r=o.firstChild;r?this.animateElement(r,"exit",()=>{n===this._animationGeneration&&(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())}):(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())})}else!i&&e&&(this._cancelPendingAnimations(),this._exitingAnimation=!1)}},created(){v.validatePackage(T.packageMetadata),this.mountedAppendTo=void 0,this.mountedAnchor=void 0,this._clonedElement=void 0,this._flipped=!1,this._offsetTop=0,this._offsetLeft=-1e3,this._opened=!1,this._exitingAnimation=!1,this._animationGeneration=0,this._enterTimerId=null,this._cancelAnimation=null,this._resizeObserver=void 0,this._domService=new E.DOMService,this._alignService=new C.AlignService(this._domService),this._positionService=new P.PositionService(this._domService),this.reposition=m.throttle(this.reposition.bind(this),m.FRAME_DURATION)},mounted(){v.canUseDOM&&(this.mountedAppendTo=this.appendTo?this.getParentRef(this.appendTo):document.body,this.mountedAnchor=this.anchor?this.getParentRef(this.anchor,!0):document.body),this._parentElement=this.$el.parentElement,this._clonedElement=this.$el.cloneNode(!0),this.hasMounted=!0,this.mountedAppendTo.appendChild(this.$el),this.$forceUpdate()},updated(){if(this.hasMounted&&this.mountedAppendTo){const e=this.$el;(e==null?void 0:e.nodeType)===1&&e.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(e)}},unmounted(){this.detachRepositionHandlers(),this.detachResizeObserver(),typeof window!="undefined"&&window.removeEventListener("mousedown",this.handleMouseDown)},beforeUnmount(){this._parentElement&&this._parentElement.appendChild(this.$el)},methods:{handleMouseDown(e){var n,o;const i=((n=e==null?void 0:e.target)==null?void 0:n.closest(".k-animation-container"))===null,t=((o=this.mountedAnchor)==null?void 0:o.contains(e==null?void 0:e.target))||!1;if(i){const r={target:this,event:e,isAnchorClicked:t};this.$emit("mousedownoutside",r),typeof window!="undefined"&&window.removeEventListener("mousedown",this.handleMouseDown)}},onOpened(){var t,n;const e=this.$el;typeof window!="undefined"&&window.addEventListener("mousedown",this.handleMouseDown),this.$props.show&&(e.classList.add($),this.animationOpen=!0),this.attachRepositionHandlers(e),this.attachResizeObserver(e);const i={target:this};(n=(t=this.$props).onOpen)==null||n.call(t,i),this.$emit("open",i)},onClosing(){this.$props.show||(this.$el.classList.remove($),this.animationOpen=!1),this.detachRepositionHandlers(),this.detachResizeObserver(),typeof window!="undefined"&&window.removeEventListener("mousedown",this.handleMouseDown)},onClosed(){var i,t;const e={target:this};(t=(i=this.$props).onClose)==null||t.call(i,e),this.$emit("close",e)},transitionDuration(){const e=this.$props.animate;let i=0,t=0;return e&&(e===!0?i=t=300:(i=e.openDuration||0,t=e.closeDuration||0)),{enter:i,exit:t}},_cancelPendingAnimations(){this._animationGeneration++,this._enterTimerId!==null&&(clearTimeout(this._enterTimerId),this._enterTimerId=null),this._cancelAnimation&&(this._cancelAnimation(),this._cancelAnimation=null)},animateElement(e,i,t){const n=this.transitionDuration()[i];if(n===0)return t();const o=e.ownerDocument,r=o==null?void 0:o.defaultView;if(!r)return t();const d=this.$props.direction==="down",h=this._flipped?"up":"down",u=this._flipped?"down":"up",c=d?h:u,p=`k-slide-${c}-${i}`,s=`k-slide-${c}-${i}-active`;let a=!1,l=null;const g=()=>{e.removeEventListener("transitionend",A),l&&(clearTimeout(l),l=null),e.style.transitionDuration="",e.classList.remove(p,s)},_=()=>{a||(a=!0,g(),i==="exit"?e.style.display="none":e.style.display="",this._cancelAnimation=null,t())},A=y=>{y.target===e&&_()};e.addEventListener("transitionend",A),l=setTimeout(_,n+50),e.style.transitionDuration="",e.classList.remove(p,s),i==="enter"&&(e.style.display=""),e.classList.add(p),r.requestAnimationFrame(()=>{a||(e.style.transitionDuration=n+"ms",e.classList.add(s))}),this._cancelAnimation=()=>{a||(a=!0,g(),e.style.display="")}},isAnimationInstant(e){if(this.transitionDuration()[e]===0)return!0;if(typeof window!="undefined"&&this.$el){const t=this.$el.firstChild;if(t){const n=window.getComputedStyle(t),o=parseFloat(n.transitionDuration||"0"),r=parseFloat(n.animationDuration||"0");if(o===0&&r===0)return!0}}return!1},getParentRef(e,i){if(e instanceof HTMLElement)return e;if(!e)return document.body;let t=this.$parent;for(;t&&!t.$refs[e];){if(t&&t.kendoAnchorRef&&i)return t.kendoAnchorRef;if(t=t.$parent,!t&&v.canUseDOM)return document.getElementById(e)||document.body}return t.$refs[e].$el||t.$refs[e]},position(e,i,t,n){var a,l,g,_;const{anchorAlign:o,popupAlign:r,collision:d,offset:h}=e,u=n||1,c=t?this.mountedAnchor:document.body;if(u===1){const A=this._alignService.alignElement({anchor:t?c:void 0,element:i,elementAlign:r,anchorAlign:o,offset:h}),y=this._positionService.positionElement({anchor:c,anchorAlign:o,collisions:d,element:i,currentLocation:A,elementAlign:r});return this.applyMargin(y,e)}const p=b.alignElement({anchor:t?c:void 0,element:i,elementAlign:r,anchorAlign:o,offset:h,margin:{horizontal:((a=e.margin)==null?void 0:a.horizontal)||0,vertical:((l=e.margin)==null?void 0:l.vertical)||0},positionMode:e.positionMode,scale:u});return b.positionElement({anchor:c,anchorAlign:o,collisions:d,element:i,currentLocation:p,elementAlign:r,margin:{horizontal:((g=e.margin)==null?void 0:g.horizontal)||0,vertical:((_=e.margin)==null?void 0:_.vertical)||0},scale:u})},applyMargin(e,i){var h,u,c,p,s,a,l,g;const t=i.margin;if(!t||!e.offset)return e;const n={...e.offset},o=t.horizontal||0,r=t.vertical||0,d=e.flipped?-1:1;return((h=i.anchorAlign)==null?void 0:h.horizontal)==="left"&&((u=i.popupAlign)==null?void 0:u.horizontal)==="right"?n.left-=o*d:((c=i.anchorAlign)==null?void 0:c.horizontal)==="right"&&((p=i.popupAlign)==null?void 0:p.horizontal)==="left"&&(n.left+=o*d),((s=i.anchorAlign)==null?void 0:s.vertical)==="top"&&((a=i.popupAlign)==null?void 0:a.vertical)==="bottom"?n.top-=r*d:((l=i.anchorAlign)==null?void 0:l.vertical)==="bottom"&&((g=i.popupAlign)==null?void 0:g.vertical)==="top"&&(n.top+=r*d),{...e,offset:n}},calculatePosition(e,i){if(!i||!m.isWindowAvailable()||!v.canUseDOM)return{flipped:!1,offset:e.offset};const t=v.getDefaultSlots(this),n=document.createElement("div"),o=this.$el&&this.$el.firstChild&&this.$el.firstChild.firstChild?this.$el.firstChild.firstChild.cloneNode(!0):null,r=o&&o.getBoundingClientRect?o:this._clonedElement;if(r)n.appendChild(r);else{const s=t&&t[0].props?t[0].props.class:"";f.render(f.h("div",{class:"k-animation-container k-animation-container-relative"},f.h("div",{class:"k-popup k-animation-container k-animation-container-relative"},f.h("div",{class:[s,this.$props.popupClass]}))),n)}if(i.appendChild(n),n&&n.firstChild){const s=n.firstChild;s.style.position="absolute",s.style.visibility="hidden",s.style.display="block",s.style.left="-1000",s.style.top="0";const a=t&&t[0].props?t[0].props.style:{};if(a)for(const[l,g]of Object.entries(a))s.style[l]=g}const d=n.firstChild,h=parseFloat(window.getComputedStyle(d).width),u=h>0?d.getBoundingClientRect().width/h:1,c=(this.$props.scale||1)*u,p=this.position(e,d,this.$props.anchor,c);return f.render(null,n),n.parentNode.removeChild(n),p},attachRepositionHandlers(e){this.detachRepositionHandlers(),this._scrollableParents=this._domService.scrollableParents(this.$props.anchor?this.mountedAnchor:e),this._scrollableParents.map(i=>i.addEventListener("scroll",this.reposition)),m.isWindowAvailable()&&window.addEventListener("resize",this.reposition)},detachRepositionHandlers(){this._scrollableParents&&(this._scrollableParents.map(e=>e.removeEventListener("scroll",this.reposition)),this._scrollableParents=void 0),m.isWindowAvailable()&&window.removeEventListener("resize",this.reposition)},attachResizeObserver(e){this.detachResizeObserver(),typeof ResizeObserver!="undefined"&&(this._resizeObserver=new ResizeObserver(()=>this.reposition()),this._resizeObserver.observe(e))},detachResizeObserver(){var e;(e=this._resizeObserver)==null||e.disconnect(),this._resizeObserver=void 0},reposition(){this._clonedElement=this.$el.cloneNode(!0),this.$forceUpdate()},getCurrentZIndex(){return this.kCurrentZIndex?this.kCurrentZIndex+S:D},hasCustomOffset(e){return e?e.left!==w.left||e.top!==w.top:!1}},render(){var c,p;const{className:e,popupClass:i,show:t,id:n}=this.$props,o=v.getDefaultSlots(this),r=o,d=this.hasCustomOffset(this.$props.offset)?k:void 0,h=m.isWindowAvailable()?this.$props.appendTo?this.mountedAppendTo||this.getParentRef(this.$props.appendTo):document.body:void 0;if(this.$props.show){const s=this.calculatePosition(this.$props,h);this._offsetLeft=s.offset.left,this._offsetTop=s.offset.top,this._flipped=!!s.flipped;const a={target:this,fitted:!!s.fitted,flipped:!!s.flipped};(p=(c=this.$props).onPosition)==null||p.call(c,a),this.$emit("position",a)}const u=this.getCurrentZIndex();if(!this.hasMounted)return f.createVNode("div",{id:n,style:{display:"none",...this.$props.style},class:e},[f.createVNode("div",{class:[i,O],style:d},[o])]);if((t||this._exitingAnimation)&&h){const s={zIndex:u,position:this.$props.positionMode||"absolute",top:this._offsetTop+"px",left:this._offsetLeft+"px",pointerEvents:t?"auto":"none",...this.$props.style};if(t&&!this._opened){this._opened=!0;const l=this._animationGeneration;this.transitionDuration().enter===0?this._enterTimerId=setTimeout(()=>{this._enterTimerId=null,l===this._animationGeneration&&(!this.$props.show||!this._opened||this.onOpened())},0):this.$nextTick(()=>{if(l!==this._animationGeneration||!this.$props.show||!this._opened)return;const _=this.$el;if(!_)return;const A=_.firstChild;A?this.animateElement(A,"enter",()=>{l===this._animationGeneration&&this.$props.show&&this.onOpened()}):this.onOpened()})}const a=this.animationOpen?$:"";return f.createVNode("div",{id:n,class:["k-animation-container",a,e],style:s,onKeydown:l=>{this.$emit("keydown",l)}},[f.createVNode("div",{class:["k-child-animation-container"],style:{transitionDelay:"0ms",display:"block"}},[f.createVNode("div",{role:this.$props.role,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,class:[i,O]},[r])])])}return f.createVNode("div",{id:n,style:{display:"none"},class:e},null)}});exports.Popup=M;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("vue"),P=require("@progress/kendo-popup-common"),_=require("./util.js"),T=require("./services/alignService.js"),D=require("./services/domService.js"),z=require("./services/positionService.js"),y=require("@progress/kendo-vue-common"),M=require("./package-metadata.js"),k=100,x=1,C={left:-1e3,top:0},E="k-animation-container-shown",$="k-popup",R={margin:"0"},L=m.defineComponent({name:"Popup",emits:["open","close","position","keydown","mousedownoutside"],props:{appendTo:{type:[String,Object],default:""},anchor:{type:[String,Object],default:""},className:[String,Array,Object],id:String,popupClass:[String,Array,Object],collision:{type:Object,default:function(){return{horizontal:_.CollisionType.fit,vertical:_.CollisionType.flip}}},anchorAlign:{type:Object,default:function(){return{horizontal:_.AlignPoint.left,vertical:_.AlignPoint.bottom}}},popupAlign:{type:Object,default:function(){return{horizontal:_.AlignPoint.left,vertical:_.AlignPoint.top}}},offset:{type:Object,default:function(){return C}},show:{type:Boolean,default:!1},animate:{type:[Boolean,Object],default:!0},direction:{type:String,default:"down"},margin:Object,positionMode:String,scale:Number,role:String,ariaLabelledBy:String,ariaDescribedBy:String,onOpen:Function,onClose:Function,onPosition:Function,onMousedownoutside:Function},inject:{kCurrentZIndex:{default:null}},data(){return{hasMounted:!1,animationOpen:!1}},watch:{anchor(e){!this.hasMounted||!y.canUseDOM||(this.mountedAnchor=e?this.getParentRef(e,!0):document.body,this.reposition())},appendTo(e){!this.hasMounted||!y.canUseDOM||(this.mountedAppendTo=e?this.getParentRef(e):document.body,this.$el.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(this.$el),this.reposition())},show(e,i){if(i&&!e)if(this._cancelPendingAnimations(),this._opened&&(this._opened=!1,this.onClosing()),this.transitionDuration().exit===0)this.onClosed();else{this._exitingAnimation=!0;const n=this._animationGeneration;this.$nextTick(()=>{if(n!==this._animationGeneration)return;const o=this.$el;if(!o||!this._exitingAnimation){this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed();return}const r=o.firstChild;r?this.animateElement(r,"exit",()=>{n===this._animationGeneration&&(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())}):(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())})}else!i&&e&&(this._cancelPendingAnimations(),this._exitingAnimation=!1)}},created(){y.validatePackage(M.packageMetadata),this.mountedAppendTo=void 0,this.mountedAnchor=void 0,this._clonedElement=void 0,this._originalNextSibling=void 0,this._flipped=!1,this._offsetTop=0,this._offsetLeft=-1e3,this._opened=!1,this._exitingAnimation=!1,this._animationGeneration=0,this._enterTimerId=null,this._cancelAnimation=null,this._resizeObserver=void 0,this._domService=new D.DOMService,this._alignService=new T.AlignService(this._domService),this._positionService=new z.PositionService(this._domService),this.reposition=_.throttle(this.reposition.bind(this),_.FRAME_DURATION)},mounted(){y.canUseDOM&&(this.mountedAppendTo=this.appendTo?this.getParentRef(this.appendTo):document.body,this.mountedAnchor=this.anchor?this.getParentRef(this.anchor,!0):document.body),this._parentElement=this.$el.parentElement,this._originalNextSibling=this.$el.nextSibling,this._clonedElement=this.$el.cloneNode(!0),this.hasMounted=!0,this.mountedAppendTo.appendChild(this.$el),this.$forceUpdate()},updated(){if(this.hasMounted&&this.mountedAppendTo){const e=this.$el;(e==null?void 0:e.nodeType)===1&&e.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(e)}},unmounted(){this.detachRepositionHandlers(),this.detachResizeObserver(),typeof window!="undefined"&&window.removeEventListener("mousedown",this.handleMouseDown)},beforeUnmount(){if(this.hasMounted=!1,this._parentElement){const e=this._originalNextSibling;this._parentElement.insertBefore(this.$el,(e==null?void 0:e.parentNode)===this._parentElement?e:null)}},methods:{handleMouseDown(e){var n,o;const i=((n=e==null?void 0:e.target)==null?void 0:n.closest(".k-animation-container"))===null,t=((o=this.mountedAnchor)==null?void 0:o.contains(e==null?void 0:e.target))||!1;if(i){const r={target:this,event:e,isAnchorClicked:t};this.$emit("mousedownoutside",r),typeof window!="undefined"&&window.removeEventListener("mousedown",this.handleMouseDown)}},onOpened(){var t,n;const e=this.$el;typeof window!="undefined"&&window.addEventListener("mousedown",this.handleMouseDown),this.$props.show&&(e.classList.add(E),this.animationOpen=!0),this.attachRepositionHandlers(e),this.attachResizeObserver(e);const i={target:this};(n=(t=this.$props).onOpen)==null||n.call(t,i),this.$emit("open",i)},onClosing(){this.$props.show||(this.$el.classList.remove(E),this.animationOpen=!1),this.detachRepositionHandlers(),this.detachResizeObserver(),typeof window!="undefined"&&window.removeEventListener("mousedown",this.handleMouseDown)},onClosed(){var i,t;const e={target:this};(t=(i=this.$props).onClose)==null||t.call(i,e),this.$emit("close",e)},transitionDuration(){const e=this.$props.animate;let i=0,t=0;return e&&(e===!0?i=t=300:(i=e.openDuration||0,t=e.closeDuration||0)),{enter:i,exit:t}},_cancelPendingAnimations(){this._animationGeneration++,this._enterTimerId!==null&&(clearTimeout(this._enterTimerId),this._enterTimerId=null),this._cancelAnimation&&(this._cancelAnimation(),this._cancelAnimation=null)},animateElement(e,i,t){const n=this.transitionDuration()[i];if(n===0)return t();const o=e.ownerDocument,r=o==null?void 0:o.defaultView;if(!r)return t();const s=this.$props.direction==="down",c=this._flipped?"up":"down",p=this._flipped?"down":"up",h=s?c:p,f=`k-slide-${h}-${i}`,d=`k-slide-${h}-${i}-active`;let a=!1,l=null;const g=()=>{e.removeEventListener("transitionend",A),l&&(clearTimeout(l),l=null),e.style.transitionDuration="",e.classList.remove(f,d)},v=()=>{a||(a=!0,g(),i==="exit"?e.style.display="none":e.style.display="",this._cancelAnimation=null,t())},A=u=>{u.target===e&&v()};e.addEventListener("transitionend",A),l=setTimeout(v,n+50),e.style.transitionDuration="",e.classList.remove(f,d),i==="enter"&&(e.style.display=""),e.classList.add(f),r.requestAnimationFrame(()=>{a||(e.style.transitionDuration=n+"ms",e.classList.add(d))}),this._cancelAnimation=()=>{a||(a=!0,g(),e.style.display="")}},isAnimationInstant(e){if(this.transitionDuration()[e]===0)return!0;if(typeof window!="undefined"&&this.$el){const t=this.$el.firstChild;if(t){const n=window.getComputedStyle(t),o=parseFloat(n.transitionDuration||"0"),r=parseFloat(n.animationDuration||"0");if(o===0&&r===0)return!0}}return!1},getParentRef(e,i){if(e instanceof HTMLElement)return e;if(!e)return document.body;let t=this.$parent;for(;t&&!t.$refs[e];){if(t&&t.kendoAnchorRef&&i)return t.kendoAnchorRef;if(t=t.$parent,!t&&y.canUseDOM)return document.getElementById(e)||document.body}return t.$refs[e].$el||t.$refs[e]},position(e,i,t,n){var a,l,g,v,A,u;const{anchorAlign:o,popupAlign:r,collision:s,offset:c}=e,p=n||1,h=t?this.mountedAnchor:document.body;if(p===1){const b=this._alignService.alignElement({anchor:t?h:void 0,element:i,elementAlign:r,anchorAlign:o,offset:c}),O=this._positionService.positionElement({anchor:h,anchorAlign:o,collisions:s,element:i,currentLocation:b,elementAlign:r}),w=this.applyMargin(O,e);if(!(((a=e.margin)==null?void 0:a.horizontal)&&(s==null?void 0:s.horizontal)==="fit"||((l=e.margin)==null?void 0:l.vertical)&&(s==null?void 0:s.vertical)==="fit")||!w.offset)return w;const S=this._positionService.positionElement({anchor:h,anchorAlign:o,collisions:{horizontal:(s==null?void 0:s.horizontal)==="fit"?"fit":"none",vertical:(s==null?void 0:s.vertical)==="fit"?"fit":"none"},element:i,currentLocation:w.offset,elementAlign:r});return{...w,offset:S.offset,fitted:w.fitted||S.fitted}}const f=P.alignElement({anchor:t?h:void 0,element:i,elementAlign:r,anchorAlign:o,offset:c,margin:{horizontal:((g=e.margin)==null?void 0:g.horizontal)||0,vertical:((v=e.margin)==null?void 0:v.vertical)||0},positionMode:e.positionMode,scale:p});return P.positionElement({anchor:h,anchorAlign:o,collisions:s,element:i,currentLocation:f,elementAlign:r,margin:{horizontal:((A=e.margin)==null?void 0:A.horizontal)||0,vertical:((u=e.margin)==null?void 0:u.vertical)||0},scale:p})},applyMargin(e,i){var c,p,h,f,d,a,l,g;const t=i.margin;if(!t||!e.offset)return e;const n={...e.offset},o=t.horizontal||0,r=t.vertical||0,s=e.flipped?-1:1;return((c=i.anchorAlign)==null?void 0:c.horizontal)==="left"&&((p=i.popupAlign)==null?void 0:p.horizontal)==="right"?n.left-=o*s:((h=i.anchorAlign)==null?void 0:h.horizontal)==="right"&&((f=i.popupAlign)==null?void 0:f.horizontal)==="left"&&(n.left+=o*s),((d=i.anchorAlign)==null?void 0:d.vertical)==="top"&&((a=i.popupAlign)==null?void 0:a.vertical)==="bottom"?n.top-=r*s:((l=i.anchorAlign)==null?void 0:l.vertical)==="bottom"&&((g=i.popupAlign)==null?void 0:g.vertical)==="top"&&(n.top+=r*s),{...e,offset:n}},calculatePosition(e,i){var a,l,g,v,A;if(!i||!_.isWindowAvailable()||!y.canUseDOM)return{flipped:!1,offset:e.offset};const t=y.getDefaultSlots(this),n=document.createElement("div"),o=(l=(a=this.$el)==null?void 0:a.querySelector)!=null&&l.call(a,`.${$}`)?this.$el:this._clonedElement,r=(g=o==null?void 0:o.querySelector)==null?void 0:g.call(o,`.${$}`);let s;if(r&&(s=o.cloneNode(!1),s.removeAttribute("id"),s.removeAttribute("style"),s.appendChild(r.cloneNode(!0))),s)n.appendChild(s);else{const u=t&&t[0].props?t[0].props.class:"";m.render(m.h("div",{class:"k-animation-container k-animation-container-relative"},m.h("div",{class:"k-popup k-animation-container k-animation-container-relative"},m.h("div",{class:[u,this.$props.popupClass]}))),n)}if(i.appendChild(n),n&&n.firstChild){const u=n.firstChild;u.style.position="absolute",u.style.visibility="hidden",u.style.display="block",u.style.left="-1000",u.style.top="0";const b=m.normalizeStyle([this.$attrs.style,(A=(v=t==null?void 0:t[0])==null?void 0:v.props)==null?void 0:A.style]);if(b&&typeof b=="object")for(const[O,w]of Object.entries(b))u.style[O]=w}const c=n.firstChild,p=parseFloat(window.getComputedStyle(c).width),h=p>0?c.getBoundingClientRect().width/p:1,f=(this.$props.scale||1)*h,d=this.position(e,c,this.$props.anchor,f);return m.render(null,n),n.parentNode.removeChild(n),d},attachRepositionHandlers(e){this.detachRepositionHandlers(),this._scrollableParents=this._domService.scrollableParents(this.$props.anchor?this.mountedAnchor:e),this._scrollableParents.map(i=>i.addEventListener("scroll",this.reposition)),_.isWindowAvailable()&&window.addEventListener("resize",this.reposition)},detachRepositionHandlers(){this._scrollableParents&&(this._scrollableParents.map(e=>e.removeEventListener("scroll",this.reposition)),this._scrollableParents=void 0),_.isWindowAvailable()&&window.removeEventListener("resize",this.reposition)},attachResizeObserver(e){this.detachResizeObserver(),typeof ResizeObserver!="undefined"&&(this._resizeObserver=new ResizeObserver(()=>this.reposition()),this._resizeObserver.observe(e))},detachResizeObserver(){var e;(e=this._resizeObserver)==null||e.disconnect(),this._resizeObserver=void 0},reposition(){this._clonedElement=this.$el.cloneNode(!0),this.$forceUpdate()},getCurrentZIndex(){return this.kCurrentZIndex?this.kCurrentZIndex+x:k},hasCustomOffset(e){return e?e.left!==C.left||e.top!==C.top:!1}},render(){var h,f;const{className:e,popupClass:i,show:t,id:n}=this.$props,o=y.getDefaultSlots(this),r=o,s=this.hasCustomOffset(this.$props.offset)?R:void 0,c=_.isWindowAvailable()?this.$props.appendTo?this.mountedAppendTo||this.getParentRef(this.$props.appendTo):document.body:void 0;if(this.$props.show){const d=this.calculatePosition(this.$props,c);this._offsetLeft=d.offset.left,this._offsetTop=d.offset.top,this._flipped=!!d.flipped;const a={target:this,fitted:!!d.fitted,flipped:!!d.flipped};(f=(h=this.$props).onPosition)==null||f.call(h,a),this.$emit("position",a)}const p=this.getCurrentZIndex();if(!this.hasMounted)return m.createVNode("div",{id:n,style:{display:"none",...this.$props.style},class:e},[m.createVNode("div",{class:[i,$],style:s},[o])]);if((t||this._exitingAnimation)&&c){const d={zIndex:p,position:this.$props.positionMode||"absolute",top:this._offsetTop+"px",left:this._offsetLeft+"px",pointerEvents:t?"auto":"none",...this.$props.style};if(t&&!this._opened){this._opened=!0;const l=this._animationGeneration;this.transitionDuration().enter===0?this._enterTimerId=setTimeout(()=>{this._enterTimerId=null,l===this._animationGeneration&&(!this.$props.show||!this._opened||this.onOpened())},0):this.$nextTick(()=>{if(l!==this._animationGeneration||!this.$props.show||!this._opened)return;const v=this.$el;if(!v)return;const A=v.firstChild;A?this.animateElement(A,"enter",()=>{l===this._animationGeneration&&this.$props.show&&this.onOpened()}):this.onOpened()})}const a=this.animationOpen?E:"";return m.createVNode("div",{id:n,class:["k-animation-container",a,e],style:d,onKeydown:l=>{this.$emit("keydown",l)}},[m.createVNode("div",{class:["k-child-animation-container"],style:{transitionDelay:"0ms",display:"block"}},[m.createVNode("div",{role:this.$props.role,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,class:[i,$]},[r])])])}return m.createVNode("div",{id:n,style:{display:"none"},class:e},null)}});exports.Popup=L;

package/Popup.mjs

@@ -5,20 +5,20 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as D, createVNode as g, render as O, h as $ } from "vue";
-import { alignElement as S, positionElement as z } from "@progress/kendo-popup-common";
-import { isWindowAvailable as A, throttle as R, AlignPoint as y, CollisionType as E, FRAME_DURATION as k } from "./util.mjs";
-import { AlignService as x } from "./services/alignService.mjs";
-import { DOMService as L } from "./services/domService.mjs";
-import { PositionService as M } from "./services/positionService.mjs";
-import { getDefaultSlots as T, canUseDOM as v, validatePackage as I } from "@progress/kendo-vue-common";
-import { packageMetadata as N } from "./package-metadata.mjs";
-const F = 100, U = 1, b = {
+import { defineComponent as k, createVNode as y, render as D, h as C, normalizeStyle as R } from "vue";
+import { alignElement as L, positionElement as M } from "@progress/kendo-popup-common";
+import { isWindowAvailable as $, throttle as I, AlignPoint as b, CollisionType as z, FRAME_DURATION as N } from "./util.mjs";
+import { AlignService as F } from "./services/alignService.mjs";
+import { DOMService as U } from "./services/domService.mjs";
+import { PositionService as j } from "./services/positionService.mjs";
+import { getDefaultSlots as x, canUseDOM as w, validatePackage as G } from "@progress/kendo-vue-common";
+import { packageMetadata as B } from "./package-metadata.mjs";
+const Z = 100, H = 1, T = {
   left: -1e3,
   top: 0
-}, C = "k-animation-container-shown", P = "k-popup", j = {
+}, S = "k-animation-container-shown", O = "k-popup", W = {
   margin: "0"
-}, V = /* @__PURE__ */ D({
+}, it = /* @__PURE__ */ k({
   name: "Popup",
   emits: ["open", "close", "position", "keydown", "mousedownoutside"],
   props: {
@@ -37,8 +37,8 @@ const F = 100, U = 1, b = {
       type: Object,
       default: function() {
         return {
-          horizontal: E.fit,
-          vertical: E.flip
+          horizontal: z.fit,
+          vertical: z.flip
         };
       }
     },
@@ -46,8 +46,8 @@ const F = 100, U = 1, b = {
       type: Object,
       default: function() {
         return {
-          horizontal: y.left,
-          vertical: y.bottom
+          horizontal: b.left,
+          vertical: b.bottom
         };
       }
     },
@@ -55,15 +55,15 @@ const F = 100, U = 1, b = {
       type: Object,
       default: function() {
         return {
-          horizontal: y.left,
-          vertical: y.top
+          horizontal: b.left,
+          vertical: b.top
         };
       }
     },
     offset: {
       type: Object,
       default: function() {
-        return b;
+        return T;
       }
     },
     show: {
@@ -102,10 +102,10 @@ const F = 100, U = 1, b = {
   },
   watch: {
     anchor(t) {
-      !this.hasMounted || !v || (this.mountedAnchor = t ? this.getParentRef(t, !0) : document.body, this.reposition());
+      !this.hasMounted || !w || (this.mountedAnchor = t ? this.getParentRef(t, !0) : document.body, this.reposition());
     },
     appendTo(t) {
-      !this.hasMounted || !v || (this.mountedAppendTo = t ? this.getParentRef(t) : document.body, this.$el.parentElement !== this.mountedAppendTo && this.mountedAppendTo.appendChild(this.$el), this.reposition());
+      !this.hasMounted || !w || (this.mountedAppendTo = t ? this.getParentRef(t) : document.body, this.$el.parentElement !== this.mountedAppendTo && this.mountedAppendTo.appendChild(this.$el), this.reposition());
     },
     show(t, i) {
       if (i && !t)
@@ -132,10 +132,10 @@ const F = 100, U = 1, b = {
     }
   },
   created() {
-    I(N), this.mountedAppendTo = void 0, this.mountedAnchor = void 0, this._clonedElement = void 0, this._flipped = !1, this._offsetTop = 0, this._offsetLeft = -1e3, this._opened = !1, this._exitingAnimation = !1, this._animationGeneration = 0, this._enterTimerId = null, this._cancelAnimation = null, this._resizeObserver = void 0, this._domService = new L(), this._alignService = new x(this._domService), this._positionService = new M(this._domService), this.reposition = R(this.reposition.bind(this), k);
+    G(B), this.mountedAppendTo = void 0, this.mountedAnchor = void 0, this._clonedElement = void 0, this._originalNextSibling = void 0, this._flipped = !1, this._offsetTop = 0, this._offsetLeft = -1e3, this._opened = !1, this._exitingAnimation = !1, this._animationGeneration = 0, this._enterTimerId = null, this._cancelAnimation = null, this._resizeObserver = void 0, this._domService = new U(), this._alignService = new F(this._domService), this._positionService = new j(this._domService), this.reposition = I(this.reposition.bind(this), N);
   },
   mounted() {
-    v && (this.mountedAppendTo = this.appendTo ? this.getParentRef(this.appendTo) : document.body, this.mountedAnchor = this.anchor ? this.getParentRef(this.anchor, !0) : document.body), this._parentElement = this.$el.parentElement, this._clonedElement = this.$el.cloneNode(!0), this.hasMounted = !0, this.mountedAppendTo.appendChild(this.$el), this.$forceUpdate();
+    w && (this.mountedAppendTo = this.appendTo ? this.getParentRef(this.appendTo) : document.body, this.mountedAnchor = this.anchor ? this.getParentRef(this.anchor, !0) : document.body), this._parentElement = this.$el.parentElement, this._originalNextSibling = this.$el.nextSibling, this._clonedElement = this.$el.cloneNode(!0), this.hasMounted = !0, this.mountedAppendTo.appendChild(this.$el), this.$forceUpdate();
   },
   updated() {
     if (this.hasMounted && this.mountedAppendTo) {
@@ -147,7 +147,10 @@ const F = 100, U = 1, b = {
     this.detachRepositionHandlers(), this.detachResizeObserver(), typeof window != "undefined" && window.removeEventListener("mousedown", this.handleMouseDown);
   },
   beforeUnmount() {
-    this._parentElement && this._parentElement.appendChild(this.$el);
+    if (this.hasMounted = !1, this._parentElement) {
+      const t = this._originalNextSibling;
+      this._parentElement.insertBefore(this.$el, (t == null ? void 0 : t.parentNode) === this._parentElement ? t : null);
+    }
   },
   methods: {
     handleMouseDown(t) {
@@ -165,14 +168,14 @@ const F = 100, U = 1, b = {
     onOpened() {
       var e, n;
       const t = this.$el;
-      typeof window != "undefined" && window.addEventListener("mousedown", this.handleMouseDown), this.$props.show && (t.classList.add(C), this.animationOpen = !0), this.attachRepositionHandlers(t), this.attachResizeObserver(t);
+      typeof window != "undefined" && window.addEventListener("mousedown", this.handleMouseDown), this.$props.show && (t.classList.add(S), this.animationOpen = !0), this.attachRepositionHandlers(t), this.attachResizeObserver(t);
       const i = {
         target: this
       };
       (n = (e = this.$props).onOpen) == null || n.call(e, i), this.$emit("open", i);
     },
     onClosing() {
-      this.$props.show || (this.$el.classList.remove(C), this.animationOpen = !1), this.detachRepositionHandlers(), this.detachResizeObserver(), typeof window != "undefined" && window.removeEventListener("mousedown", this.handleMouseDown);
+      this.$props.show || (this.$el.classList.remove(S), this.animationOpen = !1), this.detachRepositionHandlers(), this.detachResizeObserver(), typeof window != "undefined" && window.removeEventListener("mousedown", this.handleMouseDown);
     },
     onClosed() {
       var i, e;
@@ -199,19 +202,19 @@ const F = 100, U = 1, b = {
       const o = t.ownerDocument, r = o == null ? void 0 : o.defaultView;
       if (!r)
         return e();
-      const d = this.$props.direction === "down", c = this._flipped ? "up" : "down", f = this._flipped ? "down" : "up", h = d ? c : f, p = `k-slide-${h}-${i}`, s = `k-slide-${h}-${i}-active`;
+      const s = this.$props.direction === "down", p = this._flipped ? "up" : "down", c = this._flipped ? "down" : "up", h = s ? p : c, f = `k-slide-${h}-${i}`, d = `k-slide-${h}-${i}-active`;
       let a = !1, l = null;
-      const u = () => {
-        t.removeEventListener("transitionend", _), l && (clearTimeout(l), l = null), t.style.transitionDuration = "", t.classList.remove(p, s);
-      }, m = () => {
-        a || (a = !0, u(), i === "exit" ? t.style.display = "none" : t.style.display = "", this._cancelAnimation = null, e());
-      }, _ = (w) => {
-        w.target === t && m();
+      const m = () => {
+        t.removeEventListener("transitionend", g), l && (clearTimeout(l), l = null), t.style.transitionDuration = "", t.classList.remove(f, d);
+      }, _ = () => {
+        a || (a = !0, m(), i === "exit" ? t.style.display = "none" : t.style.display = "", this._cancelAnimation = null, e());
+      }, g = (u) => {
+        u.target === t && _();
       };
-      t.addEventListener("transitionend", _), l = setTimeout(m, n + 50), t.style.transitionDuration = "", t.classList.remove(p, s), i === "enter" && (t.style.display = ""), t.classList.add(p), r.requestAnimationFrame(() => {
-        a || (t.style.transitionDuration = n + "ms", t.classList.add(s));
+      t.addEventListener("transitionend", g), l = setTimeout(_, n + 50), t.style.transitionDuration = "", t.classList.remove(f, d), i === "enter" && (t.style.display = ""), t.classList.add(f), r.requestAnimationFrame(() => {
+        a || (t.style.transitionDuration = n + "ms", t.classList.add(d));
       }), this._cancelAnimation = () => {
-        a || (a = !0, u(), t.style.display = "");
+        a || (a = !0, m(), t.style.display = "");
       };
     },
     isAnimationInstant(t) {
@@ -236,111 +239,130 @@ const F = 100, U = 1, b = {
       for (; e && !e.$refs[t]; ) {
         if (e && e.kendoAnchorRef && i)
           return e.kendoAnchorRef;
-        if (e = e.$parent, !e && v)
+        if (e = e.$parent, !e && w)
           return document.getElementById(t) || document.body;
       }
       return e.$refs[t].$el || e.$refs[t];
     },
     position(t, i, e, n) {
-      var a, l, u, m;
+      var a, l, m, _, g, u;
       const {
         anchorAlign: o,
         popupAlign: r,
-        collision: d,
-        offset: c
-      } = t, f = n || 1, h = e ? this.mountedAnchor : document.body;
-      if (f === 1) {
-        const _ = this._alignService.alignElement({
+        collision: s,
+        offset: p
+      } = t, c = n || 1, h = e ? this.mountedAnchor : document.body;
+      if (c === 1) {
+        const A = this._alignService.alignElement({
           anchor: e ? h : void 0,
           element: i,
           elementAlign: r,
           anchorAlign: o,
-          offset: c
-        }), w = this._positionService.positionElement({
+          offset: p
+        }), E = this._positionService.positionElement({
           anchor: h,
           anchorAlign: o,
-          collisions: d,
+          collisions: s,
           element: i,
-          currentLocation: _,
+          currentLocation: A,
+          elementAlign: r
+        }), v = this.applyMargin(E, t);
+        if (!(((a = t.margin) == null ? void 0 : a.horizontal) && (s == null ? void 0 : s.horizontal) === "fit" || ((l = t.margin) == null ? void 0 : l.vertical) && (s == null ? void 0 : s.vertical) === "fit") || !v.offset)
+          return v;
+        const P = this._positionService.positionElement({
+          anchor: h,
+          anchorAlign: o,
+          collisions: {
+            horizontal: (s == null ? void 0 : s.horizontal) === "fit" ? "fit" : "none",
+            vertical: (s == null ? void 0 : s.vertical) === "fit" ? "fit" : "none"
+          },
+          element: i,
+          currentLocation: v.offset,
           elementAlign: r
         });
-        return this.applyMargin(w, t);
+        return {
+          ...v,
+          offset: P.offset,
+          fitted: v.fitted || P.fitted
+        };
       }
-      const p = S({
+      const f = L({
         anchor: e ? h : void 0,
         element: i,
         elementAlign: r,
         anchorAlign: o,
-        offset: c,
+        offset: p,
         margin: {
-          horizontal: ((a = t.margin) == null ? void 0 : a.horizontal) || 0,
-          vertical: ((l = t.margin) == null ? void 0 : l.vertical) || 0
+          horizontal: ((m = t.margin) == null ? void 0 : m.horizontal) || 0,
+          vertical: ((_ = t.margin) == null ? void 0 : _.vertical) || 0
         },
         positionMode: t.positionMode,
-        scale: f
+        scale: c
       });
-      return z({
+      return M({
         anchor: h,
         anchorAlign: o,
-        collisions: d,
+        collisions: s,
         element: i,
-        currentLocation: p,
+        currentLocation: f,
         elementAlign: r,
         margin: {
-          horizontal: ((u = t.margin) == null ? void 0 : u.horizontal) || 0,
-          vertical: ((m = t.margin) == null ? void 0 : m.vertical) || 0
+          horizontal: ((g = t.margin) == null ? void 0 : g.horizontal) || 0,
+          vertical: ((u = t.margin) == null ? void 0 : u.vertical) || 0
         },
-        scale: f
+        scale: c
       });
     },
     applyMargin(t, i) {
-      var c, f, h, p, s, a, l, u;
+      var p, c, h, f, d, a, l, m;
       const e = i.margin;
       if (!e || !t.offset)
         return t;
       const n = {
         ...t.offset
-      }, o = e.horizontal || 0, r = e.vertical || 0, d = t.flipped ? -1 : 1;
-      return ((c = i.anchorAlign) == null ? void 0 : c.horizontal) === "left" && ((f = i.popupAlign) == null ? void 0 : f.horizontal) === "right" ? n.left -= o * d : ((h = i.anchorAlign) == null ? void 0 : h.horizontal) === "right" && ((p = i.popupAlign) == null ? void 0 : p.horizontal) === "left" && (n.left += o * d), ((s = i.anchorAlign) == null ? void 0 : s.vertical) === "top" && ((a = i.popupAlign) == null ? void 0 : a.vertical) === "bottom" ? n.top -= r * d : ((l = i.anchorAlign) == null ? void 0 : l.vertical) === "bottom" && ((u = i.popupAlign) == null ? void 0 : u.vertical) === "top" && (n.top += r * d), {
+      }, o = e.horizontal || 0, r = e.vertical || 0, s = t.flipped ? -1 : 1;
+      return ((p = i.anchorAlign) == null ? void 0 : p.horizontal) === "left" && ((c = i.popupAlign) == null ? void 0 : c.horizontal) === "right" ? n.left -= o * s : ((h = i.anchorAlign) == null ? void 0 : h.horizontal) === "right" && ((f = i.popupAlign) == null ? void 0 : f.horizontal) === "left" && (n.left += o * s), ((d = i.anchorAlign) == null ? void 0 : d.vertical) === "top" && ((a = i.popupAlign) == null ? void 0 : a.vertical) === "bottom" ? n.top -= r * s : ((l = i.anchorAlign) == null ? void 0 : l.vertical) === "bottom" && ((m = i.popupAlign) == null ? void 0 : m.vertical) === "top" && (n.top += r * s), {
         ...t,
         offset: n
       };
     },
     calculatePosition(t, i) {
-      if (!i || !A() || !v)
+      var a, l, m, _, g;
+      if (!i || !$() || !w)
         return {
           flipped: !1,
           offset: t.offset
         };
-      const e = T(this), n = document.createElement("div"), o = this.$el && this.$el.firstChild && this.$el.firstChild.firstChild ? this.$el.firstChild.firstChild.cloneNode(!0) : null, r = o && o.getBoundingClientRect ? o : this._clonedElement;
-      if (r)
-        n.appendChild(r);
+      const e = x(this), n = document.createElement("div"), o = (l = (a = this.$el) == null ? void 0 : a.querySelector) != null && l.call(a, `.${O}`) ? this.$el : this._clonedElement, r = (m = o == null ? void 0 : o.querySelector) == null ? void 0 : m.call(o, `.${O}`);
+      let s;
+      if (r && (s = o.cloneNode(!1), s.removeAttribute("id"), s.removeAttribute("style"), s.appendChild(r.cloneNode(!0))), s)
+        n.appendChild(s);
       else {
-        const s = e && e[0].props ? e[0].props.class : "";
-        O($("div", {
+        const u = e && e[0].props ? e[0].props.class : "";
+        D(C("div", {
           class: "k-animation-container k-animation-container-relative"
-        }, $("div", {
+        }, C("div", {
           class: "k-popup k-animation-container k-animation-container-relative"
-        }, $("div", {
-          class: [s, this.$props.popupClass]
+        }, C("div", {
+          class: [u, this.$props.popupClass]
         }))), n);
       }
       if (i.appendChild(n), n && n.firstChild) {
-        const s = n.firstChild;
-        s.style.position = "absolute", s.style.visibility = "hidden", s.style.display = "block", s.style.left = "-1000", s.style.top = "0";
-        const a = e && e[0].props ? e[0].props.style : {};
-        if (a)
-          for (const [l, u] of Object.entries(a))
-            s.style[l] = u;
+        const u = n.firstChild;
+        u.style.position = "absolute", u.style.visibility = "hidden", u.style.display = "block", u.style.left = "-1000", u.style.top = "0";
+        const A = R([this.$attrs.style, (g = (_ = e == null ? void 0 : e[0]) == null ? void 0 : _.props) == null ? void 0 : g.style]);
+        if (A && typeof A == "object")
+          for (const [E, v] of Object.entries(A))
+            u.style[E] = v;
       }
-      const d = n.firstChild, c = parseFloat(window.getComputedStyle(d).width), f = c > 0 ? d.getBoundingClientRect().width / c : 1, h = (this.$props.scale || 1) * f, p = this.position(t, d, this.$props.anchor, h);
-      return O(null, n), n.parentNode.removeChild(n), p;
+      const p = n.firstChild, c = parseFloat(window.getComputedStyle(p).width), h = c > 0 ? p.getBoundingClientRect().width / c : 1, f = (this.$props.scale || 1) * h, d = this.position(t, p, this.$props.anchor, f);
+      return D(null, n), n.parentNode.removeChild(n), d;
     },
     attachRepositionHandlers(t) {
-      this.detachRepositionHandlers(), this._scrollableParents = this._domService.scrollableParents(this.$props.anchor ? this.mountedAnchor : t), this._scrollableParents.map((i) => i.addEventListener("scroll", this.reposition)), A() && window.addEventListener("resize", this.reposition);
+      this.detachRepositionHandlers(), this._scrollableParents = this._domService.scrollableParents(this.$props.anchor ? this.mountedAnchor : t), this._scrollableParents.map((i) => i.addEventListener("scroll", this.reposition)), $() && window.addEventListener("resize", this.reposition);
     },
     detachRepositionHandlers() {
-      this._scrollableParents && (this._scrollableParents.map((t) => t.removeEventListener("scroll", this.reposition)), this._scrollableParents = void 0), A() && window.removeEventListener("resize", this.reposition);
+      this._scrollableParents && (this._scrollableParents.map((t) => t.removeEventListener("scroll", this.reposition)), this._scrollableParents = void 0), $() && window.removeEventListener("resize", this.reposition);
     },
     attachResizeObserver(t) {
       this.detachResizeObserver(), typeof ResizeObserver != "undefined" && (this._resizeObserver = new ResizeObserver(() => this.reposition()), this._resizeObserver.observe(t));
@@ -353,46 +375,46 @@ const F = 100, U = 1, b = {
       this._clonedElement = this.$el.cloneNode(!0), this.$forceUpdate();
     },
     getCurrentZIndex() {
-      return this.kCurrentZIndex ? this.kCurrentZIndex + U : F;
+      return this.kCurrentZIndex ? this.kCurrentZIndex + H : Z;
     },
     hasCustomOffset(t) {
-      return t ? t.left !== b.left || t.top !== b.top : !1;
+      return t ? t.left !== T.left || t.top !== T.top : !1;
     }
   },
   render() {
-    var h, p;
+    var h, f;
     const {
       className: t,
       popupClass: i,
       show: e,
       id: n
-    } = this.$props, o = T(this), r = o, d = this.hasCustomOffset(this.$props.offset) ? j : void 0, c = A() ? this.$props.appendTo ? this.mountedAppendTo || this.getParentRef(this.$props.appendTo) : document.body : void 0;
+    } = this.$props, o = x(this), r = o, s = this.hasCustomOffset(this.$props.offset) ? W : void 0, p = $() ? this.$props.appendTo ? this.mountedAppendTo || this.getParentRef(this.$props.appendTo) : document.body : void 0;
     if (this.$props.show) {
-      const s = this.calculatePosition(this.$props, c);
-      this._offsetLeft = s.offset.left, this._offsetTop = s.offset.top, this._flipped = !!s.flipped;
+      const d = this.calculatePosition(this.$props, p);
+      this._offsetLeft = d.offset.left, this._offsetTop = d.offset.top, this._flipped = !!d.flipped;
       const a = {
         target: this,
-        fitted: !!s.fitted,
-        flipped: !!s.flipped
+        fitted: !!d.fitted,
+        flipped: !!d.flipped
       };
-      (p = (h = this.$props).onPosition) == null || p.call(h, a), this.$emit("position", a);
+      (f = (h = this.$props).onPosition) == null || f.call(h, a), this.$emit("position", a);
     }
-    const f = this.getCurrentZIndex();
+    const c = this.getCurrentZIndex();
     if (!this.hasMounted)
-      return g("div", {
+      return y("div", {
         id: n,
         style: {
           display: "none",
           ...this.$props.style
         },
         class: t
-      }, [g("div", {
-        class: [i, P],
-        style: d
+      }, [y("div", {
+        class: [i, O],
+        style: s
       }, [o])]);
-    if ((e || this._exitingAnimation) && c) {
-      const s = {
-        zIndex: f,
+    if ((e || this._exitingAnimation) && p) {
+      const d = {
+        zIndex: c,
         position: this.$props.positionMode || "absolute",
         top: this._offsetTop + "px",
         left: this._offsetLeft + "px",
@@ -407,37 +429,37 @@ const F = 100, U = 1, b = {
         }, 0) : this.$nextTick(() => {
           if (l !== this._animationGeneration || !this.$props.show || !this._opened)
             return;
-          const m = this.$el;
-          if (!m)
+          const _ = this.$el;
+          if (!_)
             return;
-          const _ = m.firstChild;
-          _ ? this.animateElement(_, "enter", () => {
+          const g = _.firstChild;
+          g ? this.animateElement(g, "enter", () => {
             l === this._animationGeneration && this.$props.show && this.onOpened();
           }) : this.onOpened();
         });
       }
-      const a = this.animationOpen ? C : "";
-      return g("div", {
+      const a = this.animationOpen ? S : "";
+      return y("div", {
         id: n,
         class: ["k-animation-container", a, t],
-        style: s,
+        style: d,
         onKeydown: (l) => {
           this.$emit("keydown", l);
         }
-      }, [g("div", {
+      }, [y("div", {
         class: ["k-child-animation-container"],
         style: {
           transitionDelay: "0ms",
           display: "block"
         }
-      }, [g("div", {
+      }, [y("div", {
         role: this.$props.role,
         "aria-labelledby": this.$props.ariaLabelledBy,
         "aria-describedby": this.$props.ariaDescribedBy,
-        class: [i, P]
+        class: [i, O]
       }, [r])])]);
     }
-    return g("div", {
+    return y("div", {
       id: n,
       style: {
         display: "none"
@@ -447,5 +469,5 @@ const F = 100, U = 1, b = {
   }
 });
 export {
-  V as Popup
+  it as Popup
 };

package/dist/cdn/js/kendo-vue-popup.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("@progress/kendo-popup-common"),require("@progress/kendo-vue-common")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-popup-common","@progress/kendo-vue-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoVuePopup={},e.Vue,e.KendoPopupCommon,e.KendoVueCommon)}(this,function(e,t,n,i){"use strict";const o=(e,t)=>e||{height:0,left:t.left,top:t.top,width:0},s=()=>"undefined"!=typeof document&&!!document.body,r=()=>"undefined"!=typeof window,l=/auto|scroll/,a=e=>{const t=window.getComputedStyle(e);return`${t.overflow}${t.overflowX}${t.overflowY}`},d=1e3/60,h=(()=>{if(!s())return!1;const e=document.createElement("div");if(e.style.transform="matrix(10, 0, 0, 10, 0, 0)",e.innerHTML="<div>child</div>",document.body.appendChild(e),e&&e.firstChild){const t=e.firstChild;t.style.position="fixed",t.style.top="10px"}const t=10!==e.children[0].getBoundingClientRect().top;return document.body.removeChild(e),t})(),c="fit",p="flip",u="left",f="bottom",m="top";class g{constructor(e){this._dom=e}alignElement(e){const{anchor:t,element:n,anchorAlign:i,elementAlign:o,offset:s}=e,r=this._dom.hasOffsetParent(n)?this.relativeRect(t,n,s):this.absoluteRect(t,n,s);return this._dom.align({anchorAlign:i,anchorRect:r,elementAlign:o,elementRect:this._dom.offset(n)})}absoluteRect(e,t,n){const i=this._dom,s=((e,t)=>t?{height:e.height,left:e.left-t.left,top:e.top-t.top,width:e.width}:e)(o(i.offset(e),n),i.stackingElementOffset(t)),r=i.stackingElementScroll(t),l=i.addScroll(s,r),a=this.elementScrollPosition(e,t),d=i.removeScroll(l,a);return d.left+=window.scrollX||window.pageXOffset,d.top+=window.scrollY||window.pageYOffset,d}elementScrollPosition(e,t){return e?{x:0,y:0}:this._dom.scrollPosition(t)}relativeRect(e,t,n){return o(this._dom.position(e,t),n)}}class v{addOffset(e,t){return{left:e.left+t.left,top:e.top+t.top}}align(e){return n.align(e)}boundingOffset(e){return n.boundingOffset(e)}getWindow(){return r()?window:null}isBodyOffset(e){return n.isBodyOffset(e)}hasOffsetParent(e){if(!e)return!1;const t=e.offsetParent;return t&&!("BODY"===t.nodeName&&"static"===window.getComputedStyle(t).position)}offset(e){return e?n.offset(e):null}staticOffset(e){if(!e)return null;const{left:t,top:i}=e.style;e.style.left="0px",e.style.top="0px";const o=n.offset(e);return e.style.left=t,e.style.top=i,o}position(e,t){if(!e||!t)return null;const i=n.siblingContainer(e,t);return n.positionWithScroll(e,i)}relativeOffset(e,t){return n.applyLocationOffset(this.offset(e),t,this.isBodyOffset(e))}addScroll(e,t){return n.addScroll(e,t)}removeScroll(e,t){return n.removeScroll(e,t)}restrictToView(e){return n.restrictToView(e)}scrollPosition(e){return n.scrollPosition(e)}scrollableParents(e){return(e=>{const t=[];if(!s()||!r())return t;let n=e.parentElement;for(;n;)l.test(a(n))&&t.push(n),n=n.parentElement;return t.push(window),t})(e)}stackingElementOffset(e){const t=this.getRelativeContextElement(e);return t?n.offset(t):null}stackingElementScroll(e){const t=this.getRelativeContextElement(e);return t?{x:t.scrollLeft,y:t.scrollTop}:{x:0,y:0}}stackingElementViewPort(e){const t=this.getRelativeContextElement(e);return t?{height:t.scrollHeight,width:t.scrollWidth}:null}getRelativeContextElement(e){if(!e||!h)return null;let t=e.parentElement;for(;t;){if("none"!==window.getComputedStyle(t).transform)return t;t=t.parentElement}return null}useRelativePosition(e){return!!this.getRelativeContextElement(e)}windowViewPort(e){return n.getWindowViewPort(e)}zIndex(e,t){return((e,t)=>{if(!e||!s()||!r())return null;const i=n.siblingContainer(e,t);if(!i)return null;const o=[e].concat(n.parents(e,i)).reduce((e,t)=>{const n=t.style.zIndex||window.getComputedStyle(t).zIndex,i=parseInt(n,10);return i>e?i:e},0);return o?o+1:null})(e,t)}zoomLevel(){return s()&&r()?parseFloat((document.documentElement.clientWidth/window.innerWidth).toFixed(2)):1}isZoomed(){return this.zoomLevel()>1}}class w{constructor(e){this._dom=e}positionElement(e){const{anchor:t,currentLocation:n,element:i,anchorAlign:s,elementAlign:r,collisions:l}=e,a=this._dom,d=e.viewPort||a.stackingElementViewPort(i)||a.windowViewPort(i),h=o(a.offset(t),n),c=((e,t)=>t?{height:e.height,left:t.left,top:t.top,width:e.width}:e)(a.staticOffset(i),n),p=this.elementRect(i,c),u=a.restrictToView({anchorAlign:s,anchorRect:h,collisions:l,elementAlign:r,elementRect:p,viewPort:d});return{fitted:u.fitted,flipped:u.flipped,offset:a.addOffset(c,u.offset)}}elementRect(e,t){return this._dom.removeScroll(t,this._dom.scrollPosition(e))}}const y={name:"@progress/kendo-vue-popup",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate:1657007252,version:"10.2.0-develop.10",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"},_={left:-1e3,top:0},b="k-animation-container-shown",$="k-popup",A={margin:"0"},C=t.defineComponent({name:"Popup",emits:["open","close","position","keydown","mousedownoutside"],props:{appendTo:{type:[String,Object],default:""},anchor:{type:[String,Object],default:""},className:[String,Array,Object],id:String,popupClass:[String,Array,Object],collision:{type:Object,default:function(){return{horizontal:c,vertical:p}}},anchorAlign:{type:Object,default:function(){return{horizontal:u,vertical:f}}},popupAlign:{type:Object,default:function(){return{horizontal:u,vertical:m}}},offset:{type:Object,default:function(){return _}},show:{type:Boolean,default:!1},animate:{type:[Boolean,Object],default:!0},direction:{type:String,default:"down"},margin:Object,positionMode:String,scale:Number,role:String,ariaLabelledBy:String,ariaDescribedBy:String,onOpen:Function,onClose:Function,onPosition:Function,onMousedownoutside:Function},inject:{kCurrentZIndex:{default:null}},data:()=>({hasMounted:!1,animationOpen:!1}),watch:{anchor(e){!this.hasMounted||!i.canUseDOM||(this.mountedAnchor=e?this.getParentRef(e,!0):document.body,this.reposition())},appendTo(e){!this.hasMounted||!i.canUseDOM||(this.mountedAppendTo=e?this.getParentRef(e):document.body,this.$el.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(this.$el),this.reposition())},show(e,t){if(t&&!e)if(this._cancelPendingAnimations(),this._opened&&(this._opened=!1,this.onClosing()),0===this.transitionDuration().exit)this.onClosed();else{this._exitingAnimation=!0;const e=this._animationGeneration;this.$nextTick(()=>{if(e!==this._animationGeneration)return;const t=this.$el;if(!t||!this._exitingAnimation)return this._exitingAnimation=!1,this.$forceUpdate(),void this.onClosed();const n=t.firstChild;n?this.animateElement(n,"exit",()=>{e===this._animationGeneration&&(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())}):(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())})}else!t&&e&&(this._cancelPendingAnimations(),this._exitingAnimation=!1)}},created(){i.validatePackage(y),this.mountedAppendTo=void 0,this.mountedAnchor=void 0,this._clonedElement=void 0,this._flipped=!1,this._offsetTop=0,this._offsetLeft=-1e3,this._opened=!1,this._exitingAnimation=!1,this._animationGeneration=0,this._enterTimerId=null,this._cancelAnimation=null,this._resizeObserver=void 0,this._domService=new v,this._alignService=new g(this._domService),this._positionService=new w(this._domService),this.reposition=function(e,t,n={}){let i,o,s,r,l=0;n=n||{};const a=function(){l=!1===n.leading?0:(new Date).getTime(),i=null,r=e.apply(o,s),i||(o=s=null)};return function(){const d=(new Date).getTime();!l&&!1===n.leading&&(l=d);const h=t-(d-l);return o=this,s=arguments,h<=0||h>t?(i&&(clearTimeout(i),i=null),l=d,r=e.apply(o,s),i||(o=s=null)):!i&&!1!==n.trailing&&(i=setTimeout(a,h)),r}}(this.reposition.bind(this),d)},mounted(){i.canUseDOM&&(this.mountedAppendTo=this.appendTo?this.getParentRef(this.appendTo):document.body,this.mountedAnchor=this.anchor?this.getParentRef(this.anchor,!0):document.body),this._parentElement=this.$el.parentElement,this._clonedElement=this.$el.cloneNode(!0),this.hasMounted=!0,this.mountedAppendTo.appendChild(this.$el),this.$forceUpdate()},updated(){if(this.hasMounted&&this.mountedAppendTo){const e=this.$el;1===(null==e?void 0:e.nodeType)&&e.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(e)}},unmounted(){this.detachRepositionHandlers(),this.detachResizeObserver(),"undefined"!=typeof window&&window.removeEventListener("mousedown",this.handleMouseDown)},beforeUnmount(){this._parentElement&&this._parentElement.appendChild(this.$el)},methods:{handleMouseDown(e){var t,n;const i=null===(null==(t=null==e?void 0:e.target)?void 0:t.closest(".k-animation-container")),o=(null==(n=this.mountedAnchor)?void 0:n.contains(null==e?void 0:e.target))||!1;if(i){const t={target:this,event:e,isAnchorClicked:o};this.$emit("mousedownoutside",t),"undefined"!=typeof window&&window.removeEventListener("mousedown",this.handleMouseDown)}},onOpened(){var e,t;const n=this.$el;"undefined"!=typeof window&&window.addEventListener("mousedown",this.handleMouseDown),this.$props.show&&(n.classList.add(b),this.animationOpen=!0),this.attachRepositionHandlers(n),this.attachResizeObserver(n);const i={target:this};null==(t=(e=this.$props).onOpen)||t.call(e,i),this.$emit("open",i)},onClosing(){this.$props.show||(this.$el.classList.remove(b),this.animationOpen=!1),this.detachRepositionHandlers(),this.detachResizeObserver(),"undefined"!=typeof window&&window.removeEventListener("mousedown",this.handleMouseDown)},onClosed(){var e,t;const n={target:this};null==(t=(e=this.$props).onClose)||t.call(e,n),this.$emit("close",n)},transitionDuration(){const e=this.$props.animate;let t=0,n=0;return e&&(!0===e?t=n=300:(t=e.openDuration||0,n=e.closeDuration||0)),{enter:t,exit:n}},_cancelPendingAnimations(){this._animationGeneration++,null!==this._enterTimerId&&(clearTimeout(this._enterTimerId),this._enterTimerId=null),this._cancelAnimation&&(this._cancelAnimation(),this._cancelAnimation=null)},animateElement(e,t,n){const i=this.transitionDuration()[t];if(0===i)return n();const o=e.ownerDocument,s=null==o?void 0:o.defaultView;if(!s)return n();const r="down"===this.$props.direction,l=this._flipped?"up":"down",a=this._flipped?"down":"up",d=r?l:a,h=`k-slide-${d}-${t}`,c=`k-slide-${d}-${t}-active`;let p=!1,u=null;const f=()=>{e.removeEventListener("transitionend",g),u&&(clearTimeout(u),u=null),e.style.transitionDuration="",e.classList.remove(h,c)},m=()=>{p||(p=!0,f(),e.style.display="exit"===t?"none":"",this._cancelAnimation=null,n())},g=t=>{t.target===e&&m()};e.addEventListener("transitionend",g),u=setTimeout(m,i+50),e.style.transitionDuration="",e.classList.remove(h,c),"enter"===t&&(e.style.display=""),e.classList.add(h),s.requestAnimationFrame(()=>{p||(e.style.transitionDuration=i+"ms",e.classList.add(c))}),this._cancelAnimation=()=>{p||(p=!0,f(),e.style.display="")}},isAnimationInstant(e){if(0===this.transitionDuration()[e])return!0;if("undefined"!=typeof window&&this.$el){const e=this.$el.firstChild;if(e){const t=window.getComputedStyle(e),n=parseFloat(t.transitionDuration||"0"),i=parseFloat(t.animationDuration||"0");if(0===n&&0===i)return!0}}return!1},getParentRef(e,t){if(e instanceof HTMLElement)return e;if(!e)return document.body;let n=this.$parent;for(;n&&!n.$refs[e];){if(n&&n.kendoAnchorRef&&t)return n.kendoAnchorRef;if(n=n.$parent,!n&&i.canUseDOM)return document.getElementById(e)||document.body}return n.$refs[e].$el||n.$refs[e]},position(e,t,i,o){var s,r,l,a;const{anchorAlign:d,popupAlign:h,collision:c,offset:p}=e,u=o||1,f=i?this.mountedAnchor:document.body;if(1===u){const n=this._alignService.alignElement({anchor:i?f:void 0,element:t,elementAlign:h,anchorAlign:d,offset:p}),o=this._positionService.positionElement({anchor:f,anchorAlign:d,collisions:c,element:t,currentLocation:n,elementAlign:h});return this.applyMargin(o,e)}const m=n.alignElement({anchor:i?f:void 0,element:t,elementAlign:h,anchorAlign:d,offset:p,margin:{horizontal:(null==(s=e.margin)?void 0:s.horizontal)||0,vertical:(null==(r=e.margin)?void 0:r.vertical)||0},positionMode:e.positionMode,scale:u});return n.positionElement({anchor:f,anchorAlign:d,collisions:c,element:t,currentLocation:m,elementAlign:h,margin:{horizontal:(null==(l=e.margin)?void 0:l.horizontal)||0,vertical:(null==(a=e.margin)?void 0:a.vertical)||0},scale:u})},applyMargin(e,t){var n,i,o,s,r,l,a,d;const h=t.margin;if(!h||!e.offset)return e;const c={...e.offset},p=h.horizontal||0,u=h.vertical||0,f=e.flipped?-1:1;return"left"===(null==(n=t.anchorAlign)?void 0:n.horizontal)&&"right"===(null==(i=t.popupAlign)?void 0:i.horizontal)?c.left-=p*f:"right"===(null==(o=t.anchorAlign)?void 0:o.horizontal)&&"left"===(null==(s=t.popupAlign)?void 0:s.horizontal)&&(c.left+=p*f),"top"===(null==(r=t.anchorAlign)?void 0:r.vertical)&&"bottom"===(null==(l=t.popupAlign)?void 0:l.vertical)?c.top-=u*f:"bottom"===(null==(a=t.anchorAlign)?void 0:a.vertical)&&"top"===(null==(d=t.popupAlign)?void 0:d.vertical)&&(c.top+=u*f),{...e,offset:c}},calculatePosition(e,n){if(!n||!r()||!i.canUseDOM)return{flipped:!1,offset:e.offset};const o=i.getDefaultSlots(this),s=document.createElement("div"),l=this.$el&&this.$el.firstChild&&this.$el.firstChild.firstChild?this.$el.firstChild.firstChild.cloneNode(!0):null,a=l&&l.getBoundingClientRect?l:this._clonedElement;if(a)s.appendChild(a);else{const e=o&&o[0].props?o[0].props.class:"";t.render(t.h("div",{class:"k-animation-container k-animation-container-relative"},t.h("div",{class:"k-popup k-animation-container k-animation-container-relative"},t.h("div",{class:[e,this.$props.popupClass]}))),s)}if(n.appendChild(s),s&&s.firstChild){const e=s.firstChild;e.style.position="absolute",e.style.visibility="hidden",e.style.display="block",e.style.left="-1000",e.style.top="0";const t=o&&o[0].props?o[0].props.style:{};if(t)for(const[n,i]of Object.entries(t))e.style[n]=i}const d=s.firstChild,h=parseFloat(window.getComputedStyle(d).width),c=h>0?d.getBoundingClientRect().width/h:1,p=(this.$props.scale||1)*c,u=this.position(e,d,this.$props.anchor,p);return t.render(null,s),s.parentNode.removeChild(s),u},attachRepositionHandlers(e){this.detachRepositionHandlers(),this._scrollableParents=this._domService.scrollableParents(this.$props.anchor?this.mountedAnchor:e),this._scrollableParents.map(e=>e.addEventListener("scroll",this.reposition)),r()&&window.addEventListener("resize",this.reposition)},detachRepositionHandlers(){this._scrollableParents&&(this._scrollableParents.map(e=>e.removeEventListener("scroll",this.reposition)),this._scrollableParents=void 0),r()&&window.removeEventListener("resize",this.reposition)},attachResizeObserver(e){this.detachResizeObserver(),"undefined"!=typeof ResizeObserver&&(this._resizeObserver=new ResizeObserver(()=>this.reposition()),this._resizeObserver.observe(e))},detachResizeObserver(){var e;null==(e=this._resizeObserver)||e.disconnect(),this._resizeObserver=void 0},reposition(){this._clonedElement=this.$el.cloneNode(!0),this.$forceUpdate()},getCurrentZIndex(){return this.kCurrentZIndex?this.kCurrentZIndex+1:100},hasCustomOffset:e=>!!e&&(e.left!==_.left||e.top!==_.top)},render(){var e,n;const{className:o,popupClass:s,show:l,id:a}=this.$props,d=i.getDefaultSlots(this),h=d,c=this.hasCustomOffset(this.$props.offset)?A:void 0,p=r()?this.$props.appendTo?this.mountedAppendTo||this.getParentRef(this.$props.appendTo):document.body:void 0;if(this.$props.show){const t=this.calculatePosition(this.$props,p);this._offsetLeft=t.offset.left,this._offsetTop=t.offset.top,this._flipped=!!t.flipped;const i={target:this,fitted:!!t.fitted,flipped:!!t.flipped};null==(n=(e=this.$props).onPosition)||n.call(e,i),this.$emit("position",i)}const u=this.getCurrentZIndex();if(!this.hasMounted)return t.createVNode("div",{id:a,style:{display:"none",...this.$props.style},class:o},[t.createVNode("div",{class:[s,$],style:c},[d])]);if((l||this._exitingAnimation)&&p){const e={zIndex:u,position:this.$props.positionMode||"absolute",top:this._offsetTop+"px",left:this._offsetLeft+"px",pointerEvents:l?"auto":"none",...this.$props.style};if(l&&!this._opened){this._opened=!0;const e=this._animationGeneration;0===this.transitionDuration().enter?this._enterTimerId=setTimeout(()=>{this._enterTimerId=null,e===this._animationGeneration&&(!this.$props.show||!this._opened||this.onOpened())},0):this.$nextTick(()=>{if(e!==this._animationGeneration||!this.$props.show||!this._opened)return;const t=this.$el;if(!t)return;const n=t.firstChild;n?this.animateElement(n,"enter",()=>{e===this._animationGeneration&&this.$props.show&&this.onOpened()}):this.onOpened()})}const n=this.animationOpen?b:"";return t.createVNode("div",{id:a,class:["k-animation-container",n,o],style:e,onKeydown:e=>{this.$emit("keydown",e)}},[t.createVNode("div",{class:["k-child-animation-container"],style:{transitionDelay:"0ms",display:"block"}},[t.createVNode("div",{role:this.$props.role,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,class:[s,$]},[h])])])}return t.createVNode("div",{id:a,style:{display:"none"},class:o},null)}});e.Popup=C});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("@progress/kendo-popup-common"),require("@progress/kendo-vue-common")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-popup-common","@progress/kendo-vue-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoVuePopup={},e.Vue,e.KendoPopupCommon,e.KendoVueCommon)}(this,function(e,t,n,i){"use strict";const o=(e,t)=>e||{height:0,left:t.left,top:t.top,width:0},s=()=>"undefined"!=typeof document&&!!document.body,r=()=>"undefined"!=typeof window,l=/auto|scroll/,a=e=>{const t=window.getComputedStyle(e);return`${t.overflow}${t.overflowX}${t.overflowY}`},d=1e3/60,c=(()=>{if(!s())return!1;const e=document.createElement("div");if(e.style.transform="matrix(10, 0, 0, 10, 0, 0)",e.innerHTML="<div>child</div>",document.body.appendChild(e),e&&e.firstChild){const t=e.firstChild;t.style.position="fixed",t.style.top="10px"}const t=10!==e.children[0].getBoundingClientRect().top;return document.body.removeChild(e),t})(),h="fit",p="flip",u="left",f="bottom",m="top";class v{constructor(e){this._dom=e}alignElement(e){const{anchor:t,element:n,anchorAlign:i,elementAlign:o,offset:s}=e,r=this._dom.hasOffsetParent(n)?this.relativeRect(t,n,s):this.absoluteRect(t,n,s);return this._dom.align({anchorAlign:i,anchorRect:r,elementAlign:o,elementRect:this._dom.offset(n)})}absoluteRect(e,t,n){const i=this._dom,s=((e,t)=>t?{height:e.height,left:e.left-t.left,top:e.top-t.top,width:e.width}:e)(o(i.offset(e),n),i.stackingElementOffset(t)),r=i.stackingElementScroll(t),l=i.addScroll(s,r),a=this.elementScrollPosition(e,t),d=i.removeScroll(l,a);return d.left+=window.scrollX||window.pageXOffset,d.top+=window.scrollY||window.pageYOffset,d}elementScrollPosition(e,t){return e?{x:0,y:0}:this._dom.scrollPosition(t)}relativeRect(e,t,n){return o(this._dom.position(e,t),n)}}let g=class{addOffset(e,t){return{left:e.left+t.left,top:e.top+t.top}}align(e){return n.align(e)}boundingOffset(e){return n.boundingOffset(e)}getWindow(){return r()?window:null}isBodyOffset(e){return n.isBodyOffset(e)}hasOffsetParent(e){if(!e)return!1;const t=e.offsetParent;return t&&!("BODY"===t.nodeName&&"static"===window.getComputedStyle(t).position)}offset(e){return e?n.offset(e):null}staticOffset(e){if(!e)return null;const{left:t,top:i}=e.style;e.style.left="0px",e.style.top="0px";const o=n.offset(e);return e.style.left=t,e.style.top=i,o}position(e,t){if(!e||!t)return null;const i=n.siblingContainer(e,t);return n.positionWithScroll(e,i)}relativeOffset(e,t){return n.applyLocationOffset(this.offset(e),t,this.isBodyOffset(e))}addScroll(e,t){return n.addScroll(e,t)}removeScroll(e,t){return n.removeScroll(e,t)}restrictToView(e){return n.restrictToView(e)}scrollPosition(e){return n.scrollPosition(e)}scrollableParents(e){return(e=>{const t=[];if(!s()||!r())return t;let n=e.parentElement;for(;n;)l.test(a(n))&&t.push(n),n=n.parentElement;return t.push(window),t})(e)}stackingElementOffset(e){const t=this.getRelativeContextElement(e);return t?n.offset(t):null}stackingElementScroll(e){const t=this.getRelativeContextElement(e);return t?{x:t.scrollLeft,y:t.scrollTop}:{x:0,y:0}}stackingElementViewPort(e){const t=this.getRelativeContextElement(e);return t?{height:t.scrollHeight,width:t.scrollWidth}:null}getRelativeContextElement(e){if(!e||!c)return null;let t=e.parentElement;for(;t;){if("none"!==window.getComputedStyle(t).transform)return t;t=t.parentElement}return null}useRelativePosition(e){return!!this.getRelativeContextElement(e)}windowViewPort(e){return n.getWindowViewPort(e)}zIndex(e,t){return((e,t)=>{if(!e||!s()||!r())return null;const i=n.siblingContainer(e,t);if(!i)return null;const o=[e].concat(n.parents(e,i)).reduce((e,t)=>{const n=t.style.zIndex||window.getComputedStyle(t).zIndex,i=parseInt(n,10);return i>e?i:e},0);return o?o+1:null})(e,t)}zoomLevel(){return s()&&r()?parseFloat((document.documentElement.clientWidth/window.innerWidth).toFixed(2)):1}isZoomed(){return this.zoomLevel()>1}};class w{constructor(e){this._dom=e}positionElement(e){const{anchor:t,currentLocation:n,element:i,anchorAlign:s,elementAlign:r,collisions:l}=e,a=this._dom,d=e.viewPort||a.stackingElementViewPort(i)||a.windowViewPort(i),c=o(a.offset(t),n),h=((e,t)=>t?{height:e.height,left:t.left,top:t.top,width:e.width}:e)(a.staticOffset(i),n),p=this.elementRect(i,h),u=a.restrictToView({anchorAlign:s,anchorRect:c,collisions:l,elementAlign:r,elementRect:p,viewPort:d});return{fitted:u.fitted,flipped:u.flipped,offset:a.addOffset(h,u.offset)}}elementRect(e,t){return this._dom.removeScroll(t,this._dom.scrollPosition(e))}}const y={name:"@progress/kendo-vue-popup",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate:1657007252,version:"10.2.0-develop.12",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"},_={left:-1e3,top:0},b="k-animation-container-shown",A="k-popup",$={margin:"0"},O=t.defineComponent({name:"Popup",emits:["open","close","position","keydown","mousedownoutside"],props:{appendTo:{type:[String,Object],default:""},anchor:{type:[String,Object],default:""},className:[String,Array,Object],id:String,popupClass:[String,Array,Object],collision:{type:Object,default:function(){return{horizontal:h,vertical:p}}},anchorAlign:{type:Object,default:function(){return{horizontal:u,vertical:f}}},popupAlign:{type:Object,default:function(){return{horizontal:u,vertical:m}}},offset:{type:Object,default:function(){return _}},show:{type:Boolean,default:!1},animate:{type:[Boolean,Object],default:!0},direction:{type:String,default:"down"},margin:Object,positionMode:String,scale:Number,role:String,ariaLabelledBy:String,ariaDescribedBy:String,onOpen:Function,onClose:Function,onPosition:Function,onMousedownoutside:Function},inject:{kCurrentZIndex:{default:null}},data:()=>({hasMounted:!1,animationOpen:!1}),watch:{anchor(e){!this.hasMounted||!i.canUseDOM||(this.mountedAnchor=e?this.getParentRef(e,!0):document.body,this.reposition())},appendTo(e){!this.hasMounted||!i.canUseDOM||(this.mountedAppendTo=e?this.getParentRef(e):document.body,this.$el.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(this.$el),this.reposition())},show(e,t){if(t&&!e)if(this._cancelPendingAnimations(),this._opened&&(this._opened=!1,this.onClosing()),0===this.transitionDuration().exit)this.onClosed();else{this._exitingAnimation=!0;const e=this._animationGeneration;this.$nextTick(()=>{if(e!==this._animationGeneration)return;const t=this.$el;if(!t||!this._exitingAnimation)return this._exitingAnimation=!1,this.$forceUpdate(),void this.onClosed();const n=t.firstChild;n?this.animateElement(n,"exit",()=>{e===this._animationGeneration&&(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())}):(this._exitingAnimation=!1,this.$forceUpdate(),this.onClosed())})}else!t&&e&&(this._cancelPendingAnimations(),this._exitingAnimation=!1)}},created(){i.validatePackage(y),this.mountedAppendTo=void 0,this.mountedAnchor=void 0,this._clonedElement=void 0,this._originalNextSibling=void 0,this._flipped=!1,this._offsetTop=0,this._offsetLeft=-1e3,this._opened=!1,this._exitingAnimation=!1,this._animationGeneration=0,this._enterTimerId=null,this._cancelAnimation=null,this._resizeObserver=void 0,this._domService=new g,this._alignService=new v(this._domService),this._positionService=new w(this._domService),this.reposition=function(e,t,n={}){let i,o,s,r,l=0;n=n||{};const a=function(){l=!1===n.leading?0:(new Date).getTime(),i=null,r=e.apply(o,s),i||(o=s=null)};return function(){const d=(new Date).getTime();!l&&!1===n.leading&&(l=d);const c=t-(d-l);return o=this,s=arguments,c<=0||c>t?(i&&(clearTimeout(i),i=null),l=d,r=e.apply(o,s),i||(o=s=null)):!i&&!1!==n.trailing&&(i=setTimeout(a,c)),r}}(this.reposition.bind(this),d)},mounted(){i.canUseDOM&&(this.mountedAppendTo=this.appendTo?this.getParentRef(this.appendTo):document.body,this.mountedAnchor=this.anchor?this.getParentRef(this.anchor,!0):document.body),this._parentElement=this.$el.parentElement,this._originalNextSibling=this.$el.nextSibling,this._clonedElement=this.$el.cloneNode(!0),this.hasMounted=!0,this.mountedAppendTo.appendChild(this.$el),this.$forceUpdate()},updated(){if(this.hasMounted&&this.mountedAppendTo){const e=this.$el;1===(null==e?void 0:e.nodeType)&&e.parentElement!==this.mountedAppendTo&&this.mountedAppendTo.appendChild(e)}},unmounted(){this.detachRepositionHandlers(),this.detachResizeObserver(),"undefined"!=typeof window&&window.removeEventListener("mousedown",this.handleMouseDown)},beforeUnmount(){if(this.hasMounted=!1,this._parentElement){const e=this._originalNextSibling;this._parentElement.insertBefore(this.$el,(null==e?void 0:e.parentNode)===this._parentElement?e:null)}},methods:{handleMouseDown(e){var t,n;const i=null===(null==(t=null==e?void 0:e.target)?void 0:t.closest(".k-animation-container")),o=(null==(n=this.mountedAnchor)?void 0:n.contains(null==e?void 0:e.target))||!1;if(i){const t={target:this,event:e,isAnchorClicked:o};this.$emit("mousedownoutside",t),"undefined"!=typeof window&&window.removeEventListener("mousedown",this.handleMouseDown)}},onOpened(){var e,t;const n=this.$el;"undefined"!=typeof window&&window.addEventListener("mousedown",this.handleMouseDown),this.$props.show&&(n.classList.add(b),this.animationOpen=!0),this.attachRepositionHandlers(n),this.attachResizeObserver(n);const i={target:this};null==(t=(e=this.$props).onOpen)||t.call(e,i),this.$emit("open",i)},onClosing(){this.$props.show||(this.$el.classList.remove(b),this.animationOpen=!1),this.detachRepositionHandlers(),this.detachResizeObserver(),"undefined"!=typeof window&&window.removeEventListener("mousedown",this.handleMouseDown)},onClosed(){var e,t;const n={target:this};null==(t=(e=this.$props).onClose)||t.call(e,n),this.$emit("close",n)},transitionDuration(){const e=this.$props.animate;let t=0,n=0;return e&&(!0===e?t=n=300:(t=e.openDuration||0,n=e.closeDuration||0)),{enter:t,exit:n}},_cancelPendingAnimations(){this._animationGeneration++,null!==this._enterTimerId&&(clearTimeout(this._enterTimerId),this._enterTimerId=null),this._cancelAnimation&&(this._cancelAnimation(),this._cancelAnimation=null)},animateElement(e,t,n){const i=this.transitionDuration()[t];if(0===i)return n();const o=e.ownerDocument,s=null==o?void 0:o.defaultView;if(!s)return n();const r="down"===this.$props.direction,l=this._flipped?"up":"down",a=this._flipped?"down":"up",d=r?l:a,c=`k-slide-${d}-${t}`,h=`k-slide-${d}-${t}-active`;let p=!1,u=null;const f=()=>{e.removeEventListener("transitionend",v),u&&(clearTimeout(u),u=null),e.style.transitionDuration="",e.classList.remove(c,h)},m=()=>{p||(p=!0,f(),e.style.display="exit"===t?"none":"",this._cancelAnimation=null,n())},v=t=>{t.target===e&&m()};e.addEventListener("transitionend",v),u=setTimeout(m,i+50),e.style.transitionDuration="",e.classList.remove(c,h),"enter"===t&&(e.style.display=""),e.classList.add(c),s.requestAnimationFrame(()=>{p||(e.style.transitionDuration=i+"ms",e.classList.add(h))}),this._cancelAnimation=()=>{p||(p=!0,f(),e.style.display="")}},isAnimationInstant(e){if(0===this.transitionDuration()[e])return!0;if("undefined"!=typeof window&&this.$el){const e=this.$el.firstChild;if(e){const t=window.getComputedStyle(e),n=parseFloat(t.transitionDuration||"0"),i=parseFloat(t.animationDuration||"0");if(0===n&&0===i)return!0}}return!1},getParentRef(e,t){if(e instanceof HTMLElement)return e;if(!e)return document.body;let n=this.$parent;for(;n&&!n.$refs[e];){if(n&&n.kendoAnchorRef&&t)return n.kendoAnchorRef;if(n=n.$parent,!n&&i.canUseDOM)return document.getElementById(e)||document.body}return n.$refs[e].$el||n.$refs[e]},position(e,t,i,o){var s,r,l,a,d,c;const{anchorAlign:h,popupAlign:p,collision:u,offset:f}=e,m=o||1,v=i?this.mountedAnchor:document.body;if(1===m){const n=this._alignService.alignElement({anchor:i?v:void 0,element:t,elementAlign:p,anchorAlign:h,offset:f}),o=this._positionService.positionElement({anchor:v,anchorAlign:h,collisions:u,element:t,currentLocation:n,elementAlign:p}),l=this.applyMargin(o,e);if(!((null==(s=e.margin)?void 0:s.horizontal)&&"fit"===(null==u?void 0:u.horizontal)||(null==(r=e.margin)?void 0:r.vertical)&&"fit"===(null==u?void 0:u.vertical))||!l.offset)return l;const a=this._positionService.positionElement({anchor:v,anchorAlign:h,collisions:{horizontal:"fit"===(null==u?void 0:u.horizontal)?"fit":"none",vertical:"fit"===(null==u?void 0:u.vertical)?"fit":"none"},element:t,currentLocation:l.offset,elementAlign:p});return{...l,offset:a.offset,fitted:l.fitted||a.fitted}}const g=n.alignElement({anchor:i?v:void 0,element:t,elementAlign:p,anchorAlign:h,offset:f,margin:{horizontal:(null==(l=e.margin)?void 0:l.horizontal)||0,vertical:(null==(a=e.margin)?void 0:a.vertical)||0},positionMode:e.positionMode,scale:m});return n.positionElement({anchor:v,anchorAlign:h,collisions:u,element:t,currentLocation:g,elementAlign:p,margin:{horizontal:(null==(d=e.margin)?void 0:d.horizontal)||0,vertical:(null==(c=e.margin)?void 0:c.vertical)||0},scale:m})},applyMargin(e,t){var n,i,o,s,r,l,a,d;const c=t.margin;if(!c||!e.offset)return e;const h={...e.offset},p=c.horizontal||0,u=c.vertical||0,f=e.flipped?-1:1;return"left"===(null==(n=t.anchorAlign)?void 0:n.horizontal)&&"right"===(null==(i=t.popupAlign)?void 0:i.horizontal)?h.left-=p*f:"right"===(null==(o=t.anchorAlign)?void 0:o.horizontal)&&"left"===(null==(s=t.popupAlign)?void 0:s.horizontal)&&(h.left+=p*f),"top"===(null==(r=t.anchorAlign)?void 0:r.vertical)&&"bottom"===(null==(l=t.popupAlign)?void 0:l.vertical)?h.top-=u*f:"bottom"===(null==(a=t.anchorAlign)?void 0:a.vertical)&&"top"===(null==(d=t.popupAlign)?void 0:d.vertical)&&(h.top+=u*f),{...e,offset:h}},calculatePosition(e,n){var o,s,l,a,d;if(!n||!r()||!i.canUseDOM)return{flipped:!1,offset:e.offset};const c=i.getDefaultSlots(this),h=document.createElement("div"),p=null!=(s=null==(o=this.$el)?void 0:o.querySelector)&&s.call(o,`.${A}`)?this.$el:this._clonedElement,u=null==(l=null==p?void 0:p.querySelector)?void 0:l.call(p,`.${A}`);let f;if(u&&(f=p.cloneNode(!1),f.removeAttribute("id"),f.removeAttribute("style"),f.appendChild(u.cloneNode(!0))),f)h.appendChild(f);else{const e=c&&c[0].props?c[0].props.class:"";t.render(t.h("div",{class:"k-animation-container k-animation-container-relative"},t.h("div",{class:"k-popup k-animation-container k-animation-container-relative"},t.h("div",{class:[e,this.$props.popupClass]}))),h)}if(n.appendChild(h),h&&h.firstChild){const e=h.firstChild;e.style.position="absolute",e.style.visibility="hidden",e.style.display="block",e.style.left="-1000",e.style.top="0";const n=t.normalizeStyle([this.$attrs.style,null==(d=null==(a=null==c?void 0:c[0])?void 0:a.props)?void 0:d.style]);if(n&&"object"==typeof n)for(const[t,i]of Object.entries(n))e.style[t]=i}const m=h.firstChild,v=parseFloat(window.getComputedStyle(m).width),g=v>0?m.getBoundingClientRect().width/v:1,w=(this.$props.scale||1)*g,y=this.position(e,m,this.$props.anchor,w);return t.render(null,h),h.parentNode.removeChild(h),y},attachRepositionHandlers(e){this.detachRepositionHandlers(),this._scrollableParents=this._domService.scrollableParents(this.$props.anchor?this.mountedAnchor:e),this._scrollableParents.map(e=>e.addEventListener("scroll",this.reposition)),r()&&window.addEventListener("resize",this.reposition)},detachRepositionHandlers(){this._scrollableParents&&(this._scrollableParents.map(e=>e.removeEventListener("scroll",this.reposition)),this._scrollableParents=void 0),r()&&window.removeEventListener("resize",this.reposition)},attachResizeObserver(e){this.detachResizeObserver(),"undefined"!=typeof ResizeObserver&&(this._resizeObserver=new ResizeObserver(()=>this.reposition()),this._resizeObserver.observe(e))},detachResizeObserver(){var e;null==(e=this._resizeObserver)||e.disconnect(),this._resizeObserver=void 0},reposition(){this._clonedElement=this.$el.cloneNode(!0),this.$forceUpdate()},getCurrentZIndex(){return this.kCurrentZIndex?this.kCurrentZIndex+1:100},hasCustomOffset:e=>!!e&&(e.left!==_.left||e.top!==_.top)},render(){var e,n;const{className:o,popupClass:s,show:l,id:a}=this.$props,d=i.getDefaultSlots(this),c=d,h=this.hasCustomOffset(this.$props.offset)?$:void 0,p=r()?this.$props.appendTo?this.mountedAppendTo||this.getParentRef(this.$props.appendTo):document.body:void 0;if(this.$props.show){const t=this.calculatePosition(this.$props,p);this._offsetLeft=t.offset.left,this._offsetTop=t.offset.top,this._flipped=!!t.flipped;const i={target:this,fitted:!!t.fitted,flipped:!!t.flipped};null==(n=(e=this.$props).onPosition)||n.call(e,i),this.$emit("position",i)}const u=this.getCurrentZIndex();if(!this.hasMounted)return t.createVNode("div",{id:a,style:{display:"none",...this.$props.style},class:o},[t.createVNode("div",{class:[s,A],style:h},[d])]);if((l||this._exitingAnimation)&&p){const e={zIndex:u,position:this.$props.positionMode||"absolute",top:this._offsetTop+"px",left:this._offsetLeft+"px",pointerEvents:l?"auto":"none",...this.$props.style};if(l&&!this._opened){this._opened=!0;const e=this._animationGeneration;0===this.transitionDuration().enter?this._enterTimerId=setTimeout(()=>{this._enterTimerId=null,e===this._animationGeneration&&(!this.$props.show||!this._opened||this.onOpened())},0):this.$nextTick(()=>{if(e!==this._animationGeneration||!this.$props.show||!this._opened)return;const t=this.$el;if(!t)return;const n=t.firstChild;n?this.animateElement(n,"enter",()=>{e===this._animationGeneration&&this.$props.show&&this.onOpened()}):this.onOpened()})}const n=this.animationOpen?b:"";return t.createVNode("div",{id:a,class:["k-animation-container",n,o],style:e,onKeydown:e=>{this.$emit("keydown",e)}},[t.createVNode("div",{class:["k-child-animation-container"],style:{transitionDelay:"0ms",display:"block"}},[t.createVNode("div",{role:this.$props.role,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,class:[s,A]},[c])])])}return t.createVNode("div",{id:a,style:{display:"none"},class:o},null)}});e.Popup=O});

package/package-metadata.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-popup",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1793620331,version:"10.2.0-develop.10",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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-popup",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1793712216,version:"10.2.0-develop.12",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

@@ -10,8 +10,8 @@ const e = {
   productName: "Kendo UI for Vue",
   productCode: "KENDOUIVUE",
   productCodes: ["KENDOUIVUE"],
-  publishDate: 1793620331,
-  version: "10.2.0-develop.10",
+  publishDate: 1793712216,
+  version: "10.2.0-develop.12",
   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"
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-vue-popup",
-  "version": "10.2.0-develop.10",
+  "version": "10.2.0-develop.12",
   "description": "Kendo UI for Vue Popup package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -26,8 +26,8 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.12.0",
-    "@progress/kendo-vue-animation": "10.2.0-develop.10",
-    "@progress/kendo-vue-common": "10.2.0-develop.10",
+    "@progress/kendo-vue-animation": "10.2.0-develop.12",
+    "@progress/kendo-vue-common": "10.2.0-develop.12",
     "vue": "^3.0.2"
   },
   "dependencies": {
@@ -45,7 +45,7 @@
     "package": {
       "productName": "Kendo UI for Vue",
       "productCode": "KENDOUIVUE",
-      "publishDate": 1793620331,
+      "publishDate": 1793712216,
       "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"
     }
   },