1.0.6 • Published 3 years ago

vue-single-input v1.0.6

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

Vue Single input

Vue single input takes only one input in a box used for taking OTP, MPIN inputs.

Installing

Using npm:

$ npm install vue-single-input

Using yarn:

$ yarn add vue-single-input

Usage

import in index.ts / index.js

import SingleInput from "vue-single-input";

add to Vue

Vue.use(SingleInput);

Than use anywhere in template

<SingleInput formId="your-form-id" />

NOTE: formId is required

Example

<SingleInput
  v-model="myMpin"
  formId="id"
  :boxCount="4"
  textColor="green"
  borderColor="red"
  textSize="2em"
  :withBorder="false"
  borderRadius="0%"
  backgroundColor="none"
  type="text"
/>

Output

alt text
alt text
alt text
alt text
alt text

Options

  • v-model : Takes Variable name given by developer

  • formId : Required form Id given by developer

  • boxCount : Type is number

  • textColor : Takes any valid color given by developer. Ex: red, green, '#ff00ff', 'rgba(1, 1, 0, 0.5)'

  • borderColor : Takes any valid color given by developer. Ex: red, green, '#ff00ff', 'rgba(1, 1, 0, 0.5)'

  • textSize : Ex: 2rem, 3em, 1px, 4px

  • withBorder : Takes boolen values true or false

  • borderRadius : Ex: 10%, 50%, 2rem, 3em, 1px, 4px

  • backgroundColor : Takes any valid color given by developer. Ex: red, green, '#ff00ff', 'rgba(1, 1, 0, 0.5)'

  • type : Ex: number, password, text

License

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago