refactor(tokens)!: consume @cytario/design via @reference pattern - #166
Merged
Conversation
|
Linked to Plane Work Item(s) References This comment was auto-generated by Plane |
1 similar comment
|
Linked to Plane Work Item(s) References This comment was auto-generated by Plane |
dfrkp
approved these changes
Jul 23, 2026
Replace direct CSS imports from @cytario/design with Tailwind v4 @reference pattern: tokens.css is referenced for utility generation without emitting CSS, then the full styles.css is imported for runtime. - Replace app/tailwind.css with app/styles.css using @reference + @import + @source pattern - Consolidate multiple @cytario/design CSS imports into single styles.css - Remove tailwindcss-react-aria-components and tw-animate-css devDeps - Remove local font files (now provided by @cytario/design) - Update vite.config.ts: remove SSR noExternal (no longer needed), add fs.allow for design system source watching Part of C-349.
dahannes
force-pushed
the
refactor/c-349-design-token-consumption
branch
from
July 23, 2026 12:26
47224a5 to
532781e
Compare
|
🎉 This PR is included in version 4.14.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
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
2 participants
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.
C-349 — Design token pipeline migration
Migrates cytario-web to consume
@cytario/designusing Tailwind v4's@referencepattern, aligning with the design system refactor in cytario/cytario-design#27.Changes
Token consumption
app/tailwind.csswithapp/styles.cssusing the@reference+@import+@sourcepattern@reference "@cytario/design/styles/tokens.css"registers all design-system color tokens for utility generation without emitting duplicate CSS@import "@cytario/design/styles.css"provides runtime styles@source "../node_modules/@cytario/design/dist/"ensures component classes are detected@cytario/designCSS imports (styles.css,tokens/variables.css,tokens/variables-dark.css) into singlestyles.cssimportDependency cleanup
tailwindcss-react-aria-componentsandtw-animate-cssdevDeps (no longer needed — provided by the design system)public/fonts/*) — now provided by@cytario/designVite config
noExternalfor@cytario/design(no longer needed)fs.allowfor design system source directory watchingVerification
npm run build✅npm run typecheck✅npm run lint✅npm run format:check✅Prerequisite
Requires cytario/cytario-design#27 to be merged and a new version of
@cytario/designpublished.