@redocly/asyncapi-docs/lib-esm/src/components/ChannelSection.js

Async API docs for Redocly Realm

import{jsx as o,jsxs as s}from"react/jsx-runtime";import j,{useMemo as a}from"react";import p from"styled-components";import{useAtomValue as O}from"jotai";import{Row as h,SamplesMiddlePanel as g,OperationSamplesPanel as C,Section as I,CustomBadges as L}from"@redocly/openapi-docs";import{LayoutVariant as P,H2 as w,LinkIcon as A,CurveAutoColonIcon as _}from"@redocly/theme";import{layoutAtom as D}from"../jotai/app";import{TagWithIcon as H,Information as M,ActionTag as N,ShareLink as T}from"./common";import{ChannelParameters as $}from"./ChannelParameters";import{ServersListPanel as B}from"./ServersListPanel";import{ChannelBinding as R}from"./ChannelBinding";import{MessageSection as V}from"./MessageSection";import{OperationSection as x}from"./OperationSection";import{useProtocolLabels as W}from"../hooks";const ae=j.memo(({item:n,definition:t})=>{var m;const l=O(D),d=l===P.STACKED,e=(m=t.channels)===null||m===void 0?void 0:m[n.id],{getProtocolLabel:b}=W(e?.bindings),c=a(()=>Object.entries(t.servers||{}).map(([i,r])=>({key:i,value:r})).filter(({value:i})=>{var r;return(r=e?.servers)===null||r===void 0?void 0:r.some(k=>k.host===i.host)}),[e?.servers,t.servers]),f=a(()=>Object.entries(e?.bindings||{}).map(([i,r])=>({key:i,value:r})),[e?.bindings]),S=a(()=>Object.entries(e?.messages||{}).map(([i,r])=>({key:i,value:r})),[e?.messages]),v=a(()=>n.items.filter(i=>i.action==="send"),[n.items]),u=a(()=>n.items.filter(i=>i.action==="receive"),[n.items]),y=a(()=>{var i;return(i=e?.["x-badges"])===null||i===void 0?void 0:i.map(r=>Object.assign(Object.assign({},r),{position:r.position||"after"}))},[e]);return e?s(z,{children:[s(E,{sectionId:n.dataSectionId,children:[o(h,{layout:l,children:o(g,{compact:!0,className:"api-info",isStacked:d,children:o(N,{color:b("channel").toLowerCase(),children:b("channel")})})}),s(h,{layout:l,children:[s(g,{compact:!0,className:"api-info",isStacked:d,children:[s(K,{children:[o(L,{badges:y,children:e?.title||e?.address||n.id}),o(T,{to:`${n.dataSectionId}`,"aria-label":`link to ${n.label}`})]}),e.address&&s(H,{icon:o(_,{size:"14px"}),children:["name: ",o("span",{children:e.address})]}),o(M,{summary:e.summary,description:e.description,externalDocs:e.externalDocs}),e.parameters&&o($,{parameters:e.parameters,id:n.link})]}),s(C,{isStacked:d,className:"panel-container-response-samples",children:[!!c?.length&&o(B,{servers:c,hideHeader:!0}),!!f.length&&o(R,{binding:f[0]})]})]}),S.length>0?o(V,{messages:S,id:n.link}):null]}),v.length>0?o(x,{operations:v,definition:t,type:"send",id:n.link}):null,u.length>0&&v.length>0?o(h,{layout:l,children:o(g,{isStacked:d,children:o(q,{})})}):null,u.length>0?o(x,{operations:u,definition:t,type:"receive",id:n.link}):null]}):null}),z=p.div`
  width: 100%;

  &:not(:last-child) {
    border-bottom: 1px solid var(--border-color-primary);
  }
`,E=p(I)`
  padding: var(--spacing-xxl) 0 var(--spacing-base);
  scroll-margin-top: calc(var(--navbar-height) - var(--spacing-base)) !important;
`,K=p(w)`
  margin: 0 0 var(--spacing-xs) 0;
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  flex-wrap: wrap;
  :hover {
    ${A} {
      opacity: 1;
      visibility: visible;
    }
  }
`,q=p.div`
  border-bottom: 1px solid var(--border-color-secondary);
`;export{ae as ChannelSection};