fix(extractor): locate diagnostics and enforce deterministic evaluation

[owjs3901]

Refs #685, #694 (W19가 확인한 오류 위치, 결정적 build-time 평가). #750 위에 쌓은 브랜치이며 #750과 그 선행 PR들이 먼저 병합되어야 합니다. PR base는 요청대로 main입니다.

요약

extractor의 파싱, 모듈 해석, stylesheet 실행 오류를 원본 파일:줄:열과 원인·수정 방법으로 보고합니다. TypeScript 제거, import 별칭, 모듈 치환, 생성 prelude를 역매핑하므로 가져온 helper/stylesheet와 import-cycle 조기 읽기도 실제 원본 위치를 가리킵니다.

두 Boa 평가 경로가 공통 deterministic sandbox를 사용합니다. 실행에서 실패한 stylesheet를 일반 추출로 다시 처리해서 CSS를 내보내지 않으며, 원래 코드의 의미와 정확히 같은 정적 추출만 실행 전에 선택합니다.

동작

• 최초 베이스 29812f376f62b74071080aec2f35efb9f0424d0f를 직접 빌드한 WASM에서 요청한 다섯 항목을 모두 먼저 재현했습니다.
• fatal Oxc parse는 첫 parser diagnostic의 원본 label 위치와 Oxc 메시지를 보존합니다.
• import/re-export/literal require 해석 실패는 이를 요구한 원본 파일과 위치를 표시합니다. JS resolver callback·getter 예외와 잘못된 반환값은 일반 cannot-resolve로 바꾸지 않고 원래 원인을 유지합니다.
• 실행 및 객체 직렬화 오류도 같은 위치 매핑을 사용하며, 생성 코드의 좌표를 사용자 코드의 좌표로 표시하지 않습니다.
• 금지된 읽기는 호스트가 기록하므로 사용자 코드가 예외를 catch해도 빌드가 실패합니다. 시간·난수·환경·locale 값 대신 literal 또는 CSS 변수를 사용해야 합니다.
• 합법적인 변수 이름 __style_1__이 내부 placeholder와 충돌해 export/CSS를 잃던 문제를 별도 map으로 이름을 옮겨 수정했습니다. getter·toJSON 등의 예외가 빈 스타일로 바뀌던 직렬화도 오류를 전파합니다.
• 새 runtime과 의존성을 추가하지 않았습니다. changepack은 WASM package Patch만 포함합니다.
• package 이름의 단순 prefix를 API package로 오인하던 버그도 수정했습니다. @devup-ui/react-values나 사용자 지정 @my/ui-tokens는 외부 module로 해석해 알려진 값을 static CSS로 inline하며, bare package와 /compat 등 실제 subpath는 그대로 API package로 취급합니다. 모든 비정확 import 경계 비교는 같은 helper를 사용하며 새로운 오류는 추가하지 않습니다.
• 평가한 helper의 CSS import는 stripped module에 남는 import만 유지합니다. bare import는 항상, TS value import는 binding의 value 참조가 있을 때, JS/JSX/MJS/CJS는 unused value import도 유지합니다. helper import 위치에서 dependency-first 깊이 우선·source 순서로 출력하고 root의 직접 import까지 같은 resolved file의 첫 발생만 남깁니다. helper 디렉터리에서 resolver로 찾은 파일을 root-relative ./ 또는 ../ 경로와 forward slash로 내보내며 query suffix를 보존합니다. CSS content는 extractor dependency가 아니고, helper JavaScript의 효과는 build-time에만 실행됩니다.
• CSS module binding의 class 이름은 추측하지 않습니다. default/namespace 객체 자체를 전달하거나 typeof로 확인하는 것은 허용하지만 property·conversion·in·열거·descriptor·prototype 관찰과 named binding의 value 읽기는 호스트가 기록하여 catch 후에도 실패합니다. 실행되지 않는 함수 안의 읽기는 오류가 아니며 해당 value import는 유지합니다.

새로 생기는 오류

변경되거나 추가된 메시지는 모두 원본 위치와 원인·수정 방법을 포함합니다.

