@koi-design/uxd-ui 12.1.36-beta.0

package/lib/components/LoadingBar/index.js

@@ -0,0 +1,113 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var install = require('../../utils/install.js');
+var loadingBar$1 = require('./loadingBar2.js');
+
+let timer = null;
+let initParams = {
+  color: "primary",
+  failedColor: "error",
+  height: 2,
+  duration: 800
+};
+let instance = null;
+const clearTimer = () => {
+  if (timer) {
+    clearInterval(timer);
+    timer = null;
+  }
+};
+const hide = (ins) => {
+  setTimeout(() => {
+    ins.update({
+      show: false
+    });
+    setTimeout(() => {
+      ins.update({
+        percent: 0
+      });
+      ins.destroy();
+      instance = null;
+    }, 200);
+  }, 800);
+};
+const start = () => {
+  if (timer)
+    return;
+  let percent = 0;
+  const params = {
+    percent,
+    status: "success",
+    show: true,
+    ...initParams
+  };
+  instance = loadingBar$1["default"](params);
+  timer = setInterval(() => {
+    percent += Math.floor(Math.random() * 3 + 1);
+    if (percent > 95) {
+      clearTimer();
+    }
+    instance && instance.update({
+      percent,
+      status: "success",
+      show: true
+    });
+  }, 200);
+};
+const update = (percent) => {
+  const params = {
+    percent,
+    status: "success",
+    show: true,
+    ...initParams
+  };
+  clearTimer();
+  instance = instance || loadingBar$1["default"]();
+  instance.update(params);
+};
+const finish = () => {
+  const params = {
+    percent: 100,
+    status: "success",
+    show: true,
+    ...initParams
+  };
+  clearTimer();
+  instance = instance || loadingBar$1["default"]();
+  instance.update(params);
+  hide(instance);
+};
+const error = () => {
+  const params = {
+    percent: 100,
+    status: "error",
+    show: true,
+    ...initParams
+  };
+  clearTimer();
+  instance = instance || loadingBar$1["default"]();
+  instance.update(params);
+  hide(instance);
+};
+const config = (options) => {
+  initParams = { ...initParams, ...options };
+};
+const destroy = () => {
+  instance && instance.destroy();
+  instance = null;
+};
+const ULoadingBar = {
+  start,
+  update,
+  finish,
+  error,
+  config,
+  destroy
+};
+const loadingBar = install.withInstallPlugin(ULoadingBar, "$loadingBar");
+
+exports["default"] = loadingBar;
+exports.loadingBar = loadingBar;
+//# sourceMappingURL=index.js.map

