/* @oracle/oraclejet-preact: undefined */
import { jsxs, jsx } from 'preact/jsx-runtime';
import { forwardRef, useRef, useCallback, useImperativeHandle } from 'preact/compat';
import './logger-c92f309c.js';
import './TabbableModeContext-7d8ad946.js';
import 'preact/hooks';
import { u as useId } from './useId-03dbfdf0.js';
import './LayerHost-e6402730.js';
import './UserAssistanceStyles.styles.css';
import './UNSAFE_UserAssistance/themes/redwood/UserAssistanceBaseTheme.styles.css';
import './UNSAFE_UserAssistance/themes/redwood/UserAssistanceVariants.css.js';
import { a as InlineUserAssistance } from './InlineUserAssistance-65ca8810.js';
import './Flex-ce31b351.js';
import './MessageBannerStyles.styles.css';
import './UNSAFE_MessageBanner/themes/redwood/MessageBannerBaseTheme.styles.css';
import './UNSAFE_MessageBanner/themes/redwood/MessageBannerVariants.css.js';
import 'preact';
import './TooltipContentStyles.styles.css';
import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.styles.css';
import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js';
import './tooltipUtils-768450a7.js';
import './IconStyle.styles.css';
import './IconButton-19fcf0a8.js';
import './MessageStyles.styles.css';
import './MessageFormattingUtils-34c9b1aa.js';
import './TransitionGroup-5fd80dc9.js';
import './MessagesContext-76544845.js';
import './HiddenAccessibleStyles.styles.css';
import './ComponentMessageStyles.styles.css';
import './UNSAFE_ComponentMessage/themes/redwood/ComponentMessageBaseTheme.styles.css';
import './UNSAFE_ComponentMessage/themes/redwood/ComponentMessageVariants.css.js';
import './FormFieldContext-68eb5946.js';
import './Popup-d8bf7f4d.js';
import './UNSAFE_Separator/themes/SeparatorStyles.css.js';
import './LabelStyles.styles.css';
import './UNSAFE_Label/themes/redwood/LabelBaseTheme.styles.css';
import './UNSAFE_Label/themes/redwood/LabelVariants.css.js';
import './InputGroupContext-20bdbd6e.js';
import './UNSAFE_Popup/themes/redwood/PopupBaseTheme.styles.css';
import './UNSAFE_Popup/themes/redwood/PopupVariants.css.js';
import './FormContext-4d71f9c7.js';
import { u as useFormContext } from './useFormContext-875cacd7.js';
import { C as CheckboxRadioContext } from './CheckboxRadioContext-fe425383.js';
import { C as CheckboxControl } from './CheckboxControl-c3c34028.js';

/**
 * Checkbox is a single standalone checkbox control. It represents a boolean value.
 */
const Checkbox = forwardRef(({ 'aria-describedby': ariaDescribedBy, assistiveText, columnSpan, helpSourceLink, helpSourceText, isDisabled: propIsDisabled, isReadonly: propIsReadonly, isRequired = false, messages, onCommit, userAssistanceDensity: propUserAssistanceDensity, value: propValue, testId, children }, ref = null) => {
    const { isDisabled: isFormDisabled, isReadonly: isFormReadonly, userAssistanceDensity: formUserAssistanceDensity } = useFormContext();
    const checkboxRef = useRef(null);
    const id = useId();
    const UAtestId = testId ? `${testId}-inline-user-assistance` : undefined;
    // default to FormContext values if component properties are not specified
    const isDisabled = propIsDisabled ?? isFormDisabled;
    const isReadonly = propIsReadonly ?? isFormReadonly;
    const userAssistanceDensity = propUserAssistanceDensity ?? formUserAssistanceDensity;
    // we still render <InlineUserAssistance/> if density is 'efficient' or 'compact' to save space,
    // even though we don't render user assistance for disabled or readonly fields
    const hasBottomUserAssistance = !isDisabled && !isReadonly;
    const bottomUaId = hasBottomUserAssistance ? `${id}-bottom-ua` : undefined;
    const onChangeHandler = useCallback((e) => {
        // return early on keyup if key isn't spacebar
        const { key } = e;
        const hasKey = key !== undefined;
        if (hasKey && key !== ' ') {
            return;
        }
        const input = e.target;
        // While mouse clicking StyledCheckbox results in toggling the checked state on an input element, spacebar key events do not.
        // If it is a spacebar key event, we will return the toggled value of its current state.
        const value = hasKey ? !input.checked : input.checked;
        const previousValue = !!propValue;
        if (previousValue !== value) {
            onCommit({
                value,
                previousValue
            });
        }
    }, [onCommit, propValue]);
    useImperativeHandle(ref, () => ({
        focus: () => {
            !isDisabled && checkboxRef.current?.focus();
        },
        blur: () => {
            const activeElement = document.activeElement;
            checkboxRef.current === activeElement && activeElement.blur();
        }
    }));
    // TODO fix issue with tooltip and link in label
    // 
    return (jsxs(CheckboxRadioContext.Provider, { value: { isFocusRingShown: !isDisabled }, children: [jsx(CheckboxControl, { ...(hasBottomUserAssistance
                    ? {
                        onChange: onChangeHandler,
                        onKeyUp: onChangeHandler
                    }
                    : {}), "aria-describedby": ariaDescribedBy, assistiveText: assistiveText, columnSpan: columnSpan, helpSourceLink: helpSourceLink, helpSourceText: helpSourceText, isChecked: propValue, isDisabled: isDisabled, isReadonly: isReadonly, isRequired: isRequired, ref: checkboxRef, children: children }), hasBottomUserAssistance ? (jsx(InlineUserAssistance, { id: bottomUaId, isRequiredShown: !!isRequired && !propValue, requiredAlignment: "start", messages: messages, userAssistanceDensity: userAssistanceDensity === 'reflow' ? 'reflow' : 'efficient', testId: UAtestId })) : userAssistanceDensity === 'reflow' ? undefined : (
            /* save space for user assistance if density is 'efficient' or 'compact', even though we don't
               render user assistance for disabled or readonly fields */
            jsx(InlineUserAssistance, { userAssistanceDensity: "efficient", testId: UAtestId }))] }));
});

export { Checkbox as C };
//# sourceMappingURL=Checkbox-74259575.js.map