• source parse: 치명적인 오류뿐 아니라 Oxc가 복구할 수 있는 문법 오류와 semantic early error도 trigger입니다. 잘못된 JSX, 최상위 return, 잘못된 정규식, 중복 lexical 선언, module의 legacy octal을 포함하며 Cannot parse source: <Oxc 메시지>의 원본 지점에서 문법을 고칩니다. 오류가 있는 소스를 유효해 보이는 JS로 고쳐 쓰거나 CSS와 함께 성공시키지 않습니다.
• 지원하지 않는 확장자: 입력 파일의 위치와 기존 Unknown file extension 원인을 보고합니다. 지원하는 JS/TS 확장자를 사용합니다.
• stylesheet parser/semantic 오류: 잘못된 imported source와 중복 lexical 선언을 실행 전에 차단합니다. 표시된 원본 위치의 문법/선언을 고칩니다.
• module resolver 없음/미해석: 값을 읽는 import/re-export/literal require가 trigger입니다. Devup plugin의 resolver를 사용하거나 import 경로·파일·bundler 해석 설정을 고칩니다.
• root CommonJS stylesheet의 package require도 module error를 fallback으로 숨기지 않고 실제 require 위치에서 보고합니다. stylesheet API는 ESM import로 작성하거나 해당 module 경로와 resolver 원인을 고쳐야 하며, 실패한 CommonJS 실행을 CSS와 함께 성공시키지 않습니다.
• JS resolver 예외/잘못된 결과: callback, path/code getter 예외 또는 non-object/non-string/빈 path가 trigger입니다. 원래 메시지를 유지하며 resolver를 고치고 {path:string,code:string} 또는 미해석을 뜻하는 null/undefined를 반환합니다.
• stylesheet 실행 예외: 사용자 throw, 잘못된 값 접근·호출·생성, import-cycle 초기화 전 읽기, imported helper/stylesheet 예외가 trigger입니다. 원인을 고치거나 cycle을 없애고 두 모듈 초기화 뒤에 읽습니다.
• 비결정적 읽기: Date, Math.random, performance, crypto, host/browser/process 환경, Intl/locale/Unicode 의존 읽기가 trigger입니다. catch해도 실패하며 literal 또는 CSS 변수를 사용합니다.
• guard로 교체한 intrinsic의 descriptor나 변환된 function source를 읽어 CSS를 고르는 경우도 실패합니다. Object/Reflect descriptor API 및 legacy __lookupGetter__/__lookupSetter__가 synthetic accessor 정보로 다른 CSS를 조용히 선택하지 않도록 원래 guarded slot을 추적하고, Function.prototype.toString은 build instrumentation이 바꾸는 source text를 반환하므로 literal/CSS 변수로 바꾸도록 안내합니다. 일반 사용자 객체의 getter/setter/descriptor와 명시적으로 덮어쓴 사용자 값은 유지합니다.
• 스타일/export 객체 직렬화 예외: getter, toJSON, proxy/array 읽기와 cyclic rule 직렬화 실패가 trigger입니다. 던지는 코드나 cycle을 없애고 정확히 직렬화할 수 있는 static data를 사용합니다.
• serializer 설정 오류: 사용자 코드가 JSON.stringify를 호출 불가능한 값으로 바꾼 경우 JSON.stringify is not callable 원인을 그대로 보고합니다. 내장 serializer를 덮어쓰지 않습니다.
• 내부 source-map 오류: retained stylesheet 코드에 필요한 map/content가 없거나 잘못된 map을 읽는 경우 Cannot trace retained stylesheet code 또는 Cannot read stylesheet source map과 원인을 파일 위치로 보고합니다. 내부 오류를 재현 가능한 원본과 함께 보고하도록 안내하며, 잘못된 좌표나 빈 CSS로 대신 성공하지 않습니다.
• 내부 build-time helper 초기화 오류: 초기화가 실제로 실패하면 원래 JavaScript 원인과 report internal evaluation setup failure 안내를 유지합니다. 사용자 소스를 임의로 바꾸거나 오류를 빈 결과로 대신하지 않고 재현 가능한 입력과 함께 내부 오류를 보고합니다.
• 실제 실행 실패 뒤의 fallback은 삭제했습니다. 단순히 Devup API import가 없어졌다는 이유로 오류를 숨기지 않습니다. 실행 전의 정적 증명이 통과하는 모듈만 일반 추출하며, 그 밖의 모듈은 실행의 성공이 필요합니다.
• imported literal의 값이 알려졌다는 사실만으로 helper의 실행 효과를 건너뛰지 않습니다. helper의 throw나 catch한 금지 읽기도 실제 helper의 원본 위치에서 실패합니다. 반면 실행되지 않는 함수 선언과 정확한 Devup helper 계산은 일반 .tsx와 동일한 결과를 유지합니다(twice(3)을 w에 주면 Devup spacing 변환으로 24px).
• 평가하는 helper가 bare import로 읽는 JavaScript dependency의 실행 효과도 유지합니다. transitive dependency의 throw와 catch한 Date 읽기는 해당 dependency의 원본 위치에서 실패하며, 정상 dependency도 watch 목록에서 빠지지 않습니다. 원래 유지하던 외부/CSS side-effect import 규칙은 별도로 보존합니다.
• helper CSS 해석 실패: style import를 찾지 못하면 helper의 원본 import 위치, specifier, helper를 통해 stylesheet가 CSS를 불러오지만 파일을 찾을 수 없다는 원인과 correct the path or import CSS from a component module 수정 방법을 보고합니다. 다른 Windows drive 또는 호환되지 않는 root이면 원본 import 위치에서 양쪽 경로를 보고하고 같은 drive를 쓰거나 component module에서 CSS를 import하도록 안내합니다. 절대 경로 import로 대체하지 않습니다.
• CSS export 관찰: bundler가 생성하는 class 이름은 build-time에 알 수 없으므로 default/namespace의 property·conversion·in·키 열거·descriptor·prototype 관찰이나 named binding의 value 읽기는 첫 실제 원본 읽기 위치, CSS 파일, key 또는 operation을 보고합니다. catch하거나 예외 객체를 바꾸어도 실패하며 같은 site의 반복 읽기는 하나로 기록합니다. Fix는 한 번만 표시하고 runtime component의 className={styles.card}에서 읽거나 css()로 스타일을 쓰도록 안내합니다.

남는 한계

theme/devup.json과 plugin config loading은 W34, StyleX는 #758 범위라 수정하지 않았습니다. vanilla-extract theme 계약과 cross-module vars는 W35이며, 기존 Vite plugin 문제는 #755 범위입니다. imported_constants의 shadowed require 탐색은 #756 (W22c)에 coordinator를 통해 보고했으며 해당 브랜치를 합치지 않았습니다.

helper의 CSS import를 찾지 못한 실패 경로는 성공한 extraction의 dependency 목록을 bundler에 반환할 수 없습니다. 누락 CSS 파일을 생성한 뒤 stylesheet를 다시 저장해 재변환해야 합니다. 성공 시 CSS content를 extractor dependency에 넣지 않고 출력 import로 bundler가 추적하므로 정상 CSS 수정은 CSS HMR 경로를 유지합니다.

TypeScript의 기본 import elision을 따르므로 binding이 value로 참조되지 않는 TS CSS import는 유지하지 않습니다. .js/.jsx/.mjs/.cjs는 unused value import도 유지합니다. verbatimModuleSyntax/preserveValueImports 설정을 읽는 기능은 이 PR에 포함되지 않으므로 해당 프로젝트의 unused TS value import 보존 설정은 남는 한계이며 coordinator가 별도로 라우팅합니다.

같은 source에 있던 sandbox prelude가 정확한 local Math 상수까지 TDZ로 막던 경우도 제거했습니다. local max: () => 1은 builtin Math.max로 취급하지 않고 실제 1을 계산하며, 회귀 테스트는 Devup 변환 결과 width:4px 전체를 검증합니다. 정적으로 알 수 없는 shadowed Math/ambient 선언 입력은 기존 오류 또는 CSS 변수 경로를 유지합니다.

검증

