qidian-vue-ui 1.2.124 → 1.3.0

package/dist/components/codemirror/index.vue.d.ts

@@ -48,7 +48,7 @@ declare const _default: import("vue").DefineComponent<QdCodemirrorProps, {
     $root: import("vue").ComponentPublicInstance | null;
     $parent: import("vue").ComponentPublicInstance | null;
     $host: Element | null;
-    $emit: ((event: "blur", viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "change", value: string, viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "update:modelValue", value: string, viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "focus", viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "ready", payload: {
+    $emit: ((event: "blur", viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "change", value: string, viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "focus", viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "update:modelValue", value: string, viewUpdate: import("@codemirror/view").ViewUpdate) => void) & ((event: "ready", payload: {
         view: import("@codemirror/view").EditorView;
         state: import("@codemirror/state").EditorState;
         container: HTMLDivElement;

package/dist/components/config-provider/index.d.ts

@@ -95,7 +95,7 @@ export declare const QdConfigProvider: import("vue").DefineComponent<{
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {
@@ -223,7 +223,7 @@ export declare const QdConfigProvider: import("vue").DefineComponent<{
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {
@@ -336,7 +336,7 @@ export declare const QdConfigProvider: import("vue").DefineComponent<{
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {
@@ -377,6 +377,7 @@ export declare const QdConfigProvider: import("vue").DefineComponent<{
     tinymce: Pick<import("../tinymce").QdTinymceProps, "name" | "action" | "headers" | "method" | "formatResponse" | "bucketConfigKey" | "skinUrl" | "skinDarkUrl" | "localeUrl" | "contentCss" | "emoticonsUrl" | "externalPlugins"> | undefined;
     dict: import("../..").QdDictBaseOptions<import("../..").QdDictItem, unknown, string, string> | undefined;
     avatar: import("../..").QdAvatarBaseOptions | undefined;
+    locale: string | undefined;
     user: import("./types").QdUser | undefined;
     org: {
         search?: Pick<import("..").QdOrgSelectProps, "service" | "transformParams" | "transformRes">;
@@ -384,7 +385,6 @@ export declare const QdConfigProvider: import("vue").DefineComponent<{
         listOrgByIds?: import("..").QdOrgListByIdsOptions;
     } | undefined;
     agentChat: Pick<import("../..").UseAgentChatOptions, "getSessionId" | "getUrl"> | undefined;
-    locale: string | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export type { QdConfigProviderProps } from './types';
 export { useConfig as useQdConfig } from './useConfig';

package/dist/components/config-provider/types.d.ts

@@ -110,7 +110,7 @@ export interface QdConfigProviderProps {
         table?: NonNullable<TdConfigProviderProps['globalConfig']>['table'] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<TdConfigProviderProps['globalConfig']>['dialog'] & {
+        wrapper?: {
             attach?: QdDialogProps['attach'];
         };
         columnsController?: {

package/dist/components/config-provider/useConfig.d.ts

@@ -83,7 +83,7 @@ export declare function useConfig<T extends keyof NonNullable<QdConfigProviderPr
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {
@@ -194,7 +194,7 @@ export declare function useConfig<T extends keyof NonNullable<QdConfigProviderPr
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {
@@ -305,7 +305,7 @@ export declare function useConfig<T extends keyof NonNullable<QdConfigProviderPr
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {
@@ -417,7 +417,7 @@ export declare function useConfig<T extends keyof NonNullable<QdConfigProviderPr
         table?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["table"] & {
             bordered?: boolean;
         };
-        dialog?: NonNullable<import("tdesign-vue-next").TdConfigProviderProps["globalConfig"]>["dialog"] & {
+        wrapper?: {
             attach?: import("..").QdDialogProps["attach"];
         };
         columnsController?: {

package/dist/components/crud/tabs-table/index.vue.d.ts

@@ -50,7 +50,6 @@ declare const _default: <D extends TableRowData = TableRowData, R = unknown, P =
                     delCheckChildren?: boolean | ((context: import("../../service/table/types").QdServiceTableDeleteCheckContext<D>) => import("../../service/table/types").QdServiceTableDeleteCheckResult | Promise<import("../../service/table/types").QdServiceTableDeleteCheckResult>) | undefined;
                 }) | undefined;
                 loading?: (boolean | import("tdesign-vue-next").TNode) | undefined;
-                attach?: import("tdesign-vue-next").AttachNode | undefined;
                 expandIcon?: boolean | ((h: typeof import("vue").h, props: import("tdesign-vue-next").ExpandArrowRenderParams<D>) => import("tdesign-vue-next").TNodeReturnValue) | undefined;
                 filterIcon?: ((h: typeof import("vue").h, props: {
                     col: import("tdesign-vue-next").PrimaryTableCol<D>;
@@ -76,6 +75,8 @@ declare const _default: <D extends TableRowData = TableRowData, R = unknown, P =
                 onValidate?: ((context: import("tdesign-vue-next").PrimaryTableValidateContext) => void) | undefined;
                 loadingProps?: Partial<import("tdesign-vue-next").LoadingProps> | undefined;
                 scroll?: import("tdesign-vue-next").TScroll | undefined;
+                attach?: import("tdesign-vue-next").AttachNode | undefined;
+                locale?: import("tdesign-vue-next").TableConfig | undefined;
                 hover?: boolean | undefined;
                 onBefore?: (() => void) | undefined;
                 onAfter?: (() => void) | undefined;
@@ -83,7 +84,6 @@ declare const _default: <D extends TableRowData = TableRowData, R = unknown, P =
                 manual?: boolean | undefined;
                 height?: string | number | undefined;
                 resizable?: boolean | undefined;
-                locale?: import("tdesign-vue-next").TableConfig | undefined;
                 onSelectChange?: ((selectedRowKeys: Array<string | number>, options: import("tdesign-vue-next").SelectOptions<D>) => void) | undefined;
                 maxHeight?: string | number | undefined;
                 onScrollY?: ((params: {

package/dist/components/dialog/index.css

@@ -103,6 +103,6 @@
 .qd-dialog--deactivated-hidden {
   display: none;
 }
-.qd-dialog--transparent-overlay .t-dialog__mask {
+.qd-dialog.qd-overlay--transparent .t-dialog__mask {
   opacity: 0 !important;
 }

package/dist/components/dialog/index.vue.d.ts

@@ -19,19 +19,19 @@ declare const __VLS_component: import("vue").DefineComponent<QdDialogProps, {
 }>, {
     closeOnEscKeydown: boolean;
     closeOnOverlayClick: boolean;
+    theme: "default" | "info" | "warning" | "danger" | "success";
+    footer: boolean | import("tdesign-vue-next").TNode;
+    header: string | boolean | import("tdesign-vue-next").TNode;
     closeBtn: string | boolean | import("tdesign-vue-next").TNode;
     confirmOnEnter: boolean;
     destroyOnClose: boolean;
-    footer: boolean | import("tdesign-vue-next").TNode;
-    header: string | boolean | import("tdesign-vue-next").TNode;
     lazy: boolean;
     preventScrollThrough: boolean;
     showOverlay: boolean;
-    theme: "default" | "info" | "warning" | "danger" | "success";
     width: string | number;
+    hideOnDeactivated: boolean;
     autoHeight: boolean;
     fullscreenBtn: boolean;
-    hideOnDeactivated: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/components/dialog/index.vue.mjs

@@ -1,9 +1,10 @@
 import './index.css'
-import { defineComponent, mergeDefaults, getCurrentInstance, reactive, ref, computed, watch, onActivated, nextTick, onBeforeUnmount, createBlock, openBlock, unref, mergeProps, isRef, createSlots, withCtx, renderSlot, createCommentVNode, Teleport, createElementBlock, resolveDynamicComponent, Fragment, renderList, normalizeProps } from "vue";
+import { defineComponent, mergeDefaults, getCurrentInstance, reactive, ref, computed, watch, onActivated, nextTick, onDeactivated, onBeforeUnmount, createBlock, openBlock, unref, mergeProps, isRef, createSlots, withCtx, renderSlot, createCommentVNode, Teleport, createElementBlock, resolveDynamicComponent, Fragment, renderList, normalizeProps } from "vue";
 import { useDraggable, useVModels } from "../../node_modules/.pnpm/@vueuse_core@14.2.0_vue@3.5.26_typescript@5.9.3_/node_modules/@vueuse/core/dist/index.mjs";
 import { useActivated, domOn, suspectedWrapperPromise, isEmpty, filterSlots } from "qidian-shared";
 import { FullscreenExitIcon, FullscreenIcon } from "tdesign-icons-vue-next";
 import { Dialog, Divider, Button } from "tdesign-vue-next";
+import { OVERLAY_TRANSPARENT_CLASS, OVERLAY_CLOSING_CLASS, updateOverlayMasks, resolveAttachParent, markPreviousOverlaysTransparent, registerOverlayEsc, setOverlayActive, unregisterOverlayEsc, setOverlayEscEnabled, focusTopOverlay } from "../../utils/overlayStack.mjs";
 import { getTransformOffset } from "../../utils/tools.mjs";
 import { useConfig } from "../config-provider/useConfig.mjs";
 import { qdDialogProps } from "./props.mjs";
@@ -71,8 +72,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     let isContainerOutsideController;
     const contentVisible = ref(false);
     const openedTime = ref(0);
-    const { t } = useConfig("dialog");
+    const { t } = useConfig("wrapper");
     const { activated } = useActivated();
+    const escEnabled = computed(
+      () => !confirmLoad.value && !props.confirmLoading && props.closeOnEscKeydown !== false
+    );
     const reProps = computed(() => {
       const {
         visible: inVisible,
@@ -89,6 +93,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ...dialogOptions
       } = props;
       const reConfirmLoading = confirmLoad.value || confirmLoading;
+      const hasMask = dialogOptions.showOverlay !== false && mode !== "normal" && mode !== "modeless";
       return {
         header,
         footerExtend,
@@ -102,7 +107,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           attach: attach ?? t("attach") ?? "body",
           mode: currentMode.value || mode,
           confirmLoading: reConfirmLoading,
-          closeOnEscKeydown: reConfirmLoading ? false : dialogOptions.closeOnEscKeydown,
+          closeOnEscKeydown: hasMask ? false : reConfirmLoading ? false : dialogOptions.closeOnEscKeydown,
           closeOnOverlayClick: reConfirmLoading ? false : dialogOptions.closeOnOverlayClick,
           closeBtn: reConfirmLoading ? false : dialogOptions.closeBtn,
           cancelBtn: reConfirmLoading ? typeof dialogOptions.cancelBtn === "object" ? { ...dialogOptions.cancelBtn, disabled: true } : { disabled: true } : dialogOptions.cancelBtn,
@@ -127,11 +132,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           onClosed: () => {
             if (dialogOptions.destroyOnClose) contentVisible.value = false;
             dialogOptions.onClosed?.();
-            updateMasks({ excludeClassName: uniqueClassName });
             const containerEl = document.querySelector(`.${uniqueClassName}`);
             if (containerEl) {
-              containerEl.classList.remove("qd-dialog--transparent-overlay", "qd-dialog--closing");
+              containerEl.classList.remove(OVERLAY_TRANSPARENT_CLASS, OVERLAY_CLOSING_CLASS);
             }
+            updateOverlayMasks(
+              resolveAttachParent(reProps.value.dialogOptions.attach),
+              uniqueClassName
+            );
           },
           onOpened: () => {
             dialogOptions.onOpened?.();
@@ -197,66 +205,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       () => currentMode.value === "full-screen" || reProps.value.dialogOptions.mode === "full-screen"
     );
     const dragDisabled = computed(() => visible.value ? isFullscreen.value : false);
-    function getAttachParent() {
-      const { attach } = reProps.value.dialogOptions;
-      if (typeof attach === "function") {
-        return attach();
-      } else if (typeof attach === "string") {
-        return document.querySelector(attach) || document.body;
-      } else if (typeof attach === "object" && attach !== null) {
-        return attach;
-      } else {
-        return document.body;
-      }
-    }
-    function updateMasks(options) {
-      const parentNode = getAttachParent();
-      if (!parentNode) return;
-      const qdDialogs = Array.from(parentNode.querySelectorAll(".qd-dialog")).filter((el) => {
-        if (options?.excludeClassName && el.classList.contains(options.excludeClassName)) return false;
-        if (el.classList.contains("qd-dialog--closing") || el.classList.contains("qd-dialog--deactivated-hidden") || getComputedStyle(el).display === "none") {
-          return false;
-        }
-        const wrap = el.querySelector(".t-dialog__wrap");
-        if (wrap && wrap.style.display === "none") return false;
-        const mask = el.querySelector(".t-dialog__mask");
-        if (!mask || mask.style.display === "none") return false;
-        return true;
-      });
-      qdDialogs.sort((a, b) => {
-        const timeA = Number(a.dataset.openedTime || Number.MAX_SAFE_INTEGER);
-        const timeB = Number(b.dataset.openedTime || Number.MAX_SAFE_INTEGER);
-        return timeA - timeB;
-      });
-      qdDialogs.forEach((el) => {
-        el.classList.remove("qd-dialog--transparent-overlay");
-      });
-      if (qdDialogs.length > 0) {
-        for (let i = 0; i < qdDialogs.length - 1; i++) {
-          qdDialogs[i].classList.add("qd-dialog--transparent-overlay");
-        }
-      }
-    }
-    function updatePreviousMasksBeforeOpen() {
-      const { showOverlay, mode } = reProps.value.dialogOptions;
-      const hasMask = showOverlay !== false && mode !== "normal" && mode !== "modeless";
-      if (!hasMask) return;
-      const parentNode = getAttachParent();
-      if (!parentNode) return;
-      const qdDialogs = Array.from(parentNode.querySelectorAll(".qd-dialog")).filter((el) => {
-        if (el.classList.contains(uniqueClassName) || el.classList.contains("qd-dialog--closing") || el.classList.contains("qd-dialog--deactivated-hidden") || getComputedStyle(el).display === "none") {
-          return false;
-        }
-        const wrap = el.querySelector(".t-dialog__wrap");
-        if (wrap && wrap.style.display === "none") return false;
-        const mask = el.querySelector(".t-dialog__mask");
-        if (!mask || mask.style.display === "none") return false;
-        return true;
-      });
-      qdDialogs.forEach((el) => {
-        el.classList.add("qd-dialog--transparent-overlay");
-      });
-    }
     function getDefaultFullscreenBtn(width) {
       if (width === void 0) return true;
       if (typeof width === "number") return width > 500;
@@ -283,23 +231,51 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       visible,
       (val) => {
         const containerEl = document.querySelector(`.${uniqueClassName}`);
+        const { showOverlay, mode, attach } = reProps.value.dialogOptions;
+        const hasMask = showOverlay !== false && mode !== "normal" && mode !== "modeless";
+        const parent = resolveAttachParent(attach);
         if (val) {
           openedTime.value = performance.now();
-          if (containerEl) containerEl.classList.remove("qd-dialog--closing");
-          updatePreviousMasksBeforeOpen();
+          if (containerEl) {
+            containerEl.classList.remove(OVERLAY_CLOSING_CLASS, OVERLAY_TRANSPARENT_CLASS);
+          }
+          if (hasMask) {
+            markPreviousOverlaysTransparent(parent, uniqueClassName);
+            registerOverlayEsc(uniqueClassName, {
+              close: () => {
+                visible.value = false;
+              },
+              closeOnEscKeydown: escEnabled.value
+            });
+            setOverlayActive(uniqueClassName, activated.value);
+          }
         } else {
-          if (containerEl) containerEl.classList.add("qd-dialog--closing");
-          updateMasks({ excludeClassName: uniqueClassName });
+          if (containerEl) containerEl.classList.add(OVERLAY_CLOSING_CLASS);
+          updateOverlayMasks(parent, uniqueClassName);
+          unregisterOverlayEsc(uniqueClassName);
         }
       },
       { flush: "sync" }
     );
+    watch(escEnabled, (val) => {
+      setOverlayEscEnabled(uniqueClassName, val);
+    });
     onActivated(() => {
-      if (visible.value) nextTick(updateMasks);
+      setOverlayActive(uniqueClassName, true);
+      if (!visible.value) return;
+      nextTick(() => {
+        const parent = resolveAttachParent(reProps.value.dialogOptions.attach);
+        updateOverlayMasks(parent);
+        focusTopOverlay(parent);
+      });
+    });
+    onDeactivated(() => {
+      setOverlayActive(uniqueClassName, false);
     });
     onBeforeUnmount(() => {
       isContainerOutsideController?.abort();
-      updateMasks({ excludeClassName: uniqueClassName });
+      unregisterOverlayEsc(uniqueClassName);
+      updateOverlayMasks(resolveAttachParent(reProps.value.dialogOptions.attach), uniqueClassName);
     });
     __expose(expose);
     return (_ctx, _cache) => {
@@ -311,7 +287,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           uniqueClassName,
           (!_ctx.$slots.footer || reProps.value.dialogOptions.footer === false || typeof reProps.value.dialogOptions.footer !== "boolean" && !reProps.value.dialogOptions.footer) && (_ctx.$slots["footer-extend"] || reProps.value.footerExtend || reProps.value.extendBtns?.length) ? "qd-dialog--has-footer-extend" : "",
           reProps.value.autoHeight ? "qd-dialog--auto-height" : "",
-          reProps.value.hideOnDeactivated && !unref(activated) ? "qd-dialog--deactivated-hidden" : ""
+          reProps.value.hideOnDeactivated && !unref(activated) ? "qd-dialog--deactivated-hidden qd-overlay--deactivated" : ""
         ],
         "data-opened-time": openedTime.value || void 0,
         "dialog-style": dialogStyle.value

package/dist/components/drawer/index.css

@@ -0,0 +1,9 @@
+.qd-drawer .t-drawer__mask {
+  transition: opacity 0.2s linear;
+}
+.qd-drawer--deactivated-hidden {
+  display: none;
+}
+.qd-drawer.qd-overlay--transparent .t-drawer__mask {
+  opacity: 0 !important;
+}

package/dist/components/drawer/index.vue.d.ts

@@ -11,17 +11,17 @@ declare const __VLS_component: import("vue").DefineComponent<QdDrawerProps, {
 }, string, import("vue").PublicProps, Readonly<QdDrawerProps> & Readonly<{
     "onUpdate:visible"?: ((args_0: boolean | undefined) => any) | undefined;
 }>, {
+    size: string;
     closeOnEscKeydown: boolean;
     closeOnOverlayClick: boolean;
-    attach: import("tdesign-vue-next").AttachNode;
-    closeBtn: string | boolean | import("tdesign-vue-next").TNode;
-    destroyOnClose: boolean;
     footer: boolean | import("tdesign-vue-next").TNode;
     header: string | boolean | import("tdesign-vue-next").TNode;
+    closeBtn: string | boolean | import("tdesign-vue-next").TNode;
+    destroyOnClose: boolean;
     lazy: boolean;
     preventScrollThrough: boolean;
     showOverlay: boolean;
-    size: string;
+    hideOnDeactivated: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/components/drawer/index.vue.mjs

@@ -1,7 +1,10 @@
-import { defineComponent, mergeDefaults, ref, computed, createBlock, openBlock, unref, mergeProps, isRef, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps } from "vue";
+import './index.css'
+import { defineComponent, mergeDefaults, getCurrentInstance, ref, computed, watch, onActivated, nextTick, onDeactivated, onBeforeUnmount, createBlock, openBlock, unref, mergeProps, isRef, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps } from "vue";
 import { useVModels } from "../../node_modules/.pnpm/@vueuse_core@14.2.0_vue@3.5.26_typescript@5.9.3_/node_modules/@vueuse/core/dist/index.mjs";
-import { suspectedWrapperPromise } from "qidian-shared";
+import { useActivated, suspectedWrapperPromise } from "qidian-shared";
 import { Drawer } from "tdesign-vue-next";
+import { resolveAttachParent, OVERLAY_CLOSING_CLASS, OVERLAY_TRANSPARENT_CLASS, markPreviousOverlaysTransparent, registerOverlayEsc, setOverlayActive, updateOverlayMasks, unregisterOverlayEsc, setOverlayEscEnabled, focusTopOverlay } from "../../utils/overlayStack.mjs";
+import { useConfig } from "../config-provider/useConfig.mjs";
 import { qdDrawerProps } from "./props.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
@@ -10,6 +13,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: /* @__PURE__ */ mergeDefaults({
     onConfirm: { type: Function },
+    hideOnDeactivated: { type: Boolean },
     attach: { type: [String, Function] },
     body: {},
     cancelBtn: {},
@@ -47,14 +51,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     const emit = __emit;
     const { visible } = useVModels(props, emit, { passive: true });
+    const { uid } = getCurrentInstance();
+    const uniqueClassName = `qd-drawer--${uid}`;
     const confirmLoad = ref(false);
+    const { t } = useConfig("wrapper");
+    const { activated } = useActivated();
+    const openedTime = ref(0);
+    const escEnabled = computed(
+      () => !confirmLoad.value && !props.confirmLoading && props.closeOnEscKeydown !== false
+    );
     const reProps = computed(() => {
-      const { visible: inVisible, confirmLoading, ...drawerOptions } = props;
+      const { visible: inVisible, confirmLoading, hideOnDeactivated, ...drawerOptions } = props;
       const reConfirmLoading = confirmLoad.value || confirmLoading;
+      const hasMask = drawerOptions.showOverlay !== false;
       return {
         drawerOptions: {
           ...drawerOptions,
-          closeOnEscKeydown: reConfirmLoading ? false : drawerOptions.closeOnEscKeydown,
+          attach: drawerOptions.attach ?? t("attach") ?? "body",
+          closeOnEscKeydown: hasMask ? false : reConfirmLoading ? false : drawerOptions.closeOnEscKeydown,
           closeOnOverlayClick: reConfirmLoading ? false : drawerOptions.closeOnOverlayClick,
           closeBtn: reConfirmLoading ? false : drawerOptions.closeBtn,
           cancelBtn: reConfirmLoading ? typeof drawerOptions.cancelBtn === "object" ? { ...drawerOptions.cancelBtn, disabled: true } : { disabled: true } : drawerOptions.cancelBtn,
@@ -72,6 +86,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             visible.value = false;
           }
         },
+        hideOnDeactivated,
         models: { visible: inVisible }
       };
     });
@@ -81,12 +96,67 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function hide() {
       visible.value = false;
     }
+    watch(
+      visible,
+      (val) => {
+        const containerEl = document.querySelector(`.${uniqueClassName}`);
+        const { showOverlay, attach } = reProps.value.drawerOptions;
+        const hasMask = showOverlay !== false;
+        const parent = resolveAttachParent(attach);
+        if (val) {
+          openedTime.value = performance.now();
+          if (containerEl) {
+            containerEl.classList.remove(OVERLAY_CLOSING_CLASS, OVERLAY_TRANSPARENT_CLASS);
+          }
+          if (hasMask) {
+            markPreviousOverlaysTransparent(parent, uniqueClassName);
+            registerOverlayEsc(uniqueClassName, {
+              close: () => {
+                visible.value = false;
+              },
+              closeOnEscKeydown: escEnabled.value
+            });
+            setOverlayActive(uniqueClassName, activated.value);
+          }
+        } else {
+          if (containerEl) containerEl.classList.add(OVERLAY_CLOSING_CLASS);
+          updateOverlayMasks(parent, uniqueClassName);
+          unregisterOverlayEsc(uniqueClassName);
+        }
+      },
+      { flush: "sync" }
+    );
+    watch(escEnabled, (val) => {
+      setOverlayEscEnabled(uniqueClassName, val);
+    });
+    onActivated(() => {
+      setOverlayActive(uniqueClassName, true);
+      if (!visible.value) return;
+      nextTick(() => {
+        const parent = resolveAttachParent(reProps.value.drawerOptions.attach);
+        updateOverlayMasks(parent);
+        focusTopOverlay(parent);
+      });
+    });
+    onDeactivated(() => {
+      setOverlayActive(uniqueClassName, false);
+    });
+    onBeforeUnmount(() => {
+      unregisterOverlayEsc(uniqueClassName);
+      updateOverlayMasks(resolveAttachParent(reProps.value.drawerOptions.attach), uniqueClassName);
+    });
     const expose = { show, hide };
     __expose(expose);
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Drawer), mergeProps({
         visible: unref(visible),
-        "onUpdate:visible": _cache[0] || (_cache[0] = ($event) => isRef(visible) ? visible.value = $event : null)
+        "onUpdate:visible": _cache[0] || (_cache[0] = ($event) => isRef(visible) ? visible.value = $event : null),
+        class: [
+          "qd-drawer",
+          uniqueClassName,
+          reProps.value.hideOnDeactivated && !unref(activated) ? "qd-drawer--deactivated-hidden qd-overlay--deactivated" : ""
+        ],
+        "data-opened-time": openedTime.value || void 0
       }, reProps.value.drawerOptions), createSlots({ _: 2 }, [
         renderList(_ctx.$slots, (_, name) => {
           return {
@@ -96,7 +166,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ])
           };
         })
-      ]), 1040, ["visible"]);
+      ]), 1040, ["visible", "class", "data-opened-time"]);
     };
   }
 });

package/dist/components/drawer/{index.vue2.mjs → index.vue3.mjs}

@@ -1,4 +1,6 @@
+import './index.css'
 import _sfc_main from "./index.vue.mjs";
+/* empty css            */
 export {
   _sfc_main as default
 };

package/dist/components/drawer/props.d.ts

@@ -1,5 +1,4 @@
 export declare const qdDrawerProps: {
-    readonly attach: "body";
     readonly size: "min(400px, 100%)";
     readonly header: true;
     readonly footer: true;
@@ -10,4 +9,5 @@ export declare const qdDrawerProps: {
     readonly lazy: true;
     readonly preventScrollThrough: true;
     readonly showOverlay: true;
+    readonly hideOnDeactivated: true;
 };

package/dist/components/drawer/props.mjs

@@ -1,5 +1,4 @@
 const qdDrawerProps = {
-  attach: "body",
   size: "min(400px, 100%)",
   header: true,
   footer: true,
@@ -9,7 +8,8 @@ const qdDrawerProps = {
   destroyOnClose: false,
   lazy: true,
   preventScrollThrough: true,
-  showOverlay: true
+  showOverlay: true,
+  hideOnDeactivated: true
 };
 export {
   qdDrawerProps

package/dist/components/drawer/types.d.ts

@@ -2,6 +2,7 @@ import type { DrawerInstance, TdDialogProps, TdDrawerProps } from 'tdesign-vue-n
 export type QdDrawerDone = (closed: boolean) => void;
 export interface QdDrawerProps extends Omit<TdDrawerProps, 'onConfirm'>, Pick<TdDialogProps, 'confirmLoading'> {
     onConfirm?: (done: QdDrawerDone) => void | boolean | Promise<void | boolean>;
+    hideOnDeactivated?: boolean;
 }
 export interface QdDrawerInstanceFunctions extends Required<Pick<DrawerInstance, 'show' | 'hide'>> {
 }

package/dist/components/md-editor/index.vue.d.ts

@@ -76,9 +76,9 @@ declare const __VLS_component: import("vue").DefineComponent<QdMdEditorProps, {
         noEcharts: boolean;
         previewComponent: import("vue").Component;
     }> & Omit<{
-        readonly theme: import("md-editor-v3").Themes;
         readonly placeholder: string;
         readonly class: string;
+        readonly theme: import("md-editor-v3").Themes;
         readonly style: string | import("vue").CSSProperties;
         readonly disabled: boolean;
         readonly modelValue: string;
@@ -156,7 +156,7 @@ declare const __VLS_component: import("vue").DefineComponent<QdMdEditorProps, {
         readonly "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined | undefined;
         readonly onOninputBoxWidthChange?: ((...args: any[]) => any) | undefined | undefined;
         readonly onOnRemount?: ((...args: any[]) => any) | undefined | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "theme" | "placeholder" | "class" | "style" | "onDrop" | "onFocus" | "onBlur" | "onChange" | "onInput" | "onError" | "disabled" | "id" | "modelValue" | "language" | "preview" | "pageFullscreen" | "htmlPreview" | "onSave" | "onUploadImg" | "toolbars" | "floatingToolbars" | "toolbarsExclude" | "tabWidth" | "tableShape" | "defToolbars" | "footers" | "scrollAuto" | "defFooters" | "autoFocus" | "autoDetectCode" | "completions" | "showToolbarName" | "inputBoxWidth" | "oninputBoxWidthChange" | "transformImgUrl" | "catalogLayout" | "catalogMaxDepth" | "onHtmlChanged" | "onGetCatalog" | "showCodeRowNumber" | "mdHeadingId" | "sanitize" | "formatCopiedText" | "codeStyleReverse" | "codeStyleReverseList" | "customIcon" | "sanitizeMermaid" | "codeFoldable" | "autoFoldThreshold" | "onRemount" | "previewComponent" | "noPrettier" | "noUploadImg" | "readOnly" | "maxLength" | "editorId" | "previewTheme" | "noMermaid" | "noKatex" | "codeTheme" | "noHighlight" | "noImgZoomIn" | "noEcharts">;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "placeholder" | "class" | "theme" | "style" | "onDrop" | "onFocus" | "onBlur" | "onChange" | "onInput" | "onError" | "disabled" | "id" | "modelValue" | "language" | "preview" | "pageFullscreen" | "htmlPreview" | "onSave" | "onUploadImg" | "toolbars" | "floatingToolbars" | "toolbarsExclude" | "tabWidth" | "tableShape" | "defToolbars" | "footers" | "scrollAuto" | "defFooters" | "autoFocus" | "autoDetectCode" | "completions" | "showToolbarName" | "inputBoxWidth" | "oninputBoxWidthChange" | "transformImgUrl" | "catalogLayout" | "catalogMaxDepth" | "onHtmlChanged" | "onGetCatalog" | "showCodeRowNumber" | "mdHeadingId" | "sanitize" | "formatCopiedText" | "codeStyleReverse" | "codeStyleReverseList" | "customIcon" | "sanitizeMermaid" | "codeFoldable" | "autoFoldThreshold" | "onRemount" | "previewComponent" | "noPrettier" | "noUploadImg" | "readOnly" | "maxLength" | "editorId" | "previewTheme" | "noMermaid" | "noKatex" | "codeTheme" | "noHighlight" | "noImgZoomIn" | "noEcharts">;
     $attrs: {
         [x: string]: unknown;
     };

package/dist/components/service-dialog-table-select/index.css

@@ -1,31 +1,31 @@
-.qd-dialog-table-select[data-v-78ae8603] {
+.qd-dialog-table-select[data-v-814b91a7] {
   width: 100%;
 }
-.qd-dialog-table-select__trigger[data-v-78ae8603] {
+.qd-dialog-table-select__trigger[data-v-814b91a7] {
   width: 100%;
 }
-.qd-dialog-table-select__trigger[data-v-78ae8603]:not(.qd-dialog-table-select__trigger--readonly):not(.qd-dialog-table-select__trigger--disabled) {
+.qd-dialog-table-select__trigger[data-v-814b91a7]:not(.qd-dialog-table-select__trigger--readonly):not(.qd-dialog-table-select__trigger--disabled) {
   cursor: pointer;
 }
-.qd-dialog-table-select__input-trigger[data-v-78ae8603] {
+.qd-dialog-table-select__input-trigger[data-v-814b91a7] {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
-.qd-dialog-table-select__table[data-v-78ae8603] .qd-crud-search > .t-loading__parent > .t-card__body,
-.qd-dialog-table-select__table[data-v-78ae8603] .qd-crud-table__body > .t-loading__parent > .t-card__body {
+.qd-dialog-table-select__table[data-v-814b91a7] .qd-crud-search > .t-loading__parent > .t-card__body,
+.qd-dialog-table-select__table[data-v-814b91a7] .qd-crud-table__body > .t-loading__parent > .t-card__body {
   padding: 0 !important;
 }
-.qd-dialog-table-select__table[data-v-78ae8603] .qd-crud-table__toolbar {
+.qd-dialog-table-select__table[data-v-814b91a7] .qd-crud-table__toolbar {
   display: none;
 }
-.qd-dialog-table-select__table[data-v-78ae8603] .qd-service-table {
+.qd-dialog-table-select__table[data-v-814b91a7] .qd-service-table {
   margin-top: 0;
 }
-.qd-dialog-table-select__table-add[data-v-78ae8603] {
+.qd-dialog-table-select__table-add[data-v-814b91a7] {
   margin-top: var(--td-comp-margin-m);
   display: flex;
 }
-.qd-dialog-table-select__table-add .t-input__wrap[data-v-78ae8603] {
+.qd-dialog-table-select__table-add .t-input__wrap[data-v-814b91a7] {
   flex: 1 1 0;
   overflow: hidden;
   margin-right: var(--td-comp-margin-m);

package/dist/components/service-dialog-table-select/index.vue.mjs

@@ -2,7 +2,7 @@ import './index.css'
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-78ae8603"]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-814b91a7"]]);
 export {
   index as default
 };