graphiql
- Version 5.2.0
- Published
- 1.02 MB
- 4 dependencies
- MIT license
Install
npm i graphiql
yarn add graphiql
pnpm add graphiql
Overview
An graphical interactive in-browser GraphQL IDE.
Index
Variables
variable GraphiQL
const GraphiQL: any;
variable GraphiQLInterface
const GraphiQLInterface: FC<GraphiQLInterfaceProps>;
Interfaces
interface GraphiQLInterfaceProps
interface GraphiQLInterfaceProps extends EditorProps, AddSuffix<Pick<QueryEditorProps, 'onEdit'>, 'Query'>, AddSuffix<Pick<VariableEditorProps, 'onEdit'>, 'Variables'>, AddSuffix<Pick<HeaderEditorProps, 'onEdit'>, 'Headers'>, Pick<ResponseEditorProps, 'responseTooltip'>, Pick< ComponentPropsWithoutRef<typeof Sidebar>, 'forcedTheme' | 'showPersistHeadersSettings' > {}
property children
children?: ReactNode;
property className
className?: string;
Additional class names which will be appended to the container element.
property defaultEditorToolsVisibility
defaultEditorToolsVisibility?: boolean | 'variables' | 'headers';
Set the default state for the editor tools. -
false
hides the editor tools -true
shows the editor tools -'variables'
specifically shows the variables editor -'headers'
specifically shows the request headers editor By default, the editor tools are initially shown when at least one of the editors has contents.
property isHeadersEditorEnabled
isHeadersEditorEnabled?: boolean;
Toggle if the headers' editor should be shown inside the editor tools. true
method confirmCloseTab
confirmCloseTab: (index: number) => Promise<boolean> | boolean;
When the user clicks a close tab button, this function is invoked with the index of the tab that is about to be closed. It can return a promise that should resolve to
true
(meaning the tab may be closed) orfalse
(meaning the tab may not be closed).Parameter index
The index of the tab that should be closed.
interface GraphiQLProps
interface GraphiQLProps extends GraphiQLInterfaceProps, Omit<ComponentPropsWithoutRef<typeof GraphiQLProvider>, 'children'>, Omit<ComponentPropsWithoutRef<typeof HistoryStore>, 'children'> {}
API docs for this live here:
https://graphiql-test.netlify.app/typedoc/modules/graphiql.html#graphiqlprops
Package Files (2)
Dependencies (4)
Dev Dependencies (18)
Peer Dependencies (3)
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/graphiql
.
- Markdown[](https://www.jsdocs.io/package/graphiql)
- HTML<a href="https://www.jsdocs.io/package/graphiql"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 3146 ms. - Missing or incorrect documentation? Open an issue for this package.