Masked Fields
Masked fields are input components that enforce a specific structure for user input. They're ideal for forms that require consistent formatting - such as dates, times, numbers, or identifiers - where accuracy is required.
These components apply formatting rules directly to the input field, helping users understand what type of value is expected while reducing input errors. This makes them particularly useful in financial systems, administrative dashboards, scheduling interfaces, and other apps that rely on validated data entry.
Topics
📄️ MaskedDateField
The MaskedDateField is a text input control designed for structured date entry. It lets users enter dates as numbers and automatically formats the input based on a defined mask when the field loses focus. The mask is a string that specifies the expected date format, guiding both input and display.
📄️ MaskedNumberField
The MaskedNumberField is a text input designed for structured numeric entry. It ensures numbers are formatted consistently based on a defined mask, making it especially useful for financial forms, pricing fields, or any input where precision and readability matter.
📄️ MaskedTextField
The MaskedTextField component aims to deliver a configurable and easily validatable text input. It's well-suited for apps requiring formatted input, such as financial, e-commerce, and healthcare apps.
📄️ MaskedTimeField
The MaskedTimeField is a text input control designed for precise, structured time entry. It lets users enter times as numbers and automatically formats the input based on a defined mask when the field loses focus. The mask is a string that specifies the expected time format, guiding both input and display.