[전수조사/M] React 18·19 지원과 패키지 메타데이터 #691

peer는 React *이지만 코드는 React 19 전용 기능(use(Context), ref를 일반 prop으로 받기, callback ref cleanup)을 씁니다. 또 React ^19.3이 dependencies에 있어 React 18 앱에 React가 두 벌 설치될 수 있습니다.

전체 계획과 결정 사항은 추적 이슈(#682)에 있습니다. 조사 기준 커밋: 77daad74 (현재 main d0b84255).

결정에 따른 작업

• (필수) peer ^18 || ^19, dependencies에서 React 제거
• (필수) use → useContext, 생성 styled 컴포넌트와 UI kit에 forwardRef, callback ref cleanup 대체
• (필수) React 18 fixture로 CI 검증(이슈 L의 테스트 인프라)

발견 항목

심각도: P0 = 흔한 사용에서 조용히 틀리거나 크래시, P1 = 흔한 패턴이 명시적 에러로 막히거나 드물게 조용히 틀림, P2 = 드문 경우·도구/문서 불일치, P3 = 있으면 좋음.

필수 (5)

• RT-05 (P0, CRASH) Declared React * compatibility is false and can crash on React 18
  • 근거: both packages advertise peerDependencies.react: "*" while also depending on react:^19.3; useSelect and useStepper call React 19's use(Context), Select relies on React 19 callback-ref cleanup, and public components rely on React 19 ref-as-prop. React 18 requires forwardRef and does not support callback-ref cleanup: https://react.dev/reference/react/forwardRef and htt…
  • 수정 방향: Either require React >=19 and remove React from runtime dependencies, or use React-18-compatible useContext, forwardRef, and effect cleanup.
• RT-29 (P0, MISMATCH) Package metadata can install a second React while claiming any peer is supported
  • 근거: packages/components/package.json and packages/react/package.json put React ^19.3 in dependencies while also declaring peer react:"*". A React-18 application can satisfy the peer yet receive nested React 19, risking invalid-hook-call/renderer mismatches; the runtime itself uses React-19-only APIs.
  • 수정 방향: Remove React from runtime dependencies and set the truthful peer range (or eliminate React-19-only behavior and test all accepted majors).
• INF-23 (P1, MISMATCH) Package compatibility claims are unconstrained
  • 근거: all manifests omit engines; React/bundler/Next/WASM/ESLint peers are mostly *; React package depends on ^19.3 while peer says every React and ref behavior is untested.
  • 수정 방향: test and declare minimum/maximum host ranges and engines; avoid both a hard React dependency and unrestricted peer unless intentional.
• RT-06 (P1, MISMATCH) Public UI-kit components do not forward refs on React 18
  • 근거: Button, Checkbox, Input, Radio, RadioGroup, Textarea, and Toggle are plain function components with no forwardRef; Select/Stepper compound wrappers are likewise plain functions. Their HTML prop types imply normal ref usability, but React 18 strips function-component refs.
  • 수정 방향: Forward refs explicitly or narrow the supported React range/types to React 19 only.
• SC-13 (P1, WRONG) Generated wrappers do not forward refs on React 16.8-18
  • 근거: 50-ref.tsx transforms styled.input to a plain const X = ({style,className,...rest}) => <input {...rest} .../>; no forwardRef is generated. On React versions supported by styled-components v5/v6 before React 19, a ref is not an ordinary function-component prop, so callers receive no underlying input ref. Devup declares peer react: "*" (packages/react/package.json:81…
  • 수정 방향: Generate forwardRef wrappers for styled components when compatibility with React <=18 is claimed, or narrow peer/support policy to React 19+ and document the break.

권장 (1)

• INF-10 (P1, MISMATCH) WASM CommonJS export resolves to ESM
  • 근거: bindings/devup-ui-wasm/package.json is type: module; both import and require point to pkg/index.js.
  • 수정 방향: ship a .cjs wrapper or remove the unsupported require condition.