function parmas

app.ts

import { showModalOrigin, showModal } from './function'

showModalOrigin({
    dom: 'dom',
    options: {
        clickCloseOrigin: (e, tools) => {
            console.log(e)
            console.log('click close origin')
            tools?.hideModalOrigin()
        }
    }
})

// 寫法會比較接近把功能都簡單的參數化
showModal({
    dom: 'dom',
    options: {
        closeModalCallback: (e) => {
            console.log(e)
            console.log('close modal callback')
        },
        clickClose: true
    }
})

function.ts

type CallBackType = (
    event: any,
    tools?: {
        hideModalOrigin: () => void
    }
) => void;

interface modalParamsOrigin {
    dom: any
    options: {
        clickCloseOrigin: CallBackType
    }
}

interface modalParams {
    dom: any
    options: {
        closeModalCallback: (event) => void
        clickClose: boolean
    }
}

const hideModalOrigin = () => {
    console.log('hide modal origin')
    // dom.classList.add('hide')
}

export const showModalOrigin = (params: modalParamsOrigin) => {
    const { dom, options } = params
    const { clickCloseOrigin } = options

    // if (clickCloseOrigin) {
    //     dom?.addEventListener('click', (event) => {
    //         clickCloseOrigin(event, {
    //             hideModalOrigin
    //         })
    //     })
    // }

    if (clickCloseOrigin) {
        clickCloseOrigin('event', {
            hideModalOrigin
        })
    }
}

const hideModal = (dom: any) => {
    console.log('hide modal')
    // dom.classList.add('hide')
}

export const showModal = (params: modalParams) => {
    const { dom, options } = params
    const { closeModalCallback, clickClose } = options

    // if (closeModalCallback) {

    //     dom?.addEventListener('click', (e) => {

    //         closeModalCallback(e)

    //         if (clickClose) {
    //             hideModal(dom)
    //         }
    //     }

    // }

    if (closeModalCallback) {

        closeModalCallback('e')

        if (clickClose) {
            hideModal(dom)
        }
    }

}