jakezatecky / react-dual-listbox

A feature-rich dual listbox for React.
https://jakezatecky.github.io/react-dual-listbox/
MIT License
109 stars 58 forks source link

`height` on root node no longer changes height of listbox component #215

Closed Zajn closed 1 year ago

Zajn commented 1 year ago

Hi, I noticed in the most recent release that if the root node is given a height attribute through a class, it no longer affects the height of the listbox.

Here are some screenshots from v3.0.1 and v4.0.0 with the addition of a .tall-listbox class on the root node of the Basic Example, via the className property:

v3.0.1

Screen Shot 2022-12-20 at 4 06 47 PM

v4.0.0

Screen Shot 2022-12-20 at 4 03 16 PM

I think this changed in https://github.com/jakezatecky/react-dual-listbox/commit/ebc2605d3996b2199057a4c539481f2a15856433 with the addition of the <div class="rdl-controls"> wrapper.

I found this issue https://github.com/jakezatecky/react-dual-listbox/issues/59 in which adding a height to the root node is the suggested method of managing the height of the component.

Was this intentionally changed, and if so, is there a new recommended way to manage the height of the component?

jakezatecky commented 1 year ago

Not intentional. Thanks for identifying this.

You are correct that the addition of the wrapper caused this issue. I will change the CSS for the next release to address this, but you can do the following in a CSS file:

.rdl-controls {
  height: 100%;
}