1
0
Fork 0
mirror of synced 2024-09-28 07:11:40 +12:00

Use clickoutside library to stop mouseup closing side panel (#13193)

* Use clickoutside library to stop mouseup closing side panel

* Revert "Use clickoutside library to stop mouseup closing side panel"

This reverts commit fbe574812e.

* Use mousedown

* Add allowedType for clickoutside event

* Remove contextmenu listener

---------

Co-authored-by: Martin McKeaveney <martin@budibase.com>
This commit is contained in:
melohagan 2024-03-20 15:16:19 +00:00 committed by GitHub
parent 3788d67e8d
commit e4e6447cf6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 13 additions and 5 deletions

View file

@ -39,19 +39,23 @@ const handleClick = event => {
return
}
if (handler.allowedType && event.type !== handler.allowedType) {
return
}
handler.callback?.(event)
})
}
document.documentElement.addEventListener("click", handleClick, true)
document.documentElement.addEventListener("contextmenu", handleClick, true)
document.documentElement.addEventListener("mousedown", handleClick, true)
/**
* Adds or updates a click handler
*/
const updateHandler = (id, element, anchor, callback) => {
const updateHandler = (id, element, anchor, callback, allowedType) => {
let existingHandler = clickHandlers.find(x => x.id === id)
if (!existingHandler) {
clickHandlers.push({ id, element, anchor, callback })
clickHandlers.push({ id, element, anchor, callback, allowedType })
} else {
existingHandler.callback = callback
}
@ -77,7 +81,8 @@ export default (element, opts) => {
const update = newOpts => {
const callback = newOpts?.callback || newOpts
const anchor = newOpts?.anchor || element
updateHandler(id, element, anchor, callback)
const allowedType = newOpts?.allowedType || "click"
updateHandler(id, element, anchor, callback, allowedType)
}
update(opts)
return {

View file

@ -291,7 +291,10 @@
<div
id="side-panel-container"
class:open={$sidePanelStore.open}
use:clickOutside={autoCloseSidePanel ? sidePanelStore.actions.close : null}
use:clickOutside={{
callback: autoCloseSidePanel ? sidePanelStore.actions.close : null,
allowedType: "mousedown",
}}
class:builder={$builderStore.inBuilder}
>
<div class="side-panel-header">