mirrors/vue-tribute
2
0
Fork 0
mirror of https://github.com/tenrok/vue-tribute.git synced 2026-06-14 00:12:25 +03:00
Code Activity

Adds a watcher for options changes so the tribute instance can rebind itself

Browse Source
This commit is contained in:
syropian
2019-07-01 18:41:10 -04:00
parent bbaa4ebe16
commit 268201f295
9 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+1 -1
View File
@@ -1 +1 @@
<!doctype html><html><head><meta charset="utf-8"><meta http-equiv="x-ua-compatible" content="ie=edge"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><title>vue-tribute</title><meta name="description" content="A Vue.js wrapper for Zurb's Tribute library for native @mentions"><link href="/vue-tribute/main.c9b06153.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="app"></div><script type="text/javascript" src="/vue-tribute/vendors~main.fe277025.js"></script><script type="text/javascript" src="/vue-tribute/main.cc147a20.js"></script></body></html>
<!doctype html><html><head><meta charset="utf-8"><meta http-equiv="x-ua-compatible" content="ie=edge"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><title>vue-tribute</title><meta name="description" content="A Vue.js wrapper for Zurb's Tribute library for native @mentions"><link href="/vue-tribute/main.e51285af.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="app"></div><script type="text/javascript" src="/vue-tribute/vendors~main.9718a16f.js"></script><script type="text/javascript" src="/vue-tribute/main.66a2a4fc.js"></script></body></html>
main.66a2a4fc.js
+2
View File
@@ -0,0 +1,2 @@
!function(s){function t(t){for(var e,n,r=t[0],o=t[1],i=t[2],u=0,a=[];u<r.length;u++)n=r[u],c[n]&&a.push(c[n][0]),c[n]=0;for(e in o)Object.prototype.hasOwnProperty.call(o,e)&&(s[e]=o[e]);for(d&&d(t);a.length;)a.shift()();return p.push.apply(p,i||[]),l()}function l(){for(var t,e=0;e<p.length;e++){for(var n=p[e],r=!0,o=1;o<n.length;o++){var i=n[o];0!==c[i]&&(r=!1)}r&&(p.splice(e--,1),t=u(u.s=n[0]))}return t}var n={},c={0:0},p=[];function u(t){if(n[t])return n[t].exports;var e=n[t]={i:t,l:!1,exports:{}};return s[t].call(e.exports,e,e.exports,u),e.l=!0,e.exports}u.m=s,u.c=n,u.d=function(t,e,n){u.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},u.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},u.t=function(e,t){if(1&t&&(e=u(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(u.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)u.d(n,r,function(t){return e[t]}.bind(null,r));return n},u.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return u.d(e,"a",e),e},u.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},u.p="/vue-tribute/";var e=window.webpackJsonp=window.webpackJsonp||[],r=e.push.bind(e);e.push=t,e=e.slice();for(var o=0;o<e.length;o++)t(e[o]);var d=r;p.push([5,1]),l()}([function(t,e,n){},,,,,function(t,e,n){t.exports=n(10)},function(t,e,n){"use strict";var r=n(0);n.n(r).a},,,,function(t,e,n){"use strict";n.r(e);var r=n(4),o=n(1),i=n.n(o),u={name:"vue-tribute",props:{options:{type:Object,required:!0}},watch:{options:{immediate:!1,deep:!0,handler:function(){var t=this,e=this.$slots.default[0].elm;this.tribute&&(this.tribute.detach(e),setTimeout(function(){t.tribute=new i.a(t.options),t.tribute.attach(e),e.tributeInstance=t.tribute},0))}}},mounted:function(){if(void 0===i.a)throw new Error("[vue-tribute] cannot locate tributejs!");var t=this.$slots.default[0].elm;this.tribute=new i.a(this.options),this.tribute.attach(t),t.tributeInstance=this.tribute},beforeDestroy:function(){var t=this.$slots.default[0].elm;this.tribute&&this.tribute.detach(t)},render:function(t){return t("div",{staticClass:"v-tribute"},this.$slots.default)}};"undefined"!=typeof window&&window.Vue&&window.Vue.component(u.name,u);var a={components:{VueTribute:u},data:function(){return{options:{trigger:"@",values:[{key:"Collin Henderson",value:"syropian"},{key:"Sarah Drasner",value:"sarah_edo"},{key:"Evan You",value:"youyuxi"},{key:"Adam Wathan",value:"adamwathan"}],positionMenu:!1,menuContainer:document.querySelector(".menu-container")}}},mounted:function(){this.options.menuContainer=this.$refs.menuContainer},methods:{noMatchFound:function(){console.log("No matches found!")},append:function(){var t=Math.random().toString(36).slice(2);this.options.values.push({key:t,value:t})}}},s=(n(6),n(3)),l=Object(s.a)(a,function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"container"},[n("h1",[t._v("vue-tribute Demo")]),t._v(" "),n("h3",[t._v("Simple text input")]),t._v(" "),n("vue-tribute",{attrs:{options:t.options}},[n("input",{ref:"foo",attrs:{type:"text",placeholder:"@..."},on:{"tribute-no-match":t.noMatchFound}})]),t._v(" "),n("br"),t._v(" "),n("h3",[t._v("Textarea")]),t._v(" "),n("vue-tribute",{attrs:{options:t.options}},[n("textarea",{attrs:{placeholder:"@..."}})]),t._v(" "),n("br"),t._v(" "),n("h3",[t._v("contenteditable element")]),t._v(" "),n("vue-tribute",{attrs:{options:t.options}},[n("div",{staticClass:"content-editable",attrs:{contenteditable:"true",placeholder:"@..."}})]),t._v(" "),n("br"),t._v(" "),n("button",{staticClass:"btn",on:{click:t.append}},[t._v("Append New Item")])],1)},[],!1,null,null,null).exports;new r.a({el:"#app",render:function(t){return t(l)}})}]);
//# sourceMappingURL=main.66a2a4fc.js.map
main.66a2a4fc.js.map
+1
View File
File diff suppressed because one or more lines are too long
main.cc147a20.js
-2
View File
@@ -1,2 +0,0 @@
!function(s){function t(t){for(var e,n,r=t[0],o=t[1],u=t[2],a=0,i=[];a<r.length;a++)n=r[a],c[n]&&i.push(c[n][0]),c[n]=0;for(e in o)Object.prototype.hasOwnProperty.call(o,e)&&(s[e]=o[e]);for(v&&v(t);i.length;)i.shift()();return p.push.apply(p,u||[]),l()}function l(){for(var t,e=0;e<p.length;e++){for(var n=p[e],r=!0,o=1;o<n.length;o++){var u=n[o];0!==c[u]&&(r=!1)}r&&(p.splice(e--,1),t=a(a.s=n[0]))}return t}var n={},c={0:0},p=[];function a(t){if(n[t])return n[t].exports;var e=n[t]={i:t,l:!1,exports:{}};return s[t].call(e.exports,e,e.exports,a),e.l=!0,e.exports}a.m=s,a.c=n,a.d=function(t,e,n){a.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},a.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},a.t=function(e,t){if(1&t&&(e=a(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(a.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)a.d(n,r,function(t){return e[t]}.bind(null,r));return n},a.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return a.d(e,"a",e),e},a.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},a.p="/vue-tribute/";var e=window.webpackJsonp=window.webpackJsonp||[],r=e.push.bind(e);e.push=t,e=e.slice();for(var o=0;o<e.length;o++)t(e[o]);var v=r;p.push([5,1]),l()}([function(t,e,n){},,,,,function(t,e,n){t.exports=n(10)},function(t,e,n){"use strict";var r=n(0);n.n(r).a},,,,function(t,e,n){"use strict";n.r(e);var r=n(4),o=n(2),u=n.n(o),a={name:"vue-tribute",props:{options:{type:Object,required:!0}},mounted:function(){if(void 0===u.a)throw new Error("[vue-tribute] cannot locate tributejs!");var t=this.$slots.default[0].elm;this.tribute=new u.a(this.options),this.tribute.attach(t)},beforeDestroy:function(){var t=this.$slots.default[0].elm;this.tribute&&this.tribute.detach(t)},render:function(t){return t("div",{staticClass:"v-tribute"},this.$slots.default)}};"undefined"!=typeof window&&window.Vue&&window.Vue.component(a.name,a);var i={components:{VueTribute:a},data:function(){return{options:{trigger:"@",values:[{key:"Collin Henderson",value:"syropian"},{key:"Sarah Drasner",value:"sarah_edo"},{key:"Evan You",value:"youyuxi"},{key:"Adam Wathan",value:"adamwathan"}]}}},methods:{noMatchFound:function(){console.log("No matches found!")},append:function(){var t=Math.random().toString(36).slice(2);this.options.values.push({key:t,value:t})}}},s=(n(6),n(3)),l=Object(s.a)(i,function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"container"},[n("h1",[t._v("vue-tribute Demo")]),t._v(" "),n("h3",[t._v("Simple text input")]),t._v(" "),n("vue-tribute",{attrs:{options:t.options}},[n("input",{attrs:{type:"text",placeholder:"@..."},on:{"tribute-no-match":t.noMatchFound}})]),t._v(" "),n("br"),t._v(" "),n("h3",[t._v("Textarea")]),t._v(" "),n("vue-tribute",{attrs:{options:t.options}},[n("textarea",{attrs:{placeholder:"@..."}})]),t._v(" "),n("br"),t._v(" "),n("h3",[t._v("contenteditable element")]),t._v(" "),n("vue-tribute",{attrs:{options:t.options}},[n("div",{staticClass:"content-editable",attrs:{contenteditable:"true",placeholder:"@..."}})]),t._v(" "),n("br"),t._v(" "),n("button",{staticClass:"btn",on:{click:t.append}},[t._v("Append New Item")])],1)},[],!1,null,null,null).exports;new r.a({el:"#app",render:function(t){return t(l)}})}]);
//# sourceMappingURL=main.cc147a20.js.map
main.cc147a20.js.map
-1
View File
File diff suppressed because one or more lines are too long
main.c9b06153.css → main.e51285af.css
+1 -1
View File
@@ -1 +1 @@
*{box-sizing:border-box}body,html{height:100vh;width:100vw}body{background:linear-gradient(90deg,#fc466b,#3f5efb);display:flex;align-items:center;justify-content:center;color:#fff;font-family:Helvetica Neue,Arial,sans-serif}.scroll{width:100%;max-height:300px;overflow-y:auto;position:relative}.container{max-width:500px;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 20px}.v-tribute{width:100%}.content-editable,input[type=text]{appearance:none;border:none;background:#eee;padding:1rem;color:#666;width:100%;border-radius:.25rem;font-size:16px;outline:none}.content-editable:focus,input[type=text]:focus{background:#fff}.content-editable:empty:before{content:attr(placeholder);display:block;color:#666}textarea{appearance:none;border:none;background:#eee;padding:1rem;width:100%;border-radius:.25rem;font-size:16px;height:100px;outline:none}textarea:focus{background:#fff}.btn{appearance:none;border:none;cursor:pointer;margin:20px 0;background:#fc466b;color:#fff;font-size:16px;padding:8px 16px;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.18)}.btn:hover{background:#fc375f}.tribute-container{position:absolute;top:0;left:0;height:auto;max-height:300px;max-width:500px;overflow:auto;display:block;z-index:999999;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.13)}.tribute-container ul{margin:0;margin-top:2px;padding:0;list-style:none;background:#fff;border-radius:4px;border:1px solid rgba(0,0,0,.13);background-clip:padding-box;overflow:hidden}.tribute-container li{color:#3f5efb;padding:5px 10px;cursor:pointer;font-size:14px}.tribute-container li.highlight,.tribute-container li:hover{background:#3f5efb;color:#fff}.tribute-container li span{font-weight:700}.tribute-container li.no-match{cursor:default}.tribute-container .menu-highlighted{font-weight:700}
*{box-sizing:border-box}body,html{height:100vh;width:100vw}body{background:linear-gradient(90deg,#fc466b,#3f5efb);display:flex;align-items:center;justify-content:center;color:#fff;font-family:Helvetica Neue,Arial,sans-serif}.scroll{width:100%;max-height:300px;overflow-y:auto;position:relative}.container{max-width:355px;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 20px}.v-tribute{width:100%}.content-editable,input[type=text]{appearance:none;border:none;background:#eee;padding:1rem;color:#666;width:100%;border-radius:.25rem;font-size:16px;outline:none}.content-editable:focus,input[type=text]:focus{background:#fff}.content-editable:empty:before{content:attr(placeholder);display:block;color:#666}textarea{appearance:none;border:none;background:#eee;padding:1rem;width:100%;border-radius:.25rem;font-size:16px;height:100px;outline:none}textarea:focus{background:#fff}.btn{appearance:none;border:none;cursor:pointer;margin:20px 0;background:#fc466b;color:#fff;font-size:16px;padding:8px 16px;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.18)}.btn:hover{background:#fc375f}.tribute-container{position:absolute;top:0;left:0;height:auto;max-height:300px;max-width:500px;overflow:auto;display:block;z-index:999999;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.13)}.tribute-container ul{margin:0;margin-top:2px;padding:0;list-style:none;background:#fff;border-radius:4px;border:1px solid rgba(0,0,0,.13);background-clip:padding-box;overflow:hidden}.tribute-container li{color:#3f5efb;padding:5px 10px;cursor:pointer;font-size:14px}.tribute-container li.highlight,.tribute-container li:hover{background:#3f5efb;color:#fff}.tribute-container li span{font-weight:700}.tribute-container li.no-match{cursor:default}.tribute-container .menu-highlighted{font-weight:700}
vendors~main.fe277025.js → vendors~main.9718a16f.js
+2 -2
View File
File diff suppressed because one or more lines are too long
vendors~main.9718a16f.js.map
+1
View File
File diff suppressed because one or more lines are too long
vendors~main.fe277025.js.map
-1
View File
File diff suppressed because one or more lines are too long