Refactor RLInput and RLDatePicker components to use Shoelace inputs and update event handling

[paolo-projects]

This pull request refactors the RL input components to use Shoelace’s React component wrappers instead of custom JSX element declarations, and updates event handling to use the new Shoelace event names and types. It also improves type safety, adds new props for greater flexibility, and updates Storybook stories for better interactivity and demonstration.

Component refactoring and Shoelace integration:

• Replaces custom JSX element declarations and direct usage of Shoelace web components with Shoelace React wrappers (SlInput, SlDropdown, SlIconButton) in RLInput, RLNumberInput, and RLDatePicker components, improving type safety and React compatibility. [1] [2] [3]
• Updates event handlers in all components to use Shoelace’s React event names (e.g., onSlChange, onSlBlur) and CustomEvent types, and ensures validation is triggered on change. [1] [2] [3]

Prop and type improvements:

• Expands supported props in RLInput and RLNumberInput (e.g., min, max, step, noSpinButtons, className, onClick, more input modes), and updates their TypeScript types for more flexibility and correctness. [1] [2] [3]

Storybook updates:

• Refactors Storybook stories for RLInput and RLNumberInput to use local state for value management and demonstrate controlled usage, making examples more interactive and realistic. [1] [2] [3] [4]

Code cleanup:

• Removes unused refs and legacy code related to direct DOM manipulation and custom event typing, simplifying the codebase. [1] [2] [3]

Consistency and usability improvements:

• Ensures all input components consistently pass props and error states, and updates class name handling for error styling. [1] [2] [3] [4]