element-plus 1.2.0-beta.4 → 1.2.0-beta.5

package/lib/hooks/index.js

@@ -3,55 +3,49 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var index = require('./use-attrs/index.js');
-var index$1 = require('./use-events/index.js');
-var index$2 = require('./use-lockscreen/index.js');
-var index$3 = require('./use-restore-active/index.js');
-var index$4 = require('./use-modal/index.js');
-var index$5 = require('./use-migrating/index.js');
-var index$6 = require('./use-focus/index.js');
-var index$7 = require('./use-throttle-render/index.js');
-var index$8 = require('./use-prevent-global/index.js');
-var index$9 = require('./use-teleport/index.js');
-var index$a = require('./use-timeout/index.js');
-var index$b = require('./use-model-toggle/index.js');
-var index$c = require('./use-popper/index.js');
-var index$d = require('./use-css-var/index.js');
-var index$e = require('./use-locale/index.js');
-var index$f = require('./use-form-item/index.js');
-var index$g = require('./use-same-target/index.js');
-var index$h = require('./use-global-config/index.js');
+var index$1 = require('./use-focus/index.js');
+var index$2 = require('./use-form-item/index.js');
+var index$3 = require('./use-global-config/index.js');
+var index$4 = require('./use-locale/index.js');
+var index$5 = require('./use-lockscreen/index.js');
+var index$6 = require('./use-modal/index.js');
+var index$7 = require('./use-model-toggle/index.js');
+var index$8 = require('./use-popper/index.js');
+var index$9 = require('./use-prevent-global/index.js');
+var index$a = require('./use-restore-active/index.js');
+var index$b = require('./use-same-target/index.js');
+var index$c = require('./use-teleport/index.js');
+var index$d = require('./use-throttle-render/index.js');
+var index$e = require('./use-timeout/index.js');
 
 
 
-exports.useAttrs = index["default"];
-exports.useEvents = index$1["default"];
-exports.useLockScreen = index$2["default"];
-exports.useRestoreActive = index$3["default"];
-exports.useModal = index$4["default"];
-exports.useMigrating = index$5["default"];
-exports.useFocus = index$6["default"];
-exports.useThrottleRender = index$7["default"];
-exports.usePreventGlobal = index$8["default"];
-exports.useTeleport = index$9["default"];
-exports.useTimeout = index$a["default"];
-exports.useModelToggle = index$b.useModelToggle;
-exports.useModelToggleEmits = index$b.useModelToggleEmits;
-exports.useModelToggleProps = index$b.useModelToggleProps;
-exports.DARK_EFFECT = index$c.DARK_EFFECT;
-exports.LIGHT_EFFECT = index$c.LIGHT_EFFECT;
-exports.usePopperControlProps = index$c.usePopperControlProps;
-exports.usePopperHook = index$c.usePopperHook;
-exports.usePopperProps = index$c.usePopperProps;
-exports.themeVarsKey = index$d.themeVarsKey;
-exports.useCssVar = index$d.useCssVar;
-exports.useThemeVars = index$d.useThemeVars;
-exports.LocaleInjectionKey = index$e.LocaleInjectionKey;
-exports.localeProviderMaker = index$e.localeProviderMaker;
-exports.useLocale = index$e.useLocale;
-exports.useLocaleInject = index$e.useLocaleInject;
-exports.useLocaleProps = index$e.useLocaleProps;
-exports.useFormItem = index$f.useFormItem;
-exports.useFormItemProps = index$f.useFormItemProps;
-exports.useSameTarget = index$g.useSameTarget;
-exports.useGlobalConfig = index$h.useGlobalConfig;
+exports.useAttrs = index.useAttrs;
+exports.useFocus = index$1.useFocus;
+exports.useFormItem = index$2.useFormItem;
+exports.useFormItemProps = index$2.useFormItemProps;
+exports.useGlobalConfig = index$3.useGlobalConfig;
+exports.buildTranslator = index$4.buildTranslator;
+exports.localeContextKey = index$4.localeContextKey;
+exports.localeProviderMaker = index$4.localeProviderMaker;
+exports.provideLocale = index$4.provideLocale;
+exports.translate = index$4.translate;
+exports.useLocale = index$4.useLocale;
+exports.useLocaleProps = index$4.useLocaleProps;
+exports.useLockscreen = index$5.useLockscreen;
+exports.useModal = index$6.useModal;
+exports.useModelToggle = index$7.useModelToggle;
+exports.useModelToggleEmits = index$7.useModelToggleEmits;
+exports.useModelToggleProps = index$7.useModelToggleProps;
+exports.DARK_EFFECT = index$8.DARK_EFFECT;
+exports.LIGHT_EFFECT = index$8.LIGHT_EFFECT;
+exports.usePopperControlProps = index$8.usePopperControlProps;
+exports.usePopperHook = index$8.usePopperHook;
+exports.usePopperProps = index$8.usePopperProps;
+exports.usePreventGlobal = index$9.usePreventGlobal;
+exports.useRestoreActive = index$a.useRestoreActive;
+exports.useSameTarget = index$b.useSameTarget;
+exports.useTeleport = index$c.useTeleport;
+exports.useThrottleRender = index$d.useThrottleRender;
+exports.useTimeout = index$e.useTimeout;
 //# sourceMappingURL=index.js.map