package/lib/components/LoadingBar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/LoadingBar/index.ts"],"sourcesContent":["import { withInstallPlugin } from '../../utils/install';\nimport loadingBarInstance from './loadingBar';\nimport type { LoadingBarInstance, LoadingBarProps } from './LoadingBar.type';\n\nlet timer: any = null;\nlet initParams = {\n  color: 'primary',\n  failedColor: 'error',\n  height: 2,\n  duration: 800\n};\n// const instance = loadingBarInstance();\nlet instance: LoadingBarInstance | null = null;\nconst clearTimer = () => {\n  if (timer) {\n    clearInterval(timer);\n    timer = null;\n  }\n};\nconst hide = (ins: LoadingBarInstance) => {\n  setTimeout(() => {\n    ins.update({\n      show: false\n    });\n    setTimeout(() => {\n      ins.update({\n        percent: 0\n      });\n      ins.destroy();\n      instance = null;\n    }, 200);\n  }, 800);\n};\nconst start = () => {\n  if (timer) return;\n  let percent = 0;\n  const params = {\n    percent,\n    status: 'success',\n    show: true,\n    ...initParams\n  };\n  instance = loadingBarInstance(params);\n  timer = setInterval(() => {\n    percent += Math.floor(Math.random() * 3 + 1);\n    if (percent > 95) {\n      clearTimer();\n    }\n    instance &&\n      instance.update({\n        percent,\n        status: 'success',\n        show: true\n      });\n  }, 200);\n};\nconst update = (percent: number) => {\n  const params = {\n    percent,\n    status: 'success',\n    show: true,\n    ...initParams\n  };\n  clearTimer();\n  instance = instance || loadingBarInstance();\n  instance.update(params);\n};\nconst finish = () => {\n  const params = {\n    percent: 100,\n    status: 'success',\n    show: true,\n    ...initParams\n  };\n  clearTimer();\n  instance = instance || loadingBarInstance();\n  instance.update(params);\n  hide(instance);\n};\nconst error = () => {\n  const params = {\n    percent: 100,\n    status: 'error',\n    show: true,\n    ...initParams\n  };\n  clearTimer();\n  instance = instance || loadingBarInstance();\n  instance.update(params);\n  hide(instance);\n};\nconst config = (options: Partial<LoadingBarProps>) => {\n  initParams = { ...initParams, ...options };\n};\nconst destroy = () => {\n  instance && instance.destroy();\n  instance = null;\n};\n\nconst ULoadingBar = {\n  start,\n  update,\n  finish,\n  error,\n  config,\n  destroy\n};\nexport const loadingBar = withInstallPlugin(ULoadingBar, '$loadingBar');\nexport default loadingBar;\n"],"names":["loadingBarInstance","withInstallPlugin"],"mappings":";;;;;;;AAIA,IAAI,QAAa;AACjB,IAAI,aAAa;AAAA,EACf,OAAO;AAAA,EACP,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,UAAU;AACZ;AAEA,IAAI,WAAsC;AAC1C,MAAM,aAAa,MAAM;AACvB,MAAI,OAAO;AACT,kBAAc,KAAK;AACnB,YAAQ;AAAA;AAEZ;AACA,MAAM,OAAO,CAAC,QAA4B;AACxC,aAAW,MAAM;AACf,QAAI,OAAO;AAAA,MACT,MAAM;AAAA,KACP;AACD,eAAW,MAAM;AACf,UAAI,OAAO;AAAA,QACT,SAAS;AAAA,OACV;AACD,UAAI;AACJ,iBAAW;AAAA,OACV,GAAG;AAAA,KACL,GAAG;AACR;AACA,MAAM,QAAQ,MAAM;AAClB,MAAI;AAAO;AACX,MAAI,UAAU;AACd,QAAM,SAAS;AAAA,IACb;AAAA,IACA,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,GAAG;AAAA;AAEL,aAAWA,wBAAmB,MAAM;AACpC,UAAQ,YAAY,MAAM;AACxB,eAAW,KAAK,MAAM,KAAK,WAAW,IAAI,CAAC;AAC3C,QAAI,UAAU,IAAI;AAChB;AAAW;AAEb,gBACE,SAAS,OAAO;AAAA,MACd;AAAA,MACA,QAAQ;AAAA,MACR,MAAM;AAAA,KACP;AAAA,KACF,GAAG;AACR;AACA,MAAM,SAAS,CAAC,YAAoB;AAClC,QAAM,SAAS;AAAA,IACb;AAAA,IACA,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,GAAG;AAAA;AAEL;AACA,aAAW,YAAYA;AACvB,WAAS,OAAO,MAAM;AACxB;AACA,MAAM,SAAS,MAAM;AACnB,QAAM,SAAS;AAAA,IACb,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,GAAG;AAAA;AAEL;AACA,aAAW,YAAYA;AACvB,WAAS,OAAO,MAAM;AACtB,OAAK,QAAQ;AACf;AACA,MAAM,QAAQ,MAAM;AAClB,QAAM,SAAS;AAAA,IACb,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,GAAG;AAAA;AAEL;AACA,aAAW,YAAYA;AACvB,WAAS,OAAO,MAAM;AACtB,OAAK,QAAQ;AACf;AACA,MAAM,SAAS,CAAC,YAAsC;AACpD,eAAa,EAAE,GAAG,YAAY,GAAG;AACnC;AACA,MAAM,UAAU,MAAM;AACpB,cAAY,SAAS;AACrB,aAAW;AACb;AAEA,MAAM,cAAc;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;MACa,aAAaC,0BAAkB,aAAa,aAAa;;;;;"}

package/lib/components/LoadingBar/loadingBar.d.ts

@@ -0,0 +1,2 @@
+import type { LoadingBarInstance, LoadingBarProps } from './LoadingBar.type';
+export default function initLoadingBar(initOptions?: LoadingBarProps): LoadingBarInstance;

