{"id":24373426,"url":"https://github.com/eduardovillao/masky-js","last_synced_at":"2025-04-15T20:12:07.925Z","repository":{"id":273000216,"uuid":"918425916","full_name":"eduardovillao/masky-js","owner":"eduardovillao","description":"A compact and high-performance JavaScript library for input masking. Weighing only 1.3 KB (gzip), it’s optimized for fast loading and ideal for any project requiring lightweight, flexible, and customizable input masks.","archived":false,"fork":false,"pushed_at":"2025-01-20T18:34:22.000Z","size":16,"stargazers_count":6,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-29T00:51:10.360Z","etag":null,"topics":["cpf-cnpj-validation","form-validation","input-mask","javascript","mask"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/eduardovillao.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-01-17T22:56:58.000Z","updated_at":"2025-03-19T17:17:34.000Z","dependencies_parsed_at":"2025-01-18T00:30:14.147Z","dependency_job_id":null,"html_url":"https://github.com/eduardovillao/masky-js","commit_stats":null,"previous_names":["eduardovillao/masky-js"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eduardovillao%2Fmasky-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eduardovillao%2Fmasky-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eduardovillao%2Fmasky-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eduardovillao%2Fmasky-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/eduardovillao","download_url":"https://codeload.github.com/eduardovillao/masky-js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249145340,"owners_count":21219966,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cpf-cnpj-validation","form-validation","input-mask","javascript","mask"],"created_at":"2025-01-19T05:11:18.434Z","updated_at":"2025-04-15T20:12:07.902Z","avatar_url":"https://github.com/eduardovillao.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Masky.js\n\n[![Bundle Size](https://img.shields.io/bundlephobia/minzip/masky-js)](https://bundlephobia.com/package/masky-js)\n\n📦 Masky.js – A compact and **high-performance JavaScript library for input masking**. Weighing only **1.3 KB** (gzip), it’s optimized for fast loading and ideal for any project requiring lightweight, flexible, and customizable input masks.\n\n---\n\n## Features\n- **Super Lightweight:** Only **1.3 KB gzipped**, minimizing your app’s bundle size.\n- **Automatic Enhancements:**\n    - **inputmode support:** Dynamically adjusts for better mobile user experience.\n    - **minlength and maxlength:** Automatically calculated based on the mask.\n- **Built-in Validations:** Native support for CPF and CNPJ validation.\n- **Flexible Masks:** Add custom masks with prefixes, suffixes, and dynamic formatting.\n- **Ease of Use:** Just add data-mask and optional attributes—Masky.js does the rest.\n- **Vanilla JS:** Works without any dependencies, making it adaptable to any environment.\n\n---\n\n## Usage\n\n**Basic Example**\n\nAdd data-mask to your input fields, and the library will handle the rest:\n\n```html\n\u003cinput type=\"text\" data-mask=\"(00) 00000-0000\" /\u003e\n\u003cscript src=\"dist/masky.min.js\"\u003e\u003c/script\u003e\n```\n\n**Adding Prefixes and Suffixes**\n\nAdd data-mask-prefix or data-mask-suffix to include additional characters:\n\n```html\n\u003cinput type=\"text\" data-mask=\"000-000\" data-mask-prefix=\"+55 \" data-mask-suffix=\" ext\" /\u003e\n```\n\n**Validating CPF and CNPJ**\n\nUse data-mask-validation for built-in validation of CPF and CNPJ:\n\n```html\n\u003cinput type=\"text\" data-mask=\"000.000.000-00\" data-mask-validation=\"cpf\" /\u003e\n\u003cinput type=\"text\" data-mask=\"00.000.000/0000-00\" data-mask-validation=\"cnpj\" /\u003e\n```\n\n## Available Tokens\n\nMasky.js provides the following tokens for creating masks:\n\n| Token | Description           | Example Input | Example Mask |   |\n|-------|-----------------------|---------------|--------------|---|\n| 0     | Numeric digits only   | 123           | 000 → 123    |   |\n| A     | Alphanumeric          | 1aB           | AAA → 1AB    |   |\n| S     | Alphabetic characters | abc           | SSS → abc    |   |\n\n## Why Masky.js?\n\n- **Automatic Enhancements:** Input mode (`inputmode`) and field limits (`minlength` and `maxlength`) are calculated and applied automatically based on the mask.\n- **Built for Performance:** With only **1.3 KB** gzipped, it’s one of the most efficient libraries available.\n- **Flexibility:** Perfect for any environment—websites, frameworks, or CMS integrations.\n- **Ease of Integration:** Add `data-mask` to your inputs, and Masky.js takes care of formatting, validation, and user experience.\n\n## Example\n\n```html\n\u003cinput type=\"text\" data-mask=\"(00) 00000-0000\" /\u003e\n\u003cinput type=\"text\" data-mask=\"000-000\" data-mask-prefix=\"+55 \" data-mask-suffix=\" ext\" /\u003e\n\u003cinput type=\"text\" data-mask=\"AAA-SSS-000\" /\u003e\n\u003cscript src=\"dist/masky.min.js\"\u003e\u003c/script\u003e\n```\n\n- No need to manually define inputmode or limits-—Masky.js handles them automatically.\n- Add as much customization as needed with `data-mask-prefix` and `data-mask-suffix`.\n\n## Installation\n\n### 🌐 Via CDN\n\nUse Masky.js directly from a reliable CDN:\n\njsDelivr\n```html\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/masky-js/dist/masky.min.js\"\u003e\u003c/script\u003e\n```\n\nUNPKG\n```html\n\u003cscript src=\"https://unpkg.com/masky-js/dist/masky.min.js\"\u003e\u003c/script\u003e\n```\n\n### 📦 Via npm\n\nMasky.js is available on npm. Install it using the following command:\n\n```bash\nnpm install masky-js\n```\n\nAfter installation, include the file in your project:\n\n```js\nimport 'masky-js/dist/masky.min.js';\n```\n\n### 📂 Copy the File\n\nFor now, download or copy the file directly from the /dist directory of the repository:\n\n1.\tGo to the `/dist` folder in this repository.\n2.\tDownload or copy the `masky.min.js` file.\n3.\tInclude it in your project:\n\n```html\n\u003cscript src=\"path/to/masky.min.js\"\u003e\u003c/script\u003e\n```\n\n## Contributing\nWe welcome contributions! Fork the repository, create a branch, and open a pull request.\n\n## License\nThis project is licensed under the [MIT License](https://mit-license.org/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feduardovillao%2Fmasky-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feduardovillao%2Fmasky-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feduardovillao%2Fmasky-js/lists"}