Hyva Input Mask
deadsimple/hyva-input-mask
Applies input masks to form fields within Hyvä themes using Alpine.js. Improves user experience and data validation by formatting user input.
Build Tests
Code Quality
Tested on Magento 2.4.8-p3
Recent Test History
Each release is tested against the latest Magento version at that time.
Top Contributors
View Leaderboard
Looking for Contributors
Template compilation fails. Your contribution could help the entire Magento community!
Share This Module's Status
README
Loaded from GitHub
Deadsimple Hyva Input Mask Module using AlpineJs Plugin
This module is a simple wrapper to integrate the input mask plugin from AlpineJs directly into your Hyvä theme and forms. It allows you to easily apply input masks to form fields, enhancing user experience and data validation.
Installation
To install the module, follow these steps:
- Install the module using Composer:
composer require deadsimple/hyva-inputmask
- Enable the module:
bin/magento module:enable DeadSimple_HyvaInputMask
- Run the setup upgrade:
bin/magento setup:upgrade
Usage
To use the input mask plugin, you need to add the x-mask attribute to your input field. The value of the x-mask attribute should be a valid mask pattern. For example:
<input type="text" x-mask="999-999-9999" />
This will apply a phone number mask to the input field, allowing only digits and formatting them as 999-999-9999.
For more information on the available mask patterns and options, refer to the AlpineJs Mask Plugin Documentation.
License
This module is licensed under the MIT License. See the LICENSE file for more information.
This content is fetched directly from the module's GitHub repository. We are not the authors of this content and take no responsibility for its accuracy, completeness, or any consequences arising from its use.