package/lib/components/LoadingBar/loadingBar2.js

@@ -0,0 +1,54 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var LoadingBar = require('./LoadingBar.js');
+
+function initLoadingBar(initOptions) {
+  const div = document.createElement("div");
+  document.body.appendChild(div);
+  let currentOptions = {
+    ...initOptions,
+    destroy,
+    show: true
+  };
+  let loadingBarInstance = null;
+  let loadingBarProps = {};
+  function update(options) {
+    currentOptions = {
+      ...currentOptions,
+      ...options
+    };
+    loadingBarInstance && Object.assign(loadingBarInstance, {
+      loadingBarProps: currentOptions
+    });
+  }
+  function destroy() {
+    if (loadingBarInstance && div.parentNode) {
+      loadingBarInstance = null;
+      div.parentNode.removeChild(div);
+    }
+  }
+  const render = (props) => {
+    loadingBarProps = props;
+    return vue.createApp({
+      data() {
+        return {
+          loadingBarProps
+        };
+      },
+      render() {
+        return vue.createVNode(LoadingBar["default"], this.loadingBarProps, null);
+      }
+    }).mount(div);
+  };
+  loadingBarInstance = render(currentOptions);
+  return {
+    destroy,
+    update
+  };
+}
+
+exports["default"] = initLoadingBar;
+//# sourceMappingURL=loadingBar2.js.map

package/lib/components/LoadingBar/loadingBar2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loadingBar2.js","sources":["../../../../src/components/LoadingBar/loadingBar.tsx"],"sourcesContent":["import { createApp } from 'vue';\nimport type { ComponentPublicInstance } from 'vue';\nimport type { LoadingBarInstance, LoadingBarProps } from './LoadingBar.type';\nimport LoadingBar from './LoadingBar.vue';\n\nexport default function initLoadingBar(initOptions?: LoadingBarProps) {\n  const div = document.createElement('div');\n  document.body.appendChild(div);\n  let currentOptions = { ...initOptions, destroy, show: true };\n  let loadingBarInstance: ComponentPublicInstance | null = null;\n  let loadingBarProps = {};\n  function update(options: LoadingBarProps) {\n    currentOptions = {\n      ...currentOptions,\n      ...options\n    };\n    loadingBarInstance &&\n      Object.assign(loadingBarInstance, {\n        loadingBarProps: currentOptions\n      });\n  }\n  function destroy() {\n    if (loadingBarInstance && div.parentNode) {\n      loadingBarInstance = null;\n      div.parentNode.removeChild(div);\n    }\n  }\n  const render = (props: Partial<LoadingBarProps>) => {\n    loadingBarProps = props;\n    return createApp({\n      data() {\n        return { loadingBarProps };\n      },\n      render() {\n        return <LoadingBar {...this.loadingBarProps} />;\n      }\n    }).mount(div);\n  };\n  loadingBarInstance = render(currentOptions);\n  return {\n    destroy,\n    update\n  } as LoadingBarInstance;\n}\n"],"names":["initLoadingBar","initOptions","div","document","createElement","body","appendChild","currentOptions","destroy","show","loadingBarInstance","loadingBarProps","update","options","Object","assign","parentNode","removeChild","render","props","createApp","data","_createVNode","LoadingBar","mount"],"mappings":";;;;;;;SAKwBA,eAAeC,aAA+B;AACpE,QAAMC,MAAMC,SAASC,cAAc,KAAK;AACxCD,WAASE,KAAKC,YAAYJ,GAAG;AAC7B,MAAIK,iBAAiB;AAAA,IAAE,GAAGN;AAAAA,IAAaO;AAAAA,IAASC,MAAM;AAAA;AACtD,MAAIC,qBAAqD;AACzD,MAAIC,kBAAkB;AACtB,WAASC,OAAOC,SAA0B;AACxCN,qBAAiB;AAAA,MACf,GAAGA;AAAAA,MACH,GAAGM;AAAAA;AAELH,0BACEI,OAAOC,OAAOL,oBAAoB;AAAA,MAChCC,iBAAiBJ;AAAAA,KAClB;AAAA;AAEL,WAASC,UAAU;AACjB,QAAIE,sBAAsBR,IAAIc,YAAY;AACxCN,2BAAqB;AACrBR,UAAIc,WAAWC,YAAYf,GAAG;AAAA;AAChC;AAEF,QAAMgB,SAAUC,WAAoC;AAClDR,sBAAkBQ;AAClB,WAAOC,cAAU;AAAA,MACfC,OAAO;AACL,eAAO;AAAA,UAAEV;AAAAA;AAAgB;AAC3B,MACAO,SAAS;AACP,eAAAI,gBAAAC,uBAAuB,KAAKZ;;AAC9B,KACD,EAAEa,MAAMtB,GAAG;AAAA;AAEdQ,uBAAqBQ,OAAOX,cAAc;AAC1C,SAAO;AAAA,IACLC;AAAAA,IACAI;AAAAA;AAEJ;;;;"}

