Which design decision about controlled versus uncontrolled patterns remains inconsistent in react-bootstrap component APIs?
0 reputation · 22 Jun 2023, 08:48 UTC
Component API Consistency Challenge
react-bootstrap exposes Bootstrap 5 UI primitives as declarative React components, mapping props like bsPrefix, as, and variant to CSS classes without direct DOM manipulation. Components manage internal side effects via React effects—Modal handles body scroll lock, Dropdown manages focus for accessibility—while relying on Bootstrap CSS for styling.
Theming uses bsPrefix and ThemeProvider context to override class prefixes and inject custom CSS variables, but the library lacks enforced token schema. Form components expose markup and validation classes, yet intentionally provide no form state manager, leaving validation to consumer applications.
An unresolved design decision centers on mixed controlled versus uncontrolled patterns across the API. Some components require explicit value and onChange props, while others support initial state only, creating inconsistency for Accordion, Carousel, and Dropdown usage. This inconsistency affects how developers manage component state and expect predictable behavior across the library.
Which specific components exhibit the most problematic divergence in their controlled/uncontrolled implementation, and what guidance exists for maintaining consistent state management patterns?