import{jsx as r,Fragment as g,jsxs as u}from"react/jsx-runtime";import{SecuritySchemeItem as s}from"./SecuritySchemeItem.js";import{useTranslate as f}from"../../hooks/index.js";import{getRequiredScopes as S}from"./helper.js";import{normalizeScopes as b,buildScopeDescriptionIndex as v}from"../../utils/security-scope.js";import{ScopeTagWithTooltip as x}from"./ScopeTagWithTooltip.js";import{Tag as h}from"./styled.js";import{Markdown as y}from"../Markdown/index.js";import{styled as i}from"../../styled-components.js";const T=24;function A({schemeId:n,securities:m,flows:o,TagComponent:c=q}){const p=f(),l=S(n,m),t=b(l);if(t.length===0)return null;const a=o?v(o):null,d=!!a;return u(g,{children:[r(s,{label:p("openapi.requiredScopes","Required scopes"),value:" "}),t.map(e=>r(s,{label:r(x,{className:"tag-grey",text:e,maxChars:T,TagComponent:c,compact:!0}),value:d?r(_,{children:r(y,{source:a?.get(e)||""})}):" "},e))]})}const _=i.div`
  p {
    margin-bottom: 0;
  }
`,q=i(h)`
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  align-self: flex-start;
  padding: 0 var(--spacing-xs);
  border: var(--tag-border-width) var(--tag-border-style) var(--tag-bg-color);
  border-radius: var(--tag-border-radius);
  color: var(--color-warm-grey-8);
`;export{A as RequiredScopesList};
