import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { SecuritySchemeItem } from './SecuritySchemeItem.js';
import { titleize } from '../../utils/index.js';
import { OAuthFlow } from './OAuthFlow.js';
import { StyledLink } from './styled.js';
import { Markdown } from '../Markdown/index.js';
import { useTranslate } from '../../hooks/index.js';
import { OAuthScopes } from './OAuthScopes.js';
import { styled } from '../../styled-components.js';
export function SecurityFlow({ type, bearerFormat, name, flows, openIdConnectUrl, description, id, securities, in: apiKeyIn, }) {
    const translate = useTranslate();
    if (!type || !id)
        return null;
    const schemaType = {
        http: (_jsxs(_Fragment, { children: [_jsx(SecuritySchemeItem, { label: translate('openapi.httpAuthorizationScheme', 'HTTP Authorization Scheme'), value: type }), _jsx(SecuritySchemeItem, { label: translate('openapi.bearerFormat', 'Bearer Format'), value: bearerFormat })] })),
        apiKey: (_jsx(SecuritySchemeItem, { label: `${titleize(apiKeyIn || '')} ${translate('openapi.parameterName', 'parameter name')}:`, value: name })),
        oauth2: (_jsxs(_Fragment, { children: [_jsx(SecuritySchemeItem, { label: translate('openapi.flowType', 'Flow type'), value: type }), flows && Object.keys(flows).map((type) => _jsx(OAuthFlow, { flow: flows[type] }, type))] })),
        openIdConnect: (_jsx(SecuritySchemeItem, { label: translate('openapi.connectUrl', 'Connect URL'), value: openIdConnectUrl && (_jsx(StyledLink, { target: "_blank", rel: "noopener noreferrer", href: openIdConnectUrl, children: openIdConnectUrl })) })),
    };
    return (_jsxs(Wrapper, { children: [_jsx(TitleSchema, { children: id }), _jsx(Markdown, { source: description }), _jsxs(List, { children: [schemaType[type] || null, _jsx(OAuthScopes, { id: id, securities: securities, flows: flows })] })] }));
}
const Wrapper = styled.div `
  background: var(--layer-color);
  padding: var(--spacing-base);
  border-radius: var(--border-radius);
  border: 1px solid var(--border-color-secondary);
  width: 100%;
  margin-top: var(--spacing-base);
`;
const List = styled.div `
  width: 100%;
  margin-top: var(--spacing-md);
`;
const TitleSchema = styled.p `
  font-size: var(--font-size-base);
  margin: 0 0 var(--spacing-xs);
  text-transform: capitalize;
  font-weight: var(--font-weight-semibold);
`;
//# sourceMappingURL=SecurityFlow.js.map