[Bug]: TextField Value Control and Input Restriction Issues

[AregSoft]

Component

TextField

Is this a regression?

None

Describe the bug

The TextField component currently enforces its own internal state management for the value prop, preventing external control when a value is passed via props. Additionally, there is a lack of built-in, easily configurable input restriction/masking functionality to prevent the typing of specific characters (e.g., non-numeric), which is necessary for use cases like Pagination or OTP fields.

To Reproduce

1. Value Control Issue:

• Render a component and pass a value prop to it (e.g., value="ExternalValue") without providing onChange action.
• Type text inside of input.
• Observe: The TextField component changes value.

2. Input Restriction Issue (Numeric Only):

• Render a component intended for numeric input (e.g., a page number input in a Pagination component).
• Attempt to type alphabetic characters or special symbols (e.g., 'a', 'b', '#', '@') into the field.
• Observe: The component accepts and displays non-numeric characters, failing to enforce a numeric-only input rule upon typing.

Expected behavior

1. Value Control:

When a value prop is provided to the , the component should operate as a controlled component. Its displayed value should exclusively reflect the passed value prop and only update when the external value prop changes.

2. Input Restriction:

The TextField should provide a prop (e.g., inputMode="numeric" or a dedicated mask prop) that allows developers to easily restrict the characters that can be typed/pasted into the field, effectively preventing invalid input before the value is submitted.

Screenshots

No response

Package version

v3.0.0

Desktop

. OS:
. Browser & version:
. Additional Information:

Smartphone

. Device:
. OS:
. Browser & version:
. Additional Information:

Exception or Error

Additional context

No response