3 repositorios
The ability to change the underlying HTML element of a component while preserving its styling and behavior.
Distinct from Custom HTML Elements: Distinct from Custom HTML Elements: focuses on the architectural pattern of polymorphic rendering (as-prop) rather than just replacing tags.
Explore 3 awesome GitHub repositories matching user interface & experience · Polymorphic Component Rendering. Refine with filters or upvote what's useful.
Rebass is a React design system library that provides a collection of theme-driven, responsive UI primitives. It functions as a theme-based layout engine, using a set of stateless components to standardize spacing, typography, and colors across a user interface. The library distinguishes itself by mapping style properties to a central design theme through a styled-system approach. This allows for responsive style mapping where components automatically adapt their appearance based on screen size and provides the ability to swap underlying HTML elements while preserving styling logic to maintai
Allows swapping the underlying HTML element of a component while preserving styling to maintain semantic markup.
cva is a TypeScript utility for defining and resolving visual variants for UI components with full type safety. It generates CSS class strings from typed variant definitions, enabling compile-time validation of component usage by deriving the union of all variant prop types from a configuration object. The library distinguishes itself through compound variant matching, which activates styles only when multiple independent variant conditions are simultaneously satisfied, merging their class names. It also provides default value propagation to ensure consistent rendering when no explicit varian
Supports polymorphic element binding, allowing the same variant logic to be applied to any HTML element type.
Reach UI is an open-source library of accessible, low-level React components designed to serve as a foundation for building design systems and interactive user interfaces. It is an accessibility-first toolkit that handles core concerns like ARIA attributes, focus management, and screen reader support automatically, without requiring developer configuration. The library is built as a collection of standalone packages, each managing its own lifecycle and dependencies, enabling granular adoption and tree-shaking. Components use a polymorphic rendering pattern, accepting an as prop to render as
Ships polymorphic components that accept an as prop to render as any HTML element or custom component.