v6: Restyle plugin-code-exporter to v6 design tokens#4296
Draft
trevor-scheer wants to merge 2 commits into
Draft
v6: Restyle plugin-code-exporter to v6 design tokens#4296trevor-scheer wants to merge 2 commits into
trevor-scheer wants to merge 2 commits into
Conversation
🦋 Changeset detectedLatest commit: 3144109 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
trevor-scheer
force-pushed
the
trevor/restyle-code-exporter
branch
from
a726917 to
1f2d761
Compare
Drop the runtime dependency on the unmaintained `graphiql-code-exporter`
package (and its transitive CodeMirror v5) and replace the plugin's
implementation with a first-party React component built on the v6
`DropdownMenu`, `ToolbarButton`, and `CopyIcon` primitives. The snippet
preview renders as a styled `<pre>` instead of a CodeMirror editor.
The `codeExporterPlugin({ snippets })` API is unchanged. The `Snippet`
shape stays source-compatible: `codeMirrorMode` and `options` become
optional and are ignored at runtime. The `codeMirrorTheme`, `variables`,
and `schema` props that the upstream component accepted are removed
(none were wired through to the GraphiQL surface).
Operation parsing is done with `graphql-js`'s `parse`/`print`; the
resulting `OperationData[]` matches what user snippets were already
receiving, including a `fragmentDependencies` list collected by walking
the AST for `FragmentSpread` references.
The new CSS is scoped to first-party class names (`.graphiql-code-exporter`,
`.graphiql-code-exporter-toolbar`, `.graphiql-code-exporter-select`,
`.graphiql-code-exporter-output`, `.graphiql-code-exporter-empty`) and
uses only v6 design tokens.
Pulls the plugin into the UMD `cdn.ts` bundle (so it survives the `removeImportsFromE2EFile` strip), exposes it on the `GraphiQL` global alongside `HISTORY_PLUGIN`, and registers it with two sample snippets (`fetch`, `curl`) on the main demo at the root of the Netlify deploy.
trevor-scheer
force-pushed
the
trevor/restyle-code-exporter
branch
from
1f2d761 to
3144109
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
@graphiql/plugin-code-exporterstyles to v6 OKLCH design tokens.{title, icon, content}) is preserved..docExplorerWrap,.doc-explorer-*) that no longer apply.Test plan
Refs: #4219