first commit
This commit is contained in:
+9
@@ -0,0 +1,9 @@
|
||||
import { Ref } from "vue";
|
||||
|
||||
//#region ../../packages/hooks/use-modal/index.d.ts
|
||||
type ModalInstance = {
|
||||
handleClose: () => void;
|
||||
};
|
||||
declare const useModal: (instance: ModalInstance, visibleRef: Ref<boolean>) => void;
|
||||
//#endregion
|
||||
export { useModal };
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
import { EVENT_CODE } from "../../constants/aria.mjs";
|
||||
import { getEventCode } from "../../utils/dom/event.mjs";
|
||||
import { isClient, useEventListener } from "@vueuse/core";
|
||||
import { watch } from "vue";
|
||||
|
||||
//#region ../../packages/hooks/use-modal/index.ts
|
||||
const modalStack = [];
|
||||
const closeModal = (e) => {
|
||||
if (modalStack.length === 0) return;
|
||||
if (getEventCode(e) === EVENT_CODE.esc) {
|
||||
e.stopPropagation();
|
||||
modalStack[modalStack.length - 1].handleClose();
|
||||
}
|
||||
};
|
||||
const useModal = (instance, visibleRef) => {
|
||||
watch(visibleRef, (val) => {
|
||||
if (val) modalStack.push(instance);
|
||||
else modalStack.splice(modalStack.indexOf(instance), 1);
|
||||
});
|
||||
};
|
||||
if (isClient) useEventListener(document, "keydown", closeModal);
|
||||
|
||||
//#endregion
|
||||
export { useModal };
|
||||
//# sourceMappingURL=index.mjs.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../packages/hooks/use-modal/index.ts"],"sourcesContent":["import { watch } from 'vue'\nimport { isClient, useEventListener } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport { getEventCode } from '@element-plus/utils'\n\nimport type { Ref } from 'vue'\n\ntype ModalInstance = {\n handleClose: () => void\n}\n\nconst modalStack: ModalInstance[] = []\n\nconst closeModal = (e: KeyboardEvent) => {\n if (modalStack.length === 0) return\n const code = getEventCode(e)\n if (code === EVENT_CODE.esc) {\n e.stopPropagation()\n const topModal = modalStack[modalStack.length - 1]\n topModal.handleClose()\n }\n}\n\nexport const useModal = (instance: ModalInstance, visibleRef: Ref<boolean>) => {\n watch(visibleRef, (val) => {\n if (val) {\n modalStack.push(instance)\n } else {\n modalStack.splice(modalStack.indexOf(instance), 1)\n }\n })\n}\n\nif (isClient) useEventListener(document, 'keydown', closeModal)\n"],"mappings":";;;;;;AAWA,MAAM,aAA8B,EAAE;AAEtC,MAAM,cAAc,MAAqB;AACvC,KAAI,WAAW,WAAW,EAAG;AAE7B,KADa,aAAa,EAAE,KACf,WAAW,KAAK;AAC3B,IAAE,iBAAiB;AAEnB,EADiB,WAAW,WAAW,SAAS,GACvC,aAAa;;;AAI1B,MAAa,YAAY,UAAyB,eAA6B;AAC7E,OAAM,aAAa,QAAQ;AACzB,MAAI,IACF,YAAW,KAAK,SAAS;MAEzB,YAAW,OAAO,WAAW,QAAQ,SAAS,EAAE,EAAE;GAEpD;;AAGJ,IAAI,SAAU,kBAAiB,UAAU,WAAW,WAAW"}
|
||||
Reference in New Issue
Block a user