appbaseio / reactivesearch

Search UI components for React and Vue
https://opensource.appbase.io/reactivesearch
Apache License 2.0
4.9k stars 466 forks source link

[MultiDropdownList] Having the possibility to open/close #1241

Open kud opened 4 years ago

kud commented 4 years ago

Affected Projects React.js / Web

Is your feature request related to a problem? Please describe. As a developer, I would like to be able to manage the fact the dropdown is displayed or not via for instance having isOpen as prop and not state.

Additional context I would like to close the dropdown everytime the user clicks on an item in the dropdown.

bietkul commented 4 years ago

Can you please tell in which component you're getting the issue? Does render prop not work for your use-case?

kud commented 4 years ago

It's on MultiDropdownList. I don't see any way to open and close the dropdown by myself in fact.

I could use MultiDataList and rendering the whole thing by my self but it could be a shame because I want the dropdown like you did on MultiDropdownList

I just need to be able to open and close the dropdown via a prop in MultiDropdownList.

kud commented 4 years ago
var Dropdown = function (_Component) {
    _inherits(Dropdown, _Component);

    function Dropdown(props) {
        _classCallCheck(this, Dropdown);

        var _this = _possibleConstructorReturn(this, _Component.call(this, props));

        _this.toggle = function () {
            _this.setState({
                isOpen: !_this.state.isOpen
            });
        };

Here you've got a state, that means you can't handle it externally.

bietkul commented 4 years ago

It can be handled with the render method but it doesn't make sense to render the complete UI for this minor functionality, I think the quick solution will be to provide access to the ref of Downshift component.

kud commented 4 years ago

Can't I play with downshiftProps like something:

                  downshiftProps={{
                    isOpen: true,
                  }}

(this one doesn't work for the moment)

?

kud commented 4 years ago

Apparently no: https://github.com/appbaseio/reactivesearch/blob/next/packages/web/src/components/shared/Dropdown.js#L143