• 최종 head: 6d0c9c837598a08103051f51effda5ea65ffb2fc. Linux CI 37272641562는 Rust coverage 13650/13650 = 100.00%, 테스트, publish의 landing E2E 두 모드, landing-next-e2e, vinext-rsc-css-e2e 및 benchmark를 통과했습니다. 전체 conclusion은 failure이며 유일하게 실패한 step은 Upload to codecov.io입니다. cli.codecov.io의 Codecov CLI 다운로드에서 curl: (35) ... sslv3 alert handshake failure가 발생했고 뒤이어 내려받지 못한 codecov.SHA256SUM.sig의 GPG 확인이 실패한 외부 장애입니다. workflow나 검증을 약화하지 않았고, coordinator가 서비스 복구 뒤 실패 job을 재실행·확인합니다. upload 성공이나 전체 green을 주장하지 않습니다. Verify clean publish checkout과 changepack publish 단계는 skipped이므로 통과·배포로 표시하지 않습니다.
• native workspace 테스트 3133개(그중 extractor 2410개), Rust 1.99 all-target clippy, cargo fmt, root build 및 모든 커밋의 기본 hook을 통과했습니다. lint는 0 error와 기존 2 warning입니다.
• Bun: 로컬 5504 pass / 0 fail, Linux CI 5512 pass / 0 fail. CI aggregate 함수·줄 coverage 100%; 별도 로컬 파일인 기존 Vite comment line 303의 99.63%는 fix(plugin-core): align bundler resolution, roots and WASM diagnostics #755 범위이며 수정하지 않았습니다. publish의 Bun preload 회귀 6개와 landing E2E 130개씩 두 모드도 성공했습니다.
• 최종 재빌드 WASM의 48개 공개 probe: 48 PASS. 아래 출력은 실제 before/after이며 긴 로컬 prefix와 공통 theme header만 줄였습니다.
• package 경계 공개 probe: 별도 12 PASS. 기본·사용자 지정 package의 sibling 값은 static CSS로, 실제 bare/subpath API는 기존대로 처리하며 sibling side-effect import도 잃지 않습니다.
• 추가 공개 probe: proof gap 15, Oracle repair 12, CSS import retention 13, CSS observation 17개 모두 PASS. CSS observation은 catch한 금지 관찰 14개가 원본 위치의 fatal 오류이며 typeof·객체 전달·미호출 함수 3개는 성공합니다.
• 직전 repair head CI 37267674033은 coverage 13645/13650 = 99.96%만 실패했고 benchmark/Next/vinext는 성공했습니다. CI가 가리킨 absolute-root/leading-relative-parent path normalization 및 computed/private member provenance를 인접한 의미 있는 테스트로 보강했습니다. coverage 제외 없이 최종 run에서 다시 측정했습니다.
• Windows 기본 main-thread stack에서 unchanged debug benchmark 14개 전부 성공했습니다. stack 환경 변수·linker flag·큰 stack thread·benchmark 제외는 없습니다. 기존 베이스의 all-target LLVM coverage 97.86%와 Windows 측정은 Linux 100% 판정을 대신하지 않습니다.
• Rust LSP daemon은 timeout, JS LSP는 설치되지 않아 LSP-clean은 주장하지 않습니다. 실제 compiler/clippy/test/WASM 및 Linux CI로 검증했습니다.
• foreground read-only delta Oracle 1회는 legacy accessor lookup 및 evaluated helper의 bare dependency 누락 두 P1을 발견해 REJECT했습니다. 두 항목은 failing-before 회귀, 별도 수정 commit 및 재빌드 WASM/native/CI로 해소했습니다(gate-delta-resolution.md). coordinator 지시대로 두 번째 Oracle는 호출하지 않았으며 첫 판정은 승인으로 바꾸지 않았습니다.
• gate 이전 head 3dc297ca의 CI 37245692977은 두 attempt 모두 Rust 13430/13430 = 100% 및 테스트/E2E/benchmark를 통과했고 Codecov CLI 인증서/TLS/GPG 다운로드만 실패했습니다. 최종 repair head의 측정은 위 새 run에 따로 기록합니다.

Oracle 지적별 해소

• imported literal만 확인하고 helper의 throw/금지 읽기를 건너뛰던 정적 증명: dca611f6에서 dependency graph의 실행 효과까지 재귀적으로 증명한 뒤에만 exact precompute를 허용했습니다. helper/transitive throw·caught Date·cycle negative와 pure helper control이 15개 공개 probe로 검증되었습니다.
• inert 함수 선언과 exact twice(3) 계산을 stylesheet가 잘못 거부: Function shape를 plain data와 구분하고 기존 exact evaluator를 실행 전 dispatch에 재사용했습니다. 미호출 함수는 성공하고 호출한 Date 함수는 실패하며 .css.ts와 .tsx 모두 width:24px입니다. Function/data branch join gap도 별도 9개 회귀로 막았습니다.
• 일반 extractor의 recoverable parser/semantic early error 수용: 06c66b96에서 parser diagnostic, regex 검증 및 semantic syntax 검증의 첫 원본 label을 전파했습니다. 최상위 return·잘못된 regex·중복 const·octal의 이전 성공이 원본 위치의 build error로 바뀐 실제 출력은 아래에 있습니다.
• synthetic getter 노출로 red 대신 blue CSS 선택: descriptor/Function-source guard를 보강한 뒤 042d6a69에서 legacy getter/setter의 반환 accessor identity까지 호스트가 추적하고 throw 전에 기록했습니다. 일반 사용자 accessor와 override는 유지하며 anonymous callee의 sparse source-map mark를 구조적으로 보완해 정확한 원본 expression token을 보고합니다. legacy 6개 fatal과 일반 accessor/override 3개 control을 공개 WASM으로 검증했습니다.
• evaluated helper의 bare dependency 누락: 042d6a69에서 기존 loader/cache/cycle/definition 경로로 helper의 JavaScript bare dependency를 source/DFS 순서대로 한 번 실행하고 dependency 목록에 남겼습니다. effect 파일의 throw·caught Date는 원본 effect 위치에서 실패하고 pure effect/helper는 둘 다 추적됩니다. 확장한 CSS retention/관찰 규칙도 13+17개 공개 probe와 인접 native 회귀로 검증했습니다.

parser: before / after

BEFORE
=== ERROR ===
Parser panicked
AFTER
=== ERROR ===
fixtures/syntax-before.tsx:2:31: Cannot parse source: Unterminated regular expression. Fix: correct the syntax at this location

no-resolver: before / after

BEFORE
=== ERROR ===
Cannot load './tokens' without a module resolver
AFTER
=== ERROR ===
fixtures/resolve.css.ts:2:23: Cannot load './tokens' without a module resolver. Fix: build through a Devup UI plugin, which resolves imports, or write what './tokens' provides in this file

missing: before / after

BEFORE
=== ERROR ===
Cannot resolve './missing' from 'fixtures/missing-before.css.ts'
AFTER
=== ERROR ===
fixtures/missing-before.css.ts:2:23: Cannot resolve './missing' from 'fixtures/missing-before.css.ts'. Fix: check that './missing' exists with a supported extension and that the bundler's resolver can find it from this file

cycle: before / after

BEFORE
=== ERROR ===
JS execution error: ReferenceError: Cannot access 'color' of 'fixtures/cycle-a.ts' before its initialization: it is part of an import cycle (unknown at :11:3)
    at get (unknown at :1:157)
    at <main> (unknown at :9:28)
    at <main> (unknown at :11:3)
AFTER
=== ERROR ===
fixtures/cycle-b.ts:2:22: JS execution error: ReferenceError: Cannot access 'color' of 'fixtures/cycle-a.ts' before its initialization: it is part of an import cycle. Fix: break the import cycle, or read the imported value only after both modules finished evaluating, for example inside a function called later
    at <main> (fixtures/cycle-b.ts:2:22)

throw: before / after

BEFORE
=== ERROR ===
JS execution error: Error: fixture boom (unknown at :2:7)
    at <main> (unknown at :2:7)
