diff --git a/src/Form/FormControl.jsx b/src/Form/FormControl.jsx
index 0ec3977c05..54fc69fca7 100644
--- a/src/Form/FormControl.jsx
+++ b/src/Form/FormControl.jsx
@@ -18,7 +18,7 @@ const FormControl = React.forwardRef(({
floatingLabel,
autoResize,
onChange,
- hasInputMask,
+ inputMask,
...props
}, ref) => {
const {
@@ -73,7 +73,7 @@ const FormControl = React.forwardRef(({
className={className}
>
@@ -126,7 +126,7 @@ FormControl.propTypes = {
/** Only for `as="textarea"`. Specifies whether the input can be resized according to the height of content. */
autoResize: PropTypes.bool,
/** Specifies what format to use for the input mask. */
- hasInputMask: PropTypes.string,
+ inputMask: PropTypes.string,
};
FormControl.defaultProps = {
@@ -145,7 +145,7 @@ FormControl.defaultProps = {
isValid: undefined,
isInvalid: undefined,
autoResize: false,
- hasInputMask: undefined,
+ inputMask: undefined,
};
export default FormControl;
diff --git a/src/Form/form-control.mdx b/src/Form/form-control.mdx
index ec8510670b..7fb34b3c55 100644
--- a/src/Form/form-control.mdx
+++ b/src/Form/form-control.mdx
@@ -165,7 +165,7 @@ or [select attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element
## Input masks
Paragon uses the [react-imask](https://www.npmjs.com/package/react-imask) library,
which allows you to add masks of different types for inputs.
-To create your own mask, you need to pass the required mask pattern (`+{1}(000)000-00-00`) to the `hasInputMask` property.
+To create your own mask, you need to pass the required mask pattern (`+{1}(000)000-00-00`) to the `inputMask` property.
See [react-imask](https://imask.js.org) for documentation on available props.
```jsx live
@@ -180,7 +180,7 @@ See [react-imask](https://imask.js.org) for documentation on available props.
Phone
}
@@ -193,7 +193,7 @@ See [react-imask](https://imask.js.org) for documentation on available props.
Credit card
}
@@ -205,7 +205,7 @@ See [react-imask](https://imask.js.org) for documentation on available props.
Date
}
@@ -217,7 +217,7 @@ See [react-imask](https://imask.js.org) for documentation on available props.
Secure password
OTP password
}
@@ -249,7 +249,7 @@ See [react-imask](https://imask.js.org) for documentation on available props.
Course prise
}
trailingElement={}
floatingLabel="What is your phone number?"
diff --git a/src/Form/tests/FormControl.test.jsx b/src/Form/tests/FormControl.test.jsx
index 9964268a4b..8eb430213c 100644
--- a/src/Form/tests/FormControl.test.jsx
+++ b/src/Form/tests/FormControl.test.jsx
@@ -17,7 +17,7 @@ function Component({ isClearValue }) {
return (
setInputValue(e.target.value)}
onAccept={isClearValue ? onChangeFunc : (value) => setInputValue(value)}