@redocly/asyncapi-docs/lib/src/components/ItemsNavigation.js

Async API docs for Redocly Realm

var C=Object.create;var l=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty;var N=(e,o)=>{for(var t in o)l(e,t,{get:o[t],enumerable:!0})},u=(e,o,t,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of E(o))!B.call(e,n)&&n!==t&&l(e,n,{get:()=>o[n],enumerable:!(s=P(o,n))||s.enumerable});return e};var T=(e,o,t)=>(t=e!=null?C(L(e)):{},u(o||!e||!e.__esModule?l(t,"default",{value:e,enumerable:!0}):t,e)),_=e=>u(l({},"__esModule",{value:!0}),e);var H={};N(H,{ItemsNavigation:()=>M});module.exports=_(H);var a=require("react/jsx-runtime"),i=T(require("styled-components")),x=require("react-router-dom"),b=require("@redocly/openapi-docs"),c=require("@redocly/theme"),y=require("jotai/index"),p=require("react"),w=require("../jotai/app"),k=require("./common"),S=require("../hooks");const f=8,M=({items:e,firstChannelBinding:o})=>{const[t,s]=(0,p.useState)(!1),{getProtocolLabel:n}=(0,S.useProtocolLabels)(o),I=(0,x.useNavigate)(),z=(0,y.useAtomValue)(w.layoutAtom)===c.LayoutVariant.STACKED,{displayItems:A,count:g}=(0,p.useMemo)(()=>{const r=e?.filter(m=>m.type==="channel")||[],d=t?r:r.slice(0,f),h=!t&&r.length>f?r.length-f:0;return{displayItems:d,count:h}},[e,t]),j=r=>{I(r)};return(0,a.jsxs)(O,{isStacked:z,children:[(0,a.jsx)(D,{children:n("channels")}),A.map(({id:r,type:d,label:h,link:m})=>d==="channel"?(0,a.jsx)(V,{variant:"outlined",size:"large",onClick:()=>j(m),children:(0,a.jsxs)("span",{children:[(0,a.jsx)(k.ActionTag,{color:n("channel").toLowerCase(),children:n("channel")}),(0,a.jsx)(W,{children:h})]})},r):null),!t&&!!g&&(0,a.jsxs)(v,{variant:"link",size:"large","data-testid":"show-more-operations",fullWidth:!0,onClick:()=>s(!0),children:["Show ",g," more..."]})]})},O=(0,i.default)(b.SamplesPanel)`
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xxs);
  padding-top: var(--spacing-xxl);
`,v=(0,i.default)(c.Button)`
  & + & {
    margin-left: 0;
  }
`,V=(0,i.default)(v)`
  border-radius: var(--border-radius);
  background: var(--bg-color);
  justify-content: space-between;

  & > span {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-unit);
    overflow-x: hidden;
  }

  &:hover {
    background: var(--bg-color);
  }

  &:hover::after {
    content: '→';
    line-height: var(--line-height-base);
  }
`,W=i.default.span`
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  color: var(--text-color-primary);
  text-decoration: none;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
`,D=i.default.span`
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  font-weight: var(--font-weight-bold);
  color: var(--text-color-primary);
  margin: var(--spacing-sm) 0 var(--spacing-xxs) 0;
`;0&&(module.exports={ItemsNavigation});