import{jsx as r,jsxs as t}from"react/jsx-runtime";import{memo as w,useCallback as $}from"react";import{useNavigate as y}from"react-router-dom";import{useAtomValue as z}from"jotai";import{LayoutVariant as j}from"@redocly/config";import{css as M}from"styled-components";import{Markdown as p}from"@redocly/theme/components/Markdown/Markdown";import{breakpoints as T}from"@redocly/theme/core/openapi";import{Button as C}from"@redocly/theme/components/Button/Button";import{PageActions as I}from"@redocly/theme/components/PageActions/PageActions";import{H2 as A}from"@redocly/theme/components/Typography/H2";import{LinkIcon as L}from"@redocly/theme/icons/LinkIcon/LinkIcon";import{joinWithSeparator as P}from"../../services/history/helpers.js";import{Row as W,SamplesMiddlePanel as m,SamplesPanel as f,ShareLink as B}from"../common/index.js";import{Markdown as D}from"../Markdown/index.js";import{OperationsNavigation as H}from"./OperationsNavigation.js";import{layoutAtom as N}from"../../jotai/app.js";import{useTranslate as V}from"../../hooks/index.js";import{styled as l}from"../../styled-components.js";import{StyledShareLink as _}from"../common/linkify.js";function E({item:a,routingBasePath:i="",isExpanded:d}){const v=V(),{description:o,name:s,href:S}=a,c=y(),g=z(N),e=P(i,a.href),x=$(()=>{c(e)},[c,e]),n=!!a.items.length,k=typeof o=="object"?o?.raw:o,h=g===j.STACKED,b=k?.includes?.("{% schemaDefinition");return t(K,{expanded:d,isSchema:b,isStacked:h,children:[t(W,{layout:g,children:[t(m,{fullWidth:!n,isStacked:h,children:[t(u,{expandable:n,children:[r(B,{to:S,"aria-label":`link to ${s}`}),s,r(I,{pageSlug:e})]}),r(D,{source:o})]}),n&&r(H,{items:a.items,routingBasePath:i})]}),n&&!d&&t(O,{type:"button",variant:"text",size:"medium",onClick:x,children:["+ ",v("openapi.actions.show","Show")]})]})}const da=w(E),K=l.div`
  padding-top: var(--spacing-lg);
  padding-bottom: ${({expanded:a})=>a?"var(--spacing-xxl)":""};

  /* 
    Markdoc components inside markdown that use SamplesPanel should not have padding.
    E.g. SchemaDefinition, McpTool
    padding is added by the TagItem itself
  */
  ${p} ${f} {
    padding-right: 0;
    padding-left: 0;
  }

  ${({isSchema:a,isStacked:i})=>a&&!i&&M`
      ${m} {
        padding-left: 0;
        padding-right: 0;
      }

      ${p} ${m} {
        padding-left: calc(var(--panel-gap-horizontal) * 2);
        padding-right: var(--panel-gap-horizontal);
      }

      ${p} ${f} {
        padding-right: calc(var(--panel-gap-horizontal) * 2);
        padding-left: var(--panel-gap-horizontal);
      }

      ${u} {
        padding-left: calc(var(--panel-gap-horizontal) * 2);
        padding-right: var(--panel-gap-horizontal);
        width: calc(100% - var(--panel-samples-width));
        ${_} {
          left: unset;
        }
      }
    `}
`,O=l(C)`
  margin: var(--spacing-md) var(--spacing-xl) var(--spacing-xxs);
  width: calc(100% - var(--spacing-xl) * 2);

  @media screen and (min-width: ${T.medium}) {
    --button-margin-md: calc(var(--spacing-xl) * 2);

    margin-left: var(--button-margin-md);
    margin-right: var(--button-margin-md);
    width: calc(100% - var(--button-margin-md) * 2);
  }
`,u=l(A)`
  display: flex;
  :hover {
    ${L} {
      opacity: 1;
      visibility: visible;
    }
  }
`;export{da as TagItem,E as TagItemComponent};
