feat: ecosystem themes with new default styles #5701
Merged
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
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.
This pulls in the latest changes from kv-ui-elements, which updates the default theme with ecosystem colors. Pairs with kiva/cms-page-server#1667.
The change to the
exportsfield in the kv-components package.json required a change to how those components are imported. I was able to get the unit tests passing by changing the imports to the exact file name, e.g.import KvButton from '@kiva/kv-components/dist/components/KvButton.vue';, but that broke the linting rule that says we shouldn't include the file extension. Eslint also had problems recognizing the imports as we still use a commonjs-based eslint config.Switching to the "flat config" method of configuring eslint and using ecma-script modules for it would require a lot of work, and it would still mean needing to use the full file name to import components. Instead of doing that, I decided to make an alias for the components directory in kv-components so that the import is just
import KvButton from '#kv-components/KvButton';. After defining the alias in the eslint config, the jest config, the vite config, and after updating all the import statements, this allowed the linting, unit testing, and build process to succeed.In the future we could consider changing the build process for kv-components to use vite in library mode, which would generate a javascript bundle for the components. That would allow us to import components like this
import { KvButton, KvLoadingPlaceholder } from '@kiva/kv-components';but we wouldn't have access to the single-file components anymore, and that might affect server rendering performance.