Provide reachability of ClayDropdown.Menu props when calling ClayAutocomplete.Dropdown

[diegonvs]

What is your proposal?

This proposal cames from liferay-frontend/liferay-portal#1471 (comment),

ClayAutocomplete.Dropdown component is being used and the developer needed to create custom code to deal with clickOutside logic

A solution for avoiding people repeating this logic is to enable passing properties to ClayDropdown.Menu component that is being used internally in ClayAutocomplete.Dropdown.

<ClayAutocomplete.DropDown active={active} closeOnClickOutside>
    <div
        className="autocomplete-items"
        ref={dropdownRef}
    >
        {itemsWrapperRenderer({
            items,
            labelKey,
            onItemClick: onSelectedItemChange,
            valueKey,
        })}
    </div>
</ClayAutocomplete.DropDown>

Why would adopting this proposal be beneficial?

Avoid repetition of logic when using ClayAutocomplete.Dropdown

What are the alternatives to this proposal?

Creating a property called dropdownMenuProps?

It will look like:

<ClayAutocomplete.DropDown active={active} dropdownMenuProps={{closeOnClickOutside
: true}}>
    <div
        className="autocomplete-items"
        ref={dropdownRef}
    >
        {itemsWrapperRenderer({
            items,
            labelKey,
            onItemClick: onSelectedItemChange,
            valueKey,
        })}
    </div>
</ClayAutocomplete.DropDown>

[github-actions]

This issue has been merged and will be released in DXP at https://issues.liferay.com/browse/LPS-130575