v-autocomplete - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

dist/v-autocomplete.js

@@ -1,1 +0,1 @@
-(function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.VAutocomplete=e():t.VAutocomplete=e()})(this,function(){return function(t){function e(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:i})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p=".",e(e.s=10)}([function(t,e){t.exports=function(t,e,n,i){var o,s=t=t||{},r=typeof t.default;"object"!==r&&"function"!==r||(o=t,s=t.default);var u="function"==typeof s?s.options:s;if(e&&(u.render=e.render,u.staticRenderFns=e.staticRenderFns),n&&(u._scopeId=n),i){var a=u.computed||(u.computed={});Object.keys(i).forEach(function(t){var e=i[t];a[t]=function(){return e}})}return{esModule:o,exports:s,options:u}}},function(t,e,n){var i=n(6);i.install=function(t){return t.component(i.name,i)},i.version="0.0.1",t.exports=i},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=n(7),o=n.n(i),s=n(4);e.default={name:"v-autocomplete",props:{componentItem:{default:function(){return o.a}},placeholder:String,minLen:{type:Number,default:s.a.minLen},wait:{type:Number,default:s.a.wait},value:null,getLabel:{type:Function,default:function(t){return t}},items:Array},data:function(){return{searchText:"",showList:!1,internalItems:this.items||[]}},methods:{inputChange:function(){this.showList=!0,this.onSelectItem(null),s.a.callUpdateItems(this.searchText,this.updateItems);var t=s.a.findItem(this.internalItems,this.searchText,this.getLabel);t&&this.onSelectItem(t),this.$emit("change",this.searchText)},updateItems:function(){this.$emit("updateItems",this.searchText)},focus:function(){this.showList=!0},blur:function(){var t=this;setTimeout(function(){return t.showList=!1},200)},onSelectItem:function(t){t?(this.internalItems=[t],this.searchText=this.getLabel(t)):this.setItems(this.items),this.$emit("input",t)},setItems:function(t){this.internalItems=t||[]}},created:function(){s.a.minLen=this.minLen,s.a.wait=this.wait,this.onSelectItem(this.value)},watch:{items:function(t){this.setItems(t)},value:function(t){this.onSelectItem(t)}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={props:{item:{required:!0}}}},function(t,e,n){"use strict";e.a={minLen:3,wait:500,timeout:null,isUpdateItems:function(t){if(t.length>this.minLen)return!0},callUpdateItems:function(t,e){clearTimeout(this.timeout),this.isUpdateItems(t)&&(this.timeout=setTimeout(e,this.wait))},findItem:function(t,e,n){if(e){if(1==t.length)return t[0];var i=!0,o=!1,s=void 0;try{for(var r,u=t[Symbol.iterator]();!(i=(r=u.next()).done);i=!0){var a=r.value;if(n(a).toLowerCase()==e.toLowerCase())return a}}catch(t){o=!0,s=t}finally{try{!i&&u.return&&u.return()}finally{if(o)throw s}}}}}},function(t,e){},function(t,e,n){n(5);var i=n(0)(n(2),n(8),null,null);t.exports=i.exports},function(t,e,n){var i=n(0)(n(3),n(9),null,null);t.exports=i.exports},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"v-autocomplete"},[n("div",{staticClass:"v-autocomplete-input-group",class:{"v-autocomplete-selected":t.value}},[n("input",{directives:[{name:"model",rawName:"v-model",value:t.searchText,expression:"searchText"}],staticClass:"v-autocomplete-input",attrs:{type:"search",placeholder:t.placeholder},domProps:{value:t.searchText},on:{blur:t.blur,focus:t.focus,input:[function(e){e.target.composing||(t.searchText=e.target.value)},t.inputChange]}})]),t.showList&&t.internalItems?n("div",{staticClass:"v-autocomplete-list"},t._l(t.internalItems,function(e){return n("div",{staticClass:"v-autocomplete-list-item",on:{click:function(n){t.onSelectItem(e)}}},[n(t.componentItem,{tag:"div",attrs:{item:e}})])})):t._e()])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement;return(t._self._c||e)("div",[t._v(t._s(t.item.label))])},staticRenderFns:[]}},function(t,e,n){t.exports=n(1)}])});
+(function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.VAutocomplete=e():t.VAutocomplete=e()})(this,function(){return function(t){function e(i){if(n[i])return n[i].exports;var s=n[i]={i:i,l:!1,exports:{}};return t[i].call(s.exports,s,s.exports,e),s.l=!0,s.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:i})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p=".",e(e.s=10)}([function(t,e){t.exports=function(t,e,n,i){var s,o=t=t||{},r=typeof t.default;"object"!==r&&"function"!==r||(s=t,o=t.default);var u="function"==typeof o?o.options:o;if(e&&(u.render=e.render,u.staticRenderFns=e.staticRenderFns),n&&(u._scopeId=n),i){var a=u.computed||(u.computed={});Object.keys(i).forEach(function(t){var e=i[t];a[t]=function(){return e}})}return{esModule:s,exports:o,options:u}}},function(t,e,n){var i=n(6);i.install=function(t){return t.component(i.name,i)},i.version="0.0.1",t.exports=i},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=n(7),s=n.n(i),o=n(4);e.default={name:"v-autocomplete",props:{componentItem:{default:function(){return s.a}},placeholder:String,minLen:{type:Number,default:o.a.minLen},wait:{type:Number,default:o.a.wait},value:null,getLabel:{type:Function,default:function(t){return t}},items:Array},data:function(){return{searchText:"",showList:!1,internalItems:this.items||[]}},methods:{inputChange:function(){this.showList=!0,this.onSelectItem(null),o.a.callUpdateItems(this.searchText,this.updateItems);var t=o.a.findItem(this.internalItems,this.searchText,this.getLabel);t&&this.onSelectItem(t),this.$emit("change",this.searchText)},updateItems:function(){this.$emit("updateItems",this.searchText)},focus:function(){this.showList=!0},blur:function(){var t=this;setTimeout(function(){return t.showList=!1},200)},onSelectItem:function(t){t?(this.internalItems=[t],this.searchText=this.getLabel(t)):this.setItems(this.items),this.$emit("input",t)},setItems:function(t){this.internalItems=t||[]}},created:function(){o.a.minLen=this.minLen,o.a.wait=this.wait,this.onSelectItem(this.value)},watch:{items:function(t){this.setItems(t)},value:function(t){this.onSelectItem(t)}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={props:{item:{required:!0}}}},function(t,e,n){"use strict";e.a={minLen:3,wait:500,timeout:null,isUpdateItems:function(t){if(t.length>this.minLen)return!0},callUpdateItems:function(t,e){clearTimeout(this.timeout),this.isUpdateItems(t)&&(this.timeout=setTimeout(e,this.wait))},findItem:function(t,e,n){if(e)return 1==t.length?t[0]:void 0}}},function(t,e){},function(t,e,n){n(5);var i=n(0)(n(2),n(8),null,null);t.exports=i.exports},function(t,e,n){var i=n(0)(n(3),n(9),null,null);t.exports=i.exports},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"v-autocomplete"},[n("div",{staticClass:"v-autocomplete-input-group",class:{"v-autocomplete-selected":t.value}},[n("input",{directives:[{name:"model",rawName:"v-model",value:t.searchText,expression:"searchText"}],staticClass:"v-autocomplete-input",attrs:{type:"search",placeholder:t.placeholder},domProps:{value:t.searchText},on:{blur:t.blur,focus:t.focus,input:[function(e){e.target.composing||(t.searchText=e.target.value)},t.inputChange]}})]),t.showList&&t.internalItems?n("div",{staticClass:"v-autocomplete-list"},t._l(t.internalItems,function(e){return n("div",{staticClass:"v-autocomplete-list-item",on:{click:function(n){t.onSelectItem(e)}}},[n(t.componentItem,{tag:"div",attrs:{item:e}})])})):t._e()])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement;return(t._self._c||e)("div",[t._v(t._s(t.item))])},staticRenderFns:[]}},function(t,e,n){t.exports=n(1)}])});

