@redocly/asyncapi-docs/lib/components/SamplesPanel.js

Async API docs for Redocly Realm

import{jsx as r,jsxs as p}from"react/jsx-runtime";import i from"styled-components";import{ExampleSwitch as u}from"@redocly/openapi-docs";import{useEffect as f,useMemo as h,useState as g}from"react";import{JsonViewer as v}from"@redocly/theme/components/JsonViewer/JsonViewer";import{Panel as E}from"@redocly/theme/components/Panel/Panel";import{PanelBody as b}from"@redocly/theme/components/Panel/PanelBody";import{PanelHeader as x}from"@redocly/theme/components/Panel/PanelHeader";import{useProtocolLabels as w,useTelemetry as y}from"../hooks/index.js";const $=({examples:e})=>{const[o,a]=g(e[0]),{getProtocolLabel:s}=w(),d=y();f(()=>{a(e[0])},[e,a]);const m=t=>{const n=e?.find(l=>l.name===t);n&&(a(n),d.sendSwitchExampleClickedMessage([{id:"switchExampleButton",object:"button",uri:"urn:redocly:redoc:ui:button:switchExampleButton",example:t,numberOfExamples:e.length}]))},c=h(()=>e?.reduce((t,n,l)=>(t[n.name||`Example ${l+1}`]=Object.assign({},n),t),{}),[e]);return p(P,{className:"panel-messages-samples",header:()=>r(j,{isExpandable:!1,children:s("payload")}),children:[r(u,{examples:c,exampleKey:o?.name,onChange:m}),r(v,{data:o?.payload,expandLevel:3})]})},P=i(E)`
  ${b} {
    padding: var(--spacing-sm) 0 0;
    line-height: var(--line-height-md);
  }
`,j=i(x)`
  font-weight: var(--font-weight-regular);
`;export{$ as SamplesPanel};