import{jsx as a,Fragment as i,jsxs as m}from"react/jsx-runtime";import{memo as p}from"react";import{css as c}from"styled-components";import{Tag as g}from"@redocly/theme/components/Tag/Tag";import{GenericIcon as l}from"@redocly/theme/icons/GenericIcon/GenericIcon";import{Tooltip as f}from"@redocly/theme/components/Tooltip/Tooltip";import{styled as s}from"../../styled-components.js";import{splitBadgesByPosition as x}from"../../utils/index.js";function n({name:r,color:e,description:o,icon:t}){return a(f,{tip:o,placement:"top",disabled:!o,children:a(d,{color:e,icon:t&&a(l,{icon:t}),children:r})},r)}function b({badges:r,children:e}){if(!r)return a(i,{children:e});const{before:o,after:t}=x(r);return m(i,{children:[o.map(n),e,t.map(n)]})}const _=p(b),d=s(g)`
  margin: 0;
  ${({deprecated:r})=>r&&c`
      color: var(--badge-deprecated-text-color);
      background-color: var(--badge-deprecated-bg-color);
      border-radius: var(--badge-deprecated-border-radius);
    `};

  svg {
    flex-shrink: 0;
  }
`,k=s(d)`
  margin: 0;
  font-size: var(--font-size-sm);
  line-height: var(--line-height-sm);
  padding: 0 var(--spacing-xxs);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
`;export{_ as CustomBadges,k as NavigationBadge,d as StyledBadge,n as renderBadge};
