import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import { Portal } from '@redocly/theme/components/Portal/Portal';
import { useModalScrollLock } from '@redocly/theme/core/openapi';
import { SecurityButton } from './SecurityButton.js';
import { SecurityModal } from './SecurityModal.js';
export function Security({ securities }) {
    const [isModalVisible, setIsModalVisible] = useState(false);
    useModalScrollLock(isModalVisible);
    if (!securities.length) {
        return null;
    }
    return (_jsxs(_Fragment, { children: [_jsx(SecurityButton, { securities: securities, onClick: () => setIsModalVisible(true) }), isModalVisible && (_jsx(Portal, { mountId: "api-content", children: _jsx(SecurityModal, { securities: securities, onClose: () => setIsModalVisible(false) }) }))] }));
}
//# sourceMappingURL=Security.js.map