refactor: #7090 for Dialog

packages/primevue/src/dialog/Dialog.vue

@@ -64,7 +64,6 @@
 <script>
 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';
 import WindowMaximizeIcon from '@primevue/icons/windowmaximize';
 import WindowMinimizeIcon from '@primevue/icons/windowminimize';
@@ -87,7 +86,6 @@ export default {
     },
     data() {
         return {
-            id: this.$attrs.id,
             containerVisible: this.visible,
             maximized: false,
             focusableMax: null,
@@ -95,11 +93,6 @@ export default {
             target: null
         };
     },
-    watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
-        }
-    },
     documentKeydownListener: null,
     container: null,
     mask: null,
@@ -133,8 +126,6 @@ export default {
         this.mask = null;
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
-
         if (this.breakpoints) {
             this.createStyle();
         }
@@ -409,7 +400,7 @@ export default {
             return this.maximized ? (this.minimizeIcon ? 'span' : 'WindowMinimizeIcon') : this.maximizeIcon ? 'span' : 'WindowMaximizeIcon';
         },
         ariaLabelledById() {
-            return this.header != null || this.$attrs['aria-labelledby'] !== null ? this.id + '_header' : null;
+            return this.header != null || this.$attrs['aria-labelledby'] !== null ? this.$id + '_header' : null;
         },
         closeAriaLabel() {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;