@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
2 lines • 3.56 kB
JavaScript
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../tooltip/tooltip-constants.cjs`),n=require(`../popover/popover-constants.cjs`),r=require(`../popover/popover.cjs`);let i=require(`vue`);var a={__name:`hovercard`,props:{transition:{type:Boolean,default:!1},open:{type:Boolean,default:null},fallbackPlacements:{type:Array,default:()=>[`auto`]},placement:{type:String,default:`top-start`,validator(e){return t.TOOLTIP_DIRECTIONS.includes(e)}},padding:{type:String,default:`large`,validator:e=>Object.keys(n.POPOVER_PADDING_CLASSES).some(t=>t===e)},offset:{type:Array,default:()=>[0,16]},id:{type:String,default(){return e.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:e=>n.POPOVER_APPEND_TO_VALUES.includes(e)||e instanceof HTMLElement},enterDelay:{type:Number,default:300},leaveDelay:{type:Number,default:300},externalAnchorElement:{type:HTMLElement,default:null}},emits:[`opened`],setup(e,{expose:t}){let n=e,a=(0,i.ref)(n.open),o=(0,i.ref)(!1),s=(0,i.ref)(!1),c=(0,i.ref)(null),l=(0,i.ref)(null),u=(0,i.ref)(null),d=(0,i.ref)(null),f=(0,i.ref)(null);(0,i.onMounted)(()=>{(0,i.nextTick)(()=>{u.value=f.value?.$refs?.anchor?.firstElementChild,d.value=new MutationObserver(()=>{u.value&&!u.value.isConnected&&(a.value=!1)}),d.value.observe(document.body,{childList:!0,subtree:!0})})}),(0,i.onBeforeUnmount)(()=>{d.value&&d.value.disconnect(),clearTimeout(c),clearTimeout(l)}),(0,i.watch)(()=>n.open,e=>{a.value=e},{immediate:!0}),t({show:h,hide:g});function p(){n.open===null&&(clearTimeout(l.value),c.value=setTimeout(()=>{a.value=!0},n.enterDelay))}function m(){n.open===null&&(clearTimeout(c.value),l.value=setTimeout(()=>{a.value=!1},n.leaveDelay))}function h(){s.value=!0,p()}function g(){s.value=!1,!o.value&&m()}function _(){o.value=!0,p()}function v(){o.value=!1,s.value||m()}return(t,n)=>((0,i.openBlock)(),(0,i.createBlock)((0,i.unref)(r.default),{id:e.id,ref_key:`popover`,ref:f,open:a.value,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,"external-anchor-element":e.externalAnchorElement,"data-qa":`dt-hovercard`,"enter-delay":e.enterDelay,"leave-delay":e.leaveDelay,onOpened:n[0]||(n[0]=e=>t.$emit(`opened`,e)),onMouseenterPopover:h,onMouseleavePopover:g,onMouseenterPopoverAnchor:h,onMouseleavePopoverAnchor:g},{anchor:(0,i.withCtx)(({attrs:e})=>[(0,i.renderSlot)(t.$slots,`anchor`,(0,i.normalizeProps)((0,i.guardReactiveProps)(e)))]),content:(0,i.withCtx)(()=>[(0,i.createElementVNode)(`div`,{onFocusin:_,onFocusout:v},[(0,i.renderSlot)(t.$slots,`content`)],32)]),headerContent:(0,i.withCtx)(()=>[(0,i.renderSlot)(t.$slots,`headerContent`)]),footerContent:(0,i.withCtx)(()=>[(0,i.renderSlot)(t.$slots,`footerContent`)]),_:3},8,[`id`,`open`,`placement`,`content-class`,`dialog-class`,`fallback-placements`,`padding`,`transition`,`offset`,`header-class`,`footer-class`,`append-to`,`external-anchor-element`,`enter-delay`,`leave-delay`]))}};exports.default=a;
//# sourceMappingURL=hovercard.cjs.map