vue-focus - npm Package Compare versions
Comparing version 0.1.0 to 0.1.1
@@ -0,3 +1,17 @@ | ||
| ## [0.1.1] - 2015-12-26 | ||
| ### Changed | ||
| - Mininification now screws IE8 | ||
| ### Added | ||
| - Overview and use cases | ||
| - Npm badge | ||
| ### Fixed | ||
| - Mixin example | ||
| ## 0.1.0 - 2015-12-20 | ||
| Initial release | ||
| [0.1.1]: https://github.com/simplesmiler/vue-focus/compare/0.1.0...0.1.1 |
@@ -1,1 +0,1 @@ | ||
| !function(u,i){"use strict";var t="default"in i?i["default"]:i,n={priority:1e3,bind:function(){var u=this;this.bound=!0,this.focus=function(){u.bound===!0&&u.el.focus()},this.blur=function(){u.bound===!0&&u.el.blur()}},update:function(u){u?t.nextTick(this.focus):t.nextTick(this.blur)},unbind:function(){this.bound=!1}},o={twoWay:!0,priority:1e3,bind:function(){var u=this;this.bound=!0,this.focus=function(){u.bound===!0&&u.el.focus()},this.blur=function(){u.bound===!0&&u.el.blur()},this.focusHandler=function(){u.set(!0)},this.blurHandler=function(){u.set(!1)},i.util.on(this.el,"focus",this.focusHandler),i.util.on(this.el,"blur",this.blurHandler)},update:function(u){u===!0?t.nextTick(this.focus):u===!1&&t.nextTick(this.blur)},unbind:function(){i.util.off(this.el,"focus",this.focusHandler),i.util.off(this.el,"blur",this.blurHandler),this.bound=!1}},s={priority:100,bind:function(){var u=this;this.bound=!0,t.nextTick(function(){u.bound===!0&&u.el.focus()})},unbind:function(){this.bound=!1}},c={directives:{focus:n,focusModel:o,focusAuto:s}};u.focus=n,u.focusModel=o,u.focusAuto=s,u.mixin=c}(this.VueFocus={},Vue); | ||
| !function(u,i){"use strict";var t="default"in i?i.default:i,n={priority:1e3,bind:function(){var u=this;this.bound=!0,this.focus=function(){u.bound===!0&&u.el.focus()},this.blur=function(){u.bound===!0&&u.el.blur()}},update:function(u){u?t.nextTick(this.focus):t.nextTick(this.blur)},unbind:function(){this.bound=!1}},o={twoWay:!0,priority:1e3,bind:function(){var u=this;this.bound=!0,this.focus=function(){u.bound===!0&&u.el.focus()},this.blur=function(){u.bound===!0&&u.el.blur()},this.focusHandler=function(){u.set(!0)},this.blurHandler=function(){u.set(!1)},i.util.on(this.el,"focus",this.focusHandler),i.util.on(this.el,"blur",this.blurHandler)},update:function(u){u===!0?t.nextTick(this.focus):u===!1&&t.nextTick(this.blur)},unbind:function(){i.util.off(this.el,"focus",this.focusHandler),i.util.off(this.el,"blur",this.blurHandler),this.bound=!1}},s={priority:100,bind:function(){var u=this;this.bound=!0,t.nextTick(function(){u.bound===!0&&u.el.focus()})},unbind:function(){this.bound=!1}},c={directives:{focus:n,focusModel:o,focusAuto:s}};u.focus=n,u.focusModel=o,u.focusAuto=s,u.mixin=c}(this.VueFocus={},Vue); |
| { | ||
| "name": "vue-focus", | ||
| "description": "Reusable focus directive for reusable Vue.js components", | ||
| "version": "0.1.0", | ||
| "version": "0.1.1", | ||
| "author": "Denis Karabaza <denis.karabaza@gmail.com>", | ||
@@ -6,0 +6,0 @@ "browserify": { |
@@ -5,6 +5,23 @@ # vue-focus | ||
| [](https://www.npmjs.com/package/vue-focus) | ||
| ## Overview | ||
| @TODO: write overview | ||
| It can be tricky to manage input focus in your components. You always have to fall back to accessing DOM elements and calling `.focus` or `.blur` on them. | ||
| Well not anymore. `vue-focus` lets you manage input focus from the safety of your view model. It consists of three directives: | ||
| - `v-focus-auto` auto focuses the element whenever it enters the DOM; | ||
| - `v-focus-model="<expression>"` binds the focus to the expression in a two-way manner (model changes cause focus to adjust, and focus changes cause model to adjust); | ||
| - `v-focus="<expression>"` binds the focus to the expression in a one-way manner (model changes cause focus to adjust). | ||
| Why the `v-focus` exists when there is `v-focus-model`, you might ask? Well, if you use a condition or a method to determine the focus, then you can not use a two-way bound directive, as it requires the expression to be settable. | ||
| Now you are ready to [check out the examples](https://jsfiddle.net/simplesmiler/k5vxp69o/), [read the docs](#api) or [file an issue](https://github.com/simplesmiler/vue-focus/issues). | ||
| ## Use cases | ||
| - Focus a field when the modal appears | ||
| - Show a hint for the focused field | ||
| ## Requirements | ||
@@ -25,5 +42,5 @@ | ||
| ``` html | ||
| <script src="https://cdn.rawgit.com/simplesmiler/vue-focus/0.1.0/dist/vue-focus.js"></script> | ||
| <script src="https://cdn.rawgit.com/simplesmiler/vue-focus/0.1.1/dist/vue-focus.js"></script> | ||
| <!-- OR --> | ||
| <script src="https://cdn.rawgit.com/simplesmiler/vue-focus/0.1.0/dist/vue-focus.min.js"></script> | ||
| <script src="https://cdn.rawgit.com/simplesmiler/vue-focus/0.1.1/dist/vue-focus.min.js"></script> | ||
| ``` | ||
@@ -104,3 +121,3 @@ | ||
| ``` js | ||
| import VueFocus from 'vue-focus'; | ||
| import * as VueFocus from 'vue-focus'; | ||
@@ -107,0 +124,0 @@ export default { |
New alerts
License Policy Violation
LicenseThis 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
LicenseThis 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
- increased by9.59%
16561
- Number of lines in readme file
- increased by13.39%
144
No dependency changes