package/lib/components/LoadingBar/style/index.d.ts

@@ -0,0 +1 @@
+import '@koi-design/uxd-ui/styles/components/loadingBar/index.less';

package/lib/components/LoadingBar/style/index.js

@@ -0,0 +1,5 @@
+'use strict';
+
+require('@koi-design/uxd-ui/styles/components/loadingBar/index.less');
+
+//# sourceMappingURL=index.js.map

package/lib/components/LoadingBar/style/index.js.map

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

package/lib/components/Mask/Mask.d.ts

@@ -0,0 +1,98 @@
+import type { PropType, CSSProperties } from 'vue';
+import type { OpacityMap, MaskColor } from './Mask.type';
+export declare const maskColors: readonly ["black", "white"];
+export declare const maskOpacity: readonly ["lighter", "default", "darker"];
+export declare const opacityMap: OpacityMap;
+export declare const maskProps: {
+    show: BooleanConstructor;
+    zIndex: (StringConstructor | NumberConstructor)[];
+    duration: (StringConstructor | NumberConstructor)[];
+    preventScroll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    desdroyOnClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    customStyle: PropType<CSSProperties>;
+    color: {
+        type: PropType<MaskColor>;
+        default: string;
+        validator: (val: "black" | "white") => boolean;
+    };
+    opacity: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+        validator: (value: any) => boolean;
+    };
+};
+declare const _default: import("vue").DefineComponent<{
+    show: BooleanConstructor;
+    zIndex: (StringConstructor | NumberConstructor)[];
+    duration: (StringConstructor | NumberConstructor)[];
+    preventScroll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    desdroyOnClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    customStyle: PropType<CSSProperties>;
+    color: {
+        type: PropType<MaskColor>;
+        default: string;
+        validator: (val: "black" | "white") => boolean;
+    };
+    opacity: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+        validator: (value: any) => boolean;
+    };
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "after-show-mask-change"[], "after-show-mask-change", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    show: BooleanConstructor;
+    zIndex: (StringConstructor | NumberConstructor)[];
+    duration: (StringConstructor | NumberConstructor)[];
+    preventScroll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    desdroyOnClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    customStyle: PropType<CSSProperties>;
+    color: {
+        type: PropType<MaskColor>;
+        default: string;
+        validator: (val: "black" | "white") => boolean;
+    };
+    opacity: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+        validator: (value: any) => boolean;
+    };
+}>> & {
+    "onAfter-show-mask-change"?: (...args: any[]) => any;
+}, {
+    show: boolean;
+    color: MaskColor;
+    opacity: string | number;
+    preventScroll: boolean;
+    lazyRender: boolean;
+    desdroyOnClose: boolean;
+}, {}>;
+export default _default;

package/lib/components/Mask/Mask.js

