import * as React from 'react';
import { FormattingsManagePane } from '../../../formatting/FormattingsManagePane';
import { BottomPanePortal } from '../../util/BottomPanePortal';
import { useToolbarPlugin } from '../../../context';
const isDirectCaretPlacement = (event) => {
    if (event && event.type === 'cursor') {
        const detail = event.detail;
        const at = detail.at;
        if (Array.isArray(at) && at.length === 1 && typeof at[0] === 'number')
            return true;
        const move = detail.move;
        if (Array.isArray(move) &&
            move.length === 1 &&
            Array.isArray(move[0]) &&
            move[0][0] === 'focus' &&
            typeof move[0][1] === 'number')
            return true;
    }
    return false;
};
export const CaretBottomOverlay = (props) => {
    const { fwd, bwd } = props;
    const inline = fwd || bwd;
    const { toolbar } = useToolbarPlugin();
    if (!inline)
        return;
    if (!isDirectCaretPlacement(toolbar.lastEvent))
        return;
    return (React.createElement(BottomPanePortal, null,
        React.createElement(FormattingsManagePane, { inline: inline })));
};
//# sourceMappingURL=index.js.map