AFTER
=== ERROR ===
fixtures/throw-before.css.ts:2:7: JS execution error: Error: fixture boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (fixtures/throw-before.css.ts:2:7)

imported-stylesheet: before / after

BEFORE
=== ERROR ===
JS execution error: Error: imported stylesheet boom (unknown at :3:7)
    at <main> (unknown at :3:7)
AFTER
=== ERROR ===
fixtures/broken.css.ts:4:7: JS execution error: Error: imported stylesheet boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (fixtures/broken.css.ts:4:7)

imported-helper: before / after

BEFORE
=== ERROR ===
JS execution error: Error: imported helper boom (unknown at :13:3)
    at fail (unknown at :9:8)
    at <main> (unknown at :11:19)
    at <main> (unknown at :13:3)
AFTER
=== ERROR ===
fixtures/broken-helper.ts:4:9: JS execution error: Error: imported helper boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at fail (fixtures/broken-helper.ts:4:9)
    at <main> (fixtures/broken-helper.ts:6:34)

resolver-throw: before / after

BEFORE
=== ERROR ===
Cannot resolve './tokens' from 'fixtures/resolve.css.ts'
AFTER
=== ERROR ===
fixtures/resolve.css.ts:2:23: module resolver failed for `./tokens` from `fixtures/resolve.css.ts`: resolver fixture: permission denied
Fix: repair the module resolver; return {path:string,code:string} with a non-empty path, or null/undefined for an unresolved module.

resolver-getter: before / after

BEFORE
=== ERROR ===
Cannot resolve './tokens' from 'fixtures/resolve.css.ts'
AFTER
=== ERROR ===
fixtures/resolve.css.ts:2:23: module resolver failed for `./tokens` from `fixtures/resolve.css.ts`: resolver fixture: path getter failed
Fix: repair the module resolver; return {path:string,code:string} with a non-empty path, or null/undefined for an unresolved module.

resolver-malformed: before / after

BEFORE
=== ERROR ===
Cannot resolve './tokens' from 'fixtures/resolve.css.ts'
AFTER
=== ERROR ===
fixtures/resolve.css.ts:2:23: module resolver failed for `./tokens` from `fixtures/resolve.css.ts`: malformed module resolver result: `path` must be a string
Fix: repair the module resolver; return {path:string,code:string} with a non-empty path, or null/undefined for an unresolved module.

clock-first: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{width:1791113503291px}
AFTER
=== ERROR ===
fixtures/clock.css.ts:2:39: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (fixtures/clock.css.ts:2:39)

clock-second: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{width:1791113503389px}
AFTER
=== ERROR ===
fixtures/clock.css.ts:2:39: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (fixtures/clock.css.ts:2:39)

caught-clock: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{width:1791113502929px}
AFTER
=== ERROR ===
fixtures/caught-clock.css.ts:3:15: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (fixtures/caught-clock.css.ts:3:15)

devup-fallback: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
throw new Error("fixture boom");
export const red = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/css-fallback.css.ts:2:7: JS execution error: Error: fixture boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (fixtures/css-fallback.css.ts:2:7)

style-getter-throw: before / after

BEFORE
=== CODE ===
export const card = "";
=== CSS (theme header omitted) ===

AFTER
=== ERROR ===
fixtures/getter-throw.css.ts:2:49: JS execution error: Error: style getter boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at get width (fixtures/getter-throw.css.ts:2:49)
    at stringify (native)
    at style (native)
    at <main> (fixtures/getter-throw.css.ts:2:26)

placeholder-name: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const second = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const __style_1__ = "a";
export const second = "b";
=== CSS (theme header omitted) ===
.b{color:blue}.a{color:red}

gate effects-throw: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import { color } from "./helper";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/effects-throw.ts:2:7: JS execution error: Error: helper boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (fixtures/effects-throw.ts:2:7)

gate effects-caught-clock: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import { color } from "./helper";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/effects-caught-clock.ts:2:7: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (fixtures/effects-caught-clock.ts:2:7)

gate unused-function: before / after

BEFORE
=== ERROR ===
/src/card.css.ts:3:24: JS execution error: TypeError: not a callable function. Fix: check that every value read, called or constructed here exists when the stylesheet is evaluated at build time
    at <main> (/src/card.css.ts:3:24)
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
function unused() {}
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

gate twice-css: before / after

BEFORE
=== ERROR ===
/src/card.css.ts:3:24: JS execution error: TypeError: not a callable function. Fix: check that every value read, called or constructed here exists when the stylesheet is evaluated at build time
    at <main> (/src/card.css.ts:3:24)
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
const twice = (n: number) => n * 2;
export const card = "a";
=== CSS (theme header omitted) ===
.a{width:24px}

recoverable-0: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
return 1;
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/recoverable-0.tsx:2:1: Cannot parse source: A 'return' statement can only be used within a function body. Fix: correct the syntax at this location

recoverable-1: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
const invalid = /[z-a]/;
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/recoverable-1.tsx:2:20: Cannot parse source: Invalid regular expression: Character class atom range out of order. Fix: correct the syntax at this location

recoverable-2: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
const repeated = 1;
const repeated = 2;
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/recoverable-2.tsx:2:7: Cannot parse source: Identifier `repeated` has already been declared. Fix: correct the syntax at this location

recoverable-3: before / after

BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
const invalid = 1;
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
fixtures/recoverable-3.tsx:2:17: Cannot parse source: '0'-prefixed octal literals and octal escape sequences are deprecated. Fix: correct the syntax at this location

guarded-descriptors: 기록된 이전 관찰 / 실제 after

descriptor-result.md의 기존 WASM 관찰: export const card = "a"; 및 .a{color:blue}. 보호용 accessor의 value가 undefined인 정보를 노출해 일반 JS와 다른 분기를 선택했습니다.

AFTER
=== ERROR ===
fixtures/reflected-random.css.ts:2:36: JS execution error: ReferenceError: `Math.random` cannot be read at build time: the chance it gives differs on every build. Fix: use a literal or a CSS variable for `Math.random`: the chance it gives differs on every build
    at <read> (fixtures/reflected-random.css.ts:2:36)

function-source: 기록된 이전 관찰 / 실제 after

W32-progress.md의 기존 WASM 관찰: 함수에 삽입한 _devup_read_site 문자열을 읽어 blue CSS를 선택했습니다. 원래 함수 소스를 읽는 의미를 보존하지 못했습니다.

AFTER
=== ERROR ===
fixtures/function-source.css.ts:3:36: JS execution error: ReferenceError: `Function.prototype.toString` cannot be read at build time: its text changes when the build transforms the function. Fix: use a literal or a CSS variable for `Function.prototype.toString`: its text changes when the build transforms the function
    at <read> (fixtures/function-source.css.ts:3:36)

