import React from "react";
import { useMergeRefs } from "../../hooks/index.js";
const visuallyHidden = {
    clip: "rect(0 0 0 0)",
    overflow: "hidden",
    whiteSpace: "nowrap",
    position: "fixed",
    top: 0,
    left: 0,
    border: 0,
    padding: 0,
    width: 1,
    height: 1,
    margin: -1,
};
function FocusGuards({ children, startRef: forwardedStartRef, endRef: forwardedEndRef, }) {
    const startRef = React.useRef(null);
    const endRef = React.useRef(null);
    const startRefCombined = useMergeRefs(startRef, forwardedStartRef);
    const endRefCombined = useMergeRefs(endRef, forwardedEndRef);
    return (React.createElement(React.Fragment, null,
        React.createElement("span", { ref: startRefCombined, 
            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
            tabIndex: 0, style: visuallyHidden, "data-aksel-focus-guard": "" }),
        children,
        React.createElement("span", { ref: endRefCombined, 
            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
            tabIndex: 0, style: visuallyHidden, "data-aksel-focus-guard": "" })));
}
export { FocusGuards };
//# sourceMappingURL=FocusGuards.js.map