UNPKG

@redocly/graphql-docs

Version:

Redocly GraphQL docs

2 lines (1 loc) 1.3 kB
import{jsx as a,jsxs as c}from"react/jsx-runtime";import{useThemeHooks as u}from"@redocly/theme";import{useSettings as d}from"../../settings/index.js";import{CodePanel as g}from"../../definition/components/CodePanel.js";import{getOperationExample as h,getOperationVariablesExample as x}from"../operation/index.js";import{SectionHeader as b,StyledCodeBlock as q,StyledJsonViewer as y,VariablesContainer as S}from"./styled.js";const f={query:"Query",mutation:"Mutation",subscription:"Subscription"};function N({operation:e,operationType:s}){const{jsonSamplesDepth:r,samplesMaxInlineArgs:l}=d(),{useTranslate:n}=u(),{translate:t}=n(),o=e.args.length>l,i=h({operationType:s,operation:e,expandLevel:r,multilineArguments:o,translate:t}),p=x({args:e.args,expandLevel:r}),m=e.args.length>0;return c(g,{className:"panel-response-samples",header:t({query:"graphql.querySample",mutation:"graphql.mutationSample",subscription:"graphql.subscriptionSample"}[s],`${f[s]} sample`),isExpandable:!1,expanded:!0,children:[a(q,{lang:"graphql",source:i,dataTestId:"query-sample",header:{className:"code-block-header",controls:{copy:{}}}}),m?a(S,{children:a(y,{data:p,expandLevel:1/0,title:a(b,{"data-testid":"vars-title",children:t("graphql.variables","Variables")})})}):null]})}export{N as OperationRequestExample};