@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
1 lines • 4.88 kB
Source Map (JSON)
{"version":3,"file":"index.mjs","sources":["../../../components/modal/index.ts"],"sourcesContent":["import { createApp, createVNode, getCurrentInstance, h, nextTick, ref, render, unref } from 'vue'\n\nimport Component from './modal.vue'\nimport { isClient, noop } from '@vexip-ui/utils'\n\nimport type { App, AppContext, ComponentPublicInstance, MaybeRef } from 'vue'\nimport type { ModalProps } from './props'\nimport type { ModalCommonSlot } from './symbol'\n\nexport type ModalOptions = Omit<ModalProps, 'active' | 'transfer' | 'loading' | 'autoRemove'> & {\n /**\n * Specify the app context, ensue the modal using same context\n */\n appContext: AppContext,\n /**\n * Specify whether the modal is loading\n */\n loading: MaybeRef<boolean>,\n /**\n * Another way to use default slot\n */\n renderer: ModalCommonSlot,\n /**\n * Another way to use header slot\n */\n headerRenderer: ModalCommonSlot,\n /**\n * Another way to use title slot\n */\n titleRenderer: ModalCommonSlot,\n /**\n * Another way to use close slot\n */\n closeRenderer: ModalCommonSlot,\n /**\n * Another way to use footer slot\n */\n footerRenderer: ModalCommonSlot\n}\n\nexport function useModal(options: Partial<ModalOptions> = {}): () => Promise<void> {\n if (!isClient) return noop\n\n const {\n appContext,\n loading,\n renderer,\n headerRenderer,\n titleRenderer,\n closeRenderer,\n footerRenderer,\n onHide,\n ...props\n } = options\n\n const active = ref(false)\n\n let instance = getCurrentInstance()\n\n let container: HTMLElement | undefined = document.createElement('div')\n let app: App | undefined\n\n if (appContext || instance) {\n const vnode = createVNode(createModal, null, null)\n\n vnode.appContext = appContext || instance!.appContext\n render(vnode, container)\n } else {\n app = createApp(createModal)\n app.mount(container)\n }\n\n document.body.appendChild(container)\n\n // Ensure Modal show transition is effective\n nextTick(() => {\n active.value = true\n })\n\n function createModal() {\n return h(\n Component,\n {\n ...props,\n active: active.value,\n transfer: false,\n autoRemove: false,\n loading: unref(loading),\n onHide: Array.isArray(onHide) ? [...onHide, destroy] : onHide ? [onHide, destroy] : destroy\n },\n {\n header: headerRenderer,\n title: titleRenderer,\n close: closeRenderer,\n default: renderer,\n footer: footerRenderer\n }\n )\n }\n\n function destroy() {\n if (instance) {\n container && render(null, container)\n instance = null\n }\n\n if (app) {\n app.unmount()\n app = undefined\n }\n\n if (container) {\n document.body.removeChild(container)\n container = undefined\n }\n }\n\n return () =>\n nextTick(() => {\n active.value = false\n })\n}\n\nComponent.open = useModal\n\nconst Modal = Component as typeof Component & { open: typeof useModal }\n\nexport { Modal }\nexport { modalProps } from './props'\n\nexport type ModalExposed = ComponentPublicInstance & InstanceType<typeof Component>\n\nexport type { ModalProps, ModalCProps } from './props'\nexport type { ModalSlotParams } from './symbol'\n"],"names":["useModal","options","isClient","noop","appContext","loading","renderer","headerRenderer","titleRenderer","closeRenderer","footerRenderer","onHide","props","active","ref","instance","getCurrentInstance","container","app","vnode","createVNode","createModal","render","createApp","nextTick","h","Component","unref","destroy","Modal"],"mappings":";;;;;AAwCgB,SAAAA,EAASC,IAAiC,IAAyB;AAC7E,MAAA,CAACC,EAAiB,QAAAC;AAEhB,QAAA;AAAA,IACJ,YAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,QAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDX,GAEEY,IAASC,EAAI,EAAK;AAExB,MAAIC,IAAWC,EAAmB,GAE9BC,IAAqC,SAAS,cAAc,KAAK,GACjEC;AAEJ,MAAId,KAAcW,GAAU;AAC1B,UAAMI,IAAQC,EAAYC,GAAa,MAAM,IAAI;AAE3C,IAAAF,EAAA,aAAaf,KAAcW,EAAU,YAC3CO,EAAOH,GAAOF,CAAS;AAAA,EAAA;AAEvB,IAAAC,IAAMK,EAAUF,CAAW,GAC3BH,EAAI,MAAMD,CAAS;AAGZ,WAAA,KAAK,YAAYA,CAAS,GAGnCO,EAAS,MAAM;AACb,IAAAX,EAAO,QAAQ;AAAA,EAAA,CAChB;AAED,WAASQ,IAAc;AACd,WAAAI;AAAA,MACLC;AAAAA,MACA;AAAA,QACE,GAAGd;AAAA,QACH,QAAQC,EAAO;AAAA,QACf,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,SAASc,EAAMtB,CAAO;AAAA,QACtB,QAAQ,MAAM,QAAQM,CAAM,IAAI,CAAC,GAAGA,GAAQiB,CAAO,IAAIjB,IAAS,CAACA,GAAQiB,CAAO,IAAIA;AAAA,MACtF;AAAA,MACA;AAAA,QACE,QAAQrB;AAAA,QACR,OAAOC;AAAA,QACP,OAAOC;AAAA,QACP,SAASH;AAAA,QACT,QAAQI;AAAA,MAAA;AAAA,IAEZ;AAAA,EAAA;AAGF,WAASkB,IAAU;AACjB,IAAIb,MACWE,KAAAK,EAAO,MAAML,CAAS,GACxBF,IAAA,OAGTG,MACFA,EAAI,QAAQ,GACNA,IAAA,SAGJD,MACO,SAAA,KAAK,YAAYA,CAAS,GACvBA,IAAA;AAAA,EACd;AAGK,SAAA,MACLO,EAAS,MAAM;AACb,IAAAX,EAAO,QAAQ;AAAA,EAAA,CAChB;AACL;AAEAa,EAAU,OAAO1B;AAEjB,MAAM6B,IAAQH;"}