import classNames from '../../../../../../_virtual/index.mjs';
import React__default, { useState, useEffect } from 'react';
import modules_654ad754 from './VerticalTransition.module.css.mjs';

/**
 * Returns a state that automatically reset itself after a given number of seconds
 * @see {useCountdown} for an alternative that returns a countdown in seconds
 */ function useTimedBoolean(timeoutSeconds) {
    const [state, setState] = useState(false);
    useEffect(()=>{
        if (!state || !timeoutSeconds) return;
        const handler = setTimeout(()=>setState(false), timeoutSeconds * 1000);
        return ()=>clearTimeout(handler);
    }, [
        state,
        timeoutSeconds
    ]);
    return [
        state,
        setState
    ];
}
const hoverTriggerClass = modules_654ad754.hoverTrigger;
/**
 * Toggles between primary and secondary content by sliding vertically.
 *
 * The two provided elements are placed in containers which both share the same height
 * and width of primary's content.
 *
 * Use the trigger prop to set what toggles between primary and secondary:
 * - manual: Default. Rely on the triggered boolean to control whether primary or secondary is displayed.
 *           Has aria-live, and only one of primary and secondary has aria-hidden="false"
 * - hover: This element must be a child of a parent that has the hoverTriggerClass class attached.
 *          Both primary and secondary are always visible to screen readers
 */ const VerticalTransition = ({ primary, secondary, rootClassName, className, trigger = 'manual', triggered })=>/*#__PURE__*/ React__default.createElement("div", {
        className: classNames(rootClassName, modules_654ad754.container, {
            [modules_654ad754.triggered]: triggered,
            [modules_654ad754.canTriggerByHover]: trigger === 'hover'
        }),
        // The manually triggered version is an aria-live region since it is meant to replace toasts for ephemeral updates.
        // The hover version is meant more for decorative elements, so we don't give it any special accessibility treatment
        "aria-live": trigger === 'manual' ? 'polite' : undefined
    }, /*#__PURE__*/ React__default.createElement("div", {
        className: classNames(className, modules_654ad754.primary),
        "aria-hidden": trigger === 'manual' ? triggered : undefined
    }, primary), /*#__PURE__*/ React__default.createElement("div", {
        className: classNames(className, modules_654ad754.secondary),
        "aria-hidden": trigger === 'manual' ? !triggered : undefined
    }, secondary));

export { VerticalTransition as default, hoverTriggerClass, useTimedBoolean };
//# sourceMappingURL=VerticalTransition.mjs.map