@@ -0,0 +1,121 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+require('../../utils/index.js');
+require('../base/hooks/index.js');
+var propsValidators = require('../../utils/propsValidators.js');
+var useGlobalConfig = require('../base/hooks/useGlobalConfig.js');
+var useLazyRender = require('../base/hooks/useLazyRender.js');
+var dom = require('../../utils/dom.js');
+var isValid = require('../../utils/isValid.js');
+var useShouldRender = require('../base/hooks/useShouldRender.js');
+
+const maskColors = ["black", "white"];
+const maskOpacity = ["lighter", "default", "darker"];
+const opacityMap = {
+  lighter: 0.35,
+  default: 0.55,
+  darker: 0.75
+};
+const maskProps = {
+  show: Boolean,
+  zIndex: [Number, String],
+  duration: [Number, String],
+  preventScroll: {
+    type: Boolean,
+    default: true
+  },
+  lazyRender: {
+    type: Boolean,
+    default: true
+  },
+  desdroyOnClose: {
+    type: Boolean,
+    default: true
+  },
+  customStyle: Object,
+  color: {
+    type: String,
+    default: "black",
+    validator: propsValidators.oneOf(maskColors)
+  },
+  opacity: {
+    type: [Number, String],
+    default: "default",
+    validator: (value) => {
+      if (typeof value === "string") {
+        return maskOpacity.includes(value);
+      }
+      return value >= 0 && value <= 1;
+    }
+  }
+};
+var Mask = vue.defineComponent({
+  name: "UMask",
+  props: maskProps,
+  emits: ["after-show-mask-change"],
+  setup(props, {
+    slots,
+    emit,
+    expose
+  }) {
+    const {
+      prefixCls
+    } = useGlobalConfig["default"]("mask");
+    const maskRef = vue.ref(null);
+    const animationEnd = vue.ref(false);
+    const lazyRender = useLazyRender.useLazyRender(() => props.show || !props.lazyRender);
+    expose({
+      maskRef,
+      animationEnd
+    });
+    const handleTouchMove = (event) => {
+      dom.preventDefault(event, true);
+    };
+    const handleAnimationend = (event) => {
+      if (event.target === maskRef.value && event.animationName.match(/uuiFade$/)) {
+        animationEnd.value = !props.show;
+        emit("after-show-mask-change", props.show);
+      }
+    };
+    const maskBackground = vue.computed(() => {
+      var _a;
+      const opacity = (_a = opacityMap[props.opacity]) != null ? _a : props.opacity;
+      const maskColor = props.color === "white" ? "255, 255, 255" : "0, 0, 0";
+      return `rgba(${maskColor}, ${opacity})`;
+    });
+    const renderMask = lazyRender(() => {
+      const style = {
+        backgroundColor: maskBackground.value,
+        ...dom.getPropStyle("zIndex", props.zIndex),
+        ...props.customStyle
+      };
+      if (isValid.isValid(props.duration)) {
+        style.animationDuration = `${props.duration}s`;
+      }
+      return vue.withDirectives(vue.createVNode("div", {
+        "ref": maskRef,
+        "style": style,
+        "class": prefixCls.value,
+        "onTouchmove": props.preventScroll ? handleTouchMove : () => {
+        },
+        "onAnimationend": handleAnimationend
+      }, [useShouldRender.useShouldRender(props.show, props.desdroyOnClose, animationEnd.value, slots.default)]), [[vue.vShow, props.show]]);
+    });
+    return () => vue.createVNode(vue.Transition, {
+      "name": `fade`,
+      "appear": true
+    }, {
+      default: renderMask
+    });
+  }
+});
+
+exports["default"] = Mask;
+exports.maskColors = maskColors;
+exports.maskOpacity = maskOpacity;
+exports.maskProps = maskProps;
+exports.opacityMap = opacityMap;
+//# sourceMappingURL=Mask.js.map

