primevue-mirror/components/lib/dock/Dock.vue

<template>
    <div :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="dock">
        <DockSub :model="model" :templates="$slots" :tooltipOptions="tooltipOptions" :position="position" :menuId="menuId" :aria-label="ariaLabel" :aria-labelledby="ariaLabelledby" :tabindex="tabindex" :pt="pt" :unstyled="unstyled"></DockSub>
    </div>
</template>

<script>
import BaseDock from './BaseDock.vue';
import DockSub from './DockSub.vue';

export default {
    name: 'Dock',
    extends: BaseDock,
    data() {
        return {
            queryMatches: false
        };
    },
    mounted() {
        const query = matchMedia(`(max-width: ${this.breakpoint})`);

        this.queryMatches = query.matches;

        query.addEventListener('change', () => {
            this.queryMatches = query.matches;
        });
    },
    computed: {
        containerClass() {
            return [this.class, this.cx('root')];
        }
    },
    components: {
        DockSub
    }
};
</script>