Add multiline edition to listbox

[brauliodiez]

We have already created a listbox component:

And we've got multiline editing.

Let's say we want to have the following entries in the list:

Apple 
Microsoft
Meta
Google
Amazon

And mark as selected Meta

We expect to have the following inline edition in a text area:

Apple
Microsoft
[*]Meta
Google
Amazon

This should show the list of companies and show selected Meta.

Steps to do this:

• Add the text property into the listbox rendered, set default data and bind it to the listbox text property in the TSX.

• Create in common/utils a method that takes as entry point a strings and split it's in an array of strings (broken down by new line character), ... this method will be used in other components.

• Add a state of type string[] (items) that will hold the list of strings inside the listbox component.

• Bind this string[] (items) to the list of items to be shown.

• Calculate the size of the text list (or add clipping) to avoid showing items that are outside of the available list box space.

• Parse each string, if one starts with [*] mark it as selected (background color or blue rectangle).

• In the ListBox shape implementation, check whether the text property changes and update a string[] field in the listbox