@dialpad/dialtone-vue
Version:
Vue component library for Dialpad's design system Dialtone
3 lines (2 loc) • 1.37 kB
JavaScript
;Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("../../common/utils/index.cjs"),n=require("../tooltip/tooltip.cjs"),a={name:"dt-tooltip-directive",install(d){const s=document.createElement("div");document.body.appendChild(s);const u="top",l=new d({name:"DtTooltipDirectiveApp",components:{DtTooltip:n.default},data(){return{tooltips:[]}},methods:{addOrUpdateTooltip(t,o,e){const i=this.tooltips.findIndex(p=>p.id===t);i!==-1?(this.tooltips[i].message=o,this.tooltips[i].placement=e):this.tooltips.push({id:t,message:o,placement:e})},removeTooltip(t){this.tooltips=this.tooltips.filter(o=>o.id!==t)}},render(t){return t("div",{domProps:{id:"dt-tooltip-directive-app"}},[this.tooltips.map(({id:o,message:e,placement:i})=>t(n.default,{key:o,props:{message:e,placement:i,sticky:!0,delay:process.env.NODE_ENV!=="test",externalAnchor:`[data-dt-tooltip-id="${o}"]`}}))])}});l.$mount(s),d.directive("dt-tooltip",{bind(t,o){r(t,o)},update(t,o){o.value!==o.oldValue&&r(t,o)},unbind(t){l.removeTooltip(t.getAttribute("data-dt-tooltip-id"))}});function r(t,o){const e=t.getAttribute("data-dt-tooltip-id")||c.getUniqueString(),i=o.value,p=o.arg||u;t.setAttribute("data-dt-tooltip-id",e),l.addOrUpdateTooltip(e,i,p)}}};exports.DtTooltipDirective=a;exports.default=a;
//# sourceMappingURL=tooltip.cjs.map