@destyler/dialog 0.0.1-beta.12 → 0.0.1-beta.14

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023-PRESENT Elone Hoo
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/component.cjs

@@ -124,13 +124,13 @@ const DestylerDialogContentImpl = vue.defineComponent({
   emits: ["openAutoFocus", "closeAutoFocus", "escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "dismiss"],
   setup() {
     const rootContext = injectDialogRootContext();
-    const { customElement, currentElement: contentElement } = composition.useCustomElement();
+    const { forwardRef, currentElement: contentElement } = composition.useForwardExpose();
     vue.onMounted(() => {
       rootContext.contentElement = contentElement;
     });
     return {
       rootContext,
-      customElement
+      forwardRef
     };
   },
   render() {
@@ -144,15 +144,15 @@ const DestylerDialogContentImpl = vue.defineComponent({
       onUnmountAutoFocus: (event) => {
         this.$emit("closeAutoFocus", event);
       }
-    }, vue.withDirectives(vue.h(dismissableLayer.DestylerDismissableLayer, {
-      ...this.$attrs,
-      "ref": "customElement",
+    }, vue.withDirectives(vue.h(dismissableLayer.DestylerDismissableLayer, vue.mergeProps(this.$attrs, {
+      "ref": (el) => this.forwardRef(el),
       "as": this.$props.as,
       "asChild": this.$props.asChild,
       "role": "dialog",
       "aria-describedby": this.rootContext.descriptionId,
       "aria-labelledby": this.rootContext.titleId,
       "data-state": shared.getOpenState(this.rootContext.open.value),
+      "isDismissable": true,
       "onDismiss": () => {
         this.rootContext.onOpenChange(false);
       },
@@ -168,7 +168,7 @@ const DestylerDialogContentImpl = vue.defineComponent({
       "onPointerDownOutside": (event) => {
         this.$emit("pointerDownOutside", event);
       }
-    }, {
+    }), {
       default: () => this.$slots.default?.()
     }), [
       [directives.BindOnceDirective, { id: this.rootContext.contentId }]
@@ -183,19 +183,19 @@ const DestylerDialogContentModal = vue.defineComponent({
   setup(_, { emit }) {
     const rootContext = injectDialogRootContext();
     const emitsAsProps = composition.useEmitAsProps(emit);
-    const { customElement, currentElement } = composition.useCustomElement();
+    const { forwardRef, currentElement } = composition.useForwardExpose();
     composition.useHideOthers(currentElement);
     return {
       rootContext,
       emitsAsProps,
-      customElement
+      forwardRef
     };
   },
   render() {
     return vue.h(DestylerDialogContentImpl, vue.mergeProps(this.$props, this.emitsAsProps, {
-      "ref": "customElement",
+      "ref": (el) => this.forwardRef(el),
       "trap-focus": this.rootContext.open.value,
-      "disable-outside-pointer-events": true,
+      "disableOutsidePointerEvents": true,
       "onCloseAutoFocus": (event) => {
         this.$emit("closeAutoFocus", event);
         if (!event.defaultPrevented) {
@@ -241,7 +241,7 @@ const DestylerDialogContentNonModal = vue.defineComponent({
   render() {
     return vue.h(DestylerDialogContentImpl, vue.mergeProps(this.$props, this.emitsAsProps, {
       "trap-focus": false,
-      "disable-outside-pointer-events": false,
+      "disableOutsidePointerEvents": false,
       "onCloseAutoFocus": (event) => {
         this.$emit("closeAutoFocus", event);
         if (!event.defaultPrevented) {
@@ -299,9 +299,11 @@ const DestylerDialogContent = vue.defineComponent({
   setup(_, { emit }) {
     const rootContext = injectDialogRootContext();
     const emitsAsProps = composition.useEmitAsProps(emit);
+    const { forwardRef } = composition.useForwardExpose();
     return {
       rootContext,
-      emitsAsProps
+      emitsAsProps,
+      forwardRef
     };
   },
   render() {
@@ -310,12 +312,14 @@ const DestylerDialogContent = vue.defineComponent({
       present: this.$props.forceMount || this.rootContext.open.value
     }, [
       useVShow ? vue.h(DestylerDialogContentModal, vue.mergeProps(this.$props, this.emitsAsProps, this.$attrs, {
+        ref: (el) => this.forwardRef(el),
         onOpenAutoFocus: (event) => {
           this.$emit("openAutoFocus", event);
         }
       }), {
         default: () => this.$slots.default?.()
       }) : vue.h(DestylerDialogContentNonModal, vue.mergeProps(this.$props, this.emitsAsProps, this.$attrs), {
+        ref: (el) => this.forwardRef(el),
         default: () => this.$slots.default?.()
       })
     ]);
@@ -372,6 +376,7 @@ const DestylerDialogOverlayImpl = vue.defineComponent({
   props: destylerDialogOverlayImplProps,
   setup() {
     const rootContext = injectDialogRootContext();
+    composition.useForwardExpose();
     return {
       rootContext
     };
@@ -411,8 +416,10 @@ const DestylerDialogOverlay = vue.defineComponent({
   props: destylerDialogOverlayProps,
   setup() {
     const rootContext = injectDialogRootContext();
+    const { forwardRef } = composition.useForwardExpose();
     return {
-      rootContext
+      rootContext,
+      forwardRef
     };
   },
   render() {
@@ -420,6 +427,7 @@ const DestylerDialogOverlay = vue.defineComponent({
     return useVShow ? vue.h(presence.DestylerPresence, {
       present: this.$props.forceMount || this.rootContext.open.value
     }, vue.h(DestylerDialogOverlayImpl, vue.mergeProps(this.$attrs, {
+      ref: (el) => this.forwardRef(el),
       as: this.$props.as,
       asChild: this.$props.asChild
     }), {
@@ -500,20 +508,20 @@ const DestylerDialogTrigger = vue.defineComponent({
   props: destylerDialogTriggerProps,
   setup() {
     const rootContext = injectDialogRootContext();
-    const { customElement, currentElement } = composition.useCustomElement();
+    const { forwardRef, currentElement } = composition.useForwardExpose();
     vue.onMounted(() => {
       rootContext.triggerElement = currentElement;
     });
     return {
       rootContext,
-      customElement
+      forwardRef
     };
   },
   render() {
     return vue.h(primitive.DestylerPrimitive, vue.mergeProps(this.$attrs, {
       "as": this.$props.as,
       "asChild": this.$props.asChild,
-      "ref": "customElement",
+      "ref": (el) => this.forwardRef(el),
       "type": this.$props.as === "button" ? "button" : void 0,
       "aria-haspopup": "dialog",
       "aria-expanded": this.rootContext.open.value || false,

package/dist/component.d.cts

@@ -1,5 +1,5 @@
-import { D as DialogRootContext } from './shared/dialog.19d267bb.cjs';
-export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.19d267bb.cjs';
+import { D as DialogRootContext } from './shared/dialog.25aba8c4.cjs';
+export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.25aba8c4.cjs';
 import * as vue from 'vue';
 import { PropType, Component } from 'vue';
 import * as _destyler_primitive from '@destyler/primitive';
@@ -28,7 +28,7 @@ declare const DestylerDialogContentImpl: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -86,7 +86,7 @@ declare const DestylerDialogContentModal: vue.DefineComponent<{
 }, {
     rootContext: DialogRootContext;
     emitsAsProps: Record<string, any>;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: vue.PropType<_destyler_primitive.AsTag | vue.Component>;

package/dist/component.d.mts

@@ -1,5 +1,5 @@
-import { D as DialogRootContext } from './shared/dialog.19d267bb.mjs';
-export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.19d267bb.mjs';
+import { D as DialogRootContext } from './shared/dialog.25aba8c4.mjs';
+export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.25aba8c4.mjs';
 import * as vue from 'vue';
 import { PropType, Component } from 'vue';
 import * as _destyler_primitive from '@destyler/primitive';
@@ -28,7 +28,7 @@ declare const DestylerDialogContentImpl: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -86,7 +86,7 @@ declare const DestylerDialogContentModal: vue.DefineComponent<{
 }, {
     rootContext: DialogRootContext;
     emitsAsProps: Record<string, any>;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: vue.PropType<_destyler_primitive.AsTag | vue.Component>;

package/dist/component.d.ts

@@ -1,5 +1,5 @@
-import { D as DialogRootContext } from './shared/dialog.19d267bb.js';
-export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.19d267bb.js';
+import { D as DialogRootContext } from './shared/dialog.25aba8c4.js';
+export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.25aba8c4.js';
 import * as vue from 'vue';
 import { PropType, Component } from 'vue';
 import * as _destyler_primitive from '@destyler/primitive';
@@ -28,7 +28,7 @@ declare const DestylerDialogContentImpl: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -86,7 +86,7 @@ declare const DestylerDialogContentModal: vue.DefineComponent<{
 }, {
     rootContext: DialogRootContext;
     emitsAsProps: Record<string, any>;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: vue.PropType<_destyler_primitive.AsTag | vue.Component>;

package/dist/component.mjs

@@ -1,7 +1,7 @@
 import { defineComponent, ref, toRefs, h, mergeProps, onMounted, withDirectives } from 'vue';
 import { DestylerPrimitive } from '@destyler/primitive';
 import { createContext, getOpenState } from '@destyler/shared';
-import { useVModel, useId, useCustomElement, useEmitAsProps, useHideOthers } from '@destyler/composition';
+import { useVModel, useId, useForwardExpose, useEmitAsProps, useHideOthers } from '@destyler/composition';
 import { DestylerPresence } from '@destyler/presence';
 import { DestylerFocusScope } from '@destyler/focus-scope';
 import { DestylerDismissableLayer } from '@destyler/dismissable-layer';
@@ -122,13 +122,13 @@ const DestylerDialogContentImpl = defineComponent({
   emits: ["openAutoFocus", "closeAutoFocus", "escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "dismiss"],
   setup() {
     const rootContext = injectDialogRootContext();
-    const { customElement, currentElement: contentElement } = useCustomElement();
+    const { forwardRef, currentElement: contentElement } = useForwardExpose();
     onMounted(() => {
       rootContext.contentElement = contentElement;
     });
     return {
       rootContext,
-      customElement
+      forwardRef
     };
   },
   render() {
@@ -142,15 +142,15 @@ const DestylerDialogContentImpl = defineComponent({
       onUnmountAutoFocus: (event) => {
         this.$emit("closeAutoFocus", event);
       }
-    }, withDirectives(h(DestylerDismissableLayer, {
-      ...this.$attrs,
-      "ref": "customElement",
+    }, withDirectives(h(DestylerDismissableLayer, mergeProps(this.$attrs, {
+      "ref": (el) => this.forwardRef(el),
       "as": this.$props.as,
       "asChild": this.$props.asChild,
       "role": "dialog",
       "aria-describedby": this.rootContext.descriptionId,
       "aria-labelledby": this.rootContext.titleId,
       "data-state": getOpenState(this.rootContext.open.value),
+      "isDismissable": true,
       "onDismiss": () => {
         this.rootContext.onOpenChange(false);
       },
@@ -166,7 +166,7 @@ const DestylerDialogContentImpl = defineComponent({
       "onPointerDownOutside": (event) => {
         this.$emit("pointerDownOutside", event);
       }
-    }, {
+    }), {
       default: () => this.$slots.default?.()
     }), [
       [BindOnceDirective, { id: this.rootContext.contentId }]
@@ -181,19 +181,19 @@ const DestylerDialogContentModal = defineComponent({
   setup(_, { emit }) {
     const rootContext = injectDialogRootContext();
     const emitsAsProps = useEmitAsProps(emit);
-    const { customElement, currentElement } = useCustomElement();
+    const { forwardRef, currentElement } = useForwardExpose();
     useHideOthers(currentElement);
     return {
       rootContext,
       emitsAsProps,
-      customElement
+      forwardRef
     };
   },
   render() {
     return h(DestylerDialogContentImpl, mergeProps(this.$props, this.emitsAsProps, {
-      "ref": "customElement",
+      "ref": (el) => this.forwardRef(el),
       "trap-focus": this.rootContext.open.value,
-      "disable-outside-pointer-events": true,
+      "disableOutsidePointerEvents": true,
       "onCloseAutoFocus": (event) => {
         this.$emit("closeAutoFocus", event);
         if (!event.defaultPrevented) {
@@ -239,7 +239,7 @@ const DestylerDialogContentNonModal = defineComponent({
   render() {
     return h(DestylerDialogContentImpl, mergeProps(this.$props, this.emitsAsProps, {
       "trap-focus": false,
-      "disable-outside-pointer-events": false,
+      "disableOutsidePointerEvents": false,
       "onCloseAutoFocus": (event) => {
         this.$emit("closeAutoFocus", event);
         if (!event.defaultPrevented) {
@@ -297,9 +297,11 @@ const DestylerDialogContent = defineComponent({
   setup(_, { emit }) {
     const rootContext = injectDialogRootContext();
     const emitsAsProps = useEmitAsProps(emit);
+    const { forwardRef } = useForwardExpose();
     return {
       rootContext,
-      emitsAsProps
+      emitsAsProps,
+      forwardRef
     };
   },
   render() {
@@ -308,12 +310,14 @@ const DestylerDialogContent = defineComponent({
       present: this.$props.forceMount || this.rootContext.open.value
     }, [
       useVShow ? h(DestylerDialogContentModal, mergeProps(this.$props, this.emitsAsProps, this.$attrs, {
+        ref: (el) => this.forwardRef(el),
         onOpenAutoFocus: (event) => {
           this.$emit("openAutoFocus", event);
         }
       }), {
         default: () => this.$slots.default?.()
       }) : h(DestylerDialogContentNonModal, mergeProps(this.$props, this.emitsAsProps, this.$attrs), {
+        ref: (el) => this.forwardRef(el),
         default: () => this.$slots.default?.()
       })
     ]);
@@ -370,6 +374,7 @@ const DestylerDialogOverlayImpl = defineComponent({
   props: destylerDialogOverlayImplProps,
   setup() {
     const rootContext = injectDialogRootContext();
+    useForwardExpose();
     return {
       rootContext
     };
@@ -409,8 +414,10 @@ const DestylerDialogOverlay = defineComponent({
   props: destylerDialogOverlayProps,
   setup() {
     const rootContext = injectDialogRootContext();
+    const { forwardRef } = useForwardExpose();
     return {
-      rootContext
+      rootContext,
+      forwardRef
     };
   },
   render() {
@@ -418,6 +425,7 @@ const DestylerDialogOverlay = defineComponent({
     return useVShow ? h(DestylerPresence, {
       present: this.$props.forceMount || this.rootContext.open.value
     }, h(DestylerDialogOverlayImpl, mergeProps(this.$attrs, {
+      ref: (el) => this.forwardRef(el),
       as: this.$props.as,
       asChild: this.$props.asChild
     }), {
@@ -498,20 +506,20 @@ const DestylerDialogTrigger = defineComponent({
   props: destylerDialogTriggerProps,
   setup() {
     const rootContext = injectDialogRootContext();
-    const { customElement, currentElement } = useCustomElement();
+    const { forwardRef, currentElement } = useForwardExpose();
     onMounted(() => {
       rootContext.triggerElement = currentElement;
     });
     return {
       rootContext,
-      customElement
+      forwardRef
     };
   },
   render() {
     return h(DestylerPrimitive, mergeProps(this.$attrs, {
       "as": this.$props.as,
       "asChild": this.$props.asChild,
-      "ref": "customElement",
+      "ref": (el) => this.forwardRef(el),
       "type": this.$props.as === "button" ? "button" : void 0,
       "aria-haspopup": "dialog",
       "aria-expanded": this.rootContext.open.value || false,

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, p as DestylerDialogOverlayProps, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.19d267bb.cjs';
+export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, p as DestylerDialogOverlayProps, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.25aba8c4.cjs';
 import 'vue';
 import '@destyler/shared';
 import '@destyler/primitive';

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, p as DestylerDialogOverlayProps, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.19d267bb.mjs';
+export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, p as DestylerDialogOverlayProps, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.25aba8c4.mjs';
 import 'vue';
 import '@destyler/shared';
 import '@destyler/primitive';

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, p as DestylerDialogOverlayProps, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.19d267bb.js';
+export { a as DestylerDialogClose, b as DestylerDialogCloseProps, c as DestylerDialogContent, d as DestylerDialogContentProps, e as DestylerDialogDescription, f as DestylerDialogDescriptionProps, g as DestylerDialogOverlay, p as DestylerDialogOverlayProps, h as DestylerDialogPortal, i as DestylerDialogPortalProps, j as DestylerDialogRoot, k as DestylerDialogRootProps, l as DestylerDialogTitle, m as DestylerDialogTitleProps, n as DestylerDialogTrigger, o as DestylerDialogTriggerProps } from './shared/dialog.25aba8c4.js';
 import 'vue';
 import '@destyler/shared';
 import '@destyler/primitive';

package/dist/shared/{dialog.19d267bb.d.cts → dialog.25aba8c4.d.cts}

@@ -160,6 +160,7 @@ declare const DestylerDialogContent: vue.DefineComponent<{
 }, {
     rootContext: DialogRootContext;
     emitsAsProps: Record<string, any>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -270,6 +271,7 @@ declare const DestylerDialogOverlay: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -398,7 +400,7 @@ declare const DestylerDialogTrigger: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly asChild: {
         readonly type: PropType<boolean>;

package/dist/shared/{dialog.19d267bb.d.mts → dialog.25aba8c4.d.mts}

@@ -160,6 +160,7 @@ declare const DestylerDialogContent: vue.DefineComponent<{
 }, {
     rootContext: DialogRootContext;
     emitsAsProps: Record<string, any>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -270,6 +271,7 @@ declare const DestylerDialogOverlay: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -398,7 +400,7 @@ declare const DestylerDialogTrigger: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly asChild: {
         readonly type: PropType<boolean>;

package/dist/shared/{dialog.19d267bb.d.ts → dialog.25aba8c4.d.ts}

@@ -160,6 +160,7 @@ declare const DestylerDialogContent: vue.DefineComponent<{
 }, {
     rootContext: DialogRootContext;
     emitsAsProps: Record<string, any>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss")[], "openAutoFocus" | "closeAutoFocus" | "escapeKeyDown" | "pointerDownOutside" | "focusOutside" | "interactOutside" | "dismiss", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -270,6 +271,7 @@ declare const DestylerDialogOverlay: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly as: {
         readonly type: PropType<AsTag | Component>;
@@ -398,7 +400,7 @@ declare const DestylerDialogTrigger: vue.DefineComponent<{
     };
 }, {
     rootContext: DialogRootContext;
-    customElement: vue.Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     readonly asChild: {
         readonly type: PropType<boolean>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@destyler/dialog",
-  "version": "0.0.1-beta.12",
+  "version": "0.0.1-beta.14",
   "description": "unstyled dialog component for vue",
   "author": "Elone Hoo <elonehoo@gmail.com>",
   "license": "MIT",
@@ -33,14 +33,14 @@
     "vue": ">=3.3.4"
   },
   "dependencies": {
-    "@destyler/composition": "0.0.1-beta.12",
-    "@destyler/directives": "0.0.1-beta.12",
-    "@destyler/dismissable-layer": "0.0.1-beta.12",
-    "@destyler/focus-scope": "0.0.1-beta.12",
-    "@destyler/presence": "0.0.1-beta.12",
-    "@destyler/shared": "0.0.1-beta.12",
-    "@destyler/teleport": "0.0.1-beta.12",
-    "@destyler/primitive": "0.0.1-beta.12"
+    "@destyler/composition": "0.0.1-beta.14",
+    "@destyler/dismissable-layer": "0.0.1-beta.14",
+    "@destyler/primitive": "0.0.1-beta.14",
+    "@destyler/shared": "0.0.1-beta.14",
+    "@destyler/teleport": "0.0.1-beta.14",
+    "@destyler/focus-scope": "0.0.1-beta.14",
+    "@destyler/directives": "0.0.1-beta.14",
+    "@destyler/presence": "0.0.1-beta.14"
   },
   "scripts": {
     "clear": "rimraf ./dist",