package/lib/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/hooks/use-attrs/index.d.ts

@@ -3,5 +3,5 @@ interface Params {
     excludeListeners?: boolean;
     excludeKeys?: string[];
 }
-declare const _default: (params?: Params) => ComputedRef<Record<string, unknown>>;
-export default _default;
+export declare const useAttrs: (params?: Params) => ComputedRef<Record<string, unknown>>;
+export {};

package/lib/hooks/use-attrs/index.js

@@ -12,7 +12,7 @@ var fromPairs__default = /*#__PURE__*/_interopDefaultLegacy(fromPairs);
 
 const DEFAULT_EXCLUDE_KEYS = ["class", "style"];
 const LISTENER_PREFIX = /^on[A-Z]/;
-var useAttrs = (params = {}) => {
+const useAttrs = (params = {}) => {
   const { excludeListeners = false, excludeKeys = [] } = params;
   const allExcludeKeys = excludeKeys.concat(DEFAULT_EXCLUDE_KEYS);
   const instance = vue.getCurrentInstance();
@@ -26,5 +26,5 @@ var useAttrs = (params = {}) => {
   });
 };
 
-exports["default"] = useAttrs;
+exports.useAttrs = useAttrs;
 //# sourceMappingURL=index.js.map

package/lib/hooks/use-attrs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-attrs/index.ts"],"sourcesContent":["import { getCurrentInstance, computed } from 'vue'\nimport fromPairs from 'lodash/fromPairs'\nimport { debugWarn } from '@element-plus/utils/error'\n\nimport type { ComputedRef } from 'vue'\n\ninterface Params {\n  excludeListeners?: boolean\n  excludeKeys?: string[]\n}\n\nconst DEFAULT_EXCLUDE_KEYS = ['class', 'style']\nconst LISTENER_PREFIX = /^on[A-Z]/\n\nexport default (params: Params = {}): ComputedRef<Record<string, unknown>> => {\n  const { excludeListeners = false, excludeKeys = [] } = params\n  const allExcludeKeys = excludeKeys.concat(DEFAULT_EXCLUDE_KEYS)\n\n  const instance = getCurrentInstance()\n  if (!instance) {\n    debugWarn(\n      'use-attrs',\n      'getCurrentInstance() returned null. useAttrs() must be called at the top of a setup function'\n    )\n    return computed(() => ({}))\n  }\n\n  return computed(() =>\n    fromPairs(\n      Object.entries(instance.proxy?.$attrs!).filter(\n        ([key]) =>\n          !allExcludeKeys.includes(key) &&\n          !(excludeListeners && LISTENER_PREFIX.test(key))\n      )\n    )\n  )\n}\n"],"names":["getCurrentInstance","computed"],"mappings":";;;;;;;;;;;;AAWA,MAAM,uBAAuB,CAAC,SAAS;AACvC,MAAM,kBAAkB;AAExB,eAAe,CAAC,SAAiB,OAA6C;AAC5E,QAAM,EAAE,mBAAmB,OAAO,cAAc,OAAO;AACvD,QAAM,iBAAiB,YAAY,OAAO;AAE1C,QAAM,WAAWA;AACjB,MAAI,CAAC,UAAU;AACb,oBACE,aACA;AAEF,WAAOC,aAAS;AAAO;AAGzB,SAAOA,aAAS,MAAG;AA3BrB;AA4BI,yCACE,OAAO,QAAQ,eAAS,UAAT,mBAAgB,QAAS,OACtC,CAAC,CAAC,SACA,CAAC,eAAe,SAAS,QACzB,sBAAsB,gBAAgB,KAAK;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-attrs/index.ts"],"sourcesContent":["import { getCurrentInstance, computed } from 'vue'\nimport fromPairs from 'lodash/fromPairs'\nimport { debugWarn } from '@element-plus/utils/error'\n\nimport type { ComputedRef } from 'vue'\n\ninterface Params {\n  excludeListeners?: boolean\n  excludeKeys?: string[]\n}\n\nconst DEFAULT_EXCLUDE_KEYS = ['class', 'style']\nconst LISTENER_PREFIX = /^on[A-Z]/\n\nexport const useAttrs = (\n  params: Params = {}\n): ComputedRef<Record<string, unknown>> => {\n  const { excludeListeners = false, excludeKeys = [] } = params\n  const allExcludeKeys = excludeKeys.concat(DEFAULT_EXCLUDE_KEYS)\n\n  const instance = getCurrentInstance()\n  if (!instance) {\n    debugWarn(\n      'use-attrs',\n      'getCurrentInstance() returned null. useAttrs() must be called at the top of a setup function'\n    )\n    return computed(() => ({}))\n  }\n\n  return computed(() =>\n    fromPairs(\n      Object.entries(instance.proxy?.$attrs!).filter(\n        ([key]) =>\n          !allExcludeKeys.includes(key) &&\n          !(excludeListeners && LISTENER_PREFIX.test(key))\n      )\n    )\n  )\n}\n"],"names":["getCurrentInstance","computed"],"mappings":";;;;;;;;;;;;AAWA,MAAM,uBAAuB,CAAC,SAAS;AACvC,MAAM,kBAAkB;MAEX,WAAW,CACtB,SAAiB,OACwB;AACzC,QAAM,EAAE,mBAAmB,OAAO,cAAc,OAAO;AACvD,QAAM,iBAAiB,YAAY,OAAO;AAE1C,QAAM,WAAWA;AACjB,MAAI,CAAC,UAAU;AACb,oBACE,aACA;AAEF,WAAOC,aAAS;AAAO;AAGzB,SAAOA,aAAS,MAAG;AA7BrB;AA8BI,yCACE,OAAO,QAAQ,eAAS,UAAT,mBAAgB,QAAS,OACtC,CAAC,CAAC,SACA,CAAC,eAAe,SAAS,QACzB,sBAAsB,gBAAgB,KAAK;AAAA;AAAA;;;;"}

