vue-input-autowidth
A Vue.js directive for adjusting a text input's width to fit its content.
Demo
Install
$ yarn add vue-input-autowidth
or
$ npm install --save vue-input-autowidth
It's also available on Unpkg: https://unpkg.com/vue-input-autowidth
Usage
import VueInputAutowidth from 'vue-input-autowidth'
Vue.use(VueInputAutowidth)
<input
type="text"
v-autowidth="{maxWidth: '960px', minWidth: '20px', comfortZone: 0}"
v-model="name"
placeholder="Watch me change size with my content!"
/>
Options
maxWidth
Type: String
Default: 'none'
The maximum width the input field will grow to.
minWidth
Type: String
Default: 'none'
The minimum width the input field will shrink to.
comfortZone
Type: Number
Default: 0
The additional space in pixels to add to the far side of the input's content.
Development
$ npm run example
$ npm test
$ npm run build
License
MIT © Collin Henderson