@redocly/graphql-docs/lib-esm/src/definition/components/FieldView.js

Redocly GraphQL docs

import{jsx as n,jsxs as a}from"react/jsx-runtime";import{useState as i}from"react";import{useThemeHooks as w}from"@redocly/theme";import{HiddenNavigationAnchor as T}from"../../../shared/index.js";import{useIsFieldExpandable as y,useShowExpandableBorder as F}from"../utils/is-field-expandable.js";import{ViewNested as l}from"../../common/components/ViewNested.js";import{getNavigationIdProp as j}from"../../navigation/hooks/utils.js";import{TypeView as q}from"./TypeView.js";import{Arguments as v}from"./Arguments.js";import{FieldRow as A}from"./FieldRow.js";import{ExpandableFieldBody as E,FieldWrapper as H}from"./styled.js";function g({field:e,contrast:m,fieldExpandLevel:r,parentType:o}){const p=r+1,[s,h]=i(!1),[d,x]=i(!1),{useTranslate:c}=w(),{translate:t}=c(),u=o?.name?`${o.name}-${e.name}`:e.name;return a("div",{id:u,children:[n(T,{...j("")}),a(H,{showBorder:F(e,r,{expandedTypes:s}),children:[n(A,{fieldExpandLevel:r,field:e,parentType:o}),y(e,r)?a(E,{contrast:!m,children:[!!e.args?.length&&n(l,{expanded:d,level:r,expandText:t("graphql.arguments.show","Show arguments"),collapseText:t("graphql.arguments.hide","Hide arguments"),args:e.args,onClick:()=>x(!d),children:n(v,{args:e.args,fieldExpandLevel:p,parentName:o?.name?`${o.name}-${e.name}`:e.name,renderField:g})}),n(l,{expanded:s,level:r,expandText:t("graphql.returnTypes.show","Show return type"),collapseText:t("graphql.returnTypes.hide","Hide return type"),onClick:()=>h(!s),children:n(q,{type:e.type,contrast:!m,fieldExpandLevel:p,renderField:g})})]}):null]})]})}export{g as FieldView};