Display Required Fields, Supporting Text, Icon, `is_sensitive` and `is_valid` for `DateInput`

[Sn3llius]

Description

Currently, our DateInputs component lacks the ability to indicate which fields are required, provide supporting text, and display leading and trailing icons. These features are crucial for enhancing user experience by guiding them through forms more effectively, ensuring they understand what information is needed, and improving the overall aesthetics and functionality of the input fields.

Design Guidline

https://m3.material.io/components/date-pickers/guidelines

Proposed Solution

Required Fields Indicator:

• Add is_required attribute to the DateInput component.
• When is_required is set to True, display an asterisk (*) next to the label.
• Optionally, add a is_required_indicator attribute to allow customization of the indicator (e.g., text, color). needs discussion

Supporting Text:

• Add supporting_text attribute to the DateInput component.
• The supporting text should be displayed below the input field.
• Style the supporting text to be visually distinct but not distracting (see Design Guidline).

Validation:

• Visually displays to the user whether the current date is_valid (similar to other input fields)

Trailing Icon:

• Add a trailing_icon attribute to the DateInput component. naming needs discussion
• The trailing_icon should be displayed inside the DateInput, aligned to the right.
• Allow customization of the icon, which accepts an icon component or a string for the icon name.

Sensitiv:

• is_sensitive: bool = True (similar to other input fields)

Alternatives

No response

Additional Context

• Update documentation and examples for these new features.

Related Issues/Pull Requests

#104, #105