Unable to add linebreaks to TextInput hints

[jclaveau]

Bug report

Required System information

• Npm version 8.12.1
• NodeJS version: v16.15.1
• Strapi Design System version: @strapi/[email protected]
• Browser: Firefox

Describe the bug

Adding a JSX node object to the "hint" property of a TextInput generates a warning Warning: Failed prop type: Invalid prop 'hint' of type 'object' supplied to 'Field', expected so adding a line break to it is not possible without spaming the console

Steps to reproduce the behavior

1. Create a TextInput
2. Add a hint with linebreak as string hint="aaa<br/>bbb"
3. the "<br/ >" appears on the page
4. Replace it by a JSX object hint={<span>aaa<br/>bbb</span>} then it works
5. But your console is obfuscated by warnings

Expected behavior

The console should remain clean

Screenshots

Code snippets

<TextInput
  name="myInput"
  hint={
    <span>
      - First line
      <br/>
      - Second line
    </span>
  }
  value={123}
/>

Additional context

Adding node propType for hints would be very useful here https://github.com/strapi/design-system/blob/main/packages/strapi-design-system/src/TextInput/TextInput.js#L59

PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.node,
    PropTypes.arrayOf(PropTypes.node),
])