CDatePicker is not closing after selecting a date

[danielhoegel]

Steps to reproduce:

1. Add a CDatePicker component to any react app: <CDatePicker label="Date" locale="en-US" />
2. Click on the date picker input to open the dropdown
3. Click on any date

Expected behavior:
Date picker dropdown closes. Same behavior as in the docs: https://coreui.io/react/docs/forms/date-picker/#example

Actual behavior:
Date picker dropdown stays open until you click outside the component

---

Sidenote:
The visible prop does not work as a toggle.

Testcase:

const VisiblePropTest = () => {
    const [isVisible, setIsVisible] = useState<boolean | undefined>();

    return (
        <CDatePicker
            label="Date"
            locale="en-US"
            visible={isVisible}
            onDateChange={(date) => {
                setIsVisible(false);
            }}
        />
    );
};

Expected behavior:
Date picker dropdown closes when selecting any date.

Actual behavior:
Date picker dropdown stays open. Contrary to the docs ("Toggle the visibility of dropdown menu component.") the visibility prop only seems to works as a default value and not as a toggle.

---

• Operating system and version: Windows 10
• Browser and version: Edge Version 108.0.1462.76

package versions

"@coreui/coreui-pro": "^4.4.3",
"@coreui/icons": "^2.1.0",
"@coreui/icons-pro": "^2.0.3",
"@coreui/icons-react": "^2.1.0",
"@coreui/react-chartjs": "^2.1.1",
"@coreui/react-pro": "^4.7.2",
"@coreui/utils": "^1.3.1",
"react": "^17.0.2",
"react-dom": "^17.0.2"

[mrholek]

@danielhoegel there was a bug, it will be fixed in 4.8.0 later this month. I additionally add closeOnSelect property to control if the dropdown will be immediately closed after submitting the full date.

If you want to try it please upgrader @coreui/react-pro to v4.8.0-alpha.1