package 경계: 실제 before / after 12개

@devup-ui/react:css-sibling
BEFORE
=== ERROR ===
/src/shared.ts:1:108: `css()` cannot use `value` at build time: its values must be literals, theme tokens or constants, or be computed from them
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import { value } from "@devup-ui/react-values";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

@devup-ui/react:jsx-sibling
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import { value } from "@devup-ui/react-values";
export const View = <div className="a c" style={{ "--b": value }} />;
=== CSS (theme header omitted) ===
.a{color:var(--b)}.c{padding:16px}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import { value } from "@devup-ui/react-values";
export const View = <div className="a b" />;
=== CSS (theme header omitted) ===
.a{color:red}.b{padding:16px}

@devup-ui/react:api
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

@devup-ui/react:api/compat
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

@devup-ui/react:side-effect-sibling
BEFORE
=== CODE ===
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

AFTER
=== CODE ===
import "@devup-ui/react-values";
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

@devup-ui/react:generated-css-subpath
BEFORE
=== CODE ===
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

AFTER
=== CODE ===
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

@my/ui:css-sibling
BEFORE
=== ERROR ===
/src/shared.ts:1:90: `css()` cannot use `value` at build time: its values must be literals, theme tokens or constants, or be computed from them
AFTER
=== CODE ===
import "@my/ui/devup-ui.css";
import { value } from "@my/ui-tokens";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

@my/ui:jsx-sibling
BEFORE
=== CODE ===
import "@my/ui/devup-ui.css";
import { value } from "@my/ui-tokens";
export const View = <div className="a c" style={{ "--b": value }} />;
=== CSS (theme header omitted) ===
.a{color:var(--b)}.c{padding:16px}
AFTER
=== CODE ===
import "@my/ui/devup-ui.css";
import { value } from "@my/ui-tokens";
export const View = <div className="a b" />;
=== CSS (theme header omitted) ===
.a{color:red}.b{padding:16px}

@my/ui:api
BEFORE
=== CODE ===
import "@my/ui/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@my/ui/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

@my/ui:api/compat
BEFORE
=== CODE ===
import "@my/ui/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@my/ui/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

@my/ui:side-effect-sibling
BEFORE
=== CODE ===
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

AFTER
=== CODE ===
import "@my/ui-tokens";
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

@my/ui:generated-css-subpath
BEFORE
=== CODE ===
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

AFTER
=== CODE ===
export const token = "var(--var-0-0)";
=== CSS (theme header omitted) ===

Oracle 두 P1 해소: 실제 before / after 12개

legacy-function-getter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:blue}
AFTER
=== ERROR ===
/src/card.css.ts:3:38: JS execution error: ReferenceError: `Function.prototype.toString` cannot be read at build time: its text changes when the build transforms the function. Fix: use a literal or a CSS variable for `Function.prototype.toString`: its text changes when the build transforms the function
    at <read> (/src/card.css.ts:3:38)

legacy-math-getter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:blue}
AFTER
=== ERROR ===
/src/card.css.ts:3:37: JS execution error: ReferenceError: `Math.random` cannot be read at build time: the chance it gives differs on every build. Fix: use a literal or a CSS variable for `Math.random`: the chance it gives differs on every build
    at <read> (/src/card.css.ts:3:37)

legacy-function-setter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:blue}
AFTER
=== ERROR ===
/src/card.css.ts:3:38: JS execution error: ReferenceError: `Function.prototype.toString` cannot be read at build time: its text changes when the build transforms the function. Fix: use a literal or a CSS variable for `Function.prototype.toString`: its text changes when the build transforms the function
    at <read> (/src/card.css.ts:3:38)

legacy-math-setter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:blue}
AFTER
=== ERROR ===
/src/card.css.ts:3:37: JS execution error: ReferenceError: `Math.random` cannot be read at build time: the chance it gives differs on every build. Fix: use a literal or a CSS variable for `Math.random`: the chance it gives differs on every build
    at <read> (/src/card.css.ts:3:37)

legacy-date-getter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:blue}
AFTER
=== ERROR ===
/src/card.css.ts:3:37: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (/src/card.css.ts:3:37)

legacy-date-setter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:blue}
AFTER
=== ERROR ===
/src/card.css.ts:3:37: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (/src/card.css.ts:3:37)

ordinary-getter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

ordinary-setter
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

own-random-override
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

bare-helper-throw
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/effect.ts:2:7: JS execution error: Error: side-effect boom. Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (/src/effect.ts:2:7)

bare-helper-caught-date
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/effect.ts:2:7: JS execution error: ReferenceError: `Date` cannot be read at build time: the time it gives differs on every build. Fix: use a literal or a CSS variable for `Date`: the time it gives differs on every build
    at <read> (/src/effect.ts:2:7)

bare-helper-pure
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

helper CSS import: 실제 before / after 13개

unused TS default/named/namespace import는 기본 elision에 따라 출력하지 않는 정상 control입니다. value로 참조되지만 호출되지 않는 함수의 import는 유지되며, JS/CJS의 unused load는 native 회귀가 별도로 검증합니다.

bare-css
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./theme.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

other-directory
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "../helpers/theme.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

package-exports-css
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "../node_modules/theme/dist/main.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

default-unused
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

named-unused
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

namespace-unused
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

query-suffix
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./theme.module.css?inline";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

root-helper-order
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./before.css";
import "./after.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./before.css";
import "./theme.module.css";
import "./after.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

root-helper-dedup
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./theme.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./theme.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

missing-css
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/project/src/helper.ts:1:8: Cannot resolve CSS './theme.module.css' from '/project/src/helper.ts': the stylesheet loads CSS through this helper and the file cannot be found. Fix: correct the path or import CSS from a component module; after creating a missing file, re-save the stylesheet to retry

css-export-read
BEFORE
=== ERROR ===
/project/src/theme.module.css:1:1: JS execution error: SyntaxError: Unexpected token. Fix: correct the syntax at this location
AFTER
=== ERROR ===
/project/src/helper.ts:2:22: JS execution error: ReferenceError: Cannot read CSS export 'card' of '/project/src/theme.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/project/src/helper.ts:2:22)
    at  (/project/src/helper.ts:2:22)

uncalled-css-export-read
BEFORE
=== ERROR ===
/project/src/theme.module.css:1:1: JS execution error: SyntaxError: Unexpected token. Fix: correct the syntax at this location
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./theme.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

called-css-export-read
BEFORE
=== ERROR ===
/project/src/theme.module.css:1:1: JS execution error: SyntaxError: Unexpected token. Fix: correct the syntax at this location
AFTER
=== ERROR ===
/project/src/helper.ts:2:26: JS execution error: ReferenceError: Cannot read CSS export 'card' of '/project/src/theme.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/project/src/helper.ts:2:26)
    at read (/project/src/helper.ts:2:26)
    at  (/project/src/helper.ts:2:65)

