feat(ui): introduce CoreColorInput. WF-9

[madeindjs]

Create a new component CoreColorInput using a sub-component BaseInputColor.

The component accept a list of predefined colors using datalist (see doc)

Screencast.from.2024-07-09.22-10-29.webm

[FabienArcellier]

The implementation look promising but I fails to reproduce the video on review environment.

[FabienArcellier]

• set a field color list (json array ?)
• separate the label for the width of color picker
• use different component between builder and component
• for later, set existing color other than default one at the end, sort by occurence
• for later, for history parsing, use field type color instead of color matching

src/ui/core/index.ts to get component definition based on its type

export function getComponentDefinition(type: string)

[madeindjs]

@FabienArcellier & @ramedina86 , I implemented the changes. Here the new screenshot

Screencast.from.2024-07-09.22-10-29.webm

I have a small doubt regarding predifined colors because:

1. we use FieldType.Object since we don't have array field, so we have to check that the JSON is an array and it's not convenient for the user to edit it
2. The browser accept only a list of hexadecimal colors (see doc)
3. It's just a suggestion palette, the user can use the color picker to select whatever he wants

Let me know what you think about it

[FabienArcellier]

Thanks It seems good. An improvement for later would be to add a BuilderFieldsValueList component which takes inspiration from BuilderFieldsKeyValue to manipulate a proposal list and provide preformatted Json.

[ramedina86]

Nice work, some small changes and I'll merge