voyager-admin/voyager

View on GitHub
resources/assets/js/mixins/closable.ts

Summary

Maintainability
A
0 mins
Test Coverage
import { watch, defineComponent } from 'vue';

export default defineComponent ({
    emits: ['opened', 'closed', 'toggled'],
    data() {
        return {
            isOpen: false,
        }
    },
    methods: {
        open: function () {
            this.isOpen = true;
        },
        close: function () {
            this.isOpen = false;
        },
        toggle: function () {
            this.isOpen = !this.isOpen;
        }
    },
    created: function () {
        watch(() => this.isOpen, (open) => {
                if (open) {
                    this.$emit('opened');
                } else {
                    this.$emit('closed');
                }
    
                this.$emit('toggled');
            }
        );
    },
});