CSS 관찰과 catch: 실제 before / after 17개

caught-property
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'card' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

caught-named
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'card' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

caught-namespace
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'card' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

primitive-conversion
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'Symbol(Symbol.toPrimitive)' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

value-of
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'valueOf' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

to-string
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'toString' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

in-check
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'has:card' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

keys
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'ownKeys' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

for-in
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:16: JS execution error: ReferenceError: Cannot read CSS export 'ownKeys' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:16)
    at  (/src/helper.ts:2:16)
    at  (/src/helper.ts:2:54)

spread
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:10: JS execution error: ReferenceError: Cannot read CSS export 'ownKeys' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:10)
    at  (/src/helper.ts:2:10)

json
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'toJSON' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

descriptor
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'getOwnPropertyDescriptor:card' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

prototype
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:7: JS execution error: ReferenceError: Cannot read CSS export 'getPrototypeOf' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:7)
    at  (/src/helper.ts:2:7)

called-function-caught
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== ERROR ===
/src/helper.ts:2:29: JS execution error: ReferenceError: Cannot read CSS export 'card' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css()
    at <read> (/src/helper.ts:2:29)
    at  (/src/helper.ts:2:29)
    at  (/src/helper.ts:2:68)

typeof-object
BEFORE
=== ERROR ===
/src/helper.ts:2:29: JS execution error: ReferenceError: Cannot read CSS export 'default' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css(). Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (/src/helper.ts:2:29)
    at <main> (/src/helper.ts:2:29)
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

object-passing
BEFORE
=== ERROR ===
/src/helper.ts:2:61: JS execution error: ReferenceError: Cannot read CSS export 'default' of '/src/styles.module.css' at build time: CSS module class names are generated by the bundler and are unknown at build time. Fix: use the class in a runtime component (className={styles.card}) or write the style with css(). Fix: remove or guard the code that fails here, or correct the cause above, so the stylesheet evaluates without throwing
    at <main> (/src/helper.ts:2:61)
    at <main> (/src/helper.ts:2:61)
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

uncalled-read
BEFORE
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}
AFTER
=== CODE ===
import "@devup-ui/react/devup-ui.css";
import "./styles.module.css";
export const card = "a";
=== CSS (theme header omitted) ===
.a{color:red}

전체 48개 QA 및 추가 회귀

W32 Real WASM QA

Case	Observed Contract	Verdict	Artifact
parser	located build error, cause and fix	PASS	after.json
parser-repair	compiled exact static input	PASS	after.json
no-resolver	located build error, cause and fix	PASS	after.json
resolved-repair	compiled exact static input	PASS	after.json
missing	located build error, cause and fix	PASS	after.json
cycle	located build error, cause and fix	PASS	after.json
throw	located build error, cause and fix	PASS	after.json
throw-repair	compiled exact static input	PASS	after.json
window	located build error, cause and fix	PASS	after.json
environment	located build error, cause and fix	PASS	after.json
vanilla-fallback	located build error, cause and fix	PASS	after.json
devup-fallback	located build error, cause and fix	PASS	after.json
imported-stylesheet	located build error, cause and fix	PASS	after.json
imported-helper	located build error, cause and fix	PASS	after.json
require-missing	located build error, cause and fix	PASS	after.json
require-helper-missing	located build error, cause and fix	PASS	after.json
caught-clock	located build error, cause and fix	PASS	after.json
style-getter-throw	located build error, cause and fix	PASS	after.json
placeholder-name	compiled exact static input	PASS	after.json
clock-repair	compiled exact static input	PASS	after.json
deterministic-helper	compiled exact static input	PASS	after.json
safe-css	compiled exact static input	PASS	after.json
effects-throw	located build error, cause and fix	PASS	after.json
effects-caught-clock	located build error, cause and fix	PASS	after.json
effects-pure	compiled exact static input	PASS	after.json
unused-function	compiled exact static input	PASS	after.json
twice-css	compiled exact static input	PASS	after.json
guarded-descriptors	located build error, cause and fix	PASS	after.json
function-source	located build error, cause and fix	PASS	after.json
recoverable-0	located build error, cause and fix	PASS	after.json
recoverable-1	located build error, cause and fix	PASS	after.json
recoverable-2	located build error, cause and fix	PASS	after.json
recoverable-3	located build error, cause and fix	PASS	after.json
clock-first	located build error, cause and fix	PASS	after.json
clock-second	located build error, cause and fix	PASS	after.json
Date.now()	located build error, cause and fix	PASS	after.json
new Date().getTime()	located build error, cause and fix	PASS	after.json
Math.random()	located build error, cause and fix	PASS	after.json
performance.now()	located build error, cause and fix	PASS	after.json
crypto.randomUUID()	located build error, cause and fix	PASS	after.json
process.env.NODE_ENV	located build error, cause and fix	PASS	after.json
Intl.DateTimeFormat().resolvedOptions().locale	located build error, cause and fix	PASS	after.json
'I'.toLocaleLowerCase()	located build error, cause and fix	PASS	after.json
'x'.normalize()	located build error, cause and fix	PASS	after.json
resolver-throw	located build error, cause and fix	PASS	after.json
resolver-getter	located build error, cause and fix	PASS	after.json
resolver-primitive	located build error, cause and fix	PASS	after.json
resolver-malformed	located build error, cause and fix	PASS	after.json

조건·논리 연산에서 Function을 Unknown-data로 잃는 proof gap도 인접 회귀 테스트로 막고, mutation/clock helper negative fixture는 실제 export를 사용하도록 복구했습니다. 일반 descriptor, 사용자 override, getter 미실행, symbol/flags/receiver 및 catch 후 불변 오류 증거는 native 회귀가 검증합니다.

[github-actions]

Changepacks

@devup-ui/wasm@1.0.83 → 1.0.84 - bindings/devup-ui-wasm/package.json

Patch

