import { onMounted, ref } from 'vue';

export function useHasContent(selector) {
    const container = ref({});
    const hasContent = ref();

    onMounted(() => {
        container.value = document.querySelector(selector);
        if (!container.value) return;

        const observer = new MutationObserver(() => {
            if (document.querySelector(selector))
                hasContent.value = !!container.value.childNodes.length;
        });

        observer.observe(container.value, {
            subtree: true,
            childList: true,
            attributes: true,
        });
    });

    return hasContent;
}