package/lib/hooks/use-focus/index.d.ts

@@ -1,5 +1,4 @@
 import type { Ref } from 'vue';
-declare const _default: (el: Ref<HTMLElement>) => {
+export declare const useFocus: (el: Ref<HTMLElement>) => {
     focus: () => void;
 };
-export default _default;

package/lib/hooks/use-focus/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var useFocus = (el) => {
+const useFocus = (el) => {
   return {
     focus: () => {
       var _a, _b;
@@ -11,5 +11,5 @@ var useFocus = (el) => {
   };
 };
 
-exports["default"] = useFocus;
+exports.useFocus = useFocus;
 //# sourceMappingURL=index.js.map

package/lib/hooks/use-focus/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-focus/index.ts"],"sourcesContent":["import type { Ref } from 'vue'\n\nexport default (el: Ref<HTMLElement>) => {\n  return {\n    focus: () => {\n      el.value?.focus?.()\n    },\n  }\n}\n"],"names":[],"mappings":";;;;AAEA,eAAe,CAAC,OAAyB;AACvC,SAAO;AAAA,IACL,OAAO,MAAM;AAJjB;AAKM,qBAAG,UAAH,mBAAU,UAAV;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-focus/index.ts"],"sourcesContent":["import type { Ref } from 'vue'\n\nexport const useFocus = (el: Ref<HTMLElement>) => {\n  return {\n    focus: () => {\n      el.value?.focus?.()\n    },\n  }\n}\n"],"names":[],"mappings":";;;;MAEa,WAAW,CAAC,OAAyB;AAChD,SAAO;AAAA,IACL,OAAO,MAAM;AAJjB;AAKM,qBAAG,UAAH,mBAAU,UAAV;AAAA;AAAA;AAAA;;;;"}

package/lib/hooks/use-form-item/index.d.ts

@@ -9,7 +9,7 @@ export declare type LocalFallbacks = {
     size?: MaybeRef<UseFormItemProps['size'] | undefined>;
     disabled?: MaybeRef<UseFormItemProps['disabled'] | undefined>;
 };
-export declare const useFormItem: ({ size, disabled }: LocalFallbacks) => {
+export declare const useFormItem: ({ size, disabled }?: LocalFallbacks) => {
     size: import("vue").ComputedRef<any>;
     disabled: import("vue").ComputedRef<boolean>;
     form: import("element-plus/es/tokens").ElFormContext | undefined;

package/lib/hooks/use-form-item/index.js

@@ -8,7 +8,7 @@ var props = require('../../utils/props.js');
 var util = require('../../utils/util.js');
 var form = require('../../tokens/form.js');
 
-const sizes = ["", "large", "medium", "small", "mini"];
+const sizes = ["", ...props.componentSize];
 const useFormItemProps = props.buildProps({
   size: {
     type: String,
@@ -17,7 +17,7 @@ const useFormItemProps = props.buildProps({
   },
   disabled: Boolean
 });
-const useFormItem = ({ size, disabled }) => {
+const useFormItem = ({ size, disabled } = {}) => {
   var _a;
   const vm = vue.getCurrentInstance();
   const $ELEMENT = util.useGlobalConfig();

package/lib/hooks/use-form-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-form-item/index.ts"],"sourcesContent":["import { inject, computed, getCurrentInstance, unref } from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { buildProps } from '@element-plus/utils/props'\nimport { useGlobalConfig } from '@element-plus/utils/util'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type { MaybeRef } from '@vueuse/core'\n\nconst sizes = ['', 'large', 'medium', 'small', 'mini'] as const\n\nexport const useFormItemProps = buildProps({\n  size: {\n    type: String,\n    values: sizes,\n    default: '',\n  },\n  disabled: Boolean,\n} as const)\n\nexport type UseFormItemProps = ExtractPropTypes<typeof useFormItemProps>\n\nexport type LocalFallbacks = {\n  size?: MaybeRef<UseFormItemProps['size'] | undefined>\n  disabled?: MaybeRef<UseFormItemProps['disabled'] | undefined>\n}\n\nexport const useFormItem = ({ size, disabled }: LocalFallbacks) => {\n  const vm = getCurrentInstance()!\n  const $ELEMENT = useGlobalConfig()\n\n  // vm.props is not reactive so we use the reactive one here.\n  const props = vm.proxy?.$props as UseFormItemProps\n  const form = inject(elFormKey, undefined)\n  const formItem = inject(elFormItemKey, undefined)\n\n  return {\n    size: computed(() => {\n      // TODO, fallback to default size like 'medium/large' instead of empty string\n      return (\n        props.size ||\n        unref(size) ||\n        formItem?.size ||\n        form?.size ||\n        $ELEMENT.size ||\n        ''\n      )\n    }),\n    disabled: computed(() => {\n      return (\n        props.disabled === true || unref(disabled) || form?.disabled || false\n      )\n    }),\n    form,\n    formItem,\n  }\n}\n"],"names":["buildProps","getCurrentInstance","useGlobalConfig","form","inject","elFormKey","elFormItemKey","computed","unref"],"mappings":";;;;;;;;;;AAQA,MAAM,QAAQ,CAAC,IAAI,SAAS,UAAU,SAAS;MAElC,mBAAmBA,iBAAW;AAAA,EACzC,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA;MAUC,cAAc,CAAC,EAAE,MAAM,eAA+B;AA1BnE;AA2BE,QAAM,KAAKC;AACX,QAAM,WAAWC;AAGjB,QAAM,QAAQ,SAAG,UAAH,mBAAU;AACxB,QAAMC,SAAOC,WAAOC,gBAAW;AAC/B,QAAM,WAAWD,WAAOE,oBAAe;AAEvC,SAAO;AAAA,IACL,MAAMC,aAAS,MAAM;AAEnB,aACE,MAAM,QACNC,UAAM,+CACI,2CACJ,SACN,SAAS,QACT;AAAA;AAAA,IAGJ,UAAUD,aAAS,MAAM;AACvB,aACE,MAAM,aAAa,QAAQC,UAAM,+CAAmB,aAAY;AAAA;AAAA,UAGpEL;AAAA,IACA;AAAA;AAAA;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-form-item/index.ts"],"sourcesContent":["import { inject, computed, getCurrentInstance, unref } from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { buildProps, componentSize } from '@element-plus/utils/props'\nimport { useGlobalConfig } from '@element-plus/utils/util'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type { MaybeRef } from '@vueuse/core'\n\nconst sizes = ['', ...componentSize] as const\n\nexport const useFormItemProps = buildProps({\n  size: {\n    type: String,\n    values: sizes,\n    default: '',\n  },\n  disabled: Boolean,\n} as const)\nexport type UseFormItemProps = ExtractPropTypes<typeof useFormItemProps>\n\nexport type LocalFallbacks = {\n  size?: MaybeRef<UseFormItemProps['size'] | undefined>\n  disabled?: MaybeRef<UseFormItemProps['disabled'] | undefined>\n}\n\nexport const useFormItem = ({ size, disabled }: LocalFallbacks = {}) => {\n  const vm = getCurrentInstance()!\n  const $ELEMENT = useGlobalConfig()\n\n  const props = vm.proxy?.$props as UseFormItemProps\n  const form = inject(elFormKey, undefined)\n  const formItem = inject(elFormItemKey, undefined)\n\n  return {\n    size: computed(() => {\n      // TODO, fallback to default size like 'medium/large' instead of empty string\n      return (\n        props.size ||\n        unref(size) ||\n        formItem?.size ||\n        form?.size ||\n        $ELEMENT.size ||\n        ''\n      )\n    }),\n    disabled: computed(() => {\n      return (\n        props.disabled === true || unref(disabled) || form?.disabled || false\n      )\n    }),\n    form,\n    formItem,\n  }\n}\n"],"names":["componentSize","buildProps","getCurrentInstance","useGlobalConfig","form","inject","elFormKey","elFormItemKey","computed","unref"],"mappings":";;;;;;;;;;AAQA,MAAM,QAAQ,CAAC,IAAI,GAAGA;MAET,mBAAmBC,iBAAW;AAAA,EACzC,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA;MASC,cAAc,CAAC,EAAE,MAAM,aAA6B,OAAO;AAzBxE;AA0BE,QAAM,KAAKC;AACX,QAAM,WAAWC;AAEjB,QAAM,QAAQ,SAAG,UAAH,mBAAU;AACxB,QAAMC,SAAOC,WAAOC,gBAAW;AAC/B,QAAM,WAAWD,WAAOE,oBAAe;AAEvC,SAAO;AAAA,IACL,MAAMC,aAAS,MAAM;AAEnB,aACE,MAAM,QACNC,UAAM,+CACI,2CACJ,SACN,SAAS,QACT;AAAA;AAAA,IAGJ,UAAUD,aAAS,MAAM;AACvB,aACE,MAAM,aAAa,QAAQC,UAAM,+CAAmB,aAAY;AAAA;AAAA,UAGpEL;AAAA,IACA;AAAA;AAAA;;;;;"}

package/lib/hooks/use-global-config/index.d.ts

@@ -1 +1 @@
-export declare const useGlobalConfig: () => any;
+export declare const useGlobalConfig: () => ConfigProvdierContext;

package/lib/hooks/use-global-config/index.js

@@ -11,9 +11,7 @@ const defaultConfig = {
     autoInsertSpace: false
   }
 };
-const useGlobalConfig = () => {
-  return vue.inject(configProvider.configProviderContextKey, defaultConfig);
-};
+const useGlobalConfig = () => vue.inject(configProvider.configProviderContextKey, defaultConfig);
 
 exports.useGlobalConfig = useGlobalConfig;
 //# sourceMappingURL=index.js.map

package/lib/hooks/use-global-config/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-global-config/index.ts"],"sourcesContent":["import { inject } from 'vue'\nimport { configProviderContextKey } from '@element-plus/tokens'\nimport type { ConfigProvdierContext } from '@element-plus/tokens'\n\nconst defaultConfig: ConfigProvdierContext = {\n  button: {\n    autoInsertSpace: false,\n  },\n}\n\nexport const useGlobalConfig = () => {\n  return inject(configProviderContextKey, defaultConfig)\n}\n"],"names":["inject","configProviderContextKey"],"mappings":";;;;;;;;AAIA,MAAM,gBAAuC;AAAA,EAC3C,QAAQ;AAAA,IACN,iBAAiB;AAAA;AAAA;MAIR,kBAAkB,MAAM;AACnC,SAAOA,WAAOC,yCAA0B;AAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-global-config/index.ts"],"sourcesContent":["import { inject } from 'vue'\nimport { configProviderContextKey } from '@element-plus/tokens'\nimport type { ConfigProvdierContext } from '@element-plus/tokens'\n\nconst defaultConfig: ConfigProvdierContext = {\n  button: {\n    autoInsertSpace: false,\n  },\n}\n\nexport const useGlobalConfig = () =>\n  inject(configProviderContextKey, defaultConfig)\n"],"names":["inject","configProviderContextKey"],"mappings":";;;;;;;;AAIA,MAAM,gBAAuC;AAAA,EAC3C,QAAQ;AAAA,IACN,iBAAiB;AAAA;AAAA;MAIR,kBAAkB,MAC7BA,WAAOC,yCAA0B;;;;"}

package/lib/hooks/use-locale/index.d.ts

@@ -1,16 +1,19 @@
+import type { MaybeRef } from '@vueuse/core';
 import type { InjectionKey, Ref } from 'vue';
 import type { Language } from 'element-plus/es/locale';
 export declare const useLocaleProps: {
-    locale: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<Language>, never, false, never, never>;
+    locale: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<Language>, unknown, unknown, unknown, unknown>;
 };
-declare type Translator = (...args: any[]) => string;
+export declare type Translator = (path: string) => string;
 export declare type LocaleContext = {
     locale: Ref<Language>;
     lang: Ref<string>;
     t: Translator;
 };
-export declare const LocaleInjectionKey: InjectionKey<LocaleContext>;
-export declare const useLocale: () => void;
+export declare const localeContextKey: InjectionKey<LocaleContext>;
+export declare const provideLocale: () => void;
+export declare const buildTranslator: (locale: MaybeRef<Language>) => Translator;
+export declare const translate: (path: string, locale: Language) => string;
 export declare const localeProviderMaker: (locale?: {
     name: string;
     el: {
@@ -256,7 +259,6 @@ export declare const localeProviderMaker: (locale?: {
             };
         };
     }>;
-    t: (...args: any[]) => string | undefined;
+    t: Translator;
 };
-export declare const useLocaleInject: () => LocaleContext;
-export {};
+export declare const useLocale: () => LocaleContext;

package/lib/hooks/use-locale/index.js

@@ -3,82 +3,55 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
+var get = require('lodash/get');
 var en = require('../../locale/lang/en.js');
 var props = require('../../utils/props.js');
 
-const useLocaleProps = {
-  locale: props.buildProp({
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var get__default = /*#__PURE__*/_interopDefaultLegacy(get);
+
+const useLocaleProps = props.buildProps({
+  locale: {
     type: props.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 localeContextCache;
+const provideLocale = () => {
   const vm = vue.getCurrentInstance();
   const props = vm.props;
   const locale = vue.computed(() => props.locale || en["default"]);
   const lang = vue.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;
-  vue.provide(LocaleInjectionKey, provides);
+  localeContextCache = provides;
+  vue.provide(localeContextKey, provides);
 };
-function template(str, option) {
-  if (!str || !option)
-    return str;
-  return str.replace(/\{(\w+)\}/g, (_, key) => {
-    return option[key];
-  });
-}
+const buildTranslator = (locale) => (path) => translate(path, vue.unref(locale));
+const translate = (path, locale) => get__default["default"](locale, path, "");
 const localeProviderMaker = (locale = en["default"]) => {
   const lang = vue.ref(locale.name);
   const localeRef = vue.ref(locale);
   return {
     lang,
     locale: localeRef,
-    t: (...args) => {
-      const [path, option] = args;
-      return translate(path, option, localeRef.value);
-    }
+    t: buildTranslator(localeRef)
   };
 };
-const useLocaleInject = () => {
-  return vue.inject(LocaleInjectionKey, localeObjCache || {
-    lang: vue.ref(en["default"].name),
-    locale: vue.ref(en["default"]),
-    t: (...args) => {
-      const [path, option] = args;
-      return translate(path, option, en["default"]);
-    }
-  });
+const useLocale = () => {
+  return vue.inject(localeContextKey, localeContextCache || localeProviderMaker(en["default"]));
 };
 
-exports.LocaleInjectionKey = LocaleInjectionKey;
+exports.buildTranslator = buildTranslator;
+exports.localeContextKey = localeContextKey;
 exports.localeProviderMaker = localeProviderMaker;
+exports.provideLocale = provideLocale;
+exports.translate = translate;
 exports.useLocale = useLocale;
-exports.useLocaleInject = useLocaleInject;
 exports.useLocaleProps = useLocaleProps;
 //# sourceMappingURL=index.js.map

package/lib/hooks/use-locale/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","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":["buildProp","definePropType","getCurrentInstance","computed","English","ref","inject"],"mappings":";;;;;;;;MAMa,iBAAiB;AAAA,EAC5B,QAAQA,gBAAU;AAAA,IAChB,MAAMC,qBAAyB;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,KAAKC;AACX,QAAM,QAAQ,GAAG;AAIjB,QAAM,SAASC,aAAS,MAAM,MAAM,UAAUC;AAC9C,QAAM,OAAOD,aAAS,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,cAAQ,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,SAASC,kBAAY;AACvD,QAAM,OAAOC,QAAI,OAAO;AACxB,QAAM,YAAYA,QAAI;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,SAAOC,WACL,oBACA,kBAAkB;AAAA,IAChB,MAAMD,QAAID,cAAQ;AAAA,IAClB,QAAQC,QAAID;AAAA,IACZ,GAAG,IAAI,SAAS;AACd,YAAM,CAAC,MAAM,UAAU;AACvB,aAAO,UAAU,MAAM,QAAQA;AAAA;AAAA;AAAA;;;;;;;;"}
+{"version":3,"file":"index.js","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 const useLocaleProps = buildProps({\n  locale: {\n    type: definePropType<Language>(Object),\n  },\n})\n\nexport type Translator = (path: string) => string\nexport type LocaleContext = {\n  locale: Ref<Language>\n  lang: Ref<string>\n  t: Translator\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 localeContextCache: 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  localeContextCache = provides\n  provide(localeContextKey, provides)\n}\n\nexport const buildTranslator =\n  (locale: MaybeRef<Language>): Translator =>\n  (path) =>\n    translate(path, unref(locale))\n\nexport const translate = (path: string, locale: Language): string =>\n  get(locale, path, '')\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(\n    localeContextKey,\n    localeContextCache || localeProviderMaker(English)\n  )\n}\n"],"names":["buildProps","definePropType","getCurrentInstance","computed","English","unref","get","ref","inject"],"mappings":";;;;;;;;;;;;;MAQa,iBAAiBA,iBAAW;AAAA,EACvC,QAAQ;AAAA,IACN,MAAMC,qBAAyB;AAAA;AAAA;MAWtB,mBACX,OAAO;AAKT,IAAI;MAES,gBAAgB,MAAM;AACjC,QAAM,KAAKC;AACX,QAAM,QAAQ,GAAG;AAGjB,QAAM,SAASC,aAAS,MAAM,MAAM,UAAUC;AAC9C,QAAM,OAAOD,aAAS,MAAM,OAAO,MAAM;AAEzC,QAAM,IAAI,gBAAgB;AAC1B,QAAM,WAA0B;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA;AAYF,uBAAqB;AACrB,cAAQ,kBAAkB;AAAA;MAGf,kBACX,CAAC,WACD,CAAC,SACC,UAAU,MAAME,UAAM;MAEb,YAAY,CAAC,MAAc,WACtCC,wBAAI,QAAQ,MAAM;MAEP,sBAAsB,CAAC,SAASF,kBAAY;AACvD,QAAM,OAAOG,QAAI,OAAO;AACxB,QAAM,YAAYA,QAAI;AACtB,SAAO;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,IACR,GAAG,gBAAgB;AAAA;AAAA;MAIV,YAAY,MAAM;AAC7B,SAAOC,WACL,kBACA,sBAAsB,oBAAoBJ;AAAA;;;;;;;;;;"}

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

@@ -1,8 +1,7 @@
 import type { Ref } from 'vue';
-declare const _default: (trigger: Ref<boolean>) => void;
 /**
  * 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 default _default;
+export declare const useLockscreen: (trigger: Ref<boolean>) => void;

package/lib/hooks/use-lockscreen/index.js

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

package/lib/hooks/use-lockscreen/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","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":["isRef","hasClass","getStyle","getScrollBarWidth"],"mappings":";;;;;;;;;AAkBA,oBAAe,CAAC,YAA0B;AACxC,MAAI,CAACA,UAAM,UAAU;AACnB,qBACE,mBACA;AAAA;AAGJ,MAAI,iBAAiB;AACrB,MAAI,qBAAqB;AACzB,MAAI,mBAAmB;AACvB,MAAI,2BAA2B;AAE/B,kBAAY,MAAM;AAChB;AAAA;AAGF,QAAM,UAAU,MAAM;AACpB,oBAAY,SAAS,MAAM;AAC3B,QAAI,oBAAoB;AACtB,eAAS,KAAK,MAAM,eAAe;AAAA;AAAA;AAGvC,YAAM,SAAS,CAAC,QAAQ;AACtB,QAAI,KAAK;AACP,2BAAqB,CAACC,aAAS,SAAS,MAAM;AAC9C,UAAI,oBAAoB;AACtB,2BAAmB,SAAS,KAAK,MAAM;AACvC,mCAA2B,SACzBC,aAAS,SAAS,MAAM,iBACxB;AAAA;AAGJ,uBAAiBC;AACjB,YAAM,kBACJ,SAAS,gBAAgB,eAAe,SAAS,KAAK;AACxD,YAAM,gBAAgBD,aAAS,SAAS,MAAM;AAC9C,UACE,iBAAiB,yBACG,kBAAkB,aACtC,oBACA;AACA,iBAAS,KAAK,MAAM,eAAe,GACjC,2BAA2B;AAAA;AAG/B,mBAAS,SAAS,MAAM;AAAA,WACnB;AACL;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"index.js","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'\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  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":["isRef","hasClass","getStyle","getScrollBarWidth"],"mappings":";;;;;;;;;MAkBa,gBAAgB,CAAC,YAA0B;AACtD,MAAI,CAACA,UAAM,UAAU;AACnB,qBACE,mBACA;AAAA;AAGJ,MAAI,iBAAiB;AACrB,MAAI,qBAAqB;AACzB,MAAI,mBAAmB;AACvB,MAAI,2BAA2B;AAE/B,QAAM,UAAU,MAAM;AACpB,oBAAY,SAAS,MAAM;AAC3B,QAAI,oBAAoB;AACtB,eAAS,KAAK,MAAM,eAAe;AAAA;AAAA;AAGvC,YAAM,SAAS,CAAC,QAAQ;AACtB,QAAI,CAAC,KAAK;AACR;AACA;AAAA;AAGF,yBAAqB,CAACC,aAAS,SAAS,MAAM;AAC9C,QAAI,oBAAoB;AACtB,yBAAmB,SAAS,KAAK,MAAM;AACvC,iCAA2B,SACzBC,aAAS,SAAS,MAAM,iBACxB;AAAA;AAGJ,qBAAiBC;AACjB,UAAM,kBACJ,SAAS,gBAAgB,eAAe,SAAS,KAAK;AACxD,UAAM,gBAAgBD,aAAS,SAAS,MAAM;AAC9C,QACE,iBAAiB,yBACG,kBAAkB,aACtC,oBACA;AACA,eAAS,KAAK,MAAM,eAAe,GACjC,2BAA2B;AAAA;AAG/B,iBAAS,SAAS,MAAM;AAAA;AAE1B,qBAAe,MAAM;AAAA;;;;"}

package/lib/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/lib/hooks/use-modal/index.js

@@ -3,9 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
-var dom = require('../../utils/dom.js');
+var core = require('@vueuse/core');
 var aria = require('../../utils/aria.js');
-var isServer = require('../../utils/isServer.js');
 
 const modalStack = [];
 const closeModal = (e) => {
@@ -17,8 +16,8 @@ const closeModal = (e) => {
     topModal.handleClose();
   }
 };
-var useModal = (instance, visibleRef) => {
-  vue.watch(() => visibleRef.value, (val) => {
+const useModal = (instance, visibleRef) => {
+  vue.watch(visibleRef, (val) => {
     if (val) {
       modalStack.push(instance);
     } else {
@@ -26,9 +25,8 @@ var useModal = (instance, visibleRef) => {
     }
   });
 };
-if (!isServer["default"]) {
-  dom.on(document, "keydown", closeModal);
-}
+if (core.isClient)
+  core.useEventListener(document, "keydown", closeModal);
 
-exports["default"] = useModal;
+exports.useModal = useModal;
 //# sourceMappingURL=index.js.map

package/lib/hooks/use-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","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":["EVENT_CODE","isServer"],"mappings":";;;;;;;;;AAWA,MAAM,aAA8B;AAEpC,MAAM,aAAa,CAAC,MAAqB;AACvC,MAAI,WAAW,WAAW;AAAG;AAC7B,MAAI,EAAE,SAASA,gBAAW,KAAK;AAC7B,MAAE;AACF,UAAM,WAAW,WAAW,WAAW,SAAS;AAChD,aAAS;AAAA;AAAA;AAIb,eAAe,CACb,UACA,eACG;AACH,YACE,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,CAACC,qBAAU;AACb,SAAG,UAAU,WAAW;AAAA;;;;"}
+{"version":3,"file":"index.js","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":["EVENT_CODE","isClient"],"mappings":";;;;;;;;AAUA,MAAM,aAA8B;AAEpC,MAAM,aAAa,CAAC,MAAqB;AACvC,MAAI,WAAW,WAAW;AAAG;AAC7B,MAAI,EAAE,SAASA,gBAAW,KAAK;AAC7B,MAAE;AACF,UAAM,WAAW,WAAW,WAAW,SAAS;AAChD,aAAS;AAAA;AAAA;MAIA,WAAW,CAAC,UAAyB,eAA6B;AAC7E,YAAM,YAAY,CAAC,QAAQ;AACzB,QAAI,KAAK;AACP,iBAAW,KAAK;AAAA,WACX;AACL,iBAAW,OACT,WAAW,UAAU,CAAC,UAAU,UAAU,WAC1C;AAAA;AAAA;AAAA;AAMR,IAAIC;AAAU,wBAAiB,UAAU,WAAW;;;;"}

package/lib/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-plus/es/utils/props").BuildPropReturn<import("element-plus/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/lib/hooks/use-model-toggle/index.js

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