move tab components to @graphiql/react (#2591)

graphql · Aug 9, 2022 · 766818d · 766818d
1 parent 3b7fdff
commit 766818d
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 11 deletions.
diff --git a/.changeset/five-pillows-fail.md b/.changeset/five-pillows-fail.md
@@ -3,7 +3,7 @@
 ---
 
 Add new components:
-- UI components (`Button`, `Dropdown`, `Spinner`, `UnStyledButton` and lots of icon components)
+- UI components (`Button`, `Dropdown`, `Spinner`, `Tab`, `TabAddButton`, `Tabs`, `UnStyledButton` and lots of icon components)
 - Editor components (`QueryEditor`, `VariableEditor`, `HeaderEditor` and `ResponseEditor`)
 - Toolbar components (`ExecuteButton` and `ToolbarButton`)
 - Docs components (`Argument`, `DefaultValue`, `DeprecationReason`, `Directive`, `DocExplorer`, `ExplorerSection`, `FieldDocumentation`, `FieldLink`, `SchemaDocumentation`, `Search`, `TypeDocumentation` and `TypeLink`)

diff --git a/packages/graphiql-react/src/ui/index.ts b/packages/graphiql-react/src/ui/index.ts
@@ -2,3 +2,4 @@ export * from './button';
 export * from './dropdown';
 export * from './markdown';
 export * from './spinner';
+export * from './tabs';
diff --git a/packages/graphiql/src/components/Tabs.tsx → packages/graphiql-react/src/ui/tabs.tsx b/packages/graphiql/src/components/Tabs.tsx → packages/graphiql-react/src/ui/tabs.tsx
@@ -1,9 +1,3 @@
-import React from 'react';
-
-/**
- * TODO: extract with other components to @graphiql/react
- */
-
 function TabCloseButton(props: { onClick: () => void }) {
   return (
     <div
@@ -20,7 +14,7 @@ function TabCloseButton(props: { onClick: () => void }) {
   );
 }
 
-export type TabProps = {
+type TabProps = {
   isActive: boolean;
   title: string;
   isCloseable: boolean;
@@ -59,7 +53,7 @@ export function TabAddButton(props: { onClick: () => void }) {
   );
 }
 
-export type TabsProps = {
+type TabsProps = {
   children: Array<React.ReactNode>;
   tabsProps?: React.HTMLAttributes<{}>;
 };

diff --git a/packages/graphiql/__mocks__/@graphiql/react.tsx b/packages/graphiql/__mocks__/@graphiql/react.tsx
@@ -69,6 +69,9 @@ export {
   StopIcon,
   StorageContext,
   StorageContextProvider,
+  Tab,
+  TabAddButton,
+  Tabs,
   ToolbarButton,
   TypeDocumentation,
   TypeIcon,

diff --git a/packages/graphiql/src/components/GraphiQL.tsx b/packages/graphiql/src/components/GraphiQL.tsx
@@ -46,6 +46,9 @@ import {
   SettingsIcon,
   Spinner,
   StorageContextProvider,
+  Tab,
+  TabAddButton,
+  Tabs,
   ToolbarButton,
   UnStyledButton,
   useAutoCompleteLeafs,
@@ -78,8 +81,6 @@ import find from '../utility/find';
 import { formatError, formatResult } from '@graphiql/toolkit';
 import type { Fetcher, GetDefaultFieldNamesFn } from '@graphiql/toolkit';
 
-import { Tab, TabAddButton, Tabs } from './Tabs';
-
 const majorVersion = parseInt(React.version.slice(0, 2), 10);
 
 if (majorVersion < 16) {