vue-tippy - npm Package Compare versions

Comparing version 0.2.9 to 0.3.0

package.json

 {
   "name": "vue-tippy",
-  "version": "0.2.9",
+  "version": "0.3.0",
   "description": "",
@@ -5,0 +5,0 @@ "main": "vue-tippy.js",

readme.md

@@ -39,12 +39,11 @@ # vue-tippy
 
-#### Popper HTML
+#### HTML Template 1 (without reactivity)
 ```html
-<button data-html="#contentpopup" v-tippy> My Button! </button>
+<button data-html="#contentpopup1" v-tippy> My Button! </button>
 ```
 ```html
-<div id="contentpopup" style="display: none">
+<div id="contentpopup1" style="display: none">
         <div>
             <h3> Header</h3>
             <p style="color: black"> {{ message }} - data binding </p>
-            <p style="color: black"> {{ clicks}} click(s) </p>
         </div>
@@ -54,8 +53,22 @@ </div>
 
+#### HTML Template 2 (with reactivity)
+```html
+<button v-tippy="{ html : '#contentpopup2'}"> My Button! </button>
+```
+```html
+<div id="contentpopup2">
+        <div>
+            <h3> Header</h3>
+            <p style="color: black"> {{ message }} - data binding </p>
+            <button @click="clicked">Click<button>
+        </div>
+ </div>
+```
+
 #### Vue component
 ```html
-<button data-html="#comppopup" v-tippy> My Button! </button>
+<button  v-tippy="{ html : '#comppopup' }"> My Button! </button>
 ```
 ```html
-<vue-component-test style="display: none" id="comppopup"></vue-component-test>
+<vue-component-test id="comppopup"></vue-component-test>
 ```
@@ -62,0 +75,0 @@

vue-tippy.js

@@ -78,3 +78,3 @@ const Tippy = require('tippy.js');
 
-                            if (s && s && s.settings && s.settings.html) {
+                            if (s && s && s.settings && !s.settings.html) {
                                 Vue.nextTick(function () {
@@ -124,4 +124,2 @@ s.tippyInstance.update(s.popper);
 
-                el.tippy = new Tippy(el, opts);
-
                 if (el.getAttribute('data-html')) {
@@ -144,4 +142,8 @@
                     })
+                } else if (opts.html) {
+                    opts.html = document.querySelector(opts.html)
                 }
 
+                el.tippy = new Tippy(el, opts);
+
                 Vue.$tippyInstances.push({
@@ -161,2 +163,4 @@ el: el,
 
+                if (opts.html) return;
+
                 if (el.tippy && ( JSON.stringify(opts) !== JSON.stringify(oldValue) )) {
@@ -163,0 +167,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

251519

increased by0.27%

Lines of code

4154

increased by0.14%

Number of lines in readme file

80

increased by19.4%

No dependency changes