themesberg / flowbite

Open-source UI component library and front-end development framework based on Tailwind CSS
https://flowbite.com
MIT License
7.73k stars 725 forks source link

Request - html driven way to reset modal state #782

Open reubenfirmin opened 8 months ago

reubenfirmin commented 8 months ago

Is your feature request related to a problem? Please describe. I am using Flowbite alongside HTMX. I have a modal for a particular CRUD operation; the action of the modal button is to post (using HTMX) to the backend. Depending on whether validation succeeds on the backend, I either upsert to the DB and rerender the content pane (behind the modal), or I keep the modal showing and rerender its contents with validation annotations. This all works; what fails is that the modal backdrop stays open in the success case, because I don't (can't) have the data-modal-toggle attribute on the save button (because I may wish to keep the modal open with validation).

Describe the solution you'd like What I'd like is something along the lines of: "data-modal-initial-state", with either open or closed. IF set to closed, FlowBite should check for a backdrop associated with the modal, and automatically clear it.

Describe alternatives you've considered Right now I have a snippet of js which clears the backdrop if it finds it. This isn't great, because it's literally the one piece of custom js in my app - everything else is markup rendered by the backend via HTMX, and Flowbite providing behavior. Taking care of this interaction would get me back to a "pure" state.