Resolved a width conflict in the date range picker where the field width
conflicted with the component's min-width. This caused content
overflow in the field container, resulting in layout issues.
As the default type of button is "submit", when including a DatePicker
inside a form, clicking on any of its button was triggering form
submission.
Fixes#245
In some cases, when the options were newly built object, due to the
fact that we were using object equality to check for the current selected
item, it was not working in those cases.
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.
This new demo aims to take advantage of all the new Cunningham's
components. The old demo was kind of a draft, this new one gives
a better overview of what Cunningham is capable of.
We realized that even if the Figma sketches indicates that the icons
are 16px in reality the rendered DOM was not visualy matching the
sketches. We needs 19px to match the sketches.
This hook is used to create a state that can be controlled by the parent.
If not the state is handled internally. We start to have this redundant
use case across Cunningham, so creating a dedicated hook reduces the
components verbosity and complexity.
Previously it was not possible to close the menu when clicking on
the toggle button on search select. It was caused by a conflicting
state update.
1. Downshift triggers closing the menu from getToggleButtonProps
2. wrapperProps was calling downshiftReturn.openMenu()
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.
For a variety of reasons, such as accessibility or integration with
external react-router deps style we needed to be able to provide the
ability to render the Button component as link in order to be able
to provide link-specific attribute for rendering such as href.
The oveflowing labels were spreading on two lines. I had to wrap a
span inside a label in order to be able to deal with the text-oveflow
plus the absolute positionning.
In some cases we need the props of a component to be exported,
to be able to use them in other components. This commit exports
the props of the Button component.
Some discussion appeared about the fact the multi select was changing
height when pill were selected, making this input having a bigger
height than others making it looks weird in a form comparing to the
others. Modifying the padding and font size make the input keep the
same height.
See #114
When clicking on the checkmark it was trigerring two onChange on parent
elements, thus causing double toggling ( which means revert to the initial
value ) in some controlled way approaches ( see the added test ).
Fixes#175
We decided to change a bit the behavior of the Select:
- Do not trigger onChange on first render if value is defined
- Show all options on searchable select menu opening even if there is an
existing value.
- Clear the input field if no choice are selected
- Clear the added text to the input field when a value is already selected
Previsouly when selecting item A and then removing it, it was impossible
to select it again. This was caused by the internal memory of useSelect
that only provides undefined selectedItem inside the onStateChange callback
when the item has not changed. So by forcing it everytime to null it is
now providing it everytime.
Changing the controlled value was setting triggering immediately an
onChange event with undefined value. This was due to the fact that when
the controlled value was changed SelectMonoAux was searching only in
options displayed, where it should in reality be searching accross all
options.
fixes#162
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.
The fullWidth was buggy for those components, the label was floating
in the middle of the empty space where it feels correct to keep it
aligned on the left.