package/lib/components/Mask/Mask.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Mask.js","sources":["../../../../src/components/Mask/Mask.tsx"],"sourcesContent":["import { ref, computed, Transition, defineComponent } from 'vue';\nimport type { PropType, CSSProperties } from 'vue';\nimport { isValid, oneOf, getPropStyle, preventDefault } from '../../utils';\nimport { useGlobalConfig, useLazyRender, useShouldRender } from '../base/hooks';\nimport type { OpacityMap, MaskColor, MaskOpacity } from './Mask.type';\n\nexport const maskColors = ['black', 'white'] as const;\nexport const maskOpacity = ['lighter', 'default', 'darker'] as const;\nexport const opacityMap: OpacityMap = {\n  lighter: 0.35,\n  default: 0.55,\n  darker: 0.75\n};\n\nexport const maskProps = {\n  show: Boolean,\n  zIndex: [Number, String],\n  duration: [Number, String],\n  preventScroll: {\n    type: Boolean,\n    default: true\n  },\n  lazyRender: {\n    type: Boolean,\n    default: true\n  },\n  desdroyOnClose: {\n    type: Boolean,\n    default: true\n  },\n  customStyle: Object as PropType<CSSProperties>,\n  color: {\n    type: String as PropType<MaskColor>,\n    default: 'black',\n    validator: oneOf(maskColors)\n  },\n  opacity: {\n    type: [Number, String],\n    default: 'default',\n    validator: (value: any) => {\n      if (typeof value === 'string') {\n        return maskOpacity.includes(value as MaskOpacity);\n      }\n      return value >= 0 && value <= 1;\n    }\n  }\n};\n\nexport default defineComponent({\n  name: 'UMask',\n  props: maskProps,\n  emits: ['after-show-mask-change'],\n  setup(props, { slots, emit, expose }) {\n    const { prefixCls } = useGlobalConfig('mask');\n    const maskRef = ref<HTMLElement | null>(null);\n    const animationEnd = ref(false);\n    const lazyRender = useLazyRender(() => props.show || !props.lazyRender);\n    expose({ maskRef, animationEnd });\n\n    const handleTouchMove = (event: Event) => {\n      preventDefault(event, true);\n    };\n\n    const handleAnimationend = (event: AnimationEvent) => {\n      if (event.target === maskRef.value && event.animationName.match(/uuiFade$/)) {\n        animationEnd.value = !props.show;\n        emit('after-show-mask-change', props.show);\n      }\n    };\n\n    const maskBackground = computed(() => {\n      const opacity = opacityMap[props.opacity as keyof OpacityMap] ?? props.opacity;\n      const maskColor = props.color === 'white' ? '255, 255, 255' : '0, 0, 0';\n      return `rgba(${maskColor}, ${opacity})`;\n    });\n\n    const renderMask = lazyRender(() => {\n      const style: CSSProperties = {\n        backgroundColor: maskBackground.value,\n        ...getPropStyle('zIndex', props.zIndex),\n        ...props.customStyle\n      };\n\n      if (isValid(props.duration)) {\n        style.animationDuration = `${props.duration}s`;\n      }\n\n      return (\n        <div\n          ref={maskRef}\n          v-show={props.show}\n          style={style}\n          class={prefixCls.value}\n          onTouchmove={props.preventScroll ? handleTouchMove : () => {}}\n          onAnimationend={handleAnimationend}\n        >\n          {useShouldRender(props.show, props.desdroyOnClose, animationEnd.value, slots.default)}\n        </div>\n      );\n    });\n\n    return () => <Transition v-slots={{ default: renderMask }} name={`fade`} appear />;\n  }\n});\n"],"names":["maskColors","maskOpacity","opacityMap","lighter","default","darker","maskProps","show","Boolean","zIndex","Number","String","duration","preventScroll","type","lazyRender","desdroyOnClose","customStyle","Object","color","validator","oneOf","opacity","value","includes","defineComponent","name","props","emits","setup","slots","emit","expose","prefixCls","useGlobalConfig","maskRef","ref","animationEnd","useLazyRender","handleTouchMove","event","preventDefault","handleAnimationend","target","animationName","match","maskBackground","computed","maskColor","renderMask","style","backgroundColor","getPropStyle","isValid","animationDuration","_withDirectives","_createVNode","useShouldRender","_vShow","Transition"],"mappings":"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"}

package/lib/components/Mask/Mask.type.d.ts

@@ -0,0 +1,10 @@
+import type { ExtractPropTypes } from 'vue';
+import type { maskProps } from './Mask';
+export declare type MaskColor = 'black' | 'white';
+export declare type MaskOpacity = 'lighter' | 'default' | 'darker';
+export interface OpacityMap {
+    lighter: number;
+    default: number;
+    darker: number;
+}
+export declare type MaskProps = ExtractPropTypes<typeof maskProps>;

package/lib/components/Mask/Mask.type.js

@@ -0,0 +1,3 @@
+'use strict';
+
+//# sourceMappingURL=Mask.type.js.map

package/lib/components/Mask/Mask.type.js.map

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

package/lib/components/Mask/index.d.ts

