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) or false (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 onejsDocs.io badgeto 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
            [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](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>