From c2ef316a987aff12ce9cb663696e3f492cd30866 Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Fri, 9 Aug 2024 13:59:16 +0200 Subject: [PATCH 1/3] aa --- .changeset/orange-rivers-draw.md | 9 +++ .../package.json | 2 +- .../vite.config.mts | 5 +- .../graphiql-plugin-explorer/package.json | 2 +- .../graphiql-plugin-explorer/vite.config.mts | 2 +- packages/graphiql-react/package.json | 2 +- packages/graphiql-react/src/editor/hooks.ts | 2 - packages/graphiql/src/cdn.ts | 55 +++++++------------ packages/graphiql/src/index.ts | 5 +- 9 files changed, 42 insertions(+), 42 deletions(-) create mode 100644 .changeset/orange-rivers-draw.md diff --git a/.changeset/orange-rivers-draw.md b/.changeset/orange-rivers-draw.md new file mode 100644 index 00000000000..f87e0f7e852 --- /dev/null +++ b/.changeset/orange-rivers-draw.md @@ -0,0 +1,9 @@ +--- +'@graphiql/plugin-code-exporter': patch +'@graphiql/plugin-explorer': patch +'@graphiql/react': patch +--- + +use `vite build --watch` instead of `vite` for `dev` script because we don't need development server for them + +do not use `vite-plugin-dts` when generating umd build diff --git a/packages/graphiql-plugin-code-exporter/package.json b/packages/graphiql-plugin-code-exporter/package.json index 54f4df58631..24f00f62ab5 100644 --- a/packages/graphiql-plugin-code-exporter/package.json +++ b/packages/graphiql-plugin-code-exporter/package.json @@ -22,7 +22,7 @@ "dist" ], "scripts": { - "dev": "vite", + "dev": "vite build --watch", "build": "vite build && UMD=true vite build", "prebuild": "yarn types:check", "postbuild": "cp src/graphiql-code-exporter.d.ts dist/graphiql-code-exporter.d.ts", diff --git a/packages/graphiql-plugin-code-exporter/vite.config.mts b/packages/graphiql-plugin-code-exporter/vite.config.mts index b0f4cebfe5b..d1aa02f024e 100644 --- a/packages/graphiql-plugin-code-exporter/vite.config.mts +++ b/packages/graphiql-plugin-code-exporter/vite.config.mts @@ -6,7 +6,10 @@ import dts from 'vite-plugin-dts'; const IS_UMD = process.env.UMD === 'true'; export default defineConfig({ - plugins: [react({ jsxRuntime: 'classic' }), dts()], + plugins: [ + react({ jsxRuntime: 'classic' }), + !IS_UMD && dts({ rollupTypes: true }), + ], build: { minify: IS_UMD ? 'terser' // produce better bundle size than esbuild diff --git a/packages/graphiql-plugin-explorer/package.json b/packages/graphiql-plugin-explorer/package.json index 073353f0dc5..044f6d5c3fd 100644 --- a/packages/graphiql-plugin-explorer/package.json +++ b/packages/graphiql-plugin-explorer/package.json @@ -21,7 +21,7 @@ "dist" ], "scripts": { - "dev": "vite", + "dev": "vite build --watch", "build": "vite build && UMD=true vite build", "postbuild": "cp src/graphiql-explorer.d.ts dist/graphiql-explorer.d.ts", "prebuild": "yarn types:check", diff --git a/packages/graphiql-plugin-explorer/vite.config.mts b/packages/graphiql-plugin-explorer/vite.config.mts index e12c0cf76a4..637fee10fb0 100644 --- a/packages/graphiql-plugin-explorer/vite.config.mts +++ b/packages/graphiql-plugin-explorer/vite.config.mts @@ -15,7 +15,7 @@ export default defineConfig({ titleProp: true, }, }), - dts(), + !IS_UMD && dts({ rollupTypes: true }), ], build: { minify: IS_UMD diff --git a/packages/graphiql-react/package.json b/packages/graphiql-react/package.json index 5878a8ac46a..e27d53d4994 100644 --- a/packages/graphiql-react/package.json +++ b/packages/graphiql-react/package.json @@ -36,7 +36,7 @@ "font" ], "scripts": { - "dev": "vite", + "dev": "vite build --watch", "build": "vite build", "prebuild": "yarn types:check", "types:check": "tsc --noEmit" diff --git a/packages/graphiql-react/src/editor/hooks.ts b/packages/graphiql-react/src/editor/hooks.ts index e946c59926b..b96ec5eaaec 100644 --- a/packages/graphiql-react/src/editor/hooks.ts +++ b/packages/graphiql-react/src/editor/hooks.ts @@ -333,8 +333,6 @@ export function useAutoCompleteLeafs({ }, [getDefaultFieldNames, queryEditor, schema]); } -export type InitialState = string | (() => string); - // https://react.dev/learn/you-might-not-need-an-effect export const useEditorState = (editor: 'query' | 'variable' | 'header') => { diff --git a/packages/graphiql/src/cdn.ts b/packages/graphiql/src/cdn.ts index d7a5914f9dc..6ad0bceabc1 100644 --- a/packages/graphiql/src/cdn.ts +++ b/packages/graphiql/src/cdn.ts @@ -9,41 +9,28 @@ import { createGraphiQLFetcher, createLocalStorage } from '@graphiql/toolkit'; import * as GraphQL from 'graphql'; import { GraphiQL } from './components/GraphiQL'; -import '@graphiql/react/font/roboto.css'; -import '@graphiql/react/font/fira-code.css'; -import '@graphiql/react/dist/style.css'; -import './style.css'; - /** * For the CDN bundle we add some static properties to the component function * so that they can be accessed in the inline-script in the HTML file. */ - -/** - * This function is needed in order to easily create a fetcher function. - */ -// @ts-expect-error -GraphiQL.createFetcher = createGraphiQLFetcher; - -/** - * This function is needed in order to easily generate a custom storage namespace - */ -// @ts-expect-error -GraphiQL.createLocalStorage = createLocalStorage; - -/** - * We also add the complete `graphiql-js` exports so that this instance of - * `graphiql-js` can be reused from plugin CDN bundles. - */ -// @ts-expect-error -GraphiQL.GraphQL = GraphQL; - -/** - * We also add the complete `@graphiql/react` exports. These will be included - * in the bundle anyway since they make up the `GraphiQL` component, so by - * doing this we can reuse them from plugin CDN bundles. - */ -// @ts-expect-error -GraphiQL.React = GraphiQLReact; - -export default GraphiQL; +export default Object.assign(GraphiQL, { + /** + * This function is needed in order to easily create a fetcher function. + */ + createFetcher: createGraphiQLFetcher, + /** + * This function is needed in order to easily generate a custom storage namespace + */ + createLocalStorage, + /** + * We also add the complete `graphiql-js` exports so that this instance of + * `graphiql-js` can be reused from plugin CDN bundles. + */ + GraphQL, + /** + * We also add the complete `@graphiql/react` exports. These will be included + * in the bundle anyway since they make up the `GraphiQL` component, so by + * doing this we can reuse them from plugin CDN bundles. + */ + React: GraphiQLReact, +}); diff --git a/packages/graphiql/src/index.ts b/packages/graphiql/src/index.ts index b4ea740e2e5..7e0743bbcbc 100644 --- a/packages/graphiql/src/index.ts +++ b/packages/graphiql/src/index.ts @@ -4,11 +4,14 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ +import '@graphiql/react/font/roboto.css'; +import '@graphiql/react/font/fira-code.css'; +import '@graphiql/react/dist/style.css'; +import './style.css'; /** * GraphiQL */ - export { GraphiQLProvider } from '@graphiql/react'; /** From 1219ea3698a47d4023ae8ae5a1b7e48ac40a903e Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Fri, 9 Aug 2024 14:06:47 +0200 Subject: [PATCH 2/3] aa --- .changeset/gentle-bugs-mix.md | 17 +++++++++++++++++ packages/graphiql/src/index.ts | 6 +----- 2 files changed, 18 insertions(+), 5 deletions(-) create mode 100644 .changeset/gentle-bugs-mix.md diff --git a/.changeset/gentle-bugs-mix.md b/.changeset/gentle-bugs-mix.md new file mode 100644 index 00000000000..5b0efd51a4f --- /dev/null +++ b/.changeset/gentle-bugs-mix.md @@ -0,0 +1,17 @@ +--- +'graphiql': major +--- + +remove default export + +### Before + +```jsx +import GraphiQL from 'graphiql' +``` + +### After + +```jsx +import { GraphiQL } from 'graphiql' +``` diff --git a/packages/graphiql/src/index.ts b/packages/graphiql/src/index.ts index 7e0743bbcbc..2d465df577e 100644 --- a/packages/graphiql/src/index.ts +++ b/packages/graphiql/src/index.ts @@ -23,8 +23,4 @@ export type { } from './components/GraphiQL'; export type { GraphiQLProviderProps } from '@graphiql/react'; -export { - GraphiQLInterface, - GraphiQL, - GraphiQL as default, -} from './components/GraphiQL'; +export { GraphiQLInterface, GraphiQL } from './components/GraphiQL'; From d0f3c5bcfe597809a5c238b7986e6195e8e49502 Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Fri, 9 Aug 2024 14:14:39 +0200 Subject: [PATCH 3/3] polish --- .changeset/gentle-bugs-mix.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.changeset/gentle-bugs-mix.md b/.changeset/gentle-bugs-mix.md index 5b0efd51a4f..9bb1ae56ab2 100644 --- a/.changeset/gentle-bugs-mix.md +++ b/.changeset/gentle-bugs-mix.md @@ -4,6 +4,8 @@ remove default export +## Migration + ### Before ```jsx