import{jsx as r,jsxs as o}from"react/jsx-runtime";import{Fragment as d}from"react";import{SecurityIcon as v}from"@redocly/theme/icons/SecurityIcon/SecurityIcon";import{Panel as u}from"@redocly/theme/components/Panel/Panel";import{Button as h}from"@redocly/theme/components/Button/Button";import{Tooltip as y}from"@redocly/theme/components/Tooltip/Tooltip";import{WarningFilledIcon as b}from"@redocly/theme/icons/WarningFilledIcon/WarningFilledIcon";import{useTranslate as x}from"../../hooks/index.js";import{styled as e}from"../../styled-components.js";import{deprecatedCss as w}from"../common/index.js";function N({securities:a,onClick:m}){const i=x();return r(j,{header:()=>o(k,{children:[r(v,{}),r(B,{children:i("openapi.security","Security")}),r(T,{onClick:m,variant:"link",children:i("openapi.viewSecurityDetails","View details")})]}),isExpandable:!1,children:r(C,{children:a.map((t,n)=>{const s=a.length>1&&t.schemes.length>1,f=t.schemes.map(({id:l,deprecated:c=!1},g)=>o(d,{children:[o(S,{deprecated:c,children:[l,c&&r(y,{tip:i("openapi.badges.deprecated","Deprecated"),children:r(b,{color:"var(--badge-deprecated-bg-color)"})})]}),g<t.schemes.length-1&&r(p,{children:" and "})]},l));return o(d,{children:[s?"(":"",f,s?")":"",n<a.length-1&&r(p,{children:" or "})]},n)})})})}const S=e.span`
  ${({deprecated:a})=>a&&w}
  display: flex;
  align-items: center;
  gap: var(--spacing-xxs);
  display: inline-flex;
};
`,j=e(u)`
  margin-top: var(--spacing-base);
  border: var(--panel-border);
  border-radius: var(--panel-border-radius);
`,k=e.div`
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-xs);
  color: var(--link-color-primary);
  padding: var(--spacing-xs) var(--spacing-sm);
  background-color: var(--layer-color);
  border-bottom: var(--panel-border);
  border-radius: var(--panel-border-radius) var(--panel-border-radius) 0 0;
`,T=e(h)`
  margin-left: auto;
  font-size: var(--font-size-sm);
`,B=e.span`
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-medium);
  color: var(--text-color-primary);
`,C=e.div`
  flex: 1;
  text-overflow: ellipsis;
  overflow: hidden;
  padding: var(--spacing-xs) var(--spacing-sm);
  color: var(--text-color-primary);
`,p=e.span`
  color: var(--text-color-description);
`;export{N as SecurityButton};
