wakirin / Litepicker

Date range picker - lightweight, no dependencies
MIT License
899 stars 132 forks source link

preventClick is inaccessible #184

Closed challamzinniagroup closed 3 years ago

challamzinniagroup commented 3 years ago

Describe the bug The documentation indicates the ability to connect to the 'before:click' emitter and prevent the click by setting the preventClick prop to true. However, this prop is protected and therefore inaccessible from code outside the library without inheriting the entire class. Unless I am overlooking something?

Thank you!

challamzinniagroup commented 3 years ago

On further examination, the before:click is not the event I am after. I was trying to enable/disable the picker based on the bound boolean value of a checkbox - but this event is fired from within the picker, not the initial click on the element.

I ended up adding a listener for the show event; check the boolean, and immediately hide the picker if necessary. Seems quite messy, but it works for now.

Is there a better way to go about this?

Thank you!

wakirin commented 3 years ago

before:click works fine.

Event is called before click on calendar elements.

I will update the docs that «calendar elements» are children of .litepicker element.

https://jsfiddle.net/ge825mn1/

In your case, you can do something like this:

https://jsfiddle.net/pLfv5za0/

challamzinniagroup commented 3 years ago

@wakirin Thank you for the quick reply - much appreciated.

I didn't have any trouble with the before:click not firing - simply that the Litepicker.preventClick property that the documentation referred to is inaccessible and cannot be used as indicated.

I should also clarify that I am using this in an Angular/Typescript project within VSCode - so while the protected access modifier may not cause issues in pure JavaScript (per your fiddle); it is being rejected by the VSCode TypeScript compiler and the solution will not even build.

Your other fiddle isn't exactly what I am looking for, but it does give me some ideas on how to clean up what I have. I am not looking to the checkbox to be a show/hide toggle; but rather simply an enabled/disabled toggle. Simply disabling the input that the Litepicker is bound to does not prevent the click and show on it's own (perhaps it could?).

Thanks,

wakirin commented 3 years ago

@challamzinniagroup in the next release I will change to public.

challamzinniagroup commented 3 years ago

Awesome, thank you @wakirin .

Also worth noting the element option is HtmlElement | HtmlInputElement while the elementEnd option is HtmlInputElement. This forces the elementEnd to have to be cast if only using document.getElementById('...') in TypeScript as that call returns an HtmlElement.

Sorry for being picky - just some things I have been noticing as I am working with the library for my first time. Overall I absolutely love the library - very fast, lightweight, really nice work!

wakirin commented 3 years ago

@challamzinniagroup

Ok, took note. Thanks.