package.json

 {
   "name": "v-autocomplete",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Autocomplete component for Vue.js",
@@ -5,0 +5,0 @@ "author": "Marcos Paliari <[e-mail]>",

README.md

@@ -1,8 +0,11 @@
-# v-autocomplete
+v-autocomplete
+==============
 
 > Autocomplete component for Vue.js
 
-# Usage
+Usage
+=====
 
-## Installation
+Installation
+------------
 
@@ -17,4 +20,79 @@ ### Using yarn
 
-## License
+Demo
+----
 
+[DEMO](http://paliari.github.io/v-autocomplete)
+
+Usage
+-----
+
+### Bundler (Webpack, Rollup)
+
+```js
+import Vue from 'vue'
+
+import Autocomplete from 'v-autocomplete'
+
+// You need a specific loader for CSS files like https://github.com/webpack/css-loader
+import 'v-autocomplete/dist/v-autocomplete.css'
+
+Vue.use(Autocomplete)
+```
+
+### Browser
+
+```html
+<!-- Include after Vue -->
+<link rel="stylesheet" href="v-autocomplete/dist/v-autocomplete.css"></link>
+<script src="v-autocomplete/dist/v-autocomplete.js"></script>
+<script>
+  Vue.use(Autocomplete)
+</script>
+```
+
+### Usage example
+
+```html
+<!-- in your component -->
+<v-autocomplete :items="items" v-model="item" :get-label="getLabel" @updateItems="updateItems">
+</v-autocomplete>
+```
+
+```js
+// in your component
+// ...
+data () {
+  return {
+    item: {label: 'Item 4', id: 4},
+    items: []
+  }
+},
+methods: {
+  getLabel (item) {
+    return item.label
+  },
+  updateItems (text) {
+    yourGetItemsMethod(text).then( (response) => {
+      this.items = response
+    })
+  }
+},
+// ...
+```
+
+### Params
+
+| Name          | Type                                | Required | Default value                  | Info                                                 |
+|---------------|-------------------------------------|----------|--------------------------------|------------------------------------------------------|
+| items         | Array                               | Yes      |                                | List items                                           |
+| componentItem | Vue Component or Function or String | No       | Item                           | Template of item list                                |
+| placeholder   | String                              | No       |                                |                                                      |
+| minLen        | Number                              | No       | 3                              | Min length to input search call 'updateItems' event  |
+| wait          | String                              | No       | 500                            | Wait of input change before call 'updateItems' event |
+| getLabel      | Function                            | No       | function(item) { return item } | Custom function to extract label of item             |
+| value         | Mixed                               | No       |                                | Initial value (use v-model)                          |
+
+License
+-------
+
 This project is licensed under [MIT License](http://en.wikipedia.org/wiki/MIT_License)

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

7818

increased by40.43%

Number of lines in readme file

98

increased by390%

No dependency changes