@progress/kendo-vue-popup 9.3.0-develop.5 → 9.3.0-develop.6

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:"9.3.0-develop.5",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,t){if(!t||!r()||!i.canUseDOM)return{flipped:!1,offset:e.offset};const n=i.getDefaultSlots(this),o=document.createElement("div"),s=this.$el&&this.$el.firstChild&&this.$el.firstChild.firstChild?this.$el.firstChild.firstChild.cloneNode(!0):null,l=s&&s.getBoundingClientRect?s:this._clonedElement;if(l)o.appendChild(l);else{const e=n&&n[0].props?n[0].props.class:"",t=this.$props.popupClass;o.innerHTML=`<div class="k-animation-container k-animation-container-relative">\n                        <div class="k-popup k-animation-container k-animation-container-relative">\n                            <div class="${e} ${t}" >\n                            </div>\n                        </div>\n                </div>`}if(t.appendChild(o),o&&o.firstChild){const e=o.firstChild;e.style.position="absolute",e.style.visibility="hidden",e.style.display="block",e.style.left="-1000",e.style.top="0";const t=n&&n[0].props?n[0].props.style:{};if(t)for(const[n,i]of Object.entries(t))e.style[n]=i}const a=o.firstChild,d=parseFloat(window.getComputedStyle(a).width),h=d>0?a.getBoundingClientRect().width/d:1,c=(this.$props.scale||1)*h,p=this.position(e,a,this.$props.anchor,c);return o.parentNode.removeChild(o),p},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,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:"9.3.0-develop.6",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,t){if(!t||!r()||!i.canUseDOM)return{flipped:!1,offset:e.offset};const n=i.getDefaultSlots(this),o=document.createElement("div"),s=this.$el&&this.$el.firstChild&&this.$el.firstChild.firstChild?this.$el.firstChild.firstChild.cloneNode(!0):null,l=s&&s.getBoundingClientRect?s:this._clonedElement;if(l)o.appendChild(l);else{const e=n&&n[0].props?n[0].props.class:"",t=this.$props.popupClass;o.innerHTML=`<div class="k-animation-container k-animation-container-relative">\n                        <div class="k-popup k-animation-container k-animation-container-relative">\n                            <div class="${e} ${t}" >\n                            </div>\n                        </div>\n                </div>`}if(t.appendChild(o),o&&o.firstChild){const e=o.firstChild;e.style.position="absolute",e.style.visibility="hidden",e.style.display="block",e.style.left="-1000",e.style.top="0";const t=n&&n[0].props?n[0].props.style:{};if(t)for(const[n,i]of Object.entries(t))e.style[n]=i}const a=o.firstChild,d=parseFloat(window.getComputedStyle(a).width),h=d>0?a.getBoundingClientRect().width/d:1,c=(this.$props.scale||1)*h,p=this.position(e,a,this.$props.anchor,c);return o.parentNode.removeChild(o),p},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});

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: 1788276473,version:"9.3.0-develop.5",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: 1788336206,version:"9.3.0-develop.6",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: 1788276473,
-  version: "9.3.0-develop.5",
+  publishDate: 1788336206,
+  version: "9.3.0-develop.6",
   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": "9.3.0-develop.5",
+  "version": "9.3.0-develop.6",
   "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.7.2",
-    "@progress/kendo-vue-animation": "9.3.0-develop.5",
-    "@progress/kendo-vue-common": "9.3.0-develop.5",
+    "@progress/kendo-vue-animation": "9.3.0-develop.6",
+    "@progress/kendo-vue-common": "9.3.0-develop.6",
     "vue": "^3.0.2"
   },
   "dependencies": {
@@ -45,7 +45,7 @@
     "package": {
       "productName": "Kendo UI for Vue",
       "productCode": "KENDOUIVUE",
-      "publishDate": 1788276473,
+      "publishDate": 1788336206,
       "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"
     }
   },