Refactor #4739 - For Dock

components/lib/dock/BaseDock.vue

@@ -14,10 +14,6 @@ export default {
         class: null,
         style: null,
         tooltipOptions: null,
-        exact: {
-            type: Boolean,
-            default: true
-        },
         menuId: {
             type: String,
             default: null

components/lib/dock/Dock.d.ts

@@ -188,6 +188,7 @@ export interface DockProps {
     style?: any;
     /**
      * Whether to apply 'router-link-active-exact' class if route exactly matches the item path.
+     * @deprecated since v3.40.0.
      * @defaultValue true
      */
     exact?: boolean | undefined;

components/lib/dock/Dock.vue

@@ -1,18 +1,6 @@
 <template>
     <div :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="dock">
-        <DockSub
+        <DockSub :model="model" :templates="$slots" :tooltipOptions="tooltipOptions" :position="position" :menuId="menuId" :aria-label="ariaLabel" :aria-labelledby="ariaLabelledby" :tabindex="tabindex" :pt="pt" :unstyled="unstyled"></DockSub>
-            :model="model"
-            :templates="$slots"
-            :exact="exact"
-            :tooltipOptions="tooltipOptions"
-            :position="position"
-            :menuId="menuId"
-            :aria-label="ariaLabel"
-            :aria-labelledby="ariaLabelledby"
-            :tabindex="tabindex"
-            :pt="pt"
-            :unstyled="unstyled"
-        ></DockSub>
     </div>
 </template>
 
@@ -23,11 +11,6 @@ import DockSub from './DockSub.vue';
 export default {
     name: 'Dock',
     extends: BaseDock,
-    beforeMount() {
-        if (!this.$slots.item) {
-            console.warn('In future versions, vue-router support will be removed. Item templating should be used.');
-        }
-    },
     computed: {
         containerClass() {
             return [this.class, this.cx('root')];

components/lib/dock/DockSub.vue

@@ -31,25 +31,7 @@
                 >
                     <div :class="cx('content')" v-bind="getPTOptions('content', processedItem, index)">
                         <template v-if="!templates['item']">
-                            <router-link v-if="processedItem.to && !disabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="processedItem.to" custom>
                             <a
-                                    v-tooltip:[tooltipOptions]="{ value: processedItem.label, disabled: !tooltipOptions }"
-                                    :href="href"
-                                    :class="cx('action', { isActive, isExactActive })"
-                                    :target="processedItem.target"
-                                    tabindex="-1"
-                                    aria-hidden="true"
-                                    @click="onItemActionClick($event, processedItem, navigate)"
-                                    v-bind="getPTOptions('action', processedItem, index)"
-                                >
-                                    <template v-if="!templates['icon']">
-                                        <span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', processedItem, index)"></span>
-                                    </template>
-                                    <component v-else :is="templates['icon']" :item="processedItem" :class="cx('icon')"></component>
-                                </a>
-                            </router-link>
-                            <a
-                                v-else
                                 v-tooltip:[tooltipOptions]="{ value: processedItem.label, disabled: !tooltipOptions }"
                                 :href="processedItem.url"
                                 :class="cx('action')"
@@ -97,10 +79,6 @@ export default {
             type: null,
             default: null
         },
-        exact: {
-            type: Boolean,
-            default: true
-        },
         tooltipOptions: null,
         menuId: {
             type: String,
@@ -163,9 +141,6 @@ export default {
         onItemMouseEnter(index) {
             this.currentIndex = index;
         },
-        onItemActionClick(event, navigate) {
-            navigate && navigate(event);
-        },
         onItemClick(event, processedItem) {
             if (this.isSameMenuItem(event)) {
                 const command = this.getItemProp(processedItem, 'command');

components/lib/dock/style/DockStyle.js

@@ -127,13 +127,7 @@ const classes = {
         }
     ],
     content: 'p-menuitem-content',
-    action: ({ props, isActive, isExactActive }) => [
+    action: 'p-dock-link',
-        'p-dock-link',
-        {
-            'router-link-active': isActive,
-            'router-link-active-exact': props.exact && isExactActive
-        }
-    ],
     icon: 'p-dock-icon'
 };