import { jsx as _jsx } from "react/jsx-runtime";
import * as React from 'react';
import { mergePropsReactAria } from './utils';
import { useLayoutContext } from '@livekit/components-react';
/**
 * The `useSettingsToggle` hook provides state and functions for toggling the settings menu.
 */
export function useSettingsToggle({ props }) {
    const { dispatch, state } = useLayoutContext().widget;
    const className = 'lk-button lk-settings-toggle';
    const mergedProps = React.useMemo(() => {
        return mergePropsReactAria(props, {
            className,
            onClick: () => {
                if (dispatch)
                    dispatch({ msg: 'toggle_settings' });
            },
            'aria-pressed': (state === null || state === void 0 ? void 0 : state.showSettings) ? 'true' : 'false'
        });
    }, [props, className, dispatch, state]);
    return { mergedProps };
}
/**
 * The `SettingsMenuToggle` component is a button that toggles the visibility of the `SettingsMenu` component.
 */
export const SettingsMenuToggle = 
/* @__PURE__ */ React.forwardRef(function SettingsMenuToggle(props, ref) {
    const { mergedProps } = useSettingsToggle({ props });
    return (_jsx("button", Object.assign({ ref: ref }, mergedProps, { children: props.children })));
});
