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

Redocly GraphQL docs

import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useRef as f,useMemo as g,memo as l}from"react";import{CloseIcon as R,SecurityIcon as x,useOutsideClick as T,useFocusTrap as j,useThemeHooks as b}from"@redocly/theme";import p from"react";import{RequiresScopesDividerWrapper as C,RequiresScopesSeparatorTag as k,RequiresScopesScopeTag as v,ScopeWrapper as F,RequiresScopesSeparatorText as I,StyledBackground as M,RequiresScopesModalWrapper as W,Close as D,RequiresScopesTitle as y,ItemWrapper as d,RequiresScopesHeader as u}from"./styled.js";function B({label:r}){return o(C,{children:[e(k,{textTransform:"none",children:r}),e("hr",{})]})}const h=l(({scopeGroup:r})=>e(F,{children:r.map((s,n)=>o(p.Fragment,{children:[e(v,{borderless:!0,textTransform:"none",children:s}),n<r.length-1&&e(I,{children:"and"})]},s))}));function H({scopes:r,onClose:s,parentScopes:n}){const t=f(null),{useTranslate:S}=b(),{translate:c}=S();T(t,s),j(t);const a=g(()=>!!n?.length,[n?.length]);return e(M,{children:o(W,{ref:t,tabIndex:0,children:[e(D,{onClick:s,"data-testid":"close",variant:"ghost",icon:e(R,{})}),o(y,{children:[e(x,{size:"24px"}),c("graphql.requiredScopes","Required scopes")]}),a&&o(d,{children:[e(u,{children:c("graphql.objectScopes","Object scopes")}),n?.map(i=>e(h,{scopeGroup:i},i.join(",")))]}),a&&e(m,{label:"and"}),o(d,{children:[a&&e(u,{children:c("graphql.fieldScopes","Field scopes")}),r.map((i,q)=>o(p.Fragment,{children:[e(h,{scopeGroup:i}),q<r.length-1&&e(m,{label:"or"})]},i.join(",")))]})]})})}const A=l(H),m=l(B);export{m as Divider,A as RequiresScopesModal};