Repository navigation
fix(extractor): compile Tailwind classes one by one with v4 variants and declarations - #705
Merged
Merged
Conversation
…and declarations Classes Tailwind does not define stay in the className as written, a class with a variant the compiler does not understand is left unchanged instead of applying unconditionally, and utilities emit every declaration Tailwind v4 writes: multi-declaration utilities in full, translate/rotate/scale/skew through their own properties so they compose, and arbitrary values read with Tailwind's grammar. Template classNames keep text that runs into an interpolation attached to it. Refs #687 Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
Contributor
Changepacks@devup-ui/wasm@1.0.83 → 1.0.84 - bindings/devup-ui-wasm/package.jsonPatch
@devup-ui/bun-plugin@1.0.22 → 1.0.23 - packages/bun-plugin/package.jsonPatch
@devup-ui/components@0.1.60 → 0.1.61 - packages/components/package.jsonPatch
@devup-ui/next-plugin@1.0.90 → 1.0.91 - packages/next-plugin/package.jsonPatch
@devup-ui/rsbuild-plugin@1.0.67 → 1.0.68 - packages/rsbuild-plugin/package.jsonPatch
@devup-ui/vite-plugin@1.0.73 → 1.0.74 - packages/vite-plugin/package.jsonPatch
@devup-ui/webpack-plugin@1.0.71 → 1.0.72 - packages/webpack-plugin/package.jsonPatch
|
Codecov Report✅ All modified and coverable lines are covered by tests.
🚀 New features to boost your workflow:
|
This was referenced Oct 3, 2026
Open
Resolve libs/extractor/src/tailwind.rs by preserving the new TailwindClass declaration/condition structure and the removal of the obsolete parser helper, matching the main integration in #749. Keep the Rust 1.99 assertion fixes and regenerate bun.lock workspace metadata for main published versions. Refs #687 Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
owjs3901
added a commit
that referenced
this pull request
Oct 6, 2026
Merge #705 head 031e8b5, which contains main a935315. Resolve libs/css/src/theme_tokens.rs by retaining the color/shadow token test and the Rust 1.99 typography assertion together, byte-for-byte matching #749; preserve all main integration and published versions. Refs #687 Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
owjs3901
added a commit
that referenced
this pull request
Oct 8, 2026
Resolved libs/extractor/src/tailwind.rs by retaining #749's nested declarations alongside #705's per-class v4 compilation and #734/#739 theme and utility integration. Resolved packages/bun-plugin/src/plugin.ts by retaining #703's SourceLoader/scanner/build stylesheet emission and #749's Tailwind watcher with its returned file list. Resolved packages/rsbuild-plugin/src/plugin.ts by combining #704's synchronous complete stylesheet helpers with #749's stat-based Tailwind watch invalidation. Resolved packages/rsbuild-plugin/src/__tests__/checkout-isolation.test.ts and plugin.test.ts by retaining #704's onBeforeBuild/rootPath setup alongside all Tailwind watcher tests. After reproducing four failing stylesheet tests, their shared test setup now selects the second Rspack config callback (stylesheet completion), while the first remains the Tailwind watcher. No snapshots or lockfiles were hand-merged, no PR intent was removed, and #734/#739/#749 remain separate PRs. Refs #687 Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
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.
문제
devup 컴포넌트(Box 등)
className의 Tailwind class를 빌드 타임에 변환하는 기능(기본 켜짐)이 다음 경우에 조용히 틀렸습니다(#687 필수 항목).className전체를 생성 class로 다시 만들어, Tailwind가 정의하지 않는 class(card,prose, 분석용 hook 등)가 지워졌습니다. 템플릿·조건식에서는 부분 문자열 치환으로my-p-4-class가my-padding-…-class로 바뀌었습니다.data-active:,not-hover:,max-md:,@sm:,[&>*]:등)를 버리고 utility를 무조건 적용했습니다.size-6→width만,rounded-t-lg→왼쪽 위만,truncate·sr-only·not-sr-only·text-sm등).transform하나를 써서 서로 덮어썼고,-translate-x-[13px]의 부호가 사라졌습니다.grid-cols-[200px_1fr]이repeat(200px 1fr, …)가 됐고,\_,[property:value],bg-(--x), 타입 힌트가 동작하지 않았습니다.hover:focus:가 자손 선택자(.x:hover:focus .x)가 됐고, hover에(hover: hover)가드가 없었으며, group/peer가 Tailwind의group/peer표시 class를 쓰지 않았습니다.className에서 보간 앞뒤에 공백을 끼워 넣어`icon-${name}`이icon- ${name},${a}${b}가${a} ${b}가 됐습니다(Tailwind와 무관, main에서도 재현).변경
p-${size},${tone}-text)도 그대로 둡니다. 문자열 치환은 없앴습니다.&에 대입해 겹칩니다:hover:focus:→&:hover:focus,*:hover:→:is(& > *):hoverhover(group-hover,peer-hover포함)는@media (hover: hover)안에 둡니다group-*/peer-*→&:is(:where(.group):hover *),&:is(:where(.peer):checked ~ *), 이름 있는group-hover/itemdata-*,data-[…],aria-*(불린 속성 9개),aria-[…],has-[…],has-<상태>,nth-*,*,**,supports-[…],[&…],[@media …]·[@supports …]·[@container …],optional,user-valid,user-invalid,inert,details-content,inverted-colors,noscript,pointer-*,any-pointer-*open→&:is([open], :popover-open, :open),rtl/ltr→&:where(:dir(rtl), …),selection/marker는 자손 포함(선택자마다 따로 규칙),before/after는content: var(--tw-content)추가dark:는 결정대로 devup theme(:root[data-theme=dark] &), breakpoint는 devup 단계를 그대로 씁니다not-*,in-*,max-*,min-[…],@container,starting, v4에 없는screen등)가 있으면 class 전체를 원문 그대로 둡니다size-*,rounded-{t,r,b,l,s,e}[-*],truncate,sr-only,not-sr-only,text-{size}(v4 line-height,leading-*가 있으면 그쪽 우선),text-sm/6·/[1.7]·/tight·/(--x),leading-*(--tw-leading함께)--tw-*변수와translate·scale·transform개별 속성으로, rotate는rotate속성으로 써서 함께 써도 합쳐집니다. 음수는 음수로 남습니다(임의 값은calc(v * -1))@property로 등록합니다(상속 안 함, 초기값 있음). 전역 CSS에 한 번만 나갑니다(여러 파일이 써도 하나)_→공백(url()안과var()의 이름은 제외),\_→_, 수학 함수 안 연산자 주위 공백(TailwindaddWhitespaceAroundMathOperators이식), 타입 힌트(length:,color:등, 모르는 힌트는 원문 유지),[property:value],root-(--변수), 값 종류 추론(text-[2rem]→font-size,text-[#fff]→color,border-[3px]→width 등)select-wrapper,order-summary,cursor-foo같은 class와align-*,whitespace-*,hyphens-*,tracking-*,touch-*,pointer-events-*,mix-blend-*,bg-blend-*,aspect-*,columns-*,col/row-start/end-*는 Tailwind 값일 때만 변환합니다\,`,${를 escape합니다동작 변화(의도한 것)
hover:는 hover할 수 있는 기기에서만 적용됩니다(v4와 같음)group-hover:등은role="group"/data-group이 아니라groupclass를 표시로 씁니다(Tailwind 마크업과 같음)text-*line-height,leading-*가 v4 값입니다새로 생기는 오류
없습니다. 이해하지 못한 class는 빌드 오류가 아니라 원문 유지입니다.
남은 항목(#687 권장)
space-*/divide-*자식 선택자(TW-05), 기본 팔레트·theme 값(TW-08), filter 합성(TW-07), gradient(TW-09),!·/50modifier(TW-11), keyframes(TW-12), 나머지 v4 utility(TW-14),clsx·배열(TW-15), 문서(TW-17), conformance 테스트(TW-18)검증
trigger-static,wrong-partial-replacement,wrong-variants,wrong-multideclaration,wrong-arbitrary)를 실제 WASM으로 probe: 모두 기대한 출력@media (hover: hover), 선언 목록, 값 디코딩을 대조cargo test --workspace통과,cargo clippy --workspace --all-targets -- -D warnings통과,cargo fmt@property한 번,translate합성,::beforecontent, hover 가드 CSS 확인bun test5474 pass, 커버리지 100%W40 main 반영 (2026-10-06)
a935315c34b45aeda6dc156e29a5c76df51b76bd까지 병합했습니다 (병합 head:031e8b542343419c37d160fa9851411bbc83193b).<div className="card a b c d e unknown:p-2" />;.a{padding:1rem},.c{--tw-translate-x:1rem},.d{translate:var(--tw-translate-x) var(--tw-translate-y)},.e{rotate:45deg},@media(hover:hover){.b:hover{background-color:#EF4444}}를 확인했습니다. Windows 원래 줄 형식 tarpaulin97.97%와 LSP 시간 초과는 기록했으며 Ubuntu 필수 gate는100%입니다.