• A project module re-exporting Devup UI (export { Box, css } from '@devup-ui/react', export * from '@devup-ui/react', export { styled as s }, export * as Devup, a default export of an import, chains of barrels and the compat entry) now works: a file importing Box or css from it compiles exactly as if it imported from the package, following the barrel through the resolver (relative paths, tsconfig paths, package exports), and hasDevupUI sees such a file. Members read from a namespace or default import of the package (Devup['css'], const { css } = Devup, Devup.css as a value) compile where the build can follow them, Devup.x for a name the package compiles being read like the named import. New build errors, located at the use: what a barrel re-exports but the build cannot read (an unresolvable export * or module, a namespace of modules re-exporting the package) is an error where its name is used instead of a runtime crash, and a namespace member read by a key the build cannot know (Devup[key]), written, or destructured in a form it cannot follow (a rest, a computed key, a default value, a nested pattern, an exported declaration, or members mixed with ones that stay at runtime) is an error that names the members to read. A namespace passed on whole (Object.keys(Devup), spyOn(Devup, 'css'), export default Devup) is left as it is
• css(a, b) composing classes whose styles the build knows (a const bound to css() in the file, or a css() result another module exports with a rule object every value of which is known) merges their styles: a later part's declaration replaces an earlier one's for the same property, selector, breakpoint and layer, also under conditions (css(base, cond && danger)) and for ||/?? parts, where the classes used to be joined and the stylesheet order picked the winner. vanilla-extract style([a, b]) passes each composed style as its own argument, so the later one wins, and a style composed again later (style([a, b, a])) is kept. Classes the build does not know (strings, props, CSS Modules) are kept as they are
• styled(Base) extending a styled component the file binds to a const renders Base's tag directly with Base's styles composed under its own, so the extension's declarations replace Base's for the same property, selector, breakpoint and layer instead of losing to them by stylesheet order; Base's attrs apply before the extension's. attrs merge as styled-components merges them: className is joined with the caller's, style is merged and other props replace earlier ones. On an element, a className or style spread after the explicit prop now wins, as React merges props in the order they are written
• Emotion's now compiles at build time with no runtime: the element becomes what its child function ({ css, cx, theme }) => ... renders, each css and cx call becomes the classes it composes (later styles replace earlier ones; css reads strings as CSS text and its tagged templates split around mixins; cx keeps unknown classes, reads { name: condition } objects as conditional classes and composes nested css and cx calls), and theme.a.b in their values becomes var(--a-b). Numbers in css rules are px lengths, as Emotion reads them, and top-level constants are inlined. New build errors, each at file:line:col: a without exactly one child function taking { css, cx, theme } that gives what it renders at once (attributes, other children, rest or default parameters, async or generator functions, several statements); reading the theme other than as theme.a.b in a css value; using css or cx other than by calling them; a cx object with a spread, getter or method; parts css and cx cannot compose (runtime calls, spreads, a condition choosing between styles and classes). @devup-ui/react/compat exports ClassNames with the ClassNamesContent and ClassNamesArg types, and the @emotion/react declarations include them
• Emotion and styled-components component selectors now compile at build time: a styled component the file defines that another style selects (${Child} { ... } in CSS text, [Child] or [&:hover ${Child}] as a rule key) gets a short marker class, which only such components get, and the selector reads it as .marker; a component extending it, or an element inlining it for its css prop, keeps the marker. Selectors written without & now nest under the component as stylis nests them (ul { ... } is & ul, a selector list nests each selector, :hover applies to the component itself) instead of becoming global rules, and rule-object keys starting with ., #, [, *, >, + or ~ are read as nested selectors instead of properties
• Emotion's css prop compiles at build time while @emotion/react is aliased: on tags and Devup UI components always, and on every element once the file imports @emotion/react or @emotion/styled or names @emotion/react in a @jsxImportSource pragma; jsx, jsxs and jsxDEV from @emotion/react/jsx-runtime (or jsx-dev-runtime) and jsx from @emotion/react compile it too, so libraries built with Emotion's JSX runtime do as well. The prop becomes the element's className, with CSS variables in its style for values only the runtime gives: arrays and conditions compose with a later part replacing what an earlier one sets, css() classes the file knows compose by their styles, strings and templates are CSS text, css`` mixins split the text around them, a function of the theme reads theme.a.b as var(--a-b), unitless numbers are px as in Emotion (constants included), and a className holding known css() classes overrides the prop as Emotion's registered classes do. A styled component the file defines renders its tag in the element's place when the prop overrides its styles and it renders a tag with no attrs or props read and the element has no spread, as or forwardedAs. Emotion's JSX runtime imports become react/jsx-runtime, the pragma names react, and jsx comes from @devup-ui/react/compat (React's createElement); @devup-ui/react/compat/css-prop types the prop on React.Attributes. New build errors, each with file:line:column and the code: a css prop part the build cannot read (a call, an element), a style object declared inside a function or with let, a binding only running the module gives or code changes, a theme function that does more than return rules or reads the theme other than as theme.a.b in a value, an interpolation CSS text cannot place or a mixin inside a nested rule, and a css prop overriding a styled component's styles where its tag cannot be rendered in place. Composing css() with a part that reads a known binding (such as a keyframes name) now reads its value
• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source
• hasDevupUI takes the import aliases and is true for a file extraction changes: one importing a redirected package (@emotion/styled, ...), naming @emotion/react in a @jsxImportSource pragma, or in a project whose tsconfig jsxImportSource is @emotion/react, so the Bun plugin no longer skips files whose only Devup UI is Emotion's css prop or an aliased import. Aliases of Devup UI now compile like the original: export const B = Box, const c = css; export { c as cc }, export const D = Devup and export const C = Devup.css in a barrel (the barrel module exports them as re-exports of the package, and what imports them follows them), export { Box } after an import, export default Box, const D = Devup namespace aliases, and const inner = css declared inside a function. A css() or keyframes() const that a function reads before its declaration compiles. New build error: a css()/keyframes() const read before its declaration runs (outside a function) is located and says to move the declaration above its first read
• Report extraction, module-resolution and stylesheet execution failures at their original source locations with the cause and repair. Reject recoverable syntax errors, nondeterministic build-time reads, synthetic descriptor/function-source and legacy accessor reflection, and unsafe stylesheet execution fallbacks instead of silently changing CSS. Preserve module resolver and serialization exceptions, evaluate transitive helper side effects, and prevent placeholder-name collisions from losing styles. Match import package names only at exact or slash-delimited boundaries so sibling data packages remain external. Retain helper CSS loads in evaluation order with deduplicated portable relative specifiers and query suffixes, without CSS content dependencies. Report missing CSS or incompatible path roots as located errors, and reject host-recorded unknown CSS export observations even when caught; unused bindings, object passing and typeof follow default TypeScript/JavaScript import semantics.
• Resolve compiled styling APIs and components by their lexical binding so shadowed local names, including minified library identifiers, remain ordinary JavaScript and JSX. No new build errors; existing diagnostics now apply only to the compiled binding they describe.
• Styled components the build generates are wrapped in React's forwardRef, so a ref passed to them reaches the element they render on React 18 as well as React 19; the file imports forwardRef from react when it defines one
• Styled components no longer pass every prop to the tag they render: $ props, theme and the props their style functions or attrs read are kept away from a tag unless it takes them as attributes, and shouldForwardProp (Emotion options or styled-components withConfig) is evaluated at build time. A shouldForwardProp the build cannot evaluate is a build error naming the file, line and code, with the forms it accepts. An element using a styled component the file defines drops props the component neither reads nor passes on; spread props are passed as written
• Styled components render what their as prop names, defaulting to the tag or component they were defined with, and pass forwardedAs on as as, as styled-components and Emotion do; as used to reach the rendered tag as an attribute. Component.withComponent(target) on a styled component the file binds to a const builds a component rendering the same styles and attrs as target (a tag name or a component JSX can name), where it used to call a method the generated function does not have and throw

@devup-ui/bun-plugin@1.0.22 → 1.0.23 - packages/bun-plugin/package.json

Patch

• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source
• hasDevupUI takes the import aliases and is true for a file extraction changes: one importing a redirected package (@emotion/styled, ...), naming @emotion/react in a @jsxImportSource pragma, or in a project whose tsconfig jsxImportSource is @emotion/react, so the Bun plugin no longer skips files whose only Devup UI is Emotion's css prop or an aliased import. Aliases of Devup UI now compile like the original: export const B = Box, const c = css; export { c as cc }, export const D = Devup and export const C = Devup.css in a barrel (the barrel module exports them as re-exports of the package, and what imports them follows them), export { Box } after an import, export default Box, const D = Devup namespace aliases, and const inner = css declared inside a function. A css() or keyframes() const that a function reads before its declaration compiles. New build error: a css()/keyframes() const read before its declaration runs (outside a function) is located and says to move the declaration above its first read

@devup-ui/components@0.1.60 → 0.1.61 - packages/components/package.json

Patch

• Auto-update: depends on '@devup-ui/react' via a local workspace dependency

@devup-ui/next-plugin@1.0.90 → 1.0.91 - packages/next-plugin/package.json

Patch

• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source

@devup-ui/plugin-utils@1.0.17 → 1.0.18 - packages/plugin-utils/package.json

Patch

• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source

@devup-ui/react@1.0.44 → 1.0.45 - packages/react/package.json

Patch

• Emotion's now compiles at build time with no runtime: the element becomes what its child function ({ css, cx, theme }) => ... renders, each css and cx call becomes the classes it composes (later styles replace earlier ones; css reads strings as CSS text and its tagged templates split around mixins; cx keeps unknown classes, reads { name: condition } objects as conditional classes and composes nested css and cx calls), and theme.a.b in their values becomes var(--a-b). Numbers in css rules are px lengths, as Emotion reads them, and top-level constants are inlined. New build errors, each at file:line:col: a without exactly one child function taking { css, cx, theme } that gives what it renders at once (attributes, other children, rest or default parameters, async or generator functions, several statements); reading the theme other than as theme.a.b in a css value; using css or cx other than by calling them; a cx object with a spread, getter or method; parts css and cx cannot compose (runtime calls, spreads, a condition choosing between styles and classes). @devup-ui/react/compat exports ClassNames with the ClassNamesContent and ClassNamesArg types, and the @emotion/react declarations include them
• Emotion's css prop compiles at build time while @emotion/react is aliased: on tags and Devup UI components always, and on every element once the file imports @emotion/react or @emotion/styled or names @emotion/react in a @jsxImportSource pragma; jsx, jsxs and jsxDEV from @emotion/react/jsx-runtime (or jsx-dev-runtime) and jsx from @emotion/react compile it too, so libraries built with Emotion's JSX runtime do as well. The prop becomes the element's className, with CSS variables in its style for values only the runtime gives: arrays and conditions compose with a later part replacing what an earlier one sets, css() classes the file knows compose by their styles, strings and templates are CSS text, css`` mixins split the text around them, a function of the theme reads theme.a.b as var(--a-b), unitless numbers are px as in Emotion (constants included), and a className holding known css() classes overrides the prop as Emotion's registered classes do. A styled component the file defines renders its tag in the element's place when the prop overrides its styles and it renders a tag with no attrs or props read and the element has no spread, as or forwardedAs. Emotion's JSX runtime imports become react/jsx-runtime, the pragma names react, and jsx comes from @devup-ui/react/compat (React's createElement); @devup-ui/react/compat/css-prop types the prop on React.Attributes. New build errors, each with file:line:column and the code: a css prop part the build cannot read (a call, an element), a style object declared inside a function or with let, a binding only running the module gives or code changes, a theme function that does more than return rules or reads the theme other than as theme.a.b in a value, an interpolation CSS text cannot place or a mixin inside a nested rule, and a css prop overriding a styled component's styles where its tag cannot be rendered in place. Composing css() with a part that reads a known binding (such as a keyframes name) now reads its value
• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source

@devup-ui/reset-css@1.0.31 → 1.0.32 - packages/reset-css/package.json

Patch

• Auto-update: depends on '@devup-ui/react' via a local workspace dependency

@devup-ui/rsbuild-plugin@1.0.67 → 1.0.68 - packages/rsbuild-plugin/package.json

Patch

• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source

@devup-ui/vite-plugin@1.0.73 → 1.0.74 - packages/vite-plugin/package.json

Patch

• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source

@devup-ui/webpack-plugin@1.0.71 → 1.0.72 - packages/webpack-plugin/package.json

Patch

• A project whose tsconfig.json (or jsconfig.json) builds JSX with Emotion (compilerOptions.jsxImportSource of @emotion/react, through extends and project references too) now compiles the css prop on every element of every file, and its .tsx and .jsx files are built with React's JSX runtime through a /** @jsxImportSource react */ pragma, which a file's own JSX pragma overrides, so the bundler no longer imports Emotion's runtime. The plugins read the setting into a new @emotion/react/jsx-runtime alias (importAliases can turn it off with false, and it is left out when @emotion/react is not aliased); @devup-ui/react/compat/emotion-jsx-runtime declares Emotion's JSX runtimes as React's so the project type-checks without Emotion installed. plugin-utils exports readJsxImportSource, and mergeImportAliases takes the JSX import source

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

Files with missing lines	Coverage Δ
bindings/devup-ui-wasm/src/lib.rs	100.00% <ø> (ø)
bindings/devup-ui-wasm/src/resolver_state.rs	100.00% <100.00%> (ø)
libs/css/src/lib.rs	100.00% <100.00%> (ø)
libs/css/src/theme_tokens.rs	100.00% <ø> (ø)
libs/extractor/src/barrel.rs	100.00% <100.00%> (ø)
libs/extractor/src/barrel/aliases.rs	100.00% <100.00%> (ø)
libs/extractor/src/barrel/gate.rs	100.00% <100.00%> (ø)
libs/extractor/src/build_time_values.rs	100.00% <100.00%> (ø)
libs/extractor/src/build_time_values_execute.rs	100.00% <100.00%> (ø)
libs/extractor/src/build_time_values_mapping.rs	100.00% <100.00%> (ø)
... and 62 more

... and 1 file with indirect coverage changes

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.