themesberg/flowbite

Cannot find Datepicker

mrVin99 opened this issue · 5 comments

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 <script src="../path/to/flowbite/dist/datepicker.js"></script>
  • 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.

Same issue here

Can confirm!

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

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() });