"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.FocusGuards = FocusGuards;
const react_1 = __importDefault(require("react"));
const hooks_1 = require("../../hooks");
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_1.default.useRef(null);
    const endRef = react_1.default.useRef(null);
    const startRefCombined = (0, hooks_1.useMergeRefs)(startRef, forwardedStartRef);
    const endRefCombined = (0, hooks_1.useMergeRefs)(endRef, forwardedEndRef);
    return (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement("span", { ref: startRefCombined, 
            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
            tabIndex: 0, style: visuallyHidden, "data-aksel-focus-guard": "" }),
        children,
        react_1.default.createElement("span", { ref: endRefCombined, 
            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
            tabIndex: 0, style: visuallyHidden, "data-aksel-focus-guard": "" })));
}
//# sourceMappingURL=FocusGuards.js.map