@@ -0,0 +1,153 @@
+import Mask from './Mask';
+export declare const UMask: {
+    new (...args: any[]): import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
+        show: BooleanConstructor;
+        zIndex: (StringConstructor | NumberConstructor)[];
+        duration: (StringConstructor | NumberConstructor)[];
+        preventScroll: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        lazyRender: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        desdroyOnClose: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        customStyle: import("vue").PropType<import("vue").CSSProperties>;
+        color: {
+            type: import("vue").PropType<import("./Mask.type").MaskColor>;
+            default: string;
+            validator: (val: "black" | "white") => boolean;
+        };
+        opacity: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: string;
+            validator: (value: any) => boolean;
+        };
+    }>> & {
+        "onAfter-show-mask-change"?: (...args: any[]) => any;
+    }, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "after-show-mask-change"[], import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
+        show: BooleanConstructor;
+        zIndex: (StringConstructor | NumberConstructor)[];
+        duration: (StringConstructor | NumberConstructor)[];
+        preventScroll: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        lazyRender: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        desdroyOnClose: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        customStyle: import("vue").PropType<import("vue").CSSProperties>;
+        color: {
+            type: import("vue").PropType<import("./Mask.type").MaskColor>;
+            default: string;
+            validator: (val: "black" | "white") => boolean;
+        };
+        opacity: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: string;
+            validator: (value: any) => boolean;
+        };
+    }>> & {
+        "onAfter-show-mask-change"?: (...args: any[]) => any;
+    }, {
+        color: import("./Mask.type").MaskColor;
+        show: boolean;
+        lazyRender: boolean;
+        preventScroll: boolean;
+        desdroyOnClose: boolean;
+        opacity: string | number;
+    }, true, {}, {}, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("vue").ExtractPropTypes<{
+        show: BooleanConstructor;
+        zIndex: (StringConstructor | NumberConstructor)[];
+        duration: (StringConstructor | NumberConstructor)[];
+        preventScroll: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        lazyRender: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        desdroyOnClose: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        customStyle: import("vue").PropType<import("vue").CSSProperties>;
+        color: {
+            type: import("vue").PropType<import("./Mask.type").MaskColor>;
+            default: string;
+            validator: (val: "black" | "white") => boolean;
+        };
+        opacity: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: string;
+            validator: (value: any) => boolean;
+        };
+    }>> & {
+        "onAfter-show-mask-change"?: (...args: any[]) => any;
+    }, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, {
+        color: import("./Mask.type").MaskColor;
+        show: boolean;
+        lazyRender: boolean;
+        preventScroll: boolean;
+        desdroyOnClose: boolean;
+        opacity: string | number;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    show: BooleanConstructor;
+    zIndex: (StringConstructor | NumberConstructor)[];
+    duration: (StringConstructor | NumberConstructor)[];
+    preventScroll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    desdroyOnClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    customStyle: import("vue").PropType<import("vue").CSSProperties>;
+    color: {
+        type: import("vue").PropType<import("./Mask.type").MaskColor>;
+        default: string;
+        validator: (val: "black" | "white") => boolean;
+    };
+    opacity: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+        validator: (value: any) => boolean;
+    };
+}>> & {
+    "onAfter-show-mask-change"?: (...args: any[]) => any;
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "after-show-mask-change"[], "after-show-mask-change", {
+    color: import("./Mask.type").MaskColor;
+    show: boolean;
+    lazyRender: boolean;
+    preventScroll: boolean;
+    desdroyOnClose: boolean;
+    opacity: string | number;
+}, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]> & Record<string, any>;
+export default Mask;
+export * from './Mask.type';

package/lib/components/Mask/index.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var install = require('../../utils/install.js');
+var Mask = require('./Mask.js');
+require('./Mask.type.js');
+
+const UMask = install.withInstall(Mask["default"]);
+
+exports["default"] = Mask["default"];
+exports.UMask = UMask;
+//# sourceMappingURL=index.js.map

package/lib/components/Mask/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/Mask/index.ts"],"sourcesContent":["import { withInstall } from '../../utils/install';\nimport Mask from './Mask';\n\nexport const UMask = withInstall(Mask);\nexport default Mask;\n\nexport * from './Mask.type';\n"],"names":["withInstall","Mask"],"mappings":";;;;;;;;MAGa,QAAQA,oBAAYC,eAAI;;;;;"}