Cannot find Datepicker

[mrVin99]

I'm having an issue importing Datepicker to obtain the selected value. More specifically, it's unable to detect and import the necessary dependencies:

import Datepicker from 'flowbite-datepicker/Datepicker';
error -> TS2307: Cannot find module flowbite-datepicker/Datepicker or its corresponding type declarations.

I thought it could be a typescript problem, so i added ts-ignore and tried to force my way into instanciating a datepicker.

const datepickerEl = document.getElementById('sale_date'); 
new Datepicker(datepickerEl, {
        autoHide: true,
});

I got this error: Uncaught TypeError: Cannot set properties of null (setting 'datepicker')

I followed the https://flowbite.com/docs/plugins/datepicker/ guide. Which basically is:

• add
• install flowbite-datepicker
• add import Datepicker from 'flowbite-datepicker/Datepicker';

The visual element itself is working perfectly. However i need a way to obtain the selected value, and this part isn't. I'm using SolidJS 1.8.11 with TS.

[kboul]

Same issue here

[eliasbraun]

Can confirm!

[gijsbeijer]

+1

[mrVin99]

I made a repository to reproduce this issue: https://github.com/mrVin99/datepicker-flowbite-issue

[mrVin99]

I also made a temporary fix.

const datePickerValue = () => {
    const datePicker = document.getElementById('datepickerId');
    datePicker.addEventListener('click', () => {
        const datePickerModal = document.querySelectorAll('.datepicker-cell');
        datePickerModal.forEach(date => {
            date.addEventListener('click', (e) => {
                const target = e.target as HTMLElement;
                console.log(target.innerText);
            });
        });
    });
}

PS: You have to call it after the page is done rendering, in solidjs case use onMount(() => { datePickerValue() });

[zoltanszogyenyi]

Hey guys,

We've released v2.4.1 and this brings the datepicker API to Flowbite and is now available in the instances object too.

Please check the new docs here:

https://flowbite.com/docs/components/datepicker/index.html#javascript-behaviour

Cheers, Zoltan