vue-devui 1.5.12 → 1.5.13

package/date-picker-pro/index.es.js

@@ -33,10 +33,10 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { defineComponent, watch, provide, reactive, toRefs, createVNode, onUnmounted, Transition, mergeProps, ref, unref, nextTick, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, Teleport, createTextVNode, onBeforeUnmount, shallowRef, resolveDynamicComponent, getCurrentInstance, onBeforeMount, isVNode, onUpdated, toRaw, watchEffect, render, resolveComponent, vShow, toRef, renderSlot, useSlots } from "vue";
+import { defineComponent, watch, provide, reactive, toRefs, createVNode, onUnmounted, Transition, mergeProps, ref, unref, nextTick, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, Teleport, createTextVNode, onBeforeUnmount, shallowRef, resolveDynamicComponent, getCurrentInstance, resolveDirective, onBeforeMount, isVNode, onUpdated, toRaw, watchEffect, render, resolveComponent, vShow, toRef, renderSlot, useSlots } from "vue";
 import { onClickOutside } from "@vueuse/core";
-import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 import "clipboard";
+import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 const datePickerProCommonProps = {
   format: {
     type: String
@@ -393,9 +393,37 @@ const formProps = {
   hideRequiredMark: {
     type: Boolean,
     default: false
+  },
+  styleType: {
+    type: String,
+    default: "default"
+  },
+  appendToBodyScrollStrategy: {
+    type: String,
+    default: "reposition"
   }
 };
 const FORM_TOKEN = Symbol("dForm");
+const STYLE_TOKEN = Symbol("dForm");
+function lockScroll() {
+  if (document.documentElement.scrollHeight > document.documentElement.clientHeight) {
+    const scrollTop = document.documentElement.scrollTop;
+    const style = document.documentElement.getAttribute("style");
+    document.documentElement.style.position = "fixed";
+    document.documentElement.style.top = `-${scrollTop}px`;
+    document.documentElement.style.width = document.documentElement.style.width || "100%";
+    document.documentElement.style.overflowY = "scroll";
+    return () => {
+      if (style) {
+        document.documentElement.setAttribute("style", style);
+      } else {
+        document.documentElement.removeAttribute("style");
+      }
+      document.documentElement.scrollTop = scrollTop;
+    };
+  }
+  return;
+}
 function createBem$1(namespace, element, modifier) {
   let cls = namespace;
   if (element) {
@@ -419,6 +447,9 @@ function useNamespace$1(block, needDot = false) {
     em
   };
 }
+function isUrl(value) {
+  return /^((http|https):)?\/\//.test(value);
+}
 function useFieldCollection() {
   const itemContexts = [];
   const addItemContext = (field) => {
@@ -5924,6 +5955,7 @@ defineComponent({
       addItemContext,
       removeItemContext
     })));
+    provide(STYLE_TOKEN, props.styleType);
     ctx.expose({
       validate,
       validateFields,
@@ -5965,7 +5997,7 @@ const formItemProps = {
     default: void 0
   },
   helpTips: {
-    type: String,
+    type: [String, Object],
     default: ""
   },
   feedbackStatus: {
@@ -5978,12 +6010,6 @@ const formItemProps = {
 };
 const FORM_ITEM_TOKEN = Symbol("dFormItem");
 const LABEL_DATA = Symbol("labelData");
-const formLabelProps = {
-  helpTips: {
-    type: String,
-    default: ""
-  }
-};
 const fixedOverlayProps = {
   modelValue: {
     type: Boolean,
@@ -5998,25 +6024,6 @@ const fixedOverlayProps = {
     default: true
   }
 };
-function lockScroll() {
-  if (document.documentElement.scrollHeight > document.documentElement.clientHeight) {
-    const scrollTop = document.documentElement.scrollTop;
-    const style = document.documentElement.getAttribute("style");
-    document.documentElement.style.position = "fixed";
-    document.documentElement.style.top = `-${scrollTop}px`;
-    document.documentElement.style.width = document.documentElement.style.width || "100%";
-    document.documentElement.style.overflowY = "scroll";
-    return () => {
-      if (style) {
-        document.documentElement.setAttribute("style", style);
-      } else {
-        document.documentElement.removeAttribute("style");
-      }
-      document.documentElement.scrollTop = scrollTop;
-    };
-  }
-  return;
-}
 function useFixedOverlay(props, ctx) {
   let lockScrollCb;
   const onClick = (event) => {
@@ -6039,6 +6046,29 @@ function useFixedOverlay(props, ctx) {
   onUnmounted(removeBodyAdditions);
   return { onClick };
 }
+function createBem(namespace, element, modifier) {
+  let cls = namespace;
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+}
+function useNamespace(block, needDot = false) {
+  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
+  const b = () => createBem(namespace);
+  const e = (element) => element ? createBem(namespace, element) : "";
+  const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
+  const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
+  return {
+    b,
+    e,
+    m,
+    em
+  };
+}
 var fixedOverlay = "";
 defineComponent({
   name: "DFixedOverlay",
@@ -6049,7 +6079,7 @@ defineComponent({
     const {
       modelValue
     } = toRefs(props);
-    const ns2 = useNamespace$1("fixed-overlay");
+    const ns2 = useNamespace("fixed-overlay");
     const {
       onClick
     } = useFixedOverlay(props, ctx);
@@ -6215,7 +6245,7 @@ const FlexibleOverlay = defineComponent({
     emit,
     expose
   }) {
-    const ns2 = useNamespace$1("flexible-overlay");
+    const ns2 = useNamespace("flexible-overlay");
     const {
       clickEventBubble
     } = toRefs(props);
@@ -6244,7 +6274,7 @@ const FlexibleOverlay = defineComponent({
 });
 const POPPER_TRIGGER_TOKEN = Symbol("popper-trigger");
 const isObject = (val) => val !== null && typeof val === "object";
-const ns$1 = useNamespace$1("popper-trigger");
+const ns$1 = useNamespace("popper-trigger");
 function wrapContent(content) {
   return h("span", { class: ns$1.b() }, content);
 }
@@ -6431,7 +6461,7 @@ function usePopoverEvent(props, visible, origin) {
   });
   return { placement, handlePositionChange, onMouseenter, onMouseleave };
 }
-const ns = useNamespace$1("popover");
+const ns = useNamespace("popover");
 function SuccessIcon$1() {
   return createVNode("svg", {
     "class": [ns.e("icon"), ns.em("icon", "success")],
@@ -6533,7 +6563,7 @@ var PopoverIcon = defineComponent({
     }
   },
   setup(props) {
-    const ns2 = useNamespace$1("popover");
+    const ns2 = useNamespace("popover");
     return () => props.type && props.type !== "default" && createVNode("span", {
       "class": ns2.e("icon-wrap")
     }, [props.type === "success" && createVNode(SuccessIcon$1, null, null), props.type === "warning" && createVNode(WarningIcon, null, null), props.type === "info" && createVNode(InfoIcon, null, null), props.type === "error" && createVNode(ErrorIcon$1, null, null)]);
@@ -6570,7 +6600,7 @@ var Popover = defineComponent({
     const {
       overlayStyles
     } = usePopover(props, visible, placement, origin, popoverRef);
-    const ns2 = useNamespace$1("popover");
+    const ns2 = useNamespace("popover");
     provide(POPPER_TRIGGER_TOKEN, origin);
     watch(visible, (newVal) => {
       if (newVal) {
@@ -6704,6 +6734,12 @@ function useFormLabel() {
   const formItemContext = inject(FORM_ITEM_TOKEN);
   const labelData = inject(LABEL_DATA);
   const ns2 = useNamespace$1("form");
+  const defaultTipsPopover = {
+    content: "",
+    position: ["top"],
+    trigger: "hover",
+    popType: "info"
+  };
   const labelClasses = computed(() => ({
     [`${ns2.e("label")}`]: true,
     [`${ns2.em("label", "vertical")}`]: labelData.value.layout === "vertical",
@@ -6715,17 +6751,24 @@ function useFormLabel() {
     [`${ns2.em("label", "required")}`]: formItemContext.isRequired,
     [`${ns2.em("label", "required-hide")}`]: formItemContext.isRequired && formContext.hideRequiredMark
   }));
-  return { labelClasses, labelInnerClasses };
+  const tipsPopover = computed(() => {
+    if (typeof labelData.value.helpTips === "string") {
+      return __spreadProps(__spreadValues({}, defaultTipsPopover), { content: labelData.value.helpTips });
+    } else {
+      return __spreadValues(__spreadValues({}, defaultTipsPopover), labelData.value.helpTips);
+    }
+  });
+  return { labelClasses, labelInnerClasses, tipsPopover };
 }
 var formLabel = "";
 var FormLabel = defineComponent({
   name: "DFormLabel",
-  props: formLabelProps,
-  setup(props, ctx) {
+  setup(_, ctx) {
     const ns2 = useNamespace$1("form");
     const {
       labelClasses,
-      labelInnerClasses
+      labelInnerClasses,
+      tipsPopover
     } = useFormLabel();
     return () => {
       var _a, _b;
@@ -6733,12 +6776,9 @@ var FormLabel = defineComponent({
         "class": labelClasses.value
       }, [createVNode("span", {
         "class": labelInnerClasses.value
-      }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]), props.helpTips && createVNode(Popover, {
-        "content": props.helpTips,
-        "position": ["top"],
-        "trigger": "hover",
-        "pop-type": "info"
-      }, {
+      }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]), tipsPopover.value.content && createVNode(Popover, mergeProps({
+        "class": ns2.e("label-tips-popover")
+      }, tipsPopover.value), {
         default: () => [createVNode(HelpTipsIcon, {
           "class": ns2.e("label-help")
         }, null), createTextVNode(",")]
@@ -6769,7 +6809,7 @@ function useFormControl(props) {
     [ns2.em("control-container", "has-feedback")]: Boolean(feedbackStatus == null ? void 0 : feedbackStatus.value),
     [ns2.em("control-container", "feedback-error")]: Boolean((feedbackStatus == null ? void 0 : feedbackStatus.value) === "error")
   }));
-  return { controlClasses, controlContainerClasses };
+  return { controlClasses, controlContainerClasses, labelData };
 }
 function useFormControlValidate() {
   const formItemContext = inject(FORM_ITEM_TOKEN);
@@ -6786,11 +6826,15 @@ var FormControl = defineComponent({
   name: "DFormControl",
   props: formControlProps,
   setup(props, ctx) {
+    const formContext = inject(FORM_TOKEN);
     const formControl2 = ref();
+    const popoverRef = ref();
     const ns2 = useNamespace$1("form");
+    const showPopoverClick = ref(true);
     const {
       controlClasses,
-      controlContainerClasses
+      controlContainerClasses,
+      labelData
     } = useFormControl(props);
     const {
       feedbackStatus,
@@ -6800,17 +6844,52 @@ var FormControl = defineComponent({
       errorMessage,
       popPosition
     } = useFormControlValidate();
+    const align = computed(() => {
+      var _a, _b;
+      if ((_a = popPosition.value) == null ? void 0 : _a.some((item) => item.includes("start"))) {
+        return "start";
+      }
+      if ((_b = popPosition.value) == null ? void 0 : _b.some((item) => item.includes("end"))) {
+        return "end";
+      }
+      return void 0;
+    });
+    const onDocumentClick = (e) => {
+      const composedPath = e.composedPath();
+      if (composedPath.includes(popoverRef.value.triggerEl)) {
+        showPopoverClick.value = true;
+      } else {
+        showPopoverClick.value = false;
+      }
+    };
+    watch(showPopover, (val) => {
+      if (val) {
+        setTimeout(() => {
+          document.addEventListener("click", onDocumentClick);
+        });
+      } else {
+        showPopoverClick.value = true;
+        document.removeEventListener("click", onDocumentClick);
+      }
+    });
+    onUnmounted(() => {
+      document.removeEventListener("click", onDocumentClick);
+    });
     return () => createVNode("div", {
       "class": controlClasses.value,
       "ref": formControl2
     }, [createVNode("div", {
       "class": controlContainerClasses.value
     }, [createVNode(Popover, {
-      "is-open": showPopover.value,
+      "ref": popoverRef,
+      "is-open": showPopover.value && showPopoverClick.value,
       "trigger": "manually",
       "content": errorMessage.value,
       "pop-type": "error",
-      "position": popPosition.value
+      "position": popPosition.value,
+      "align": align.value,
+      "scroll-element": "auto",
+      "append-to-body-scroll-strategy": formContext.appendToBodyScrollStrategy
     }, {
       default: () => {
         var _a, _b;
@@ -6822,7 +6901,7 @@ var FormControl = defineComponent({
       "class": ns2.e("control-info")
     }, [showMessage.value && createVNode("div", {
       "class": "error-message"
-    }, [errorMessage.value]), props.extraInfo && createVNode("div", {
+    }, [errorMessage.value]), labelData.value.formItemCtx.slots.extraInfo ? labelData.value.formItemCtx.slots.extraInfo() : props.extraInfo && createVNode("div", {
       "class": ns2.e("control-extra")
     }, [props.extraInfo])])]);
   }
@@ -8005,7 +8084,9 @@ defineComponent({
     const labelData = computed(() => ({
       layout: formContext.layout,
       labelSize: formContext.labelSize,
-      labelAlign: formContext.labelAlign
+      labelAlign: formContext.labelAlign,
+      helpTips: helpTips.value,
+      formItemCtx: ctx
     }));
     provide(LABEL_DATA, labelData);
     const context = reactive(__spreadProps(__spreadValues({}, otherProps), {
@@ -8021,6 +8102,7 @@ defineComponent({
     }));
     provide(FORM_ITEM_TOKEN, context);
     ctx.expose({
+      validate,
       resetField,
       clearValidate
     });
@@ -8034,9 +8116,7 @@ defineComponent({
     });
     return () => createVNode("div", {
       "class": itemClasses.value
-    }, [createVNode(FormLabel, {
-      "help-tips": helpTips.value
-    }, {
+    }, [createVNode(FormLabel, null, {
       default: () => [ctx.slots.label ? ctx.slots.label() : label == null ? void 0 : label.value]
     }), createVNode(FormControl, {
       "feedback-status": feedbackStatus == null ? void 0 : feedbackStatus.value,
@@ -8222,7 +8302,7 @@ var svgIcon = defineComponent({
       color,
       size
     } = toRefs(props);
-    const ns2 = useNamespace$1("svg-icon");
+    const ns2 = useNamespace("svg-icon");
     const iconName = computed(() => `#icon-${name.value}`);
     const iconSize = computed(() => {
       return typeof size.value === "number" ? `${size.value}px` : size.value;
@@ -8242,9 +8322,6 @@ var svgIcon = defineComponent({
     };
   }
 });
-function isUrl(value) {
-  return /^((http|https):)?\/\//.test(value);
-}
 function useIconDom(props, ctx) {
   const {
     component,
@@ -8254,7 +8331,7 @@ function useIconDom(props, ctx) {
     classPrefix,
     rotate
   } = toRefs(props);
-  const ns2 = useNamespace$1("icon");
+  const ns2 = useNamespace("icon");
   const iconSize = computed(() => {
     return typeof size.value === "number" ? `${size.value}px` : size.value;
   });
@@ -8312,7 +8389,7 @@ var Icon = defineComponent({
     const {
       iconDom
     } = useIconDom(props, ctx);
-    const ns2 = useNamespace$1("icon");
+    const ns2 = useNamespace("icon");
     const wrapClassed = computed(() => ({
       [ns2.e("container")]: true,
       [ns2.m("disabled")]: disabled.value,
@@ -8334,6 +8411,13 @@ var Icon = defineComponent({
     };
   }
 });
+var AutoFocus = {
+  mounted: (el, binding) => {
+    if (binding.value) {
+      el.focus();
+    }
+  }
+};
 const inputProps = {
   modelValue: {
     type: String,
@@ -8373,6 +8457,14 @@ const inputProps = {
   placeholder: {
     type: String,
     default: ""
+  },
+  title: {
+    type: String,
+    default: ""
+  },
+  autofocus: {
+    type: Boolean,
+    default: false
   }
 };
 function useInputRender(props, ctx) {
@@ -8386,6 +8478,7 @@ function useInputRender(props, ctx) {
   const slots = ctx.slots;
   const inputDisabled = computed(() => disabled.value || (formContext == null ? void 0 : formContext.disabled));
   const inputSize = computed(() => (size == null ? void 0 : size.value) || (formContext == null ? void 0 : formContext.size) || "");
+  const styleType = inject(STYLE_TOKEN, void 0);
   const _a = ctx.attrs, { style, class: customClass } = _a, otherAttrs = __objRest(_a, ["style", "class"]);
   const customStyle = { style };
   const wrapClasses = computed(() => ({
@@ -8401,7 +8494,8 @@ function useInputRender(props, ctx) {
       [ns2.m(inputSize.value)]: Boolean(inputSize.value),
       [slotNs.b()]: slots.prepend || slots.append,
       [ns2.m("append")]: slots.append,
-      [ns2.m("prepend")]: slots.prepend
+      [ns2.m("prepend")]: slots.prepend,
+      [ns2.m("gray-style")]: styleType === "gray"
     },
     customClass
   ]);
@@ -8409,6 +8503,7 @@ function useInputRender(props, ctx) {
 }
 function useInputEvent(isFocus, props, ctx, focus) {
   const formItemContext = inject(FORM_ITEM_TOKEN, void 0);
+  const isComposition = ref(false);
   const onFocus = (e) => {
     isFocus.value = true;
     ctx.emit("focus", e);
@@ -8422,6 +8517,9 @@ function useInputEvent(isFocus, props, ctx, focus) {
   };
   const onInput = (e) => {
     ctx.emit("input", e.target.value);
+    if (isComposition.value) {
+      return;
+    }
     ctx.emit("update:modelValue", e.target.value);
   };
   const onChange = (e) => {
@@ -8435,7 +8533,22 @@ function useInputEvent(isFocus, props, ctx, focus) {
     ctx.emit("clear");
     focus();
   };
-  return { onFocus, onBlur, onInput, onChange, onKeydown, onClear };
+  const onCompositionStart = () => {
+    isComposition.value = true;
+  };
+  const onCompositionUpdate = (e) => {
+    var _a;
+    const text = (_a = e.target) == null ? void 0 : _a.value;
+    const lastCharacter = text[text.length - 1] || "";
+    isComposition.value = !/([(\uAC00-\uD7AF)|(\u3130-\u318F)])+/gi.test(lastCharacter);
+  };
+  const onCompositionEnd = (e) => {
+    if (isComposition.value) {
+      isComposition.value = false;
+      onInput(e);
+    }
+  };
+  return { onFocus, onBlur, onInput, onChange, onKeydown, onClear, onCompositionStart, onCompositionUpdate, onCompositionEnd };
 }
 function useInputFunction(input2) {
   const refInput = computed(() => input2.value);
@@ -8625,6 +8738,9 @@ function createI18nTranslate(name, app, newPrefix) {
 }
 var Input = defineComponent({
   name: "DInput",
+  directives: {
+    dAutoFocus: AutoFocus
+  },
   inheritAttrs: false,
   props: inputProps,
   emits: ["update:modelValue", "focus", "blur", "input", "change", "keydown", "clear"],
@@ -8633,7 +8749,10 @@ var Input = defineComponent({
     const t = createI18nTranslate("DInput", app);
     const formItemContext = inject(FORM_ITEM_TOKEN, void 0);
     const {
-      modelValue
+      modelValue,
+      placeholder,
+      title,
+      autofocus
     } = toRefs(props);
     const ns2 = useNamespace$1("input");
     const slotNs = useNamespace$1("input-slot");
@@ -8658,7 +8777,10 @@ var Input = defineComponent({
       onInput,
       onChange,
       onKeydown,
-      onClear
+      onClear,
+      onCompositionStart,
+      onCompositionUpdate,
+      onCompositionEnd
     } = useInputEvent(isFocus, props, ctx, focus);
     const passwordVisible = ref(false);
     const clickPasswordIcon = () => {
@@ -8683,7 +8805,7 @@ var Input = defineComponent({
       blur
     });
     return () => {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
+      var _a, _b, _c, _d, _e, _f, _g, _h, _i;
       return createVNode("div", mergeProps({
         "class": inputClasses.value
       }, customStyle), [ctx.slots.prepend && createVNode("div", {
@@ -8695,25 +8817,29 @@ var Input = defineComponent({
       }, [ctx.slots.prefix && ((_d = (_c = ctx.slots).prefix) == null ? void 0 : _d.call(_c)), props.prefix && createVNode(Icon, {
         "size": inputSize.value,
         "name": props.prefix
-      }, null)]), createVNode("input", mergeProps({
+      }, null)]), withDirectives(createVNode("input", mergeProps({
         "ref": input2,
         "value": modelValue.value,
         "disabled": inputDisabled.value,
         "class": ns2.e("inner"),
-        "placeholder": props.placeholder || t("placeholder")
+        "placeholder": (_e = placeholder.value) != null ? _e : t("placeholder")
       }, otherAttrs, {
+        "title": title.value,
         "type": props.showPassword ? passwordVisible.value ? "text" : "password" : "text",
         "onInput": onInput,
         "onFocus": onFocus,
         "onBlur": onBlur,
         "onChange": onChange,
-        "onKeydown": onKeydown
-      }), null), suffixVisible && createVNode("span", {
+        "onKeydown": onKeydown,
+        "onCompositionstart": onCompositionStart,
+        "onCompositionupdate": onCompositionUpdate,
+        "onCompositionend": onCompositionEnd
+      }), null), [[resolveDirective("dAutoFocus"), autofocus.value]]), suffixVisible && createVNode("span", {
         "class": slotNs.e("suffix")
       }, [props.suffix && createVNode(Icon, {
         "size": inputSize.value,
         "name": props.suffix
-      }, null), ctx.slots.suffix && ((_f = (_e = ctx.slots).suffix) == null ? void 0 : _f.call(_e)), showPwdVisible.value && createVNode(Icon, {
+      }, null), ctx.slots.suffix && ((_g = (_f = ctx.slots).suffix) == null ? void 0 : _g.call(_f)), showPwdVisible.value && createVNode(Icon, {
         "size": inputSize.value,
         "class": ns2.em("password", "icon"),
         "name": passwordVisible.value ? "preview" : "preview-forbidden",
@@ -8721,11 +8847,12 @@ var Input = defineComponent({
       }, null), showClearable.value && createVNode(Icon, {
         "size": inputSize.value,
         "class": ns2.em("clear", "icon"),
-        "name": "close",
+        "name": "error-o",
+        "color": "#adb0b8",
         "onClick": onClear
       }, null)])]), ctx.slots.append && createVNode("div", {
         "class": slotNs.e("append")
-      }, [(_h = (_g = ctx.slots).append) == null ? void 0 : _h.call(_g)])]);
+      }, [(_i = (_h = ctx.slots).append) == null ? void 0 : _i.call(_h)])]);
     };
   }
 });
@@ -10058,7 +10185,7 @@ var CalendarPanel = defineComponent({
   setup(props, ctx) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DDatePickerPro", app);
-    const ns2 = useNamespace$1("date-picker-pro");
+    const ns2 = useNamespace("date-picker-pro");
     const {
       yearScrollRef,
       monthScrollRef,
@@ -10502,35 +10629,12 @@ function useTimeScroll() {
     getScrollWidth
   };
 }
-function createBem(namespace, element, modifier) {
-  let cls = namespace;
-  if (element) {
-    cls += `__${element}`;
-  }
-  if (modifier) {
-    cls += `--${modifier}`;
-  }
-  return cls;
-}
-function useNamespace(block, needDot = false) {
-  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
-  const b = () => createBem(namespace);
-  const e = (element) => element ? createBem(namespace, element) : "";
-  const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
-  const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
-  return {
-    b,
-    e,
-    m,
-    em
-  };
-}
 var index$2 = "";
 var TimeScroll = defineComponent({
   name: "DTimeScroll",
   props: timePickerProps,
   setup(props, ctx) {
-    const ns2 = useNamespace("scroll-box");
+    const ns2 = useNamespace$1("scroll-box");
     const {
       scrollBoxDom,
       scrollThumbDom,
@@ -10594,7 +10698,7 @@ var DTimeList = defineComponent({
   props: popupLineProps,
   emits: ["change"],
   setup(props, ctx) {
-    const ns2 = useNamespace("popup-line");
+    const ns2 = useNamespace$1("popup-line");
     const timeListDom = ref();
     const {
       getNewTime,
@@ -10707,7 +10811,7 @@ var TimerPickerPanel = defineComponent({
   setup(props, ctx) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DDatePickerPro", app);
-    const ns2 = useNamespace$1("date-picker-pro");
+    const ns2 = useNamespace("date-picker-pro");
     const {
       timeListDom,
       hourList,
@@ -10739,7 +10843,7 @@ var iconGroup = "";
 defineComponent({
   name: "DIconGroup",
   setup(_, ctx) {
-    const ns2 = useNamespace$1("icon-group");
+    const ns2 = useNamespace("icon-group");
     return () => {
       var _a, _b;
       return createVNode("div", {
@@ -10816,7 +10920,7 @@ var Loading = defineComponent({
       message,
       $slots
     } = this;
-    const ns2 = useNamespace$1("loading");
+    const ns2 = useNamespace("loading");
     return isShow && createVNode("div", {
       "class": [ns2.b(), isFull ? ns2.m("full") : ""]
     }, [((_a = $slots.default) == null ? void 0 : _a.call($slots)) || createVNode("div", {
@@ -10989,7 +11093,7 @@ const buttonGroupProps = {
 };
 const buttonGroupInjectionKey = Symbol("d-button-group");
 function useButton(props, ctx) {
-  const ns2 = useNamespace$1("button");
+  const ns2 = useNamespace("button");
   const hasContent = computed(() => ctx.slots.default);
   const colorMap = {
     solid: "primary",
@@ -11078,7 +11182,7 @@ defineComponent({
   setup(props, {
     slots
   }) {
-    const ns2 = useNamespace$1("button-group");
+    const ns2 = useNamespace("button-group");
     provide(buttonGroupInjectionKey, {
       size: toRef(props, "size")
     });
@@ -11090,7 +11194,7 @@ defineComponent({
   }
 });
 function useYearCalendarPanel(props, ctx) {
-  const ns2 = useNamespace$1("date-picker-pro");
+  const ns2 = useNamespace("date-picker-pro");
   const yarListScrollRef = ref();
   const yearList = ref([]);
   const { today, calendarRange, selectDate, rangeSelectDate, minDate, maxDate, fixRangeDate, getToDate, emitSelectedDate } = useCalendarSelected(props, ctx);
@@ -11217,7 +11321,7 @@ var YearCalendarPanel = defineComponent({
   props: datePickerProPanelProps,
   emits: ["selectedDate", "changeRangeFocusType"],
   setup(props, ctx) {
-    const ns2 = useNamespace$1("date-picker-pro");
+    const ns2 = useNamespace("date-picker-pro");
     const {
       yarListScrollRef,
       yearList,
@@ -11253,7 +11357,7 @@ var YearCalendarPanel = defineComponent({
   }
 });
 function useMonthCalendarPanel(props, ctx) {
-  const ns2 = useNamespace$1("date-picker-pro");
+  const ns2 = useNamespace("date-picker-pro");
   const yearScrollRef = ref();
   const monthScrollRef = ref();
   const yearList = ref([]);
@@ -11442,7 +11546,7 @@ var MonthCalendarPanel = defineComponent({
   setup(props, ctx) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DDatePickerPro", app);
-    const ns2 = useNamespace$1("date-picker-pro");
+    const ns2 = useNamespace("date-picker-pro");
     const {
       yearScrollRef,
       monthScrollRef,
@@ -11656,7 +11760,7 @@ var DatePickerProPanel = defineComponent({
   setup(props, ctx) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DDatePickerPro", app);
-    const ns2 = useNamespace$1("date-picker-pro");
+    const ns2 = useNamespace("date-picker-pro");
     const {
       calendarPanelRef,
       timeData,
@@ -11766,7 +11870,7 @@ var DatePickerPro = defineComponent({
   setup(props, ctx) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DDatePickerPro", app);
-    const ns2 = useNamespace$1("date-picker-pro");
+    const ns2 = useNamespace("date-picker-pro");
     const {
       originRef,
       inputRef,
@@ -11992,7 +12096,7 @@ var DRangeDatePickerPro = defineComponent({
   setup(props, ctx) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DDatePickerPro", app);
-    const ns2 = useNamespace$1("range-date-picker-pro");
+    const ns2 = useNamespace("range-date-picker-pro");
     const {
       originRef,
       startInputRef,