# text-mask/text-mask

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/text-mask-text-mask).**

8,217 stars · 819 forks · JavaScript · Unlicense

## Links

- GitHub: https://github.com/text-mask/text-mask
- Homepage: https://text-mask.github.io/text-mask/
- awesome-repositories: https://awesome-repositories.com/repository/text-mask-text-mask.md

## Topics

`angular` `ember` `input-mask` `inputmask` `react` `text-formatting` `vue`

## Description

text-mask is a JavaScript library for enforcing consistent text formats and dynamic masking patterns in web input fields. It provides a suite of utilities to constrain text field entries to predefined masks and validators, ensuring data consistency across multiple frontend frameworks including React, Angular, and Vue.

The library supports dynamic pattern generation using functions to handle variable data formats and localized patterns. It includes capabilities for processing bulk text entries, such as pasted content and browser auto-fill data, while maintaining the integrity of the defined input mask.

The system manages frontend data formatting through input pattern enforcement and form validation. It also provides visual guidance by displaying placeholder characters and mask structures as the user types.

## Tags

### User Interface & Experience

- [Masked Inputs](https://awesome-repositories.com/f/user-interface-experience/masked-inputs.md) — Enforces specific character patterns and formatting rules for user data entry through masked inputs. ([source](https://cdn.jsdelivr.net/gh/text-mask/text-mask@master/README.md))
- [Form Input Validation](https://awesome-repositories.com/f/user-interface-experience/form-input-validation.md) — Verifies the correctness of user input during entry by enforcing specific text patterns and formats.
- [Framework Agnostic UI Logic](https://awesome-repositories.com/f/user-interface-experience/framework-agnostic-ui-logic.md) — Decouples the masking engine from UI rendering to ensure compatibility across multiple JavaScript frameworks.
- [Input Data Formatting](https://awesome-repositories.com/f/user-interface-experience/input-data-formatting.md) — Processes raw user text into a standardized format during the data entry phase across frameworks.
- [Dynamic Pattern Generation](https://awesome-repositories.com/f/user-interface-experience/input-masking-patterns/dynamic-pattern-generation.md) — Provides callback functions to update mask patterns in real time based on the current input value.
- [Input Masks](https://awesome-repositories.com/f/user-interface-experience/input-masks.md) — Provides a set of utilities to enforce formatting patterns on user input fields across React, Angular, and Vue.
- [Dynamic Formatting](https://awesome-repositories.com/f/user-interface-experience/input-masks/dynamic-formatting.md) — Creates flexible text fields that adapt their formatting patterns based on user input or localization.
- [Input Value Transformations](https://awesome-repositories.com/f/user-interface-experience/input-value-transformations.md) — Converts raw input strings into formatted masked values by tracking cursor position and character indices.
- [Bulk Input Processing](https://awesome-repositories.com/f/user-interface-experience/bulk-input-processing.md) — Processes pasted content and browser auto-fill data while maintaining the integrity of the input mask.
- [Input Placeholders](https://awesome-repositories.com/f/user-interface-experience/data-to-visual-mappings/input-placeholders.md) — Displays placeholder characters and mask structures as the user types to guide the required format.
- [Input Progress Visualization](https://awesome-repositories.com/f/user-interface-experience/masked-inputs/input-progress-visualization.md) — Displays placeholder characters and mask structures as the user types to guide the required format. ([source](https://cdn.jsdelivr.net/gh/text-mask/text-mask@master/README.md))

### Web Development

- [Event Interception Utilities](https://awesome-repositories.com/f/web-development/event-interception-utilities.md) — Intercepts and transforms keyboard and paste events before they are committed to the DOM.