ui/node_modules/@melt-ui/svelte/dist/builders/toggle/create.js

import { addMeltEventListener, makeElement, disabledAttr, executeCallbacks, kbd, omit, overridable, toWritableStores, } from '../../internal/helpers/index.js';
import { writable } from 'svelte/store';
const defaults = {
    defaultPressed: false,
    disabled: false,
};
export function createToggle(props) {
    const withDefaults = { ...defaults, ...props };
    const options = toWritableStores(omit(withDefaults, 'pressed'));
    const { disabled } = options;
    const pressedWritable = withDefaults.pressed ?? writable(withDefaults.defaultPressed);
    const pressed = overridable(pressedWritable, withDefaults?.onPressedChange);
    function handleToggle() {
        const $disabled = disabled.get();
        if ($disabled)
            return;
        pressed.update((v) => !v);
    }
    const root = makeElement('toggle', {
        stores: [pressed, disabled],
        returned: ([$pressed, $disabled]) => {
            return {
                'data-disabled': disabledAttr($disabled),
                disabled: disabledAttr($disabled),
                'data-state': $pressed ? 'on' : 'off',
                'aria-pressed': $pressed,
                type: 'button',
            };
        },
        action: (node) => {
            const unsub = executeCallbacks(addMeltEventListener(node, 'click', () => {
                handleToggle();
            }), addMeltEventListener(node, 'keydown', (e) => {
                if (e.key !== kbd.ENTER && e.key !== kbd.SPACE)
                    return;
                e.preventDefault();
                handleToggle();
            }));
            return {
                destroy: unsub,
            };
        },
    });
    return {
        elements: {
            root,
        },
        states: {
            pressed,
        },
        options,
    };
}