Have ideas to improve npm?Join in the discussion! »

    @bw2tecnologia/v-mask

    2.1.5 • Public • Published

    🔡 Vue input mask

    This package has been modified to fill in our use cases.

    npm Github file size GitHub license Vue2 Tested with TestCafe

    Tiny input mask library for vue.js based on text-mask-core (~4kb) exposed as directive. No dependencies

    ✔️ Browser Support

    Chrome Firefox Safari Opera Edge IE iOS Safari Android WebView Android WebView
    74+ ✔️ 66+ ✔️ 12+ ✔️ 46+ ✔️ 17+ ✔️ 11+ ✔️ 12+ ✔️ 67+ ✔️ 8.2+ ✔️

    We support only browsers with global usage statistics greater then 1%, last 2 version of each browser but not dead browsers. Library may work in older browser but we don't not guarantee that. You may need addition polyfills to make it work.

    💿 Installation

    npm install v-mask

    Initialization

    ES2015 (Webpack/Rollup/Browserify/etc)

    import Vue from "vue";
     
    // As a plugin
    import VueMask from "v-mask";
    Vue.use(VueMask);
     
    // Or as a directive
    import { VueMaskDirective } from "v-mask";
    Vue.directive("mask", VueMaskDirective);
     
    // Or only as a filter
    import { VueMaskFilter } from "v-mask";
    Vue.filter("VMask", VueMaskFilter);

    🚀 Usage

    <input type="text" v-mask="'####-##'" v-model="myInputModel" />
    <!-- OR -->
    <input type="text" v-mask="nameOfVariableWithMask" v-model="myInputModel" />

    There is no reason to support using this lib for using without v-model but open the door for using on custom inputs.

    Filter usage

    <span>{{ '9999999999' | VMask('(###) ###-####') }}</span>

    ⚙️ Configs

    List of supported placeholders:

    Value Format
    # Number (0-9)
    A Letter in any case (a-z,A-Z)
    N Number or letter
    X Any symbol
    ? Optional (next character)

    💉 Tests

    Jest is used for unit-tests.

    Unit-tests can be executed by typing this command in your terminal:

    npm test

    TestCafe is used of E2E testing.

    E2E-tests can be executed by typing this command in your terminal:

    npm test:e2e

    ⚓️ Semantic Versioning Policy

    This plugin follows semantic versioning.

    📰 Changelog

    We're using GitHub Releases.

    🍻 Contributing

    We're more than happy to see potential contributions, so don't hesitate. If you have any suggestions, ideas or problems feel free to add new issue, but first please make sure your question does not repeat previous ones.

    Notice: You should make your changes only in src folder, don't try to edit files from dist as it compiled from src by babel and shouldn't be changes manually.

    🔒 License

    See the LICENSE file for license rights and limitations (MIT).

    Install

    npm i @bw2tecnologia/v-mask

    DownloadsWeekly Downloads

    0

    Version

    2.1.5

    License

    MIT

    Unpacked Size

    69.6 kB

    Total Files

    25

    Last publish

    Collaborators

    • avatar
    • avatar