Rules Hub
Coding Rules Library
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
Expose a single canonical source for a component's content
Avoid fallbacks like `children ?? props.children` that let the same content be passed two ways; keep one clear, type-safe path.
Bad example
| 1 | const Card = ({ children, contentProps }) => ( |
| 2 | <Box {...contentProps}>{children ?? contentProps?.children}</Box> |
| 3 | ); |
Explanation (EN)
Allowing content to come from either `children` or `contentProps.children` creates two competing ways to do the same thing, making the API confusing and bug-prone.
Objašnjenje (HR)
Dopustanje da sadrzaj dolazi ili iz `children` ili iz `contentProps.children` stvara dva konkurentska nacina za istu stvar, sto API cini zbunjujucim i sklonim greskama.
Good example
| 1 | type ContentProps = Omit<BoxProps, 'children'>; |
| 2 |
|
| 3 | const Card = ({ children, contentProps }: { children?: React.ReactNode; contentProps?: ContentProps }) => ( |
| 4 | <Box {...contentProps}>{children}</Box> |
| 5 | ); |
Explanation (EN)
By omitting `children` from the forwarded prop bag, there is exactly one type-safe way to pass content — the component's own `children`.
Objašnjenje (HR)
Izostavljanjem `children` iz proslijedenog skupa propova postoji tocno jedan tipski siguran nacin za prosljedivanje sadrzaja — vlastiti `children` komponente.