diff --git a/packages/primevue/src/dialog/Dialog.vue b/packages/primevue/src/dialog/Dialog.vue
index 2fb07507b..f0c5bd5cc 100755
--- a/packages/primevue/src/dialog/Dialog.vue
+++ b/packages/primevue/src/dialog/Dialog.vue
@@ -1,7 +1,7 @@
 <template>
     <Portal :appendTo="appendTo">
         <div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @mousedown="onMaskMouseDown" @mouseup="onMaskMouseUp" v-bind="ptm('mask')">
-            <transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @after-enter="onAfterEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
+            <transition name="p-dialog" @enter="onEnter" @after-enter="onAfterEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
                 <div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="ptmi('root')">
                     <slot v-if="$slots.container" name="container" :closeCallback="close" :maximizeCallback="(event) => maximize(event)"></slot>
                     <template v-else>
@@ -62,7 +62,7 @@
 </template>
 
 <script>
-import { addClass, addStyle, blockBodyScroll, focus, getOuterHeight, getOuterWidth, getViewport, isClient, setAttribute, unblockBodyScroll } from '@primeuix/utils/dom';
+import { addClass, addStyle, blockBodyScroll, focus, getOuterHeight, getOuterWidth, getViewport, setAttribute, unblockBodyScroll } from '@primeuix/utils/dom';
 import { ZIndex } from '@primeuix/utils/zindex';
 import { UniqueComponentId } from '@primevue/core/utils';
 import TimesIcon from '@primevue/icons/times';
@@ -134,7 +134,6 @@ export default {
     },
     mounted() {
         this.id = this.id || UniqueComponentId();
-        isClient() && (this.attributeSelector = UniqueComponentId());
 
         if (this.breakpoints) {
             this.createStyle();
@@ -144,9 +143,6 @@ export default {
         close() {
             this.$emit('update:visible', false);
         },
-        onBeforeEnter(el) {
-            el.setAttribute(this.attributeSelector, '');
-        },
         onEnter() {
             this.$emit('show');
             this.target = document.activeElement;
@@ -296,7 +292,7 @@ export default {
                 for (let breakpoint in this.breakpoints) {
                     innerHTML += `
                         @media screen and (max-width: ${breakpoint}) {
-                            .p-dialog[${this.attributeSelector}] {
+                            .p-dialog[${this.$attrSelector}] {
                                 width: ${this.breakpoints[breakpoint]} !important;
                             }
                         }