UNPKG

doc-fui-ds

Version:

Doc

84 lines (74 loc) 2.61 kB
import { callIfFunction } from './utils/utils.js' import { DismissReason } from './utils/DismissReason.js' import privateProps from './privateProps.js' export const handlePopupClick = (instance, domCache, dismissWith) => { const innerParams = privateProps.innerParams.get(instance) if (innerParams.toast) { handleToastClick(instance, domCache, dismissWith) } else { // Ignore click events that had mousedown on the popup but mouseup on the container // This can happen when the user drags a slider handleModalMousedown(domCache) // Ignore click events that had mousedown on the container but mouseup on the popup handleContainerMousedown(domCache) handleModalClick(instance, domCache, dismissWith) } } const handleToastClick = (instance, domCache, dismissWith) => { // Closing toast by internal click domCache.popup.onclick = () => { const innerParams = privateProps.innerParams.get(instance) if (innerParams && (isAnyButtonShown(innerParams) || innerParams.timer || innerParams.input)) { return } dismissWith(DismissReason.close) } } /** * @param {*} innerParams * @returns {boolean} */ const isAnyButtonShown = (innerParams) => { return ( innerParams.showConfirmButton || innerParams.showDenyButton || innerParams.showCancelButton || innerParams.showCloseButton ) } let ignoreOutsideClick = false const handleModalMousedown = (domCache) => { domCache.popup.onmousedown = () => { domCache.container.onmouseup = function (e) { domCache.container.onmouseup = undefined // We only check if the mouseup target is the container because usually it doesn't // have any other direct children aside of the popup if (e.target === domCache.container) { ignoreOutsideClick = true } } } } const handleContainerMousedown = (domCache) => { domCache.container.onmousedown = () => { domCache.popup.onmouseup = function (e) { domCache.popup.onmouseup = undefined // We also need to check if the mouseup target is a child of the popup if (e.target === domCache.popup || domCache.popup.contains(e.target)) { ignoreOutsideClick = true } } } } const handleModalClick = (instance, domCache, dismissWith) => { domCache.container.onclick = (e) => { const innerParams = privateProps.innerParams.get(instance) if (ignoreOutsideClick) { ignoreOutsideClick = false return } if (e.target === domCache.container && callIfFunction(innerParams.allowOutsideClick)) { dismissWith(DismissReason.backdrop) } } }