This commit modifies the Button component to switch the `variant` and
`color` props, ensuring consistency across various components that
utilize the Button. The changes include updates in the Alert, Modal,
Tooltip, and other components to reflect this new prop structure.
Additionally, several test and story files have been adjusted to
accommodate these changes, enhancing the overall component architecture.
The way the menu of the select was made was causing it to be cropped
inside modals, it was due to the fact the menu was nested inside a
position relative parent. Now we use react aria to position in full
absolute the menu, making it to be correctly displayed inside modals.
At first we had a simple bug were it was not possible to open the
menu by clicking on the label. This fix is a rework to consider
the select wrapper as the toggle button itself, which is what we
do on the mono version. This change caused various tests to fail.
Since the addition of tertiary-text variant, the original tertiary
variant has seen its background color changing from transparent to
greyscale-100, the change has impacted lots of components making
them look odd. So that's why I updated most of old tertiary to
tertiary-text.
Fixes#223
We want to enable a mode that prevent the pills the wrap on multiple
lines in order to control any height overflowing. In monoline mode the
selected items are displayed as text to allow text ellipsis, and the
menu renders the list items with checkboxes.
It was considered as a bad practice to include array indexes in list
elements keys even though it was made this way in the documentation. We
removed them and also decided to drop the use of options value in the
keys too to the profit of optionToValue which can never be undefined or null.
This changes caused test crashing due to the fact that it made the useSelect
onStateChange trigger a onBlur event that was causing the first option of the
list to be selected automatically, which was a really weird behavior. Before
it was not happening because newSelectedItem was not defined, using the
new keys made it defined, we don't 100% understand why yet.
Previously if the menu was opened and no there were no options to be
displayed it was just showing a tiny empty menu, this commit adds an
empty placeholder in order to make it clearer that the list is empty.
This new major version broke our components, including the way the menu
gets opened, how to determine the disabled options and some other semantic
types changes.
Adding this new variant makes necessary to reorganize the files to keep
a clear separations of concerns. As of now Select/index.tsx is just an
entrypoint to render either the mono or multi variant of the select.