@vue-interface/tooltip 1.0.0-beta.11 → 1.0.0-beta.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/tooltip.js +27 -26
  2. package/dist/tooltip.js.map +1 -1
  3. package/dist/tooltip.umd.cjs +1 -1
  4. package/dist/tooltip.umd.cjs.map +1 -1
  5. package/package.json +1 -1
  6. package/src/TooltipPlugin.ts +5 -1
package/dist/tooltip.js CHANGED
@@ -82,8 +82,8 @@ const I = $({
82
82
  I
83
83
  ]
84
84
  });
85
- const k = (s, d) => {
86
- const p = s.__vccOpts || s;
85
+ const k = (l, d) => {
86
+ const p = l.__vccOpts || l;
87
87
  for (const [a, n] of d)
88
88
  p[a] = n;
89
89
  return p;
@@ -94,21 +94,21 @@ const k = (s, d) => {
94
94
  ref: "inner",
95
95
  class: "tooltip-inner"
96
96
  };
97
- function q(s, d, p, a, n, m) {
97
+ function q(l, d, p, a, n, m) {
98
98
  return A(), S("div", {
99
- class: N(["tooltip", s.tooltipClasses]),
99
+ class: N(["tooltip", l.tooltipClasses]),
100
100
  role: "tooltip"
101
101
  }, [
102
102
  _("div", F, null, 512),
103
103
  _("div", M, [
104
- O(s.$slots, "default", {}, () => [
105
- L(j(s.title), 1)
104
+ O(l.$slots, "default", {}, () => [
105
+ L(j(l.title), 1)
106
106
  ])
107
107
  ], 512)
108
108
  ], 2);
109
109
  }
110
110
  const H = /* @__PURE__ */ k(R, [["render", q]]);
111
- function W(s, d = {}) {
111
+ function W(l, d = {}) {
112
112
  const p = /* @__PURE__ */ new Map(), a = Object.assign({
113
113
  delay: void 0,
114
114
  prefix: "data-tooltip",
@@ -118,38 +118,38 @@ function W(s, d = {}) {
118
118
  close: ["mouseout:100"]
119
119
  }
120
120
  }, d), n = a.prefix.replace(/[-]+$/, ""), m = new RegExp(`^${n}-`);
121
- function w(e) {
121
+ function E(e) {
122
122
  return Array.from(e.attributes).map((t) => [t.name, t.value]).filter(([t]) => t === "title" || t.match(m)).map(([t, o]) => [t.replace(new RegExp(m), ""), o]).reduce((t, o) => Object.assign(t, { [o[0]]: o[1] }), {});
123
123
  }
124
- function E(e, t = {}, o) {
124
+ function w(e, t = {}, o) {
125
125
  const i = document.createElement("template"), r = B(H, Object.assign({
126
126
  target: e,
127
127
  show: !0
128
128
  }, t));
129
129
  C(r, i);
130
- const [l] = [...i.children];
131
- return document.body.append(l), () => {
130
+ const [s] = [...i.children];
131
+ return document.body.append(s), () => {
132
132
  var u;
133
- p.delete(o), (u = r.component) == null || u.ctx.close(), setTimeout(() => l.remove(), 150);
133
+ p.delete(o), (u = r.component) == null || u.ctx.close(), setTimeout(() => s.remove(), 150);
134
134
  };
135
135
  }
136
136
  function h(e, t = {}) {
137
137
  var b, v;
138
138
  const o = Object.assign({
139
139
  title: e.getAttribute(n) || e.getAttribute("title")
140
- }, t, w(e));
140
+ }, t, E(e));
141
141
  if (!o.title || e.hasAttribute(`${n}-id`))
142
142
  return;
143
143
  const i = Math.random().toString(36).slice(2, 7);
144
- let r, l;
144
+ let r, s;
145
145
  e.setAttribute(`${n}-id`, i), e.removeAttribute("title");
146
146
  function u(c = 0) {
147
- clearTimeout(l), r || (l = setTimeout(() => {
148
- document.contains(e) && (r = E(e, o, i), p.set(i, r));
147
+ clearTimeout(s), r || (s = setTimeout(() => {
148
+ document.contains(e) && (r = w(e, o, i), p.set(i, r));
149
149
  }, c));
150
150
  }
151
151
  function f(c = 0) {
152
- clearTimeout(l), r && (l = setTimeout(() => {
152
+ clearTimeout(s), r && (s = setTimeout(() => {
153
153
  r && r(), r = null;
154
154
  }, c));
155
155
  }
@@ -159,7 +159,7 @@ function W(s, d = {}) {
159
159
  }
160
160
  (((b = e.getAttribute(`${n}-trigger-open`)) == null ? void 0 : b.split(",")) || a.triggers.open).map((c) => g(c, u)), (((v = e.getAttribute(`${n}-trigger-close`)) == null ? void 0 : v.split(",")) || a.triggers.close).map((c) => g(c, f));
161
161
  }
162
- s.mixin({
162
+ l.mixin({
163
163
  mounted() {
164
164
  if (!a.progressiveEnhancement)
165
165
  return;
@@ -174,16 +174,17 @@ function W(s, d = {}) {
174
174
  t.currentNode instanceof Element && h(t.currentNode);
175
175
  new MutationObserver((i) => {
176
176
  for (const { removedNodes: r } of i)
177
- for (const l of r)
178
- for (const u of l.querySelectorAll(`[${n}-id]`)) {
179
- const f = p.get(
180
- u.getAttribute(`${n}-id`)
181
- );
182
- f && f();
183
- }
177
+ for (const s of r)
178
+ if (s instanceof Element)
179
+ for (const u of s.querySelectorAll(`[${n}-id]`)) {
180
+ const f = p.get(
181
+ u.getAttribute(`${n}-id`)
182
+ );
183
+ f && f();
184
+ }
184
185
  }).observe(e, { childList: !0 });
185
186
  }
186
- }), s.directive("tooltip", {
187
+ }), l.directive("tooltip", {
187
188
  beforeMount(e, t) {
188
189
  h(e, Object.assign({}, t.modifiers, t.value));
189
190
  },
package/dist/tooltip.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.js","sources":["../src/Popper.ts","../src/Tooltip.vue","../src/TooltipPlugin.ts"],"sourcesContent":["import { createPopper } from '@popperjs/core';\nimport { defineComponent } from 'vue';\n\nexport default defineComponent({\n\n props: {\n offset: {\n type: Array,\n default: undefined\n },\n\n popper: {\n type: Object,\n default: undefined\n },\n\n placement: {\n type: String,\n default: undefined\n },\n\n target: {\n type: Element,\n required: true\n },\n\n title: {\n type: String,\n default: undefined\n },\n \n show: Boolean,\n \n top: Boolean,\n\n bottom: Boolean,\n\n left: Boolean,\n\n right: Boolean,\n },\n\n data() {\n return {\n currentShow: false,\n popperInstance: null\n };\n },\n\n computed: {\n computedPlacement() {\n if(this.placement) {\n return this.placement;\n }\n\n if(this.bottom) {\n return 'bottom';\n }\n\n if(this.left) {\n return 'left';\n }\n\n if(this.right) {\n return 'right';\n }\n\n return 'top';\n },\n tooltipClasses() {\n return {\n show: this.currentShow,\n [`bs-tooltip-${this.computedPlacement}`]: true\n };\n }\n },\n\n mounted() {\n this.popperInstance = createPopper(this.target, this.$el, Object.assign({\n placement: this.computedPlacement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 6]\n },\n },\n {\n name: 'arrow',\n options: {\n element: this.$refs.arrow,\n },\n },\n ],\n }, this.popper));\n\n this.$nextTick(() => {\n this.currentShow = this.show;\n });\n },\n\n beforeUnmount() {\n this.popperInstance && this.popperInstance.destroy();\n },\n\n methods: {\n\n open() {\n this.currentShow = true;\n },\n\n close() {\n this.currentShow = false;\n }\n\n }\n\n});","<script lang=\"ts\">\nimport { defineComponent } from 'vue';\nimport Popper from './Popper';\n\nexport default defineComponent({\n mixins: [\n Popper\n ]\n});\n</script>\n\n<template>\n <div\n class=\"tooltip\"\n :class=\"tooltipClasses\"\n role=\"tooltip\">\n <div\n ref=\"arrow\"\n class=\"tooltip-arrow\" />\n <div\n ref=\"inner\"\n class=\"tooltip-inner\">\n <slot>{{ title }}</slot>\n </div>\n </div>\n</template>\n\n<style>\n.tooltip:not(.show) {\n z-index: -1;\n}\n</style>","import type { App } from 'vue';\nimport { h, render } from 'vue';\nimport Tooltip from './Tooltip.vue';\n\ntype TooltipPluginOptions = {\n delay?: number,\n prefix: string,\n progressiveEnhancement: boolean,\n triggers: {\n open: string[],\n close: string[],\n }\n}\n\nexport default function (app: App, opts: Partial<TooltipPluginOptions> = {}) {\n const tooltips: Map<string,Function> = new Map;\n\n const options: TooltipPluginOptions = Object.assign({\n delay: undefined,\n prefix: 'data-tooltip',\n progressiveEnhancement: true,\n triggers: {\n open: ['mouseover:350'],\n close: ['mouseout:100'],\n }\n }, opts);\n \n const prefix = options.prefix.replace(/[-]+$/, '');\n const prefixRegExp = new RegExp(`^${prefix}\\-`);\n\n function getAttributes(el: Element): Record<string,any> {\n return Array.from(el.attributes)\n .map(a => [a.name, a.value])\n .filter(([key]) => key === 'title' || key.match(prefixRegExp))\n .map(([key, value]) => [key.replace(new RegExp(prefixRegExp), ''), value])\n .reduce((carry, attr) => Object.assign(carry, { [attr[0]]: attr[1] }), {});\n }\n\n function createTooltip(target: Element, props: Record<string,any> = {}, hash: string): Function {\n const container = document.createElement('template');\n \n const vnode = h(Tooltip, Object.assign({\n target,\n show: true\n }, props));\n \n render(vnode, container);\n \n const [el] = [...container.children];\n \n document.body.append(el);\n \n return () => {\n tooltips.delete(hash);\n\n // @ts-ignore\n vnode.component?.ctx.close();\n \n // @todo: Make the animation rate (150) dynamic. Should get value \n // from the CSS transition duration.\n setTimeout(() => el.remove(), 150);\n };\n }\n\n function init(target: Element, props = {}) {\n const properties: Record<string,any> = Object.assign({\n title: target.getAttribute(prefix) || target.getAttribute('title')\n }, props, getAttributes(target));\n\n // If the properties don't have a title, ignore this target.\n if(!properties.title || target.hasAttribute(`${prefix}-id`)) {\n return;\n }\n\n // Create a unique \"hash\" to show the node has been initialized.\n // This prevents double initializing on the same element.\n const hash = Math.random().toString(36).slice(2, 7);\n \n // Create the instance vars.\n let tooltip: Function|null, timer: number;\n\n //target.setAttribute(prefix, properties.title);\n target.setAttribute(`${prefix}-id`, hash);\n target.removeAttribute('title');\n\n function open(delay = 0) {\n clearTimeout(timer);\n\n if(!tooltip) {\n timer = setTimeout(() => {\n // Do a check before creating the tooltip to ensure the dom\n // element still exists. Its possible for the element to\n // be removed after the timeout delay runs.\n if(document.contains(target)) {\n tooltip = createTooltip(target, properties, hash);\n tooltips.set(hash, tooltip);\n }\n }, delay);\n }\n }\n\n function close(delay = 0) {\n clearTimeout(timer);\n\n if(tooltip) {\n timer = setTimeout(() => {\n tooltip && tooltip();\n tooltip = null;\n }, delay);\n } \n }\n\n function addEventListener(trigger: string, fn: Function) {\n const [ event, delayString ] = trigger.split(':');\n\n target.addEventListener(event, () => fn(Number(delayString || 0)));\n }\n\n (target.getAttribute(`${prefix}-trigger-open`)?.split(',') || options.triggers.open)\n .map(trigger => addEventListener(trigger, open));\n \n (target.getAttribute(`${prefix}-trigger-close`)?.split(',') || options.triggers.close)\n .map(trigger => addEventListener(trigger, close));\n }\n \n app.mixin({\n mounted() {\n if(!options.progressiveEnhancement) {\n return;\n }\n \n let el = this.$el;\n\n if(this.$el instanceof Text) {\n el = this.$el.parentNode;\n }\n\n if(el instanceof HTMLElement) {\n init(el);\n }\n\n // Create the tree walker.\n const walker = document.createTreeWalker(\n el,\n NodeFilter.SHOW_ALL,\n (node: Node) => {\n if(!(node instanceof Element)) {\n return NodeFilter.FILTER_REJECT;\n }\n \n return NodeFilter.FILTER_ACCEPT;\n }\n );\n\n // Step through and alert all child nodes\n while(walker.nextNode()) {\n if(walker.currentNode instanceof Element) {\n init(<Element> walker.currentNode);\n }\n }\n\n const observer = new MutationObserver((changes) => {\n for(const { removedNodes } of changes) {\n for(const node of removedNodes) {\n for(const el of (node as Element).querySelectorAll(`[${prefix}-id]`)) {\n const tooltip = tooltips.get(\n el.getAttribute(`${prefix}-id`) as string\n );\n\n tooltip && tooltip();\n }\n } \n }\n });\n\n observer.observe(el, { childList: true });\n }\n });\n\n app.directive('tooltip', {\n beforeMount(target, binding) {\n init(target, Object.assign({}, binding.modifiers, binding.value));\n },\n beforeUnmount(target) {\n const id = target.getAttribute(`${prefix}-id`);\n const tooltip = tooltips.get(id);\n\n tooltip && tooltip();\n }\n });\n}"],"names":["Popper","defineComponent","createPopper","_sfc_main","_hoisted_1","_hoisted_2","_sfc_render","_ctx","_cache","$props","$setup","$data","$options","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_renderSlot","TooltipPlugin","app","opts","tooltips","options","prefix","prefixRegExp","getAttributes","el","a","key","value","carry","attr","createTooltip","target","props","hash","container","vnode","h","Tooltip","render","_a","init","properties","tooltip","timer","open","delay","close","addEventListener","trigger","fn","event","delayString","_b","walker","node","changes","removedNodes","binding","id"],"mappings":"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"}
1
+ {"version":3,"file":"tooltip.js","sources":["../src/Popper.ts","../src/Tooltip.vue","../src/TooltipPlugin.ts"],"sourcesContent":["import { createPopper } from '@popperjs/core';\nimport { defineComponent } from 'vue';\n\nexport default defineComponent({\n\n props: {\n offset: {\n type: Array,\n default: undefined\n },\n\n popper: {\n type: Object,\n default: undefined\n },\n\n placement: {\n type: String,\n default: undefined\n },\n\n target: {\n type: Element,\n required: true\n },\n\n title: {\n type: String,\n default: undefined\n },\n \n show: Boolean,\n \n top: Boolean,\n\n bottom: Boolean,\n\n left: Boolean,\n\n right: Boolean,\n },\n\n data() {\n return {\n currentShow: false,\n popperInstance: null\n };\n },\n\n computed: {\n computedPlacement() {\n if(this.placement) {\n return this.placement;\n }\n\n if(this.bottom) {\n return 'bottom';\n }\n\n if(this.left) {\n return 'left';\n }\n\n if(this.right) {\n return 'right';\n }\n\n return 'top';\n },\n tooltipClasses() {\n return {\n show: this.currentShow,\n [`bs-tooltip-${this.computedPlacement}`]: true\n };\n }\n },\n\n mounted() {\n this.popperInstance = createPopper(this.target, this.$el, Object.assign({\n placement: this.computedPlacement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 6]\n },\n },\n {\n name: 'arrow',\n options: {\n element: this.$refs.arrow,\n },\n },\n ],\n }, this.popper));\n\n this.$nextTick(() => {\n this.currentShow = this.show;\n });\n },\n\n beforeUnmount() {\n this.popperInstance && this.popperInstance.destroy();\n },\n\n methods: {\n\n open() {\n this.currentShow = true;\n },\n\n close() {\n this.currentShow = false;\n }\n\n }\n\n});","<script lang=\"ts\">\nimport { defineComponent } from 'vue';\nimport Popper from './Popper';\n\nexport default defineComponent({\n mixins: [\n Popper\n ]\n});\n</script>\n\n<template>\n <div\n class=\"tooltip\"\n :class=\"tooltipClasses\"\n role=\"tooltip\">\n <div\n ref=\"arrow\"\n class=\"tooltip-arrow\" />\n <div\n ref=\"inner\"\n class=\"tooltip-inner\">\n <slot>{{ title }}</slot>\n </div>\n </div>\n</template>\n\n<style>\n.tooltip:not(.show) {\n z-index: -1;\n}\n</style>","import type { App } from 'vue';\nimport { h, render } from 'vue';\nimport Tooltip from './Tooltip.vue';\n\ntype TooltipPluginOptions = {\n delay?: number,\n prefix: string,\n progressiveEnhancement: boolean,\n triggers: {\n open: string[],\n close: string[],\n }\n}\n\nexport default function (app: App, opts: Partial<TooltipPluginOptions> = {}) {\n const tooltips: Map<string,Function> = new Map;\n\n const options: TooltipPluginOptions = Object.assign({\n delay: undefined,\n prefix: 'data-tooltip',\n progressiveEnhancement: true,\n triggers: {\n open: ['mouseover:350'],\n close: ['mouseout:100'],\n }\n }, opts);\n \n const prefix = options.prefix.replace(/[-]+$/, '');\n const prefixRegExp = new RegExp(`^${prefix}\\-`);\n\n function getAttributes(el: Element): Record<string,any> {\n return Array.from(el.attributes)\n .map(a => [a.name, a.value])\n .filter(([key]) => key === 'title' || key.match(prefixRegExp))\n .map(([key, value]) => [key.replace(new RegExp(prefixRegExp), ''), value])\n .reduce((carry, attr) => Object.assign(carry, { [attr[0]]: attr[1] }), {});\n }\n\n function createTooltip(target: Element, props: Record<string,any> = {}, hash: string): Function {\n const container = document.createElement('template');\n \n const vnode = h(Tooltip, Object.assign({\n target,\n show: true\n }, props));\n \n render(vnode, container);\n \n const [el] = [...container.children];\n \n document.body.append(el);\n \n return () => {\n tooltips.delete(hash);\n\n // @ts-ignore\n vnode.component?.ctx.close();\n \n // @todo: Make the animation rate (150) dynamic. Should get value \n // from the CSS transition duration.\n setTimeout(() => el.remove(), 150);\n };\n }\n\n function init(target: Element, props = {}) {\n const properties: Record<string,any> = Object.assign({\n title: target.getAttribute(prefix) || target.getAttribute('title')\n }, props, getAttributes(target));\n\n // If the properties don't have a title, ignore this target.\n if(!properties.title || target.hasAttribute(`${prefix}-id`)) {\n return;\n }\n\n // Create a unique \"hash\" to show the node has been initialized.\n // This prevents double initializing on the same element.\n const hash = Math.random().toString(36).slice(2, 7);\n \n // Create the instance vars.\n let tooltip: Function|null, timer: number;\n\n //target.setAttribute(prefix, properties.title);\n target.setAttribute(`${prefix}-id`, hash);\n target.removeAttribute('title');\n\n function open(delay = 0) {\n clearTimeout(timer);\n\n if(!tooltip) {\n timer = setTimeout(() => {\n // Do a check before creating the tooltip to ensure the dom\n // element still exists. Its possible for the element to\n // be removed after the timeout delay runs.\n if(document.contains(target)) {\n tooltip = createTooltip(target, properties, hash);\n tooltips.set(hash, tooltip);\n }\n }, delay);\n }\n }\n\n function close(delay = 0) {\n clearTimeout(timer);\n\n if(tooltip) {\n timer = setTimeout(() => {\n tooltip && tooltip();\n tooltip = null;\n }, delay);\n } \n }\n\n function addEventListener(trigger: string, fn: Function) {\n const [ event, delayString ] = trigger.split(':');\n\n target.addEventListener(event, () => fn(Number(delayString || 0)));\n }\n\n (target.getAttribute(`${prefix}-trigger-open`)?.split(',') || options.triggers.open)\n .map(trigger => addEventListener(trigger, open));\n \n (target.getAttribute(`${prefix}-trigger-close`)?.split(',') || options.triggers.close)\n .map(trigger => addEventListener(trigger, close));\n }\n \n app.mixin({\n mounted() {\n if(!options.progressiveEnhancement) {\n return;\n }\n \n let el = this.$el;\n\n if(this.$el instanceof Text) {\n el = this.$el.parentNode;\n }\n\n if(el instanceof HTMLElement) {\n init(el);\n }\n\n // Create the tree walker.\n const walker = document.createTreeWalker(\n el,\n NodeFilter.SHOW_ALL,\n (node: Node) => {\n if(!(node instanceof Element)) {\n return NodeFilter.FILTER_REJECT;\n }\n \n return NodeFilter.FILTER_ACCEPT;\n }\n );\n\n // Step through and alert all child nodes\n while(walker.nextNode()) {\n if(walker.currentNode instanceof Element) {\n init(<Element> walker.currentNode);\n }\n }\n\n const observer = new MutationObserver((changes) => {\n for(const { removedNodes } of changes) {\n for(const node of removedNodes) {\n if(!(node instanceof Element)) {\n continue;\n }\n \n for(const el of node.querySelectorAll(`[${prefix}-id]`)) {\n const tooltip = tooltips.get(\n el.getAttribute(`${prefix}-id`) as string\n );\n\n tooltip && tooltip();\n }\n } \n }\n });\n\n observer.observe(el, { childList: true });\n }\n });\n\n app.directive('tooltip', {\n beforeMount(target, binding) {\n init(target, Object.assign({}, binding.modifiers, binding.value));\n },\n beforeUnmount(target) {\n const id = target.getAttribute(`${prefix}-id`);\n const tooltip = tooltips.get(id);\n\n tooltip && tooltip();\n }\n });\n}"],"names":["Popper","defineComponent","createPopper","_sfc_main","_hoisted_1","_hoisted_2","_sfc_render","_ctx","_cache","$props","$setup","$data","$options","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_renderSlot","TooltipPlugin","app","opts","tooltips","options","prefix","prefixRegExp","getAttributes","el","a","key","value","carry","attr","createTooltip","target","props","hash","container","vnode","h","Tooltip","render","_a","init","properties","tooltip","timer","open","delay","close","addEventListener","trigger","fn","event","delayString","_b","walker","node","changes","removedNodes","binding","id"],"mappings":"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"}
package/dist/tooltip.umd.cjs CHANGED
@@ -1,2 +1,2 @@
1
- (function(l,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue"),require("@popperjs/core")):typeof define=="function"&&define.amd?define(["exports","vue","@popperjs/core"],o):(l=typeof globalThis<"u"?globalThis:l||self,o(l.Tooltip={},l.Vue,l.PopperjsCore))})(this,function(l,o,E){"use strict";const w=o.defineComponent({props:{offset:{type:Array,default:void 0},popper:{type:Object,default:void 0},placement:{type:String,default:void 0},target:{type:Element,required:!0},title:{type:String,default:void 0},show:Boolean,top:Boolean,bottom:Boolean,left:Boolean,right:Boolean},data(){return{currentShow:!1,popperInstance:null}},computed:{computedPlacement(){return this.placement?this.placement:this.bottom?"bottom":this.left?"left":this.right?"right":"top"},tooltipClasses(){return{show:this.currentShow,[`bs-tooltip-${this.computedPlacement}`]:!0}}},mounted(){this.popperInstance=E.createPopper(this.target,this.$el,Object.assign({placement:this.computedPlacement,modifiers:[{name:"offset",options:{offset:[0,6]}},{name:"arrow",options:{element:this.$refs.arrow}}]},this.popper)),this.$nextTick(()=>{this.currentShow=this.show})},beforeUnmount(){this.popperInstance&&this.popperInstance.destroy()},methods:{open(){this.currentShow=!0},close(){this.currentShow=!1}}}),y=o.defineComponent({mixins:[w]}),M="",x=(c,m)=>{const a=c.__vccOpts||c;for(const[d,i]of m)a[d]=i;return a},A={ref:"arrow",class:"tooltip-arrow"},S={ref:"inner",class:"tooltip-inner"};function j(c,m,a,d,i,g){return o.openBlock(),o.createElementBlock("div",{class:o.normalizeClass(["tooltip",c.tooltipClasses]),role:"tooltip"},[o.createElementVNode("div",A,null,512),o.createElementVNode("div",S,[o.renderSlot(c.$slots,"default",{},()=>[o.createTextVNode(o.toDisplayString(c.title),1)])],512)],2)}const T=x(y,[["render",j]]);function N(c,m={}){const a=new Map,d=Object.assign({delay:void 0,prefix:"data-tooltip",progressiveEnhancement:!0,triggers:{open:["mouseover:350"],close:["mouseout:100"]}},m),i=d.prefix.replace(/[-]+$/,""),g=new RegExp(`^${i}-`);function O(e){return Array.from(e.attributes).map(t=>[t.name,t.value]).filter(([t])=>t==="title"||t.match(g)).map(([t,n])=>[t.replace(new RegExp(g),""),n]).reduce((t,n)=>Object.assign(t,{[n[0]]:n[1]}),{})}function P(e,t={},n){const s=document.createElement("template"),r=o.h(T,Object.assign({target:e,show:!0},t));o.render(r,s);const[p]=[...s.children];return document.body.append(p),()=>{var f;a.delete(n),(f=r.component)==null||f.ctx.close(),setTimeout(()=>p.remove(),150)}}function b(e,t={}){var v,$;const n=Object.assign({title:e.getAttribute(i)||e.getAttribute("title")},t,O(e));if(!n.title||e.hasAttribute(`${i}-id`))return;const s=Math.random().toString(36).slice(2,7);let r,p;e.setAttribute(`${i}-id`,s),e.removeAttribute("title");function f(u=0){clearTimeout(p),r||(p=setTimeout(()=>{document.contains(e)&&(r=P(e,n,s),a.set(s,r))},u))}function h(u=0){clearTimeout(p),r&&(p=setTimeout(()=>{r&&r(),r=null},u))}function _(u,C){const[L,B]=u.split(":");e.addEventListener(L,()=>C(Number(B||0)))}(((v=e.getAttribute(`${i}-trigger-open`))==null?void 0:v.split(","))||d.triggers.open).map(u=>_(u,f)),((($=e.getAttribute(`${i}-trigger-close`))==null?void 0:$.split(","))||d.triggers.close).map(u=>_(u,h))}c.mixin({mounted(){if(!d.progressiveEnhancement)return;let e=this.$el;this.$el instanceof Text&&(e=this.$el.parentNode),e instanceof HTMLElement&&b(e);const t=document.createTreeWalker(e,NodeFilter.SHOW_ALL,s=>s instanceof Element?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_REJECT);for(;t.nextNode();)t.currentNode instanceof Element&&b(t.currentNode);new MutationObserver(s=>{for(const{removedNodes:r}of s)for(const p of r)for(const f of p.querySelectorAll(`[${i}-id]`)){const h=a.get(f.getAttribute(`${i}-id`));h&&h()}}).observe(e,{childList:!0})}}),c.directive("tooltip",{beforeMount(e,t){b(e,Object.assign({},t.modifiers,t.value))},beforeUnmount(e){const t=e.getAttribute(`${i}-id`),n=a.get(t);n&&n()}})}l.Tooltip=T,l.TooltipPlugin=N,Object.defineProperties(l,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
1
+ (function(c,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue"),require("@popperjs/core")):typeof define=="function"&&define.amd?define(["exports","vue","@popperjs/core"],o):(c=typeof globalThis<"u"?globalThis:c||self,o(c.Tooltip={},c.Vue,c.PopperjsCore))})(this,function(c,o,$){"use strict";const w=o.defineComponent({props:{offset:{type:Array,default:void 0},popper:{type:Object,default:void 0},placement:{type:String,default:void 0},target:{type:Element,required:!0},title:{type:String,default:void 0},show:Boolean,top:Boolean,bottom:Boolean,left:Boolean,right:Boolean},data(){return{currentShow:!1,popperInstance:null}},computed:{computedPlacement(){return this.placement?this.placement:this.bottom?"bottom":this.left?"left":this.right?"right":"top"},tooltipClasses(){return{show:this.currentShow,[`bs-tooltip-${this.computedPlacement}`]:!0}}},mounted(){this.popperInstance=$.createPopper(this.target,this.$el,Object.assign({placement:this.computedPlacement,modifiers:[{name:"offset",options:{offset:[0,6]}},{name:"arrow",options:{element:this.$refs.arrow}}]},this.popper)),this.$nextTick(()=>{this.currentShow=this.show})},beforeUnmount(){this.popperInstance&&this.popperInstance.destroy()},methods:{open(){this.currentShow=!0},close(){this.currentShow=!1}}}),y=o.defineComponent({mixins:[w]}),M="",x=(p,m)=>{const a=p.__vccOpts||p;for(const[d,i]of m)a[d]=i;return a},A={ref:"arrow",class:"tooltip-arrow"},S={ref:"inner",class:"tooltip-inner"};function j(p,m,a,d,i,g){return o.openBlock(),o.createElementBlock("div",{class:o.normalizeClass(["tooltip",p.tooltipClasses]),role:"tooltip"},[o.createElementVNode("div",A,null,512),o.createElementVNode("div",S,[o.renderSlot(p.$slots,"default",{},()=>[o.createTextVNode(o.toDisplayString(p.title),1)])],512)],2)}const T=x(y,[["render",j]]);function N(p,m={}){const a=new Map,d=Object.assign({delay:void 0,prefix:"data-tooltip",progressiveEnhancement:!0,triggers:{open:["mouseover:350"],close:["mouseout:100"]}},m),i=d.prefix.replace(/[-]+$/,""),g=new RegExp(`^${i}-`);function O(e){return Array.from(e.attributes).map(t=>[t.name,t.value]).filter(([t])=>t==="title"||t.match(g)).map(([t,n])=>[t.replace(new RegExp(g),""),n]).reduce((t,n)=>Object.assign(t,{[n[0]]:n[1]}),{})}function P(e,t={},n){const s=document.createElement("template"),r=o.h(T,Object.assign({target:e,show:!0},t));o.render(r,s);const[l]=[...s.children];return document.body.append(l),()=>{var f;a.delete(n),(f=r.component)==null||f.ctx.close(),setTimeout(()=>l.remove(),150)}}function b(e,t={}){var v,E;const n=Object.assign({title:e.getAttribute(i)||e.getAttribute("title")},t,O(e));if(!n.title||e.hasAttribute(`${i}-id`))return;const s=Math.random().toString(36).slice(2,7);let r,l;e.setAttribute(`${i}-id`,s),e.removeAttribute("title");function f(u=0){clearTimeout(l),r||(l=setTimeout(()=>{document.contains(e)&&(r=P(e,n,s),a.set(s,r))},u))}function h(u=0){clearTimeout(l),r&&(l=setTimeout(()=>{r&&r(),r=null},u))}function _(u,C){const[L,B]=u.split(":");e.addEventListener(L,()=>C(Number(B||0)))}(((v=e.getAttribute(`${i}-trigger-open`))==null?void 0:v.split(","))||d.triggers.open).map(u=>_(u,f)),(((E=e.getAttribute(`${i}-trigger-close`))==null?void 0:E.split(","))||d.triggers.close).map(u=>_(u,h))}p.mixin({mounted(){if(!d.progressiveEnhancement)return;let e=this.$el;this.$el instanceof Text&&(e=this.$el.parentNode),e instanceof HTMLElement&&b(e);const t=document.createTreeWalker(e,NodeFilter.SHOW_ALL,s=>s instanceof Element?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_REJECT);for(;t.nextNode();)t.currentNode instanceof Element&&b(t.currentNode);new MutationObserver(s=>{for(const{removedNodes:r}of s)for(const l of r)if(l instanceof Element)for(const f of l.querySelectorAll(`[${i}-id]`)){const h=a.get(f.getAttribute(`${i}-id`));h&&h()}}).observe(e,{childList:!0})}}),p.directive("tooltip",{beforeMount(e,t){b(e,Object.assign({},t.modifiers,t.value))},beforeUnmount(e){const t=e.getAttribute(`${i}-id`),n=a.get(t);n&&n()}})}c.Tooltip=T,c.TooltipPlugin=N,Object.defineProperties(c,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
2
2
  //# sourceMappingURL=tooltip.umd.cjs.map
package/dist/tooltip.umd.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.umd.cjs","sources":["../src/Popper.ts","../src/Tooltip.vue","../src/TooltipPlugin.ts"],"sourcesContent":["import { createPopper } from '@popperjs/core';\nimport { defineComponent } from 'vue';\n\nexport default defineComponent({\n\n props: {\n offset: {\n type: Array,\n default: undefined\n },\n\n popper: {\n type: Object,\n default: undefined\n },\n\n placement: {\n type: String,\n default: undefined\n },\n\n target: {\n type: Element,\n required: true\n },\n\n title: {\n type: String,\n default: undefined\n },\n \n show: Boolean,\n \n top: Boolean,\n\n bottom: Boolean,\n\n left: Boolean,\n\n right: Boolean,\n },\n\n data() {\n return {\n currentShow: false,\n popperInstance: null\n };\n },\n\n computed: {\n computedPlacement() {\n if(this.placement) {\n return this.placement;\n }\n\n if(this.bottom) {\n return 'bottom';\n }\n\n if(this.left) {\n return 'left';\n }\n\n if(this.right) {\n return 'right';\n }\n\n return 'top';\n },\n tooltipClasses() {\n return {\n show: this.currentShow,\n [`bs-tooltip-${this.computedPlacement}`]: true\n };\n }\n },\n\n mounted() {\n this.popperInstance = createPopper(this.target, this.$el, Object.assign({\n placement: this.computedPlacement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 6]\n },\n },\n {\n name: 'arrow',\n options: {\n element: this.$refs.arrow,\n },\n },\n ],\n }, this.popper));\n\n this.$nextTick(() => {\n this.currentShow = this.show;\n });\n },\n\n beforeUnmount() {\n this.popperInstance && this.popperInstance.destroy();\n },\n\n methods: {\n\n open() {\n this.currentShow = true;\n },\n\n close() {\n this.currentShow = false;\n }\n\n }\n\n});","<script lang=\"ts\">\nimport { defineComponent } from 'vue';\nimport Popper from './Popper';\n\nexport default defineComponent({\n mixins: [\n Popper\n ]\n});\n</script>\n\n<template>\n <div\n class=\"tooltip\"\n :class=\"tooltipClasses\"\n role=\"tooltip\">\n <div\n ref=\"arrow\"\n class=\"tooltip-arrow\" />\n <div\n ref=\"inner\"\n class=\"tooltip-inner\">\n <slot>{{ title }}</slot>\n </div>\n </div>\n</template>\n\n<style>\n.tooltip:not(.show) {\n z-index: -1;\n}\n</style>","import type { App } from 'vue';\nimport { h, render } from 'vue';\nimport Tooltip from './Tooltip.vue';\n\ntype TooltipPluginOptions = {\n delay?: number,\n prefix: string,\n progressiveEnhancement: boolean,\n triggers: {\n open: string[],\n close: string[],\n }\n}\n\nexport default function (app: App, opts: Partial<TooltipPluginOptions> = {}) {\n const tooltips: Map<string,Function> = new Map;\n\n const options: TooltipPluginOptions = Object.assign({\n delay: undefined,\n prefix: 'data-tooltip',\n progressiveEnhancement: true,\n triggers: {\n open: ['mouseover:350'],\n close: ['mouseout:100'],\n }\n }, opts);\n \n const prefix = options.prefix.replace(/[-]+$/, '');\n const prefixRegExp = new RegExp(`^${prefix}\\-`);\n\n function getAttributes(el: Element): Record<string,any> {\n return Array.from(el.attributes)\n .map(a => [a.name, a.value])\n .filter(([key]) => key === 'title' || key.match(prefixRegExp))\n .map(([key, value]) => [key.replace(new RegExp(prefixRegExp), ''), value])\n .reduce((carry, attr) => Object.assign(carry, { [attr[0]]: attr[1] }), {});\n }\n\n function createTooltip(target: Element, props: Record<string,any> = {}, hash: string): Function {\n const container = document.createElement('template');\n \n const vnode = h(Tooltip, Object.assign({\n target,\n show: true\n }, props));\n \n render(vnode, container);\n \n const [el] = [...container.children];\n \n document.body.append(el);\n \n return () => {\n tooltips.delete(hash);\n\n // @ts-ignore\n vnode.component?.ctx.close();\n \n // @todo: Make the animation rate (150) dynamic. Should get value \n // from the CSS transition duration.\n setTimeout(() => el.remove(), 150);\n };\n }\n\n function init(target: Element, props = {}) {\n const properties: Record<string,any> = Object.assign({\n title: target.getAttribute(prefix) || target.getAttribute('title')\n }, props, getAttributes(target));\n\n // If the properties don't have a title, ignore this target.\n if(!properties.title || target.hasAttribute(`${prefix}-id`)) {\n return;\n }\n\n // Create a unique \"hash\" to show the node has been initialized.\n // This prevents double initializing on the same element.\n const hash = Math.random().toString(36).slice(2, 7);\n \n // Create the instance vars.\n let tooltip: Function|null, timer: number;\n\n //target.setAttribute(prefix, properties.title);\n target.setAttribute(`${prefix}-id`, hash);\n target.removeAttribute('title');\n\n function open(delay = 0) {\n clearTimeout(timer);\n\n if(!tooltip) {\n timer = setTimeout(() => {\n // Do a check before creating the tooltip to ensure the dom\n // element still exists. Its possible for the element to\n // be removed after the timeout delay runs.\n if(document.contains(target)) {\n tooltip = createTooltip(target, properties, hash);\n tooltips.set(hash, tooltip);\n }\n }, delay);\n }\n }\n\n function close(delay = 0) {\n clearTimeout(timer);\n\n if(tooltip) {\n timer = setTimeout(() => {\n tooltip && tooltip();\n tooltip = null;\n }, delay);\n } \n }\n\n function addEventListener(trigger: string, fn: Function) {\n const [ event, delayString ] = trigger.split(':');\n\n target.addEventListener(event, () => fn(Number(delayString || 0)));\n }\n\n (target.getAttribute(`${prefix}-trigger-open`)?.split(',') || options.triggers.open)\n .map(trigger => addEventListener(trigger, open));\n \n (target.getAttribute(`${prefix}-trigger-close`)?.split(',') || options.triggers.close)\n .map(trigger => addEventListener(trigger, close));\n }\n \n app.mixin({\n mounted() {\n if(!options.progressiveEnhancement) {\n return;\n }\n \n let el = this.$el;\n\n if(this.$el instanceof Text) {\n el = this.$el.parentNode;\n }\n\n if(el instanceof HTMLElement) {\n init(el);\n }\n\n // Create the tree walker.\n const walker = document.createTreeWalker(\n el,\n NodeFilter.SHOW_ALL,\n (node: Node) => {\n if(!(node instanceof Element)) {\n return NodeFilter.FILTER_REJECT;\n }\n \n return NodeFilter.FILTER_ACCEPT;\n }\n );\n\n // Step through and alert all child nodes\n while(walker.nextNode()) {\n if(walker.currentNode instanceof Element) {\n init(<Element> walker.currentNode);\n }\n }\n\n const observer = new MutationObserver((changes) => {\n for(const { removedNodes } of changes) {\n for(const node of removedNodes) {\n for(const el of (node as Element).querySelectorAll(`[${prefix}-id]`)) {\n const tooltip = tooltips.get(\n el.getAttribute(`${prefix}-id`) as string\n );\n\n tooltip && tooltip();\n }\n } \n }\n });\n\n observer.observe(el, { childList: true });\n }\n });\n\n app.directive('tooltip', {\n beforeMount(target, binding) {\n init(target, Object.assign({}, binding.modifiers, binding.value));\n },\n beforeUnmount(target) {\n const id = target.getAttribute(`${prefix}-id`);\n const tooltip = tooltips.get(id);\n\n tooltip && tooltip();\n }\n });\n}"],"names":["Popper","defineComponent","createPopper","_sfc_main","_hoisted_1","_hoisted_2","_sfc_render","_ctx","_cache","$props","$setup","$data","$options","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_renderSlot","TooltipPlugin","app","opts","tooltips","options","prefix","prefixRegExp","getAttributes","el","a","key","value","carry","attr","createTooltip","target","props","hash","container","vnode","h","Tooltip","render","_a","init","properties","tooltip","timer","open","delay","close","addEventListener","trigger","fn","event","delayString","_b","walker","node","changes","removedNodes","binding","id"],"mappings":"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"}
1
+ {"version":3,"file":"tooltip.umd.cjs","sources":["../src/Popper.ts","../src/Tooltip.vue","../src/TooltipPlugin.ts"],"sourcesContent":["import { createPopper } from '@popperjs/core';\nimport { defineComponent } from 'vue';\n\nexport default defineComponent({\n\n props: {\n offset: {\n type: Array,\n default: undefined\n },\n\n popper: {\n type: Object,\n default: undefined\n },\n\n placement: {\n type: String,\n default: undefined\n },\n\n target: {\n type: Element,\n required: true\n },\n\n title: {\n type: String,\n default: undefined\n },\n \n show: Boolean,\n \n top: Boolean,\n\n bottom: Boolean,\n\n left: Boolean,\n\n right: Boolean,\n },\n\n data() {\n return {\n currentShow: false,\n popperInstance: null\n };\n },\n\n computed: {\n computedPlacement() {\n if(this.placement) {\n return this.placement;\n }\n\n if(this.bottom) {\n return 'bottom';\n }\n\n if(this.left) {\n return 'left';\n }\n\n if(this.right) {\n return 'right';\n }\n\n return 'top';\n },\n tooltipClasses() {\n return {\n show: this.currentShow,\n [`bs-tooltip-${this.computedPlacement}`]: true\n };\n }\n },\n\n mounted() {\n this.popperInstance = createPopper(this.target, this.$el, Object.assign({\n placement: this.computedPlacement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 6]\n },\n },\n {\n name: 'arrow',\n options: {\n element: this.$refs.arrow,\n },\n },\n ],\n }, this.popper));\n\n this.$nextTick(() => {\n this.currentShow = this.show;\n });\n },\n\n beforeUnmount() {\n this.popperInstance && this.popperInstance.destroy();\n },\n\n methods: {\n\n open() {\n this.currentShow = true;\n },\n\n close() {\n this.currentShow = false;\n }\n\n }\n\n});","<script lang=\"ts\">\nimport { defineComponent } from 'vue';\nimport Popper from './Popper';\n\nexport default defineComponent({\n mixins: [\n Popper\n ]\n});\n</script>\n\n<template>\n <div\n class=\"tooltip\"\n :class=\"tooltipClasses\"\n role=\"tooltip\">\n <div\n ref=\"arrow\"\n class=\"tooltip-arrow\" />\n <div\n ref=\"inner\"\n class=\"tooltip-inner\">\n <slot>{{ title }}</slot>\n </div>\n </div>\n</template>\n\n<style>\n.tooltip:not(.show) {\n z-index: -1;\n}\n</style>","import type { App } from 'vue';\nimport { h, render } from 'vue';\nimport Tooltip from './Tooltip.vue';\n\ntype TooltipPluginOptions = {\n delay?: number,\n prefix: string,\n progressiveEnhancement: boolean,\n triggers: {\n open: string[],\n close: string[],\n }\n}\n\nexport default function (app: App, opts: Partial<TooltipPluginOptions> = {}) {\n const tooltips: Map<string,Function> = new Map;\n\n const options: TooltipPluginOptions = Object.assign({\n delay: undefined,\n prefix: 'data-tooltip',\n progressiveEnhancement: true,\n triggers: {\n open: ['mouseover:350'],\n close: ['mouseout:100'],\n }\n }, opts);\n \n const prefix = options.prefix.replace(/[-]+$/, '');\n const prefixRegExp = new RegExp(`^${prefix}\\-`);\n\n function getAttributes(el: Element): Record<string,any> {\n return Array.from(el.attributes)\n .map(a => [a.name, a.value])\n .filter(([key]) => key === 'title' || key.match(prefixRegExp))\n .map(([key, value]) => [key.replace(new RegExp(prefixRegExp), ''), value])\n .reduce((carry, attr) => Object.assign(carry, { [attr[0]]: attr[1] }), {});\n }\n\n function createTooltip(target: Element, props: Record<string,any> = {}, hash: string): Function {\n const container = document.createElement('template');\n \n const vnode = h(Tooltip, Object.assign({\n target,\n show: true\n }, props));\n \n render(vnode, container);\n \n const [el] = [...container.children];\n \n document.body.append(el);\n \n return () => {\n tooltips.delete(hash);\n\n // @ts-ignore\n vnode.component?.ctx.close();\n \n // @todo: Make the animation rate (150) dynamic. Should get value \n // from the CSS transition duration.\n setTimeout(() => el.remove(), 150);\n };\n }\n\n function init(target: Element, props = {}) {\n const properties: Record<string,any> = Object.assign({\n title: target.getAttribute(prefix) || target.getAttribute('title')\n }, props, getAttributes(target));\n\n // If the properties don't have a title, ignore this target.\n if(!properties.title || target.hasAttribute(`${prefix}-id`)) {\n return;\n }\n\n // Create a unique \"hash\" to show the node has been initialized.\n // This prevents double initializing on the same element.\n const hash = Math.random().toString(36).slice(2, 7);\n \n // Create the instance vars.\n let tooltip: Function|null, timer: number;\n\n //target.setAttribute(prefix, properties.title);\n target.setAttribute(`${prefix}-id`, hash);\n target.removeAttribute('title');\n\n function open(delay = 0) {\n clearTimeout(timer);\n\n if(!tooltip) {\n timer = setTimeout(() => {\n // Do a check before creating the tooltip to ensure the dom\n // element still exists. Its possible for the element to\n // be removed after the timeout delay runs.\n if(document.contains(target)) {\n tooltip = createTooltip(target, properties, hash);\n tooltips.set(hash, tooltip);\n }\n }, delay);\n }\n }\n\n function close(delay = 0) {\n clearTimeout(timer);\n\n if(tooltip) {\n timer = setTimeout(() => {\n tooltip && tooltip();\n tooltip = null;\n }, delay);\n } \n }\n\n function addEventListener(trigger: string, fn: Function) {\n const [ event, delayString ] = trigger.split(':');\n\n target.addEventListener(event, () => fn(Number(delayString || 0)));\n }\n\n (target.getAttribute(`${prefix}-trigger-open`)?.split(',') || options.triggers.open)\n .map(trigger => addEventListener(trigger, open));\n \n (target.getAttribute(`${prefix}-trigger-close`)?.split(',') || options.triggers.close)\n .map(trigger => addEventListener(trigger, close));\n }\n \n app.mixin({\n mounted() {\n if(!options.progressiveEnhancement) {\n return;\n }\n \n let el = this.$el;\n\n if(this.$el instanceof Text) {\n el = this.$el.parentNode;\n }\n\n if(el instanceof HTMLElement) {\n init(el);\n }\n\n // Create the tree walker.\n const walker = document.createTreeWalker(\n el,\n NodeFilter.SHOW_ALL,\n (node: Node) => {\n if(!(node instanceof Element)) {\n return NodeFilter.FILTER_REJECT;\n }\n \n return NodeFilter.FILTER_ACCEPT;\n }\n );\n\n // Step through and alert all child nodes\n while(walker.nextNode()) {\n if(walker.currentNode instanceof Element) {\n init(<Element> walker.currentNode);\n }\n }\n\n const observer = new MutationObserver((changes) => {\n for(const { removedNodes } of changes) {\n for(const node of removedNodes) {\n if(!(node instanceof Element)) {\n continue;\n }\n \n for(const el of node.querySelectorAll(`[${prefix}-id]`)) {\n const tooltip = tooltips.get(\n el.getAttribute(`${prefix}-id`) as string\n );\n\n tooltip && tooltip();\n }\n } \n }\n });\n\n observer.observe(el, { childList: true });\n }\n });\n\n app.directive('tooltip', {\n beforeMount(target, binding) {\n init(target, Object.assign({}, binding.modifiers, binding.value));\n },\n beforeUnmount(target) {\n const id = target.getAttribute(`${prefix}-id`);\n const tooltip = tooltips.get(id);\n\n tooltip && tooltip();\n }\n });\n}"],"names":["Popper","defineComponent","createPopper","_sfc_main","_hoisted_1","_hoisted_2","_sfc_render","_ctx","_cache","$props","$setup","$data","$options","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_renderSlot","TooltipPlugin","app","opts","tooltips","options","prefix","prefixRegExp","getAttributes","el","a","key","value","carry","attr","createTooltip","target","props","hash","container","vnode","h","Tooltip","render","_a","init","properties","tooltip","timer","open","delay","close","addEventListener","trigger","fn","event","delayString","_b","walker","node","changes","removedNodes","binding","id"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vue-interface/tooltip",
3
- "version": "1.0.0-beta.11",
3
+ "version": "1.0.0-beta.12",
4
4
  "description": "A Vue tooltip component.",
5
5
  "files": [
6
6
  "index.ts",
package/src/TooltipPlugin.ts CHANGED
@@ -162,7 +162,11 @@ export default function (app: App, opts: Partial<TooltipPluginOptions> = {}) {
162
162
  const observer = new MutationObserver((changes) => {
163
163
  for(const { removedNodes } of changes) {
164
164
  for(const node of removedNodes) {
165
- for(const el of (node as Element).querySelectorAll(`[${prefix}-id]`)) {
165
+ if(!(node instanceof Element)) {
166
+ continue;
167
+ }
168
+
169
+ for(const el of node.querySelectorAll(`[${prefix}-id]`)) {
166
170
  const tooltip = tooltips.get(
167
171
  el.getAttribute(`${prefix}-id`) as string
168
172
  );