ui-ingredients/dist/presence/create-presence.svelte.js

Headless component library for Svelte powered by zag

import * as presence from '@zag-js/presence';
import { normalizeProps, useMachine } from '@zag-js/svelte';
export function createPresence(props) {
    const service = useMachine(presence.machine, () => ({
        present: props.present,
        immediate: props.immediate,
        onExitComplete: props.onExitComplete,
    }));
    const api = $derived(presence.connect(service, normalizeProps));
    function getPresenceProps() {
        return {
            hidden: !api.present,
            'data-state': props.present ? 'open' : 'closed',
        };
    }
    let wasPresent = $state(false);
    $effect.pre(() => {
        if (api.present) {
            wasPresent = true;
        }
    });
    const unmounted = $derived.by(() => {
        if (!api.present && !wasPresent && props.lazyMount)
            return true;
        if (!props.keepMounted && !api.present && wasPresent)
            return true;
        return false;
    });
    const setReference = (node) => {
        api.setNode(node);
    };
    return {
        setReference,
        getPresenceProps,
        get mounted() {
            return !unmounted;
        },
    };
}