@dialpad/dialtone-vue/dist/lib/hovercard/hovercard.cjs

Vue component library for Dialpad's design system Dialtone

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../common/utils/index.cjs"),i=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),r=require("../tooltip/tooltip-constants.cjs"),l=require("../popover/popover.cjs"),s=require("../popover/popover-constants.cjs"),u={name:"DtHovercard",components:{DtPopover:l.default},props:{open:{type:Boolean,default:null},transition:{type:Boolean,default:!1},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"top-start",validator(t){return r.TOOLTIP_DIRECTIONS.includes(t)}},padding:{type:String,default:"large",validator:t=>Object.keys(s.POPOVER_PADDING_CLASSES).some(e=>e===t)},offset:{type:Array,default:()=>[0,16]},id:{type:String,default(){return a.getUniqueString()}},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},contentClass:{type:[String,Array,Object],default:""},appendTo:{type:[HTMLElement,String],default:"body",validator:t=>s.POPOVER_APPEND_TO_VALUES.includes(t)||t instanceof HTMLElement},enterDelay:{type:Number,default:r.TOOLTIP_DELAY_MS},leaveDelay:{type:Number,default:r.TOOLTIP_DELAY_MS}},emits:["opened"],data(){return{hovercardOpen:this.open,anchorEl:null,observer:null,inTimer:null,outTimer:null,contentFocused:!1,mouseOverHovercard:!1}},watch:{open:{handler:function(t){this.hovercardOpen=t},immediate:!0}},mounted(){this.$nextTick(()=>{var t,e,o;this.anchorEl=(o=(e=(t=this.$refs.popover)==null?void 0:t.$refs)==null?void 0:e.anchor)==null?void 0:o.firstElementChild,this.observer=new MutationObserver(()=>{this.anchorEl&&!this.anchorEl.isConnected&&(this.hovercardOpen=!1)}),this.observer.observe(document.body,{childList:!0,subtree:!0})})},beforeDestroy(){this.observer&&this.observer.disconnect(),clearTimeout(this.inTimer),clearTimeout(this.outTimer)},methods:{setInTimer(){this.open===null&&(clearTimeout(this.outTimer),this.inTimer=setTimeout(()=>{this.hovercardOpen=!0},this.enterDelay))},setOutTimer(){this.open===null&&(clearTimeout(this.inTimer),this.outTimer=setTimeout(()=>{this.hovercardOpen=!1},this.leaveDelay))},onMouseEnter(){this.mouseOverHovercard=!0,this.setInTimer()},onMouseLeave(){this.mouseOverHovercard=!1,!this.contentFocused&&this.open===null&&(clearTimeout(this.inTimer),this.setOutTimer())},onContentFocusIn(){this.contentFocused=!0,this.setInTimer()},onContentFocusOut(){this.contentFocused=!1,this.mouseOverHovercard||this.setOutTimer()}}};var c=function(){var e=this,o=e._self._c;return o("dt-popover",{ref:"popover",attrs:{id:e.id,open:e.hovercardOpen,placement:e.placement,"content-class":e.contentClass,"dialog-class":e.dialogClass,"fallback-placements":e.fallbackPlacements,padding:e.padding,transition:e.transition?"fade":null,offset:e.offset,modal:!1,"initial-focus-element":"none","header-class":e.headerClass,"footer-class":e.footerClass,"append-to":e.appendTo,"data-qa":"dt-hovercard","enter-delay":e.enterDelay,"leave-delay":e.leaveDelay},on:{opened:n=>e.$emit("opened",n),"mouseenter-popover":e.onMouseEnter,"mouseleave-popover":e.onMouseLeave,"mouseenter-popover-anchor":e.onMouseEnter,"mouseleave-popover-anchor":e.onMouseLeave},scopedSlots:e._u([{key:"anchor",fn:function({attrs:n}){return[e._t("anchor",null,null,n)]}},{key:"content",fn:function(){return[o("div",{on:{focusin:e.onContentFocusIn,focusout:e.onContentFocusOut}},[e._t("content")],2)]},proxy:!0},{key:"headerContent",fn:function(){return[e._t("headerContent")]},proxy:!0},{key:"footerContent",fn:function(){return[e._t("footerContent")]},proxy:!0}],null,!0)})},d=[],p=i.n(u,c,d);const f=p.exports;exports.default=f;
//# sourceMappingURL=hovercard.cjs.map