element-pe 1.0.8 → 1.0.9-alpha.12

package/es/hooks/use-locale/index.mjs

@@ -1,76 +1,46 @@
-import { getCurrentInstance, computed, provide, ref, inject } from 'vue';
-import defaultLang from '../../locale/lang/en.mjs';
-import { buildProp, definePropType } from '../../utils/props.mjs';
+import { getCurrentInstance, computed, provide, unref, ref, inject } from 'vue';
+import get from 'lodash/get';
+import English from '../../locale/lang/en.mjs';
+import { buildProps, definePropType } from '../../utils/props.mjs';
 
-const useLocaleProps = {
-  locale: buildProp({
+const useLocaleProps = buildProps({
+  locale: {
     type: definePropType(Object)
-  })
-};
-const LocaleInjectionKey = "ElLocaleInjection";
-let localeObjCache;
-function translate(path, option, current) {
-  const paths = path.split(".");
-  let value;
-  for (let i = 0, j = paths.length; i < j; i++) {
-    const property = paths[i];
-    value = current[property];
-    if (i === j - 1)
-      return template(value, option);
-    if (!value)
-      return "";
-    current = value;
   }
-}
-const useLocale = () => {
+});
+const localeContextKey = Symbol("localeContextKey");
+let cache;
+const provideLocale = () => {
   const vm = getCurrentInstance();
   const props = vm.props;
-  const locale = computed(() => props.locale || defaultLang);
+  const locale = computed(() => props.locale || English);
   const lang = computed(() => locale.value.name);
-  const _translator = (...args) => {
-    const [path, option] = args;
-    return translate(path, option, locale.value);
-  };
-  const t = (...args) => {
-    return _translator(...args);
-  };
+  const t = buildTranslator(locale);
   const provides = {
     locale,
     lang,
     t
   };
-  localeObjCache = provides;
-  provide(LocaleInjectionKey, provides);
+  cache = provides;
+  provide(localeContextKey, provides);
 };
-function template(str, option) {
-  if (!str || !option)
-    return str;
-  return str.replace(/\{(\w+)\}/g, (_, key) => {
-    return option[key];
-  });
-}
-const localeProviderMaker = (locale = defaultLang) => {
+const buildTranslator = (locale) => (path, option) => translate(path, option, unref(locale));
+const translate = (path, option, locale) => get(locale, path, path).replace(/\{(\w+)\}/g, (_, key) => {
+  var _a;
+  return `${(_a = option == null ? void 0 : option[key]) != null ? _a : `{${key}}`}`;
+});
+const localeProviderMaker = (locale = English) => {
   const lang = ref(locale.name);
   const localeRef = ref(locale);
   return {
     lang,
     locale: localeRef,
-    t: (...args) => {
-      const [path, option] = args;
-      return translate(path, option, localeRef.value);
-    }
+    t: buildTranslator(localeRef)
   };
 };
-const useLocaleInject = () => {
-  return inject(LocaleInjectionKey, localeObjCache || {
-    lang: ref(defaultLang.name),
-    locale: ref(defaultLang),
-    t: (...args) => {
-      const [path, option] = args;
-      return translate(path, option, defaultLang);
-    }
-  });
+const useLocale = () => {
+  return inject(localeContextKey, cache || localeProviderMaker(English));
 };
 
-export { LocaleInjectionKey, localeProviderMaker, useLocale, useLocaleInject, useLocaleProps };
+export { buildTranslator, localeContextKey, localeProviderMaker, provideLocale, translate, useLocale, useLocaleProps };
 //# sourceMappingURL=index.mjs.map

package/es/hooks/use-locale/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-locale/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, inject, provide, ref } from 'vue'\nimport English from '@element-plus/locale/lang/en'\nimport { buildProp, definePropType } from '@element-plus/utils/props'\nimport type { InjectionKey, Ref } from 'vue'\nimport type { Language } from '@element-plus/locale'\n\nexport const useLocaleProps = {\n  locale: buildProp({\n    type: definePropType<Language>(Object),\n  }),\n}\n\ntype Translator = (...args: any[]) => string\n\nexport type LocaleContext = {\n  locale: Ref<Language>\n  lang: Ref<string>\n  t: Translator\n}\n\nexport const LocaleInjectionKey =\n  'ElLocaleInjection' as unknown as InjectionKey<LocaleContext>\n\n// this is meant to fix global methods like `ElMessage(opts)`, this way we can inject current locale\n// into the component as default injection value.\n// refer to: https://github.com/element-plus/element-plus/issues/2610#issuecomment-887965266\nlet localeObjCache: LocaleContext\n\nfunction translate(path, option, current) {\n  const paths = path.split('.')\n  let value\n  for (let i = 0, j = paths.length; i < j; i++) {\n    const property = paths[i]\n    value = current[property]\n    if (i === j - 1) return template(value, option)\n    if (!value) return ''\n    current = value\n  }\n}\n\nexport const useLocale = () => {\n  const vm = getCurrentInstance()!\n  const props = vm.props as {\n    locale: Language\n  }\n\n  const locale = computed(() => props.locale || English)\n  const lang = computed(() => locale.value.name)\n\n  const _translator = (...args: any[]) => {\n    const [path, option] = args\n    return translate(path, option, locale.value)\n  }\n\n  const t = (...args: any[]) => {\n    return _translator(...args)\n  }\n\n  const provides = {\n    locale,\n    lang,\n    t,\n  } as LocaleContext\n\n  // this could be broken if someone tries to do following:\n\n  /**\n   * <config-provider :locale=\"lang1\">\n   *   <config-provider :locale=\"lang2\">\n   *     Something calls modal component.\n   *   </config-provider>\n   * </config-provider>\n   */\n  localeObjCache = provides\n  provide(LocaleInjectionKey, provides)\n}\n\nfunction template(str: string, option) {\n  if (!str || !option) return str\n  return str.replace(/\\{(\\w+)\\}/g, (_, key) => {\n    return option[key]\n  })\n}\n\nexport const localeProviderMaker = (locale = English) => {\n  const lang = ref(locale.name)\n  const localeRef = ref(locale)\n  return {\n    lang,\n    locale: localeRef,\n    t: (...args: any[]) => {\n      const [path, option] = args\n      return translate(path, option, localeRef.value)\n    },\n  }\n}\n\nexport const useLocaleInject = () => {\n  return inject(\n    LocaleInjectionKey,\n    localeObjCache || {\n      lang: ref(English.name),\n      locale: ref(English),\n      t: (...args) => {\n        const [path, option] = args\n        return translate(path, option, English)\n      },\n    }\n  )\n}\n"],"names":["English"],"mappings":";;;;MAMa,iBAAiB;AAAA,EAC5B,QAAQ,UAAU;AAAA,IAChB,MAAM,eAAyB;AAAA;AAAA;MAYtB,qBACX;AAKF,IAAI;AAEJ,mBAAmB,MAAM,QAAQ,SAAS;AACxC,QAAM,QAAQ,KAAK,MAAM;AACzB,MAAI;AACJ,WAAS,IAAI,GAAG,IAAI,MAAM,QAAQ,IAAI,GAAG,KAAK;AAC5C,UAAM,WAAW,MAAM;AACvB,YAAQ,QAAQ;AAChB,QAAI,MAAM,IAAI;AAAG,aAAO,SAAS,OAAO;AACxC,QAAI,CAAC;AAAO,aAAO;AACnB,cAAU;AAAA;AAAA;MAID,YAAY,MAAM;AAC7B,QAAM,KAAK;AACX,QAAM,QAAQ,GAAG;AAIjB,QAAM,SAAS,SAAS,MAAM,MAAM,UAAUA;AAC9C,QAAM,OAAO,SAAS,MAAM,OAAO,MAAM;AAEzC,QAAM,cAAc,IAAI,SAAgB;AACtC,UAAM,CAAC,MAAM,UAAU;AACvB,WAAO,UAAU,MAAM,QAAQ,OAAO;AAAA;AAGxC,QAAM,IAAI,IAAI,SAAgB;AAC5B,WAAO,YAAY,GAAG;AAAA;AAGxB,QAAM,WAAW;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA;AAYF,mBAAiB;AACjB,UAAQ,oBAAoB;AAAA;AAG9B,kBAAkB,KAAa,QAAQ;AACrC,MAAI,CAAC,OAAO,CAAC;AAAQ,WAAO;AAC5B,SAAO,IAAI,QAAQ,cAAc,CAAC,GAAG,QAAQ;AAC3C,WAAO,OAAO;AAAA;AAAA;MAIL,sBAAsB,CAAC,SAASA,gBAAY;AACvD,QAAM,OAAO,IAAI,OAAO;AACxB,QAAM,YAAY,IAAI;AACtB,SAAO;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,IACR,GAAG,IAAI,SAAgB;AACrB,YAAM,CAAC,MAAM,UAAU;AACvB,aAAO,UAAU,MAAM,QAAQ,UAAU;AAAA;AAAA;AAAA;MAKlC,kBAAkB,MAAM;AACnC,SAAO,OACL,oBACA,kBAAkB;AAAA,IAChB,MAAM,IAAIA,YAAQ;AAAA,IAClB,QAAQ,IAAIA;AAAA,IACZ,GAAG,IAAI,SAAS;AACd,YAAM,CAAC,MAAM,UAAU;AACvB,aAAO,UAAU,MAAM,QAAQA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-locale/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, inject, provide, ref, unref } from 'vue'\nimport get from 'lodash/get'\nimport English from '@element-plus/locale/lang/en'\nimport { buildProps, definePropType } from '@element-plus/utils/props'\nimport type { MaybeRef } from '@vueuse/core'\nimport type { InjectionKey, Ref } from 'vue'\nimport type { Language } from '@element-plus/locale'\n\nexport type TranslatorOption = Record<string, string | number>\nexport type Translator = (path: string, option?: TranslatorOption) => string\nexport type LocaleContext = {\n  locale: Ref<Language>\n  lang: Ref<string>\n  t: Translator\n}\n\nexport const useLocaleProps = buildProps({\n  locale: {\n    type: definePropType<Language>(Object),\n  },\n})\n\nexport const localeContextKey: InjectionKey<LocaleContext> =\n  Symbol('localeContextKey')\n\n// this is meant to fix global methods like `ElMessage(opts)`, this way we can inject current locale\n// into the component as default injection value.\n// refer to: https://github.com/element-plus/element-plus/issues/2610#issuecomment-887965266\nlet cache: LocaleContext\n\nexport const provideLocale = () => {\n  const vm = getCurrentInstance()!\n  const props = vm.props as {\n    locale: Language\n  }\n  const locale = computed(() => props.locale || English)\n  const lang = computed(() => locale.value.name)\n\n  const t = buildTranslator(locale)\n  const provides: LocaleContext = {\n    locale,\n    lang,\n    t,\n  }\n\n  // this could be broken if someone tries to do following:\n\n  /**\n   * <config-provider :locale=\"lang1\">\n   *   <config-provider :locale=\"lang2\">\n   *     Something calls modal component.\n   *   </config-provider>\n   * </config-provider>\n   */\n  cache = provides\n  provide(localeContextKey, provides)\n}\n\nexport const buildTranslator =\n  (locale: MaybeRef<Language>): Translator =>\n  (path, option) =>\n    translate(path, option, unref(locale))\n\nexport const translate = (\n  path: string,\n  option: undefined | TranslatorOption,\n  locale: Language\n): string =>\n  (get(locale, path, path) as string).replace(\n    /\\{(\\w+)\\}/g,\n    (_, key) => `${option?.[key] ?? `{${key}}`}`\n  )\n\nexport const localeProviderMaker = (locale = English) => {\n  const lang = ref(locale.name)\n  const localeRef = ref(locale)\n  return {\n    lang,\n    locale: localeRef,\n    t: buildTranslator(localeRef),\n  }\n}\n\nexport const useLocale = () => {\n  return inject(localeContextKey, cache || localeProviderMaker(English))\n}\n"],"names":[],"mappings":";;;;;MAgBa,iBAAiB,WAAW;AAAA,EACvC,QAAQ;AAAA,IACN,MAAM,eAAyB;AAAA;AAAA;MAItB,mBACX,OAAO;AAKT,IAAI;MAES,gBAAgB,MAAM;AACjC,QAAM,KAAK;AACX,QAAM,QAAQ,GAAG;AAGjB,QAAM,SAAS,SAAS,MAAM,MAAM,UAAU;AAC9C,QAAM,OAAO,SAAS,MAAM,OAAO,MAAM;AAEzC,QAAM,IAAI,gBAAgB;AAC1B,QAAM,WAA0B;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA;AAYF,UAAQ;AACR,UAAQ,kBAAkB;AAAA;MAGf,kBACX,CAAC,WACD,CAAC,MAAM,WACL,UAAU,MAAM,QAAQ,MAAM;MAErB,YAAY,CACvB,MACA,QACA,WAEC,IAAI,QAAQ,MAAM,MAAiB,QAClC,cACA,CAAC,GAAG,QAAK;AAtEb;AAsEgB,YAAG,uCAAS,SAAT,YAAiB,IAAI;AAAA;MAG3B,sBAAsB,CAAC,SAAS,YAAY;AACvD,QAAM,OAAO,IAAI,OAAO;AACxB,QAAM,YAAY,IAAI;AACtB,SAAO;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,IACR,GAAG,gBAAgB;AAAA;AAAA;MAIV,YAAY,MAAM;AAC7B,SAAO,OAAO,kBAAkB,SAAS,oBAAoB;AAAA;;;;"}

package/es/hooks/use-lockscreen/index.d.ts

@@ -1,3 +1,7 @@
 import type { Ref } from 'vue';
-declare const _default: (trigger: Ref<boolean>) => void;
-export default _default;
+/**
+ * Hook that monitoring the ref value to lock or unlock the screen.
+ * When the trigger became true, it assumes modal is now opened and vice versa.
+ * @param trigger {Ref<boolean>}
+ */
+export declare const useLockscreen: (trigger: Ref<boolean>) => void;

package/es/hooks/use-lockscreen/index.mjs

@@ -1,19 +1,20 @@
-import { isRef, onUnmounted, watch } from 'vue';
+import { isRef, watch, onScopeDispose } from 'vue';
 import scrollbarWidth from '../../utils/scrollbar-width.mjs';
 import { throwError } from '../../utils/error.mjs';
-import { removeClass, hasClass, getStyle, addClass } from '../../utils/dom.mjs';
+import { hasClass, removeClass, getStyle, addClass } from '../../utils/dom.mjs';
+import isServer from '../../utils/isServer.mjs';
 
-var useLockScreen = (trigger) => {
+const useLockscreen = (trigger) => {
   if (!isRef(trigger)) {
-    throwError("[useLockScreen]", "You need to pass a ref param to this function");
+    throwError("[useLockscreen]", "You need to pass a ref param to this function");
+  }
+  if (isServer || hasClass(document.body, "el-popup-parent--hidden")) {
+    return;
   }
   let scrollBarWidth = 0;
   let withoutHiddenClass = false;
   let bodyPaddingRight = "0";
   let computedBodyPaddingRight = 0;
-  onUnmounted(() => {
-    cleanup();
-  });
   const cleanup = () => {
     removeClass(document.body, "el-popup-parent--hidden");
     if (withoutHiddenClass) {
@@ -21,24 +22,25 @@ var useLockScreen = (trigger) => {
     }
   };
   watch(trigger, (val) => {
-    if (val) {
-      withoutHiddenClass = !hasClass(document.body, "el-popup-parent--hidden");
-      if (withoutHiddenClass) {
-        bodyPaddingRight = document.body.style.paddingRight;
-        computedBodyPaddingRight = parseInt(getStyle(document.body, "paddingRight"), 10);
-      }
-      scrollBarWidth = scrollbarWidth();
-      const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
-      const bodyOverflowY = getStyle(document.body, "overflowY");
-      if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === "scroll") && withoutHiddenClass) {
-        document.body.style.paddingRight = `${computedBodyPaddingRight + scrollBarWidth}px`;
-      }
-      addClass(document.body, "el-popup-parent--hidden");
-    } else {
+    if (!val) {
       cleanup();
+      return;
+    }
+    withoutHiddenClass = !hasClass(document.body, "el-popup-parent--hidden");
+    if (withoutHiddenClass) {
+      bodyPaddingRight = document.body.style.paddingRight;
+      computedBodyPaddingRight = parseInt(getStyle(document.body, "paddingRight"), 10);
+    }
+    scrollBarWidth = scrollbarWidth();
+    const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
+    const bodyOverflowY = getStyle(document.body, "overflowY");
+    if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === "scroll") && withoutHiddenClass) {
+      document.body.style.paddingRight = `${computedBodyPaddingRight + scrollBarWidth}px`;
     }
+    addClass(document.body, "el-popup-parent--hidden");
   });
+  onScopeDispose(() => cleanup());
 };
 
-export { useLockScreen as default };
+export { useLockscreen };
 //# sourceMappingURL=index.mjs.map

package/es/hooks/use-lockscreen/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-lockscreen/index.ts"],"sourcesContent":["import { watch, isRef, onUnmounted } from 'vue'\n\nimport getScrollBarWidth from '@element-plus/utils/scrollbar-width'\nimport { throwError } from '@element-plus/utils/error'\nimport {\n  addClass,\n  removeClass,\n  hasClass,\n  getStyle,\n} from '@element-plus/utils/dom'\n\nimport type { Ref } from 'vue'\n\n/**\n * Hook that monitoring the ref value to lock or unlock the screen.\n * When the trigger became true, it assumes modal is now opened and vice versa.\n * @param trigger {Ref<boolean>}\n */\nexport default (trigger: Ref<boolean>) => {\n  if (!isRef(trigger)) {\n    throwError(\n      '[useLockScreen]',\n      'You need to pass a ref param to this function'\n    )\n  }\n  let scrollBarWidth = 0\n  let withoutHiddenClass = false\n  let bodyPaddingRight = '0'\n  let computedBodyPaddingRight = 0\n\n  onUnmounted(() => {\n    cleanup()\n  })\n\n  const cleanup = () => {\n    removeClass(document.body, 'el-popup-parent--hidden')\n    if (withoutHiddenClass) {\n      document.body.style.paddingRight = bodyPaddingRight\n    }\n  }\n  watch(trigger, (val) => {\n    if (val) {\n      withoutHiddenClass = !hasClass(document.body, 'el-popup-parent--hidden')\n      if (withoutHiddenClass) {\n        bodyPaddingRight = document.body.style.paddingRight\n        computedBodyPaddingRight = parseInt(\n          getStyle(document.body, 'paddingRight'),\n          10\n        )\n      }\n      scrollBarWidth = getScrollBarWidth()\n      const bodyHasOverflow =\n        document.documentElement.clientHeight < document.body.scrollHeight\n      const bodyOverflowY = getStyle(document.body, 'overflowY')\n      if (\n        scrollBarWidth > 0 &&\n        (bodyHasOverflow || bodyOverflowY === 'scroll') &&\n        withoutHiddenClass\n      ) {\n        document.body.style.paddingRight = `${\n          computedBodyPaddingRight + scrollBarWidth\n        }px`\n      }\n      addClass(document.body, 'el-popup-parent--hidden')\n    } else {\n      cleanup()\n    }\n  })\n}\n"],"names":["getScrollBarWidth"],"mappings":";;;;;AAkBA,oBAAe,CAAC,YAA0B;AACxC,MAAI,CAAC,MAAM,UAAU;AACnB,eACE,mBACA;AAAA;AAGJ,MAAI,iBAAiB;AACrB,MAAI,qBAAqB;AACzB,MAAI,mBAAmB;AACvB,MAAI,2BAA2B;AAE/B,cAAY,MAAM;AAChB;AAAA;AAGF,QAAM,UAAU,MAAM;AACpB,gBAAY,SAAS,MAAM;AAC3B,QAAI,oBAAoB;AACtB,eAAS,KAAK,MAAM,eAAe;AAAA;AAAA;AAGvC,QAAM,SAAS,CAAC,QAAQ;AACtB,QAAI,KAAK;AACP,2BAAqB,CAAC,SAAS,SAAS,MAAM;AAC9C,UAAI,oBAAoB;AACtB,2BAAmB,SAAS,KAAK,MAAM;AACvC,mCAA2B,SACzB,SAAS,SAAS,MAAM,iBACxB;AAAA;AAGJ,uBAAiBA;AACjB,YAAM,kBACJ,SAAS,gBAAgB,eAAe,SAAS,KAAK;AACxD,YAAM,gBAAgB,SAAS,SAAS,MAAM;AAC9C,UACE,iBAAiB,yBACG,kBAAkB,aACtC,oBACA;AACA,iBAAS,KAAK,MAAM,eAAe,GACjC,2BAA2B;AAAA;AAG/B,eAAS,SAAS,MAAM;AAAA,WACnB;AACL;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-lockscreen/index.ts"],"sourcesContent":["import { watch, isRef, onScopeDispose } from 'vue'\n\nimport getScrollBarWidth from '@element-plus/utils/scrollbar-width'\nimport { throwError } from '@element-plus/utils/error'\nimport {\n  addClass,\n  removeClass,\n  hasClass,\n  getStyle,\n} from '@element-plus/utils/dom'\nimport isServer from '@element-plus/utils/isServer'\n\nimport type { Ref } from 'vue'\n\n/**\n * Hook that monitoring the ref value to lock or unlock the screen.\n * When the trigger became true, it assumes modal is now opened and vice versa.\n * @param trigger {Ref<boolean>}\n */\nexport const useLockscreen = (trigger: Ref<boolean>) => {\n  if (!isRef(trigger)) {\n    throwError(\n      '[useLockscreen]',\n      'You need to pass a ref param to this function'\n    )\n  }\n  if (isServer || hasClass(document.body, 'el-popup-parent--hidden')) {\n    return\n  }\n\n  let scrollBarWidth = 0\n  let withoutHiddenClass = false\n  let bodyPaddingRight = '0'\n  let computedBodyPaddingRight = 0\n\n  const cleanup = () => {\n    removeClass(document.body, 'el-popup-parent--hidden')\n    if (withoutHiddenClass) {\n      document.body.style.paddingRight = bodyPaddingRight\n    }\n  }\n  watch(trigger, (val) => {\n    if (!val) {\n      cleanup()\n      return\n    }\n\n    withoutHiddenClass = !hasClass(document.body, 'el-popup-parent--hidden')\n    if (withoutHiddenClass) {\n      bodyPaddingRight = document.body.style.paddingRight\n      computedBodyPaddingRight = parseInt(\n        getStyle(document.body, 'paddingRight'),\n        10\n      )\n    }\n    scrollBarWidth = getScrollBarWidth()\n    const bodyHasOverflow =\n      document.documentElement.clientHeight < document.body.scrollHeight\n    const bodyOverflowY = getStyle(document.body, 'overflowY')\n    if (\n      scrollBarWidth > 0 &&\n      (bodyHasOverflow || bodyOverflowY === 'scroll') &&\n      withoutHiddenClass\n    ) {\n      document.body.style.paddingRight = `${\n        computedBodyPaddingRight + scrollBarWidth\n      }px`\n    }\n    addClass(document.body, 'el-popup-parent--hidden')\n  })\n  onScopeDispose(() => cleanup())\n}\n"],"names":["getScrollBarWidth"],"mappings":";;;;;;MAmBa,gBAAgB,CAAC,YAA0B;AACtD,MAAI,CAAC,MAAM,UAAU;AACnB,eACE,mBACA;AAAA;AAGJ,MAAI,YAAY,SAAS,SAAS,MAAM,4BAA4B;AAClE;AAAA;AAGF,MAAI,iBAAiB;AACrB,MAAI,qBAAqB;AACzB,MAAI,mBAAmB;AACvB,MAAI,2BAA2B;AAE/B,QAAM,UAAU,MAAM;AACpB,gBAAY,SAAS,MAAM;AAC3B,QAAI,oBAAoB;AACtB,eAAS,KAAK,MAAM,eAAe;AAAA;AAAA;AAGvC,QAAM,SAAS,CAAC,QAAQ;AACtB,QAAI,CAAC,KAAK;AACR;AACA;AAAA;AAGF,yBAAqB,CAAC,SAAS,SAAS,MAAM;AAC9C,QAAI,oBAAoB;AACtB,yBAAmB,SAAS,KAAK,MAAM;AACvC,iCAA2B,SACzB,SAAS,SAAS,MAAM,iBACxB;AAAA;AAGJ,qBAAiBA;AACjB,UAAM,kBACJ,SAAS,gBAAgB,eAAe,SAAS,KAAK;AACxD,UAAM,gBAAgB,SAAS,SAAS,MAAM;AAC9C,QACE,iBAAiB,yBACG,kBAAkB,aACtC,oBACA;AACA,eAAS,KAAK,MAAM,eAAe,GACjC,2BAA2B;AAAA;AAG/B,aAAS,SAAS,MAAM;AAAA;AAE1B,iBAAe,MAAM;AAAA;;;;"}

package/es/hooks/use-modal/index.d.ts

@@ -1,6 +1,6 @@
-import type { Ref, ComputedRef } from 'vue';
+import type { Ref } from 'vue';
 declare type ModalInstance = {
     handleClose: () => void;
 };
-declare const _default: (instance: ModalInstance, visibleRef: Ref<boolean> | ComputedRef) => void;
-export default _default;
+export declare const useModal: (instance: ModalInstance, visibleRef: Ref<boolean>) => void;
+export {};

package/es/hooks/use-modal/index.mjs

@@ -1,7 +1,6 @@
 import { watch } from 'vue';
-import { on } from '../../utils/dom.mjs';
+import { isClient, useEventListener } from '@vueuse/core';
 import { EVENT_CODE } from '../../utils/aria.mjs';
-import isServer from '../../utils/isServer.mjs';
 
 const modalStack = [];
 const closeModal = (e) => {
@@ -13,8 +12,8 @@ const closeModal = (e) => {
     topModal.handleClose();
   }
 };
-var useModal = (instance, visibleRef) => {
-  watch(() => visibleRef.value, (val) => {
+const useModal = (instance, visibleRef) => {
+  watch(visibleRef, (val) => {
     if (val) {
       modalStack.push(instance);
     } else {
@@ -22,9 +21,8 @@ var useModal = (instance, visibleRef) => {
     }
   });
 };
-if (!isServer) {
-  on(document, "keydown", closeModal);
-}
+if (isClient)
+  useEventListener(document, "keydown", closeModal);
 
-export { useModal as default };
+export { useModal };
 //# sourceMappingURL=index.mjs.map

package/es/hooks/use-modal/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-modal/index.ts"],"sourcesContent":["import { watch } from 'vue'\nimport { on } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport isServer from '@element-plus/utils/isServer'\n\nimport type { Ref, ComputedRef } 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  if (e.code === EVENT_CODE.esc) {\n    e.stopPropagation()\n    const topModal = modalStack[modalStack.length - 1]\n    topModal.handleClose()\n  }\n}\n\nexport default (\n  instance: ModalInstance,\n  visibleRef: Ref<boolean> | ComputedRef\n) => {\n  watch(\n    () => visibleRef.value,\n    (val) => {\n      if (val) {\n        modalStack.push(instance)\n      } else {\n        modalStack.splice(\n          modalStack.findIndex((modal) => modal === instance),\n          1\n        )\n      }\n    }\n  )\n}\n\nif (!isServer) {\n  on(document, 'keydown', closeModal)\n}\n"],"names":[],"mappings":";;;;;AAWA,MAAM,aAA8B;AAEpC,MAAM,aAAa,CAAC,MAAqB;AACvC,MAAI,WAAW,WAAW;AAAG;AAC7B,MAAI,EAAE,SAAS,WAAW,KAAK;AAC7B,MAAE;AACF,UAAM,WAAW,WAAW,WAAW,SAAS;AAChD,aAAS;AAAA;AAAA;AAIb,eAAe,CACb,UACA,eACG;AACH,QACE,MAAM,WAAW,OACjB,CAAC,QAAQ;AACP,QAAI,KAAK;AACP,iBAAW,KAAK;AAAA,WACX;AACL,iBAAW,OACT,WAAW,UAAU,CAAC,UAAU,UAAU,WAC1C;AAAA;AAAA;AAAA;AAOV,IAAI,CAAC,UAAU;AACb,KAAG,UAAU,WAAW;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-modal/index.ts"],"sourcesContent":["import { watch } from 'vue'\nimport { isClient, useEventListener } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\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  if (e.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(\n        modalStack.findIndex((modal) => modal === instance),\n        1\n      )\n    }\n  })\n}\n\nif (isClient) useEventListener(document, 'keydown', closeModal)\n"],"names":[],"mappings":";;;;AAUA,MAAM,aAA8B;AAEpC,MAAM,aAAa,CAAC,MAAqB;AACvC,MAAI,WAAW,WAAW;AAAG;AAC7B,MAAI,EAAE,SAAS,WAAW,KAAK;AAC7B,MAAE;AACF,UAAM,WAAW,WAAW,WAAW,SAAS;AAChD,aAAS;AAAA;AAAA;MAIA,WAAW,CAAC,UAAyB,eAA6B;AAC7E,QAAM,YAAY,CAAC,QAAQ;AACzB,QAAI,KAAK;AACP,iBAAW,KAAK;AAAA,WACX;AACL,iBAAW,OACT,WAAW,UAAU,CAAC,UAAU,UAAU,WAC1C;AAAA;AAAA;AAAA;AAMR,IAAI;AAAU,mBAAiB,UAAU,WAAW;;;;"}

package/es/hooks/use-model-toggle/index.d.ts

@@ -1,11 +1,9 @@
-import type { Ref } from 'vue';
+import type { Ref, ExtractPropTypes } from 'vue';
 export declare const useModelToggleProps: {
-    modelValue: {
-        type: BooleanConstructor;
-        default: null;
-    };
+    modelValue: import("element-pe/es/utils/props").BuildPropReturn<import("element-pe/es/utils/props").PropWrapper<boolean | null>, null, unknown, unknown, unknown>;
     'onUpdate:modelValue': FunctionConstructor;
 };
+export declare type UseModelToggleProps = ExtractPropTypes<typeof useModelToggleProps>;
 export declare const useModelToggleEmits: string[];
 export declare type ModelToggleParams = {
     indicator: Ref<boolean>;

package/es/hooks/use-model-toggle/index.mjs

@@ -3,14 +3,15 @@ import { isFunction } from '@vue/shared';
 import { isBool } from '../../utils/util.mjs';
 import { UPDATE_MODEL_EVENT } from '../../utils/constants.mjs';
 import isServer from '../../utils/isServer.mjs';
+import { buildProps, definePropType } from '../../utils/props.mjs';
 
-const useModelToggleProps = {
+const useModelToggleProps = buildProps({
   modelValue: {
-    type: Boolean,
+    type: definePropType(Boolean),
     default: null
   },
   "onUpdate:modelValue": Function
-};
+});
 const useModelToggleEmits = [UPDATE_MODEL_EVENT];
 const useModelToggle = ({
   indicator,
@@ -19,7 +20,9 @@ const useModelToggle = ({
   onShow,
   onHide
 }) => {
-  const { appContext, props, proxy, emit } = getCurrentInstance();
+  const instance = getCurrentInstance();
+  const props = instance.props;
+  const { emit } = instance;
   const hasUpdateHandler = computed(() => isFunction(props["onUpdate:modelValue"]));
   const isModelBindingAbsent = computed(() => props.modelValue === null);
   const doShow = () => {
@@ -85,9 +88,9 @@ const useModelToggle = ({
     }
   };
   watch(() => props.modelValue, onChange);
-  if (shouldHideWhenRouteChanges && appContext.config.globalProperties.$route !== void 0) {
+  if (shouldHideWhenRouteChanges && instance.appContext.config.globalProperties.$route !== void 0) {
     watch(() => ({
-      ...proxy.$route
+      ...instance.proxy.$route
     }), () => {
       if (shouldHideWhenRouteChanges.value && indicator.value) {
         hide();

package/es/hooks/use-model-toggle/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-model-toggle/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, watch, onMounted } from 'vue'\nimport { isFunction } from '@vue/shared'\nimport { isBool } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport isServer from '@element-plus/utils/isServer'\n\nimport type { Ref, ComponentPublicInstance } from 'vue'\n\nexport const useModelToggleProps = {\n  modelValue: {\n    type: Boolean,\n    default: null,\n  },\n\n  'onUpdate:modelValue': Function,\n}\n\nexport const useModelToggleEmits = [UPDATE_MODEL_EVENT]\n\nexport type ModelToggleParams = {\n  indicator: Ref<boolean>\n  shouldHideWhenRouteChanges?: Ref<boolean>\n  shouldProceed?: () => boolean\n  onShow?: () => void\n  onHide?: () => void\n}\n\nexport const useModelToggle = ({\n  indicator,\n  shouldHideWhenRouteChanges,\n  shouldProceed,\n  onShow,\n  onHide,\n}: ModelToggleParams) => {\n  const { appContext, props, proxy, emit } = getCurrentInstance()!\n\n  const hasUpdateHandler = computed(() =>\n    isFunction(props['onUpdate:modelValue'])\n  )\n  // when it matches the default value we say this is absent\n  // though this could be mistakenly passed from the user but we need to rule out that\n  // condition\n  const isModelBindingAbsent = computed(() => props.modelValue === null)\n\n  const doShow = () => {\n    if (indicator.value === true) {\n      return\n    }\n\n    indicator.value = true\n    if (isFunction(onShow)) {\n      onShow()\n    }\n  }\n\n  const doHide = () => {\n    if (indicator.value === false) {\n      return\n    }\n\n    indicator.value = false\n\n    if (isFunction(onHide)) {\n      onHide()\n    }\n  }\n\n  const show = () => {\n    if (\n      props.disabled === true ||\n      (isFunction(shouldProceed) && !shouldProceed())\n    )\n      return\n\n    const shouldEmit = hasUpdateHandler.value && !isServer\n\n    if (shouldEmit) {\n      emit(UPDATE_MODEL_EVENT, true)\n    }\n\n    if (isModelBindingAbsent.value || !shouldEmit) {\n      doShow()\n    }\n  }\n\n  const hide = () => {\n    if (props.disabled === true || isServer) return\n\n    const shouldEmit = hasUpdateHandler.value && !isServer\n\n    if (shouldEmit) {\n      emit(UPDATE_MODEL_EVENT, false)\n    }\n\n    if (isModelBindingAbsent.value || !shouldEmit) {\n      doHide()\n    }\n  }\n\n  const onChange = (val: boolean) => {\n    if (!isBool(val)) return\n    if (props.disabled && val) {\n      if (hasUpdateHandler.value) {\n        emit(UPDATE_MODEL_EVENT, false)\n      }\n    } else if (indicator.value !== val) {\n      if (val) {\n        doShow()\n      } else {\n        doHide()\n      }\n    }\n  }\n\n  const toggle = () => {\n    if (indicator.value) {\n      hide()\n    } else {\n      show()\n    }\n  }\n\n  watch(() => props.modelValue, onChange as any)\n\n  if (\n    shouldHideWhenRouteChanges &&\n    appContext.config.globalProperties.$route !== undefined\n  ) {\n    watch(\n      () => ({\n        ...(\n          proxy as ComponentPublicInstance<{\n            $route: any\n          }>\n        ).$route,\n      }),\n      () => {\n        if (shouldHideWhenRouteChanges.value && indicator.value) {\n          hide()\n        }\n      }\n    )\n  }\n\n  onMounted(() => {\n    onChange(props.modelValue as boolean)\n  })\n\n  return {\n    hide,\n    show,\n    toggle,\n  }\n}\n"],"names":[],"mappings":";;;;;;MAQa,sBAAsB;AAAA,EACjC,YAAY;AAAA,IACV,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAGX,uBAAuB;AAAA;MAGZ,sBAAsB,CAAC;MAUvB,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACuB;AACvB,QAAM,EAAE,YAAY,OAAO,OAAO,SAAS;AAE3C,QAAM,mBAAmB,SAAS,MAChC,WAAW,MAAM;AAKnB,QAAM,uBAAuB,SAAS,MAAM,MAAM,eAAe;AAEjE,QAAM,SAAS,MAAM;AACnB,QAAI,UAAU,UAAU,MAAM;AAC5B;AAAA;AAGF,cAAU,QAAQ;AAClB,QAAI,WAAW,SAAS;AACtB;AAAA;AAAA;AAIJ,QAAM,SAAS,MAAM;AACnB,QAAI,UAAU,UAAU,OAAO;AAC7B;AAAA;AAGF,cAAU,QAAQ;AAElB,QAAI,WAAW,SAAS;AACtB;AAAA;AAAA;AAIJ,QAAM,OAAO,MAAM;AACjB,QACE,MAAM,aAAa,QAClB,WAAW,kBAAkB,CAAC;AAE/B;AAEF,UAAM,aAAa,iBAAiB,SAAS,CAAC;AAE9C,QAAI,YAAY;AACd,WAAK,oBAAoB;AAAA;AAG3B,QAAI,qBAAqB,SAAS,CAAC,YAAY;AAC7C;AAAA;AAAA;AAIJ,QAAM,OAAO,MAAM;AACjB,QAAI,MAAM,aAAa,QAAQ;AAAU;AAEzC,UAAM,aAAa,iBAAiB,SAAS,CAAC;AAE9C,QAAI,YAAY;AACd,WAAK,oBAAoB;AAAA;AAG3B,QAAI,qBAAqB,SAAS,CAAC,YAAY;AAC7C;AAAA;AAAA;AAIJ,QAAM,WAAW,CAAC,QAAiB;AACjC,QAAI,CAAC,OAAO;AAAM;AAClB,QAAI,MAAM,YAAY,KAAK;AACzB,UAAI,iBAAiB,OAAO;AAC1B,aAAK,oBAAoB;AAAA;AAAA,eAElB,UAAU,UAAU,KAAK;AAClC,UAAI,KAAK;AACP;AAAA,aACK;AACL;AAAA;AAAA;AAAA;AAKN,QAAM,SAAS,MAAM;AACnB,QAAI,UAAU,OAAO;AACnB;AAAA,WACK;AACL;AAAA;AAAA;AAIJ,QAAM,MAAM,MAAM,YAAY;AAE9B,MACE,8BACA,WAAW,OAAO,iBAAiB,WAAW,QAC9C;AACA,UACE;AAAO,SAEH,MAGA;AAAA,QAEJ,MAAM;AACJ,UAAI,2BAA2B,SAAS,UAAU,OAAO;AACvD;AAAA;AAAA;AAAA;AAMR,YAAU,MAAM;AACd,aAAS,MAAM;AAAA;AAGjB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-model-toggle/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, watch, onMounted } from 'vue'\nimport { isFunction } from '@vue/shared'\nimport { isBool } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport isServer from '@element-plus/utils/isServer'\nimport { buildProps, definePropType } from '@element-plus/utils/props'\nimport type { RouteLocationNormalizedLoaded } from 'vue-router'\n\nimport type { Ref, ComponentPublicInstance, ExtractPropTypes } from 'vue'\n\nexport const useModelToggleProps = buildProps({\n  modelValue: {\n    type: definePropType<boolean | null>(Boolean),\n    default: null,\n  },\n  'onUpdate:modelValue': Function,\n})\nexport type UseModelToggleProps = ExtractPropTypes<typeof useModelToggleProps>\n\nexport const useModelToggleEmits = [UPDATE_MODEL_EVENT]\n\nexport type ModelToggleParams = {\n  indicator: Ref<boolean>\n  shouldHideWhenRouteChanges?: Ref<boolean>\n  shouldProceed?: () => boolean\n  onShow?: () => void\n  onHide?: () => void\n}\n\nexport const useModelToggle = ({\n  indicator,\n  shouldHideWhenRouteChanges,\n  shouldProceed,\n  onShow,\n  onHide,\n}: ModelToggleParams) => {\n  const instance = getCurrentInstance()!\n  const props = instance.props as UseModelToggleProps & { disabled: boolean }\n  const { emit } = instance\n\n  const hasUpdateHandler = computed(() =>\n    isFunction(props['onUpdate:modelValue'])\n  )\n  // when it matches the default value we say this is absent\n  // though this could be mistakenly passed from the user but we need to rule out that\n  // condition\n  const isModelBindingAbsent = computed(() => props.modelValue === null)\n\n  const doShow = () => {\n    if (indicator.value === true) {\n      return\n    }\n\n    indicator.value = true\n    if (isFunction(onShow)) {\n      onShow()\n    }\n  }\n\n  const doHide = () => {\n    if (indicator.value === false) {\n      return\n    }\n\n    indicator.value = false\n\n    if (isFunction(onHide)) {\n      onHide()\n    }\n  }\n\n  const show = () => {\n    if (\n      props.disabled === true ||\n      (isFunction(shouldProceed) && !shouldProceed())\n    )\n      return\n\n    const shouldEmit = hasUpdateHandler.value && !isServer\n\n    if (shouldEmit) {\n      emit(UPDATE_MODEL_EVENT, true)\n    }\n\n    if (isModelBindingAbsent.value || !shouldEmit) {\n      doShow()\n    }\n  }\n\n  const hide = () => {\n    if (props.disabled === true || isServer) return\n\n    const shouldEmit = hasUpdateHandler.value && !isServer\n\n    if (shouldEmit) {\n      emit(UPDATE_MODEL_EVENT, false)\n    }\n\n    if (isModelBindingAbsent.value || !shouldEmit) {\n      doHide()\n    }\n  }\n\n  const onChange = (val: boolean) => {\n    if (!isBool(val)) return\n    if (props.disabled && val) {\n      if (hasUpdateHandler.value) {\n        emit(UPDATE_MODEL_EVENT, false)\n      }\n    } else if (indicator.value !== val) {\n      if (val) {\n        doShow()\n      } else {\n        doHide()\n      }\n    }\n  }\n\n  const toggle = () => {\n    if (indicator.value) {\n      hide()\n    } else {\n      show()\n    }\n  }\n\n  watch(() => props.modelValue, onChange as any)\n\n  if (\n    shouldHideWhenRouteChanges &&\n    instance.appContext.config.globalProperties.$route !== undefined\n  ) {\n    watch(\n      () => ({\n        ...(\n          instance.proxy as ComponentPublicInstance<{\n            $route: RouteLocationNormalizedLoaded\n          }>\n        ).$route,\n      }),\n      () => {\n        if (shouldHideWhenRouteChanges.value && indicator.value) {\n          hide()\n        }\n      }\n    )\n  }\n\n  onMounted(() => {\n    onChange(props.modelValue as boolean)\n  })\n\n  return {\n    hide,\n    show,\n    toggle,\n  }\n}\n"],"names":[],"mappings":";;;;;;;MAUa,sBAAsB,WAAW;AAAA,EAC5C,YAAY;AAAA,IACV,MAAM,eAA+B;AAAA,IACrC,SAAS;AAAA;AAAA,EAEX,uBAAuB;AAAA;MAIZ,sBAAsB,CAAC;MAUvB,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACuB;AACvB,QAAM,WAAW;AACjB,QAAM,QAAQ,SAAS;AACvB,QAAM,EAAE,SAAS;AAEjB,QAAM,mBAAmB,SAAS,MAChC,WAAW,MAAM;AAKnB,QAAM,uBAAuB,SAAS,MAAM,MAAM,eAAe;AAEjE,QAAM,SAAS,MAAM;AACnB,QAAI,UAAU,UAAU,MAAM;AAC5B;AAAA;AAGF,cAAU,QAAQ;AAClB,QAAI,WAAW,SAAS;AACtB;AAAA;AAAA;AAIJ,QAAM,SAAS,MAAM;AACnB,QAAI,UAAU,UAAU,OAAO;AAC7B;AAAA;AAGF,cAAU,QAAQ;AAElB,QAAI,WAAW,SAAS;AACtB;AAAA;AAAA;AAIJ,QAAM,OAAO,MAAM;AACjB,QACE,MAAM,aAAa,QAClB,WAAW,kBAAkB,CAAC;AAE/B;AAEF,UAAM,aAAa,iBAAiB,SAAS,CAAC;AAE9C,QAAI,YAAY;AACd,WAAK,oBAAoB;AAAA;AAG3B,QAAI,qBAAqB,SAAS,CAAC,YAAY;AAC7C;AAAA;AAAA;AAIJ,QAAM,OAAO,MAAM;AACjB,QAAI,MAAM,aAAa,QAAQ;AAAU;AAEzC,UAAM,aAAa,iBAAiB,SAAS,CAAC;AAE9C,QAAI,YAAY;AACd,WAAK,oBAAoB;AAAA;AAG3B,QAAI,qBAAqB,SAAS,CAAC,YAAY;AAC7C;AAAA;AAAA;AAIJ,QAAM,WAAW,CAAC,QAAiB;AACjC,QAAI,CAAC,OAAO;AAAM;AAClB,QAAI,MAAM,YAAY,KAAK;AACzB,UAAI,iBAAiB,OAAO;AAC1B,aAAK,oBAAoB;AAAA;AAAA,eAElB,UAAU,UAAU,KAAK;AAClC,UAAI,KAAK;AACP;AAAA,aACK;AACL;AAAA;AAAA;AAAA;AAKN,QAAM,SAAS,MAAM;AACnB,QAAI,UAAU,OAAO;AACnB;AAAA,WACK;AACL;AAAA;AAAA;AAIJ,QAAM,MAAM,MAAM,YAAY;AAE9B,MACE,8BACA,SAAS,WAAW,OAAO,iBAAiB,WAAW,QACvD;AACA,UACE;AAAO,SAEH,SAAS,MAGT;AAAA,QAEJ,MAAM;AACJ,UAAI,2BAA2B,SAAS,UAAU,OAAO;AACvD;AAAA;AAAA;AAAA;AAMR,YAAU,MAAM;AACd,aAAS,MAAM;AAAA;AAGjB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}

package/es/hooks/use-popper/index.mjs

@@ -7,8 +7,8 @@ import { getFirstValidNode } from '../../utils/vnode.mjs';
 import { stop } from '../../utils/dom.mjs';
 import PopupManager from '../../utils/popup-manager.mjs';
 import { throwError } from '../../utils/error.mjs';
-import useTeleport from '../use-teleport/index.mjs';
-import useTimeout from '../use-timeout/index.mjs';
+import { useTeleport } from '../use-teleport/index.mjs';
+import { useTimeout } from '../use-timeout/index.mjs';
 import { useModelToggle } from '../use-model-toggle/index.mjs';
 import { useTransitionFallthrough } from '../use-transition-fallthrough/index.mjs';
 import { defaultPopperOptions, defaultModifiers } from './use-popper-options.mjs';

package/es/hooks/use-popper/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-popper/index.ts"],"sourcesContent":["import {\n  cloneVNode,\n  computed,\n  Fragment,\n  getCurrentInstance,\n  h,\n  nextTick,\n  toDisplayString,\n  toRef,\n  Transition,\n  ref,\n  renderSlot,\n  withDirectives,\n} from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { createPopper } from '@popperjs/core'\nimport { ClickOutside } from '@element-plus/directives'\nimport {\n  generateId,\n  isHTMLElement,\n  isString,\n  refAttacher,\n} from '@element-plus/utils/util'\nimport { getFirstValidNode } from '@element-plus/utils/vnode'\nimport { stop } from '@element-plus/utils/dom'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { throwError } from '@element-plus/utils/error'\n\nimport useTeleport from '../use-teleport'\nimport useTimeout from '../use-timeout'\nimport { useModelToggle } from '../use-model-toggle'\nimport { useTransitionFallthrough } from '../use-transition-fallthrough'\nimport { defaultPopperOptions, defaultModifiers } from './use-popper-options'\nimport { useTargetEvents, DEFAULT_TRIGGER } from './use-target-events'\n\nimport type {\n  CSSProperties,\n  ComponentPublicInstance,\n  ExtractPropTypes,\n  PropType,\n} from 'vue'\nimport type {\n  Instance as PopperInstance,\n  StrictModifiers,\n} from '@popperjs/core'\nimport type { RefElement, Nullable } from '@element-plus/utils/types'\nimport type { Trigger } from './use-target-events'\n\nexport type PopperEffect = 'light' | 'dark'\nexport type Offset = [number, number] | number\n\ntype ElementType = ComponentPublicInstance | HTMLElement\n\nexport const DARK_EFFECT = 'dark'\nexport const LIGHT_EFFECT = 'light'\n\nexport const usePopperControlProps = {\n  appendToBody: {\n    type: Boolean,\n    default: true,\n  },\n  arrowOffset: {\n    type: Number,\n  },\n  popperOptions: defaultPopperOptions,\n  popperClass: {\n    type: String,\n    default: '',\n  },\n}\n\nexport const usePopperProps = {\n  ...usePopperControlProps,\n  // the arrow size is an equailateral triangle with 10px side length, the 3rd side length ~ 14.1px\n  // adding a offset to the ceil of 4.1 should be 5 this resolves the problem of arrow overflowing out of popper.\n  autoClose: {\n    type: Number,\n    default: 0,\n  },\n  content: {\n    type: String,\n    default: '',\n  },\n  class: String,\n  style: Object,\n  hideAfter: {\n    type: Number,\n    default: 200,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  effect: {\n    type: String as PropType<PopperEffect>,\n    default: DARK_EFFECT,\n  },\n  enterable: {\n    type: Boolean,\n    default: true,\n  },\n  manualMode: {\n    type: Boolean,\n    default: false,\n  },\n  showAfter: {\n    type: Number,\n    default: 0,\n  },\n  pure: {\n    type: Boolean,\n    default: false,\n  },\n  showArrow: {\n    type: Boolean,\n    default: true,\n  },\n  transition: {\n    type: String,\n    default: 'el-fade-in-linear',\n  },\n  trigger: {\n    type: [String, Array] as PropType<Trigger>,\n    default: DEFAULT_TRIGGER,\n  },\n  visible: {\n    type: Boolean,\n    default: undefined,\n  },\n  stopPopperMouseEvent: {\n    type: Boolean,\n    default: true,\n  },\n}\n\nexport const usePopperHook = () => {\n  const vm = getCurrentInstance()!\n  const props: ExtractPropTypes<typeof usePopperProps> = vm.proxy?.$props as any\n  const { slots } = vm\n\n  const arrowRef = ref<RefElement>(null)\n  const triggerRef = ref<ElementType>(null)\n  const popperRef = ref<RefElement>(null)\n\n  const popperStyle = ref<CSSProperties>({ zIndex: PopupManager.nextZIndex() })\n  const visible = ref(false)\n  const isManual = computed(\n    () => props.manualMode || props.trigger === 'manual'\n  )\n\n  const popperId = `el-popper-${generateId()}`\n  let popperInstance: Nullable<PopperInstance> = null\n\n  const { renderTeleport, showTeleport, hideTeleport } = useTeleport(\n    popupRenderer,\n    toRef(props, 'appendToBody')\n  )\n\n  const { show, hide } = useModelToggle({\n    indicator: visible,\n    onShow,\n    onHide,\n  })\n\n  const { registerTimeout, cancelTimeout } = useTimeout()\n\n  // event handlers\n\n  function onShow() {\n    popperStyle.value.zIndex = PopupManager.nextZIndex()\n    nextTick(initializePopper)\n  }\n\n  function onHide() {\n    hideTeleport()\n    nextTick(detachPopper)\n  }\n\n  /**\n   * The calling mechanism here is:\n   * when the visibility gets changed, let's say we change it to true\n   * the delayShow gets called which initializes a global root node for the popper content\n   * to insert in, then it register a timer for calling the show method, which changes the flag to\n   * true, then calls onShow method.\n   * So the order of invocation is: delayedShow -> timer(show) -> set the indicator to true -> onShow\n   */\n\n  function delayShow() {\n    if (isManual.value || props.disabled) return\n    // renders out the teleport element root.\n    showTeleport()\n    registerTimeout(show, props.showAfter)\n  }\n\n  function delayHide() {\n    if (isManual.value) return\n    registerTimeout(hide, props.hideAfter)\n  }\n\n  function onToggle() {\n    if (visible.value) {\n      delayShow()\n    } else {\n      delayHide()\n    }\n  }\n\n  function detachPopper() {\n    popperInstance?.destroy?.()\n    popperInstance = null\n  }\n\n  function onPopperMouseEnter() {\n    // if trigger is click, user won't be able to close popper when\n    // user tries to move the mouse over popper contents\n    if (props.enterable && props.trigger !== 'click') {\n      cancelTimeout()\n    }\n  }\n\n  function onPopperMouseLeave() {\n    const { trigger } = props\n    const shouldPrevent =\n      (isString(trigger) && (trigger === 'click' || trigger === 'focus')) ||\n      // we'd like to test array type trigger here, but the only case we need to cover is trigger === 'click' or\n      // trigger === 'focus', because that when trigger is string\n      // trigger.length === 1 and trigger[0] === 5 chars string is mutually exclusive.\n      // so there will be no need to test if trigger is array type.\n      (trigger.length === 1 &&\n        (trigger[0] === 'click' || trigger[0] === 'focus'))\n    if (shouldPrevent) return\n    delayHide()\n  }\n\n  function initializePopper() {\n    if (!visible.value || popperInstance !== null) {\n      return\n    }\n    const unwrappedTrigger = triggerRef.value\n    const $el = isHTMLElement(unwrappedTrigger)\n      ? unwrappedTrigger\n      : (unwrappedTrigger as ComponentPublicInstance).$el\n\n    popperInstance = createPopper($el, popperRef.value, buildPopperOptions())\n    popperInstance.update()\n  }\n\n  function buildPopperOptions() {\n    const modifiers = [...defaultModifiers, ...props.popperOptions.modifiers]\n\n    if (props.showArrow) {\n      modifiers.push({\n        name: 'arrow',\n        options: {\n          padding: props.arrowOffset || 5,\n          element: arrowRef.value,\n        },\n      } as StrictModifiers)\n    }\n\n    return {\n      ...props.popperOptions,\n      modifiers,\n    }\n  }\n\n  const { onAfterEnter, onAfterLeave, onBeforeEnter, onBeforeLeave } =\n    useTransitionFallthrough()\n\n  const events = useTargetEvents(delayShow, delayHide, onToggle)\n\n  const arrowRefAttacher = refAttacher(arrowRef)\n  const popperRefAttacher = refAttacher(popperRef)\n  const triggerRefAttacher = refAttacher(triggerRef)\n\n  // renderers\n  function popupRenderer() {\n    const mouseUpAndDown = props.stopPopperMouseEvent ? stop : NOOP\n    return h(\n      Transition as any,\n      {\n        name: props.transition,\n        onAfterEnter,\n        onAfterLeave,\n        onBeforeEnter,\n        onBeforeLeave,\n      },\n      {\n        default: () => () =>\n          visible.value\n            ? h(\n                'div',\n                {\n                  'aria-hidden': false,\n                  class: [\n                    props.popperClass,\n                    'el-popper',\n                    `is-${props.effect}`,\n                    props.pure ? 'is-pure' : '',\n                  ],\n                  style: popperStyle.value,\n                  id: popperId,\n                  ref: popperRefAttacher,\n                  role: 'tooltip',\n                  onMouseenter: onPopperMouseEnter,\n                  onMouseleave: onPopperMouseLeave,\n                  onClick: stop,\n                  onMousedown: mouseUpAndDown,\n                  onMouseup: mouseUpAndDown,\n                },\n                [\n                  renderSlot(slots, 'default', {}, () => [\n                    toDisplayString(props.content),\n                  ]),\n                  arrowRenderer(),\n                ]\n              )\n            : null,\n      }\n    )\n  }\n\n  function arrowRenderer() {\n    return props.showArrow\n      ? h(\n          'div',\n          {\n            ref: arrowRefAttacher,\n            class: 'el-popper__arrow',\n            'data-popper-arrow': '',\n          },\n          null\n        )\n      : null\n  }\n\n  function triggerRenderer(triggerProps) {\n    const trigger = slots.trigger?.()\n    const firstElement = getFirstValidNode(trigger, 1)\n    if (!firstElement)\n      throwError('renderTrigger', 'trigger expects single rooted node')\n    return cloneVNode(firstElement, triggerProps, true)\n  }\n\n  function render() {\n    const trigger = triggerRenderer({\n      'aria-describedby': popperId,\n      class: props.class,\n      style: props.style,\n      ref: triggerRefAttacher,\n      ...events,\n    })\n    return h(Fragment, null, [\n      isManual.value\n        ? trigger\n        : withDirectives(trigger, [[ClickOutside, delayHide]]),\n      renderTeleport(),\n    ])\n  }\n\n  return {\n    render,\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-popper/index.ts"],"sourcesContent":["import {\n  cloneVNode,\n  computed,\n  Fragment,\n  getCurrentInstance,\n  h,\n  nextTick,\n  toDisplayString,\n  toRef,\n  Transition,\n  ref,\n  renderSlot,\n  withDirectives,\n} from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { createPopper } from '@popperjs/core'\nimport { ClickOutside } from '@element-plus/directives'\nimport {\n  generateId,\n  isHTMLElement,\n  isString,\n  refAttacher,\n} from '@element-plus/utils/util'\nimport { getFirstValidNode } from '@element-plus/utils/vnode'\nimport { stop } from '@element-plus/utils/dom'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { throwError } from '@element-plus/utils/error'\n\nimport { useTeleport } from '../use-teleport'\nimport { useTimeout } from '../use-timeout'\nimport { useModelToggle } from '../use-model-toggle'\nimport { useTransitionFallthrough } from '../use-transition-fallthrough'\nimport { defaultPopperOptions, defaultModifiers } from './use-popper-options'\nimport { useTargetEvents, DEFAULT_TRIGGER } from './use-target-events'\n\nimport type {\n  CSSProperties,\n  ComponentPublicInstance,\n  ExtractPropTypes,\n  PropType,\n} from 'vue'\nimport type {\n  Instance as PopperInstance,\n  StrictModifiers,\n} from '@popperjs/core'\nimport type { RefElement, Nullable } from '@element-plus/utils/types'\nimport type { Trigger } from './use-target-events'\n\nexport type PopperEffect = 'light' | 'dark'\nexport type Offset = [number, number] | number\n\ntype ElementType = ComponentPublicInstance | HTMLElement\n\nexport const DARK_EFFECT = 'dark'\nexport const LIGHT_EFFECT = 'light'\n\nexport const usePopperControlProps = {\n  appendToBody: {\n    type: Boolean,\n    default: true,\n  },\n  arrowOffset: {\n    type: Number,\n  },\n  popperOptions: defaultPopperOptions,\n  popperClass: {\n    type: String,\n    default: '',\n  },\n}\n\nexport const usePopperProps = {\n  ...usePopperControlProps,\n  // the arrow size is an equailateral triangle with 10px side length, the 3rd side length ~ 14.1px\n  // adding a offset to the ceil of 4.1 should be 5 this resolves the problem of arrow overflowing out of popper.\n  autoClose: {\n    type: Number,\n    default: 0,\n  },\n  content: {\n    type: String,\n    default: '',\n  },\n  class: String,\n  style: Object,\n  hideAfter: {\n    type: Number,\n    default: 200,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  effect: {\n    type: String as PropType<PopperEffect>,\n    default: DARK_EFFECT,\n  },\n  enterable: {\n    type: Boolean,\n    default: true,\n  },\n  manualMode: {\n    type: Boolean,\n    default: false,\n  },\n  showAfter: {\n    type: Number,\n    default: 0,\n  },\n  pure: {\n    type: Boolean,\n    default: false,\n  },\n  showArrow: {\n    type: Boolean,\n    default: true,\n  },\n  transition: {\n    type: String,\n    default: 'el-fade-in-linear',\n  },\n  trigger: {\n    type: [String, Array] as PropType<Trigger>,\n    default: DEFAULT_TRIGGER,\n  },\n  visible: {\n    type: Boolean,\n    default: undefined,\n  },\n  stopPopperMouseEvent: {\n    type: Boolean,\n    default: true,\n  },\n}\n\nexport const usePopperHook = () => {\n  const vm = getCurrentInstance()!\n  const props: ExtractPropTypes<typeof usePopperProps> = vm.proxy?.$props as any\n  const { slots } = vm\n\n  const arrowRef = ref<RefElement>(null)\n  const triggerRef = ref<ElementType>(null)\n  const popperRef = ref<RefElement>(null)\n\n  const popperStyle = ref<CSSProperties>({ zIndex: PopupManager.nextZIndex() })\n  const visible = ref(false)\n  const isManual = computed(\n    () => props.manualMode || props.trigger === 'manual'\n  )\n\n  const popperId = `el-popper-${generateId()}`\n  let popperInstance: Nullable<PopperInstance> = null\n\n  const { renderTeleport, showTeleport, hideTeleport } = useTeleport(\n    popupRenderer,\n    toRef(props, 'appendToBody')\n  )\n\n  const { show, hide } = useModelToggle({\n    indicator: visible,\n    onShow,\n    onHide,\n  })\n\n  const { registerTimeout, cancelTimeout } = useTimeout()\n\n  // event handlers\n\n  function onShow() {\n    popperStyle.value.zIndex = PopupManager.nextZIndex()\n    nextTick(initializePopper)\n  }\n\n  function onHide() {\n    hideTeleport()\n    nextTick(detachPopper)\n  }\n\n  /**\n   * The calling mechanism here is:\n   * when the visibility gets changed, let's say we change it to true\n   * the delayShow gets called which initializes a global root node for the popper content\n   * to insert in, then it register a timer for calling the show method, which changes the flag to\n   * true, then calls onShow method.\n   * So the order of invocation is: delayedShow -> timer(show) -> set the indicator to true -> onShow\n   */\n\n  function delayShow() {\n    if (isManual.value || props.disabled) return\n    // renders out the teleport element root.\n    showTeleport()\n    registerTimeout(show, props.showAfter)\n  }\n\n  function delayHide() {\n    if (isManual.value) return\n    registerTimeout(hide, props.hideAfter)\n  }\n\n  function onToggle() {\n    if (visible.value) {\n      delayShow()\n    } else {\n      delayHide()\n    }\n  }\n\n  function detachPopper() {\n    popperInstance?.destroy?.()\n    popperInstance = null\n  }\n\n  function onPopperMouseEnter() {\n    // if trigger is click, user won't be able to close popper when\n    // user tries to move the mouse over popper contents\n    if (props.enterable && props.trigger !== 'click') {\n      cancelTimeout()\n    }\n  }\n\n  function onPopperMouseLeave() {\n    const { trigger } = props\n    const shouldPrevent =\n      (isString(trigger) && (trigger === 'click' || trigger === 'focus')) ||\n      // we'd like to test array type trigger here, but the only case we need to cover is trigger === 'click' or\n      // trigger === 'focus', because that when trigger is string\n      // trigger.length === 1 and trigger[0] === 5 chars string is mutually exclusive.\n      // so there will be no need to test if trigger is array type.\n      (trigger.length === 1 &&\n        (trigger[0] === 'click' || trigger[0] === 'focus'))\n    if (shouldPrevent) return\n    delayHide()\n  }\n\n  function initializePopper() {\n    if (!visible.value || popperInstance !== null) {\n      return\n    }\n    const unwrappedTrigger = triggerRef.value\n    const $el = isHTMLElement(unwrappedTrigger)\n      ? unwrappedTrigger\n      : (unwrappedTrigger as ComponentPublicInstance).$el\n\n    popperInstance = createPopper($el, popperRef.value, buildPopperOptions())\n    popperInstance.update()\n  }\n\n  function buildPopperOptions() {\n    const modifiers = [...defaultModifiers, ...props.popperOptions.modifiers]\n\n    if (props.showArrow) {\n      modifiers.push({\n        name: 'arrow',\n        options: {\n          padding: props.arrowOffset || 5,\n          element: arrowRef.value,\n        },\n      } as StrictModifiers)\n    }\n\n    return {\n      ...props.popperOptions,\n      modifiers,\n    }\n  }\n\n  const { onAfterEnter, onAfterLeave, onBeforeEnter, onBeforeLeave } =\n    useTransitionFallthrough()\n\n  const events = useTargetEvents(delayShow, delayHide, onToggle)\n\n  const arrowRefAttacher = refAttacher(arrowRef)\n  const popperRefAttacher = refAttacher(popperRef)\n  const triggerRefAttacher = refAttacher(triggerRef)\n\n  // renderers\n  function popupRenderer() {\n    const mouseUpAndDown = props.stopPopperMouseEvent ? stop : NOOP\n    return h(\n      Transition as any,\n      {\n        name: props.transition,\n        onAfterEnter,\n        onAfterLeave,\n        onBeforeEnter,\n        onBeforeLeave,\n      },\n      {\n        default: () => () =>\n          visible.value\n            ? h(\n                'div',\n                {\n                  'aria-hidden': false,\n                  class: [\n                    props.popperClass,\n                    'el-popper',\n                    `is-${props.effect}`,\n                    props.pure ? 'is-pure' : '',\n                  ],\n                  style: popperStyle.value,\n                  id: popperId,\n                  ref: popperRefAttacher,\n                  role: 'tooltip',\n                  onMouseenter: onPopperMouseEnter,\n                  onMouseleave: onPopperMouseLeave,\n                  onClick: stop,\n                  onMousedown: mouseUpAndDown,\n                  onMouseup: mouseUpAndDown,\n                },\n                [\n                  renderSlot(slots, 'default', {}, () => [\n                    toDisplayString(props.content),\n                  ]),\n                  arrowRenderer(),\n                ]\n              )\n            : null,\n      }\n    )\n  }\n\n  function arrowRenderer() {\n    return props.showArrow\n      ? h(\n          'div',\n          {\n            ref: arrowRefAttacher,\n            class: 'el-popper__arrow',\n            'data-popper-arrow': '',\n          },\n          null\n        )\n      : null\n  }\n\n  function triggerRenderer(triggerProps) {\n    const trigger = slots.trigger?.()\n    const firstElement = getFirstValidNode(trigger, 1)\n    if (!firstElement)\n      throwError('renderTrigger', 'trigger expects single rooted node')\n    return cloneVNode(firstElement, triggerProps, true)\n  }\n\n  function render() {\n    const trigger = triggerRenderer({\n      'aria-describedby': popperId,\n      class: props.class,\n      style: props.style,\n      ref: triggerRefAttacher,\n      ...events,\n    })\n    return h(Fragment, null, [\n      isManual.value\n        ? trigger\n        : withDirectives(trigger, [[ClickOutside, delayHide]]),\n      renderTeleport(),\n    ])\n  }\n\n  return {\n    render,\n  }\n}\n"],"names":[],"mappings":"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"}

package/es/hooks/use-prevent-global/index.d.ts

@@ -1,3 +1,2 @@
 import type { Ref } from 'vue';
-declare const _default: (indicator: Ref<boolean>, evt: string, cb: (e: Event) => boolean) => void;
-export default _default;
+export declare const usePreventGlobal: <E extends keyof DocumentEventMap>(indicator: Ref<boolean>, evt: E, cb: (e: DocumentEventMap[E]) => boolean) => void;

package/es/hooks/use-prevent-global/index.mjs

@@ -1,20 +1,20 @@
 import { watch } from 'vue';
-import { on, off } from '../../utils/dom.mjs';
+import { useEventListener } from '@vueuse/core';
 
-var usePreventGlobal = (indicator, evt, cb) => {
+const usePreventGlobal = (indicator, evt, cb) => {
   const prevent = (e) => {
-    if (cb(e)) {
+    if (cb(e))
       e.stopImmediatePropagation();
-    }
   };
+  let stop = void 0;
   watch(() => indicator.value, (val) => {
     if (val) {
-      on(document, evt, prevent, true);
+      stop = useEventListener(document, evt, prevent, true);
     } else {
-      off(document, evt, prevent, true);
+      stop == null ? void 0 : stop();
     }
   }, { immediate: true });
 };
 
-export { usePreventGlobal as default };
+export { usePreventGlobal };
 //# sourceMappingURL=index.mjs.map

package/es/hooks/use-prevent-global/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-prevent-global/index.ts"],"sourcesContent":["import { watch } from 'vue'\nimport { on, off } from '@element-plus/utils/dom'\n\nimport type { Ref } from 'vue'\n\nexport default (\n  indicator: Ref<boolean>,\n  evt: string,\n  cb: (e: Event) => boolean\n) => {\n  const prevent = (e: Event) => {\n    if (cb(e)) {\n      e.stopImmediatePropagation()\n    }\n  }\n  watch(\n    () => indicator.value,\n    (val) => {\n      if (val) {\n        on(document, evt, prevent, true)\n      } else {\n        off(document, evt, prevent, true)\n      }\n    },\n    { immediate: true }\n  )\n}\n"],"names":[],"mappings":";;;AAKA,uBAAe,CACb,WACA,KACA,OACG;AACH,QAAM,UAAU,CAAC,MAAa;AAC5B,QAAI,GAAG,IAAI;AACT,QAAE;AAAA;AAAA;AAGN,QACE,MAAM,UAAU,OAChB,CAAC,QAAQ;AACP,QAAI,KAAK;AACP,SAAG,UAAU,KAAK,SAAS;AAAA,WACtB;AACL,UAAI,UAAU,KAAK,SAAS;AAAA;AAAA,KAGhC,EAAE,WAAW;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-prevent-global/index.ts"],"sourcesContent":["import { watch } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport type { Ref } from 'vue'\n\nexport const usePreventGlobal = <E extends keyof DocumentEventMap>(\n  indicator: Ref<boolean>,\n  evt: E,\n  cb: (e: DocumentEventMap[E]) => boolean\n) => {\n  const prevent = (e: DocumentEventMap[E]) => {\n    if (cb(e)) e.stopImmediatePropagation()\n  }\n  let stop: (() => void) | undefined = undefined\n  watch(\n    () => indicator.value,\n    (val) => {\n      if (val) {\n        stop = useEventListener(document, evt, prevent, true)\n      } else {\n        stop?.()\n      }\n    },\n    { immediate: true }\n  )\n}\n"],"names":[],"mappings":";;;MAIa,mBAAmB,CAC9B,WACA,KACA,OACG;AACH,QAAM,UAAU,CAAC,MAA2B;AAC1C,QAAI,GAAG;AAAI,QAAE;AAAA;AAEf,MAAI,OAAiC;AACrC,QACE,MAAM,UAAU,OAChB,CAAC,QAAQ;AACP,QAAI,KAAK;AACP,aAAO,iBAAiB,UAAU,KAAK,SAAS;AAAA,WAC3C;AACL;AAAA;AAAA,KAGJ,EAAE,WAAW;AAAA;;;;"}

package/es/hooks/use-prop/index.d.ts

@@ -0,0 +1,2 @@
+import type { ComputedRef } from 'vue';
+export declare const useProp: <T>(name: string) => ComputedRef<T | undefined>;

package/es/hooks/use-prop/index.mjs

@@ -0,0 +1,12 @@
+import { getCurrentInstance, computed } from 'vue';
+
+const useProp = (name) => {
+  const vm = getCurrentInstance();
+  return computed(() => {
+    var _a, _b;
+    return (_b = (_a = vm.proxy) == null ? void 0 : _a.$props[name]) != null ? _b : void 0;
+  });
+};
+
+export { useProp };
+//# sourceMappingURL=index.mjs.map

package/es/hooks/use-prop/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-prop/index.ts"],"sourcesContent":["import { getCurrentInstance, computed } from 'vue'\nimport type { ComputedRef } from 'vue'\n\nexport const useProp = <T>(name: string): ComputedRef<T | undefined> => {\n  const vm = getCurrentInstance()!\n  return computed(() => vm.proxy?.$props[name] ?? undefined)\n}\n"],"names":[],"mappings":";;MAGa,UAAU,CAAI,SAA6C;AACtE,QAAM,KAAK;AACX,SAAO,SAAS,MAAG;AALrB;AAKwB,0BAAG,UAAH,mBAAU,OAAO,UAAjB,YAA0B;AAAA;AAAA;;;;"}

package/es/hooks/use-restore-active/index.d.ts

@@ -1,3 +1,6 @@
 import type { Ref } from 'vue';
-declare const _default: (toggle: Ref<boolean>, initialFocus?: Ref<HTMLElement> | undefined) => void;
-export default _default;
+/**
+ * This method provides dialogable components the ability to restore previously activated element before
+ * the dialog gets opened
+ */
+export declare const useRestoreActive: (toggle: Ref<boolean>, initialFocus?: Ref<HTMLElement> | undefined) => void;

package/es/hooks/use-restore-active/index.mjs

@@ -1,6 +1,6 @@
 import { watch, isRef } from 'vue';
 
-var useRestoreActive = (toggle, initialFocus) => {
+const useRestoreActive = (toggle, initialFocus) => {
   let previousActive;
   watch(() => toggle.value, (val) => {
     var _a, _b;
@@ -19,5 +19,5 @@ var useRestoreActive = (toggle, initialFocus) => {
   });
 };
 
-export { useRestoreActive as default };
+export { useRestoreActive };
 //# sourceMappingURL=index.mjs.map

package/es/hooks/use-restore-active/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-restore-active/index.ts"],"sourcesContent":["import { isRef, watch } from 'vue'\nimport type { Ref } from 'vue'\n\n/**\n * This method provides dialogable components the ability to restore previously activated element before\n * the dialog gets opened\n */\nexport default (toggle: Ref<boolean>, initialFocus?: Ref<HTMLElement>) => {\n  let previousActive: HTMLElement\n  watch(\n    () => toggle.value,\n    (val) => {\n      if (val) {\n        previousActive = document.activeElement as HTMLElement\n        if (isRef(initialFocus)) {\n          initialFocus.value.focus?.()\n        }\n      } else {\n        if (process.env.NODE_ENV === 'testing') {\n          previousActive.focus.call(previousActive)\n        } else {\n          previousActive.focus()\n        }\n      }\n    }\n  )\n}\n"],"names":[],"mappings":";;AAOA,uBAAe,CAAC,QAAsB,iBAAoC;AACxE,MAAI;AACJ,QACE,MAAM,OAAO,OACb,CAAC,QAAQ;AAXb;AAYM,QAAI,KAAK;AACP,uBAAiB,SAAS;AAC1B,UAAI,MAAM,eAAe;AACvB,iCAAa,OAAM,UAAnB;AAAA;AAAA,WAEG;AACL,UAAI,QAAQ,IAAI,aAAa,WAAW;AACtC,uBAAe,MAAM,KAAK;AAAA,aACrB;AACL,uBAAe;AAAA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-restore-active/index.ts"],"sourcesContent":["import { isRef, watch } from 'vue'\nimport type { Ref } from 'vue'\n\n/**\n * This method provides dialogable components the ability to restore previously activated element before\n * the dialog gets opened\n */\nexport const useRestoreActive = (\n  toggle: Ref<boolean>,\n  initialFocus?: Ref<HTMLElement>\n) => {\n  let previousActive: HTMLElement\n  watch(\n    () => toggle.value,\n    (val) => {\n      if (val) {\n        previousActive = document.activeElement as HTMLElement\n        if (isRef(initialFocus)) {\n          initialFocus.value.focus?.()\n        }\n      } else {\n        if (process.env.NODE_ENV === 'testing') {\n          previousActive.focus.call(previousActive)\n        } else {\n          previousActive.focus()\n        }\n      }\n    }\n  )\n}\n"],"names":[],"mappings":";;MAOa,mBAAmB,CAC9B,QACA,iBACG;AACH,MAAI;AACJ,QACE,MAAM,OAAO,OACb,CAAC,QAAQ;AAdb;AAeM,QAAI,KAAK;AACP,uBAAiB,SAAS;AAC1B,UAAI,MAAM,eAAe;AACvB,iCAAa,OAAM,UAAnB;AAAA;AAAA,WAEG;AACL,UAAI,QAAQ,IAAI,aAAa,WAAW;AACtC,uBAAe,MAAM,KAAK;AAAA,aACrB;AACL,uBAAe;AAAA;AAAA;AAAA;AAAA;;;;"}

package/es/hooks/use-teleport/index.d.ts

@@ -1,8 +1,7 @@
 import type { VNode, Ref } from 'vue';
-declare const _default: (contentRenderer: () => VNode, appendToBody: Ref<boolean>) => {
+export declare const useTeleport: (contentRenderer: () => VNode, appendToBody: Ref<boolean>) => {
     isTeleportVisible: Ref<boolean>;
     showTeleport: () => void;
     hideTeleport: () => void;
     renderTeleport: () => void;
 };
-export default _default;

package/es/hooks/use-teleport/index.mjs

@@ -1,11 +1,11 @@
 import { ref, h, Teleport, onUnmounted } from 'vue';
 import { NOOP } from '@vue/shared';
-import isServer from '../../utils/isServer.mjs';
+import { isClient } from '@vueuse/core';
 import { createGlobalNode, removeGlobalNode } from '../../utils/global-nodes.mjs';
 
-var useTeleport = (contentRenderer, appendToBody) => {
+const useTeleport = (contentRenderer, appendToBody) => {
   const isTeleportVisible = ref(false);
-  if (isServer) {
+  if (!isClient) {
     return {
       isTeleportVisible,
       showTeleport: NOOP,
@@ -39,5 +39,5 @@ var useTeleport = (contentRenderer, appendToBody) => {
   };
 };
 
-export { useTeleport as default };
+export { useTeleport };
 //# sourceMappingURL=index.mjs.map

package/es/hooks/use-teleport/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-teleport/index.ts"],"sourcesContent":["import { h, ref, Teleport, onUnmounted } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport isServer from '@element-plus/utils/isServer'\nimport {\n  createGlobalNode,\n  removeGlobalNode,\n} from '@element-plus/utils/global-nodes'\n\nimport type { VNode, Ref } from 'vue'\n\nexport default (contentRenderer: () => VNode, appendToBody: Ref<boolean>) => {\n  const isTeleportVisible = ref(false)\n\n  if (isServer) {\n    return {\n      isTeleportVisible,\n      showTeleport: NOOP,\n      hideTeleport: NOOP,\n      renderTeleport: NOOP,\n    }\n  }\n\n  let $el: HTMLElement | null = null\n\n  const showTeleport = () => {\n    isTeleportVisible.value = true\n    // this allows the delayed showing strategy since the the content itself could be enterable\n    // e.g. el-popper\n    if ($el !== null) return\n\n    $el = createGlobalNode()\n  }\n\n  const hideTeleport = () => {\n    isTeleportVisible.value = false\n    if ($el !== null) {\n      removeGlobalNode($el)\n      $el = null\n    }\n  }\n\n  const renderTeleport = () => {\n    return appendToBody.value !== true\n      ? contentRenderer()\n      : isTeleportVisible.value\n      ? [h(Teleport, { to: $el }, contentRenderer())]\n      : undefined\n  }\n\n  onUnmounted(hideTeleport)\n\n  return {\n    isTeleportVisible,\n    showTeleport,\n    hideTeleport,\n    renderTeleport,\n  }\n}\n"],"names":[],"mappings":";;;;;AAUA,kBAAe,CAAC,iBAA8B,iBAA+B;AAC3E,QAAM,oBAAoB,IAAI;AAE9B,MAAI,UAAU;AACZ,WAAO;AAAA,MACL;AAAA,MACA,cAAc;AAAA,MACd,cAAc;AAAA,MACd,gBAAgB;AAAA;AAAA;AAIpB,MAAI,MAA0B;AAE9B,QAAM,eAAe,MAAM;AACzB,sBAAkB,QAAQ;AAG1B,QAAI,QAAQ;AAAM;AAElB,UAAM;AAAA;AAGR,QAAM,eAAe,MAAM;AACzB,sBAAkB,QAAQ;AAC1B,QAAI,QAAQ,MAAM;AAChB,uBAAiB;AACjB,YAAM;AAAA;AAAA;AAIV,QAAM,iBAAiB,MAAM;AAC3B,WAAO,aAAa,UAAU,OAC1B,oBACA,kBAAkB,QAClB,CAAC,EAAE,UAAU,EAAE,IAAI,OAAO,sBAC1B;AAAA;AAGN,cAAY;AAEZ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-teleport/index.ts"],"sourcesContent":["import { h, ref, Teleport, onUnmounted } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport { isClient } from '@vueuse/core'\nimport {\n  createGlobalNode,\n  removeGlobalNode,\n} from '@element-plus/utils/global-nodes'\n\nimport type { VNode, Ref } from 'vue'\n\nexport const useTeleport = (\n  contentRenderer: () => VNode,\n  appendToBody: Ref<boolean>\n) => {\n  const isTeleportVisible = ref(false)\n\n  if (!isClient) {\n    return {\n      isTeleportVisible,\n      showTeleport: NOOP,\n      hideTeleport: NOOP,\n      renderTeleport: NOOP,\n    }\n  }\n\n  let $el: HTMLElement | null = null\n\n  const showTeleport = () => {\n    isTeleportVisible.value = true\n    // this allows the delayed showing strategy since the the content itself could be enterable\n    // e.g. el-popper\n    if ($el !== null) return\n\n    $el = createGlobalNode()\n  }\n\n  const hideTeleport = () => {\n    isTeleportVisible.value = false\n    if ($el !== null) {\n      removeGlobalNode($el)\n      $el = null\n    }\n  }\n\n  const renderTeleport = () => {\n    return appendToBody.value !== true\n      ? contentRenderer()\n      : isTeleportVisible.value\n      ? [h(Teleport, { to: $el }, contentRenderer())]\n      : undefined\n  }\n\n  onUnmounted(hideTeleport)\n\n  return {\n    isTeleportVisible,\n    showTeleport,\n    hideTeleport,\n    renderTeleport,\n  }\n}\n"],"names":[],"mappings":";;;;;MAUa,cAAc,CACzB,iBACA,iBACG;AACH,QAAM,oBAAoB,IAAI;AAE9B,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,MACL;AAAA,MACA,cAAc;AAAA,MACd,cAAc;AAAA,MACd,gBAAgB;AAAA;AAAA;AAIpB,MAAI,MAA0B;AAE9B,QAAM,eAAe,MAAM;AACzB,sBAAkB,QAAQ;AAG1B,QAAI,QAAQ;AAAM;AAElB,UAAM;AAAA;AAGR,QAAM,eAAe,MAAM;AACzB,sBAAkB,QAAQ;AAC1B,QAAI,QAAQ,MAAM;AAChB,uBAAiB;AACjB,YAAM;AAAA;AAAA;AAIV,QAAM,iBAAiB,MAAM;AAC3B,WAAO,aAAa,UAAU,OAC1B,oBACA,kBAAkB,QAClB,CAAC,EAAE,UAAU,EAAE,IAAI,OAAO,sBAC1B;AAAA;AAGN,cAAY;AAEZ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}

package/es/hooks/use-throttle-render/index.d.ts

@@ -1,2 +1,2 @@
 import type { Ref } from 'vue';
-export default function (loading: Ref<boolean>, throttle?: number): Ref<boolean>;
+export declare const useThrottleRender: (loading: Ref<boolean>, throttle?: number) => Ref<boolean>;