Repository navigation
fix(types): accept an explicit undefined on every prop this package adds - #418
YevheniiKotyrlo wants to merge 1 commit into
Conversation
Device evidence — before / afterUNFIXED — The same image. A type declaration has no compiled twin; the evidence is that this story COMPILES, which it cannot against stock types. FIXED — Each explicit-undefined slot is empty exactly like the omitted-prop slot beside it, and the resolved slot is filled.
Apart from the typeface, the two frames are the same image: the change is to the declarations. Android 16 emulator (API 36, GLES on the host GPU), 1140×2400 @ 480dpi, both frames from one run. |
React Native declares its optional props as `?: T | undefined`, and the props
this package adds were bare `?: string`. Under exactOptionalPropertyTypes the
two differ, so `className={condition ? "p-4" : undefined}` failed to compile,
and declaration merging cannot widen an existing prop from the consumer side.
Every prop types.d.ts adds now takes `| undefined`, and so do the props
StyledProps, StyledReactElement and StyledComponent synthesise. A second
typecheck compiles a fixture of every added prop with the flag on, since the
root typecheck cannot tell the two declarations apart.
6c6da94 to
d10ad90
Compare
This branch has not been deployed
1 participant
Problem
React Native declares its own optional props as
?: T | undefined, while the props this package adds are bare?: string. UnderexactOptionalPropertyTypesthe two differ, and the difference falls on the most ordinary thing a consumer writes:A consumer cannot fix it locally, because declaration merging can add props but not widen an existing one.
Solution
Every prop
types.d.tsadds takes| undefined. So do the propsStyledProps,StyledReactElementandStyledComponentsynthesise through their mapped types; without them the error reproduces onreact-native-css/componentsandstyled().Tests
src/__tests__/types/compiles a fixture of every proptypes.d.tsadds withexactOptionalPropertyTypeson, andtypecheckruns it as a secondtsc. The root typecheck cannot tell the two declarations apart, because without the flag they are the same type.main'stypes.d.tsthe fixture fails with 11 errors, and with this change it compiles.Verification
On Windows with Node 26:
yarn lintcleanyarn typecheckclean, both invocationsyarn test --coverage: every failure also fails onmainon this machine (the four babel cases)yarn buildcleanyarn example expo export --platform webexportedDevice evidence, before and after: #418 (comment)
Known limits
runtime.types.tshalf is checked by hand rather than by the gate. ImportingStyledPropspulls the compiler into the program, and the compiler has 8 errors of its own under the flag, ininline-variables.tsandselectors.ts. With this change aStyledPropsfixture adds no error of its own, and againstmain'sruntime.types.tsit adds TS2375. I am fixing those 8 separately, and that PR extends the gate toStyledProps.Merge order
It shares lines with #459 (
types.d.ts); whichever lands second rebases.Base
Re-written on
main(a5002c5), whosetypes.d.tsadds fewer props (nocssInterop,indicatorClassName,placeholderClassNameorpresentationClassName); every one it adds is covered.