Styling Components for React UI Kits
summary
Claims that a component library can support three concrete customization axes: theming via a provided theme object, site-level overrides by passing CSS snippets per primitive, and render customization by injecting primitives or factories. Demonstrates using CSS-in-JS tools (mentions styled-components, glamor, emotion and CSS Modules) and a factory/HOC API that maps props to styles and a pass-through hook so props can change internal nodes (eg make a counter turn red when value > 10). Presents a prototype toolbox core and higher-order utilities; demo partially fails but the approach is implemented.
AI-written summary · about
chapters (5)
- 0:00Start
- 5:33Render Customization
- 12:09Provider Pattern
- 14:00Counter Component
- 15:00Vendor Customization
related talks
29mStyling Components for React UI Kits
22mStyled Components
30mDynamic Styling Systems with React
05mStyling in React
44mWriting styles for React components
19mHarnessing React to Build Consistently Designed Applications
07mReact Components and How To Style Them
16mStyling your React js components for reuse