POC: Use Codex in NewLexemeForm #747
Draft
Conversation
This file contains 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
|
Oh, oops, closed the wrong PR I think |
This sets up Codex components and design tokens so we can start using them. No actual components are migrated to Codex yet. Components from Wikit can be used directly in our own components. The build is set up so that, when Special:NewLexeme is used within MediaWiki, Codex will be imported from there; this means that our build should get substantially smaller once we don’t need Wikit anymore. In the dev entry point, Codex comes from node_modules/ as expected. (Notice that the styles are only imported in index.html, so they won’t be included in our build output either. As far as I could tell, Vite doesn’t have a CSS equivalent of `external` JS packages in vite.config.ts yet.) When MediaWiki upgrades to a new Codex version, Special:NewLexeme will use the new versions of the Codex components (and their styles) immediately. For the design tokens from Codex, we will start by directly importing them into each component that uses them, where they will end up being included (inlined) in the build. This means that design tokens used in our own components will be outdated after a MediaWiki upgrade to a new Codex version until we update this repository and push a new build to WikibaseLexeme. We will continue to investigate whether we can use them in some way that will automatically update them instead. (The solution will almost certainly involve using the tokens via CSS variables, but currently only a subset of the design tokens is available as CSS variables, and even then this depends on the skin. We might be able to get more variables added by MediaWiki, or we might add the variables in WikibaseLexeme ourselves.) Bug: T369505
Using the Button component from Codex instead of Wikit is straightforward – we just need to rename a few props. Using the variables is a bit more involved. Not only do we need replacement variables from Codex that aren’t always clear, but the small-text mixin used for the copyright notice also relies on the Wikit variables. So for now, this change just keeps importing the Wikit variables and lets Codex override them wherever they both use the same name. Bug: T369505
lucaswerkmeister
force-pushed
the
codex
branch
from
d88f944
to
7ea087a
Compare
lucaswerkmeister
force-pushed
the
codex-poc2
branch
from
bc773e6
to
6a7a13f
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Using the Button component from Codex instead of Wikit is straightforward – we just need to rename a few props.
Using the variables is a bit more involved. Not only do we need replacement variables from Codex that aren’t always clear, but the small-text mixin used for the copyright notice also relies on the Wikit variables. So for now, this change just keeps importing the Wikit variables and lets Codex override them wherever they both use the same name.
Bug: T369505
Based on #746.