Material UI is a comprehensive, production-grade React component library implementing Google's Material Design system. It operates as a monorepo containing 15+ published packages including @mui/material (core components), @mui/system (CSS utilities), @mui/styled-engine (Emotion wrapper), @mui/icons-material (10,000+ SVG icons), @mui/lab (incubator components), and integration packages for Next.js, Pigment CSS, and styled-components. The library provides 100+ accessible, customizable components with a sophisticated theming system supporting both CSS-in-JS (Emotion/styled-components) and zero-runtime CSS variables via Pigment CSS. Key architectural patterns include the slot/slotProps API for component customization, the sx prop for rapid styling, a composable theme system with colorSchemes and cssVariables, and a codemod framework for automated migrations. The codebase demonstrates exceptional engineering: the styled-engine abstraction enables runtime-agnostic styling, the theme system generates native CSS variables with color-mix() support, the component conformance tests ensure consistent APIs, and the documentation infrastructure auto-generates API docs from source. The project maintains rigorous quality with visual regression testing (Argos), accessibility testing (axe-core), bundle size monitoring, and multi-version React testing. Version 9.1.2 was released June 2026 with active development continuing.
Primer Octicons is a monorepo containing GitHub's official SVG icon set and its idiomatic packages for Node.js (JavaScript), React (with styled-system variants), and Ruby (gem, Rails helper, Jekyll plugin). The core build pipeline (`script/build.ts`) ingests raw SVG files from the `icons/` directory, validates their structure (filename, width/height, viewBox), parses them into an AST via svgson, and produces a consolidated `data.json` along with optimized SVG copies. A metadata layer (`script/icon-metadata.ts`) handles icon naming and backward compatibility: it supports aliases (e.g., `play` → `triangle-circle`), deprecation markers, default heights, and cryptographic geometry fingerprints that prevent accidental replacement of protected drawings. Each platform package is then generated from this shared data. The React package (`@primer/octicons-react`) uses a sophisticated build script that emits per-icon modules as pre-compiled `React.forwardRef` components, enabling tree-shaking and dynamic imports without runtime factory calls. The test suite is comprehensive, covering build validation, metadata integrity, React rendering, code-splitting, and Ruby library behavior. The repository exhibits excellent craftsmanship in its handling of naming stability, deprecation, and cross-platform icon delivery while maintaining a consistent design language across all packages.
React Suite (rsuite) is a comprehensive React component library providing high-quality, accessible UI components for building web applications. The library follows modern React practices with TypeScript, offering a consistent design system with components for layout, forms, data display, navigation, feedback, and overlays. It features extensive internationalization support, theming capabilities, responsive design patterns, and comprehensive documentation with examples for various frameworks. The architecture emphasizes reusable patterns through custom hooks, compound components, and utility functions, demonstrating strong engineering practices in solving common React challenges.
react-bits is a comprehensive open-source library of animated, interactive React components, accompanied by a full documentation and demo site. The repository contains hundreds of self-contained components spanning text animations, background effects, UI micro-interactions, and complete widgets, each offered in four variants (JavaScript/TypeScript × CSS/Tailwind) and distributed via a custom jsrepo registry that allows direct code copying or CLI installation (shadcn/jsrepo). The architecture is a hybrid of a component distribution platform and a marketing/demo site: `src/content`, `src/tailwind`, `src/ts-default`, and `src/ts-tailwind` contain the actual component sources, while `src/demo` and `src/components` host a Chakra UI–based playground with live prop editing, code previews, prop tables, and dependency listings. The project heavily leverages modern animation and WebGL libraries — GSAP, Framer Motion (motion/react), OGL, Three.js, and Matter.js — with many components implementing custom shaders, physics simulations, and gesture handling. While the codebase exhibits strong craftsmanship in individual components (clean hooks, accessibility attributes, cleanup of WebGL contexts, reduced-motion support), it suffers from notable duplication across the four variant directories, which risks behavioral drift and increases maintenance burden. Despite this, the library is actively maintained, well-documented, and genuinely reusable, making it a valuable resource for front-end developers seeking production-ready animated UI patterns.
Chakra UI is a React component library that provides accessible, customizable UI components with a design system foundation. The monorepo contains the core component library (@chakra-ui/react), styling system (Emotion-based with Panda CSS preset), CLI tools for project scaffolding and codemods for migration, a Next.js documentation site, an interactive example gallery, framework sandboxes for Next.js/Remix/Vite integration, and an MCP server for AI tool access. The architecture emphasizes composable APIs, theme-driven design via design tokens, and comprehensive accessibility coverage. Key entry points include the core library index, styled system factory, CLI commands, documentation layout, example compositions, and MCP server entry point.
Radix Themes is a monorepo containing a React component library built on Radix UI primitives and a Next.js playground application for demonstration and testing. The library provides accessible, themeable UI components with support for responsive values, variant styling, and a flexible theme system. The architecture separates concerns through a prop definition system, helper utilities for style extraction and merging, and a theme context. The playground showcases components and includes visual regression testing via Playwright.
Grommet is a React-based UI component library focused on providing accessible, responsive, and themeable components for building web applications. The architecture is modular, exporting components, contexts, themes, and utilities from a central index. Key entry points include src/js/index.js (main export) and the component directories under src/js/components/. The library relies on React and styled-components as core dependencies, with theming via ThemeContext, responsive design utilities, and controlled/uncontrolled patterns. Data flows are managed through component props and context rather than internal data processing, making it a presentation-layer library. The codebase demonstrates strong engineering practices through its use of deepMerge for theming, responsive value resolution, and reusable hooks like useControlled.
A collection of reusable React UI components built on top of shadcn/ui (Radix UI + Tailwind CSS), along with a Next.js documentation site. The project provides 15+ advanced components not included in the base shadcn/ui library, such as a datetime picker with keyboard navigation, a multiple-selector with async search and grouping, an interactive stepper, infinite scroll, and others. All components are designed to be copied and pasted directly into user projects and are fully customizable. The documentation site demonstrates each component with live previews, usage examples, and prop tables. The codebase is well-structured, modern (Next.js 15, React 19, TypeScript), and actively maintained.
beautiful-react-hooks is a TypeScript library providing a collection of over 50 reusable, well-tested custom React hooks for common patterns such as lifecycle management, event handling (mouse, touch, swipe, drag, resize, scroll), geolocation, media queries, local/session storage, debounce/throttle, timers, animations, and more. The architecture is clean and modular: each hook is a standalone file with its own TypeScript types, unit tests, and documentation. Shared utilities (SSR detection, API support checks, warning helpers) are separated into a shared module, and a factory pattern is used to create storage hooks. The library supports tree-shaking via per-hook imports and provides both CommonJS and ES module builds. It also includes a comprehensive styleguidist documentation site with interactive examples. The code demonstrates strong engineering practices: proper handling of SSR, browser API availability checks, cleanup logic in useEffect, and memoization to avoid unnecessary re-renders. Peer dependencies (rxjs, react-router-dom) are required only for specific hooks, keeping the core lightweight.
Heroicons is a MIT-licensed SVG icon library providing 16x16, 20x20, and 24x24 pixel icons in outline and solid styles. The system consists of source SVG files that are optimized via SVGO and converted to framework-specific React and Vue components through a sophisticated build process. The library emphasizes tree-shakability, proper theming via currentColor, and accessibility attributes. It's distributed as separate npm packages (@heroicons/react, @heroicons/vue) with a base package containing raw SVGs.
Intent UI is a copy-paste accessible React component library built on React Aria Components and styled with Tailwind CSS v4. It follows the shadcn/ui distribution model: components are installed via CLI (`npx shadcn@latest add @intentui/<component>`) from a registry served by the included Next.js documentation site. The repository contains over 80 UI components (buttons, forms, overlays, charts, navigation, layouts, etc.), each with multiple usage examples and comprehensive MDX documentation. The architecture is a Next.js App Router application that also functions as the component registry host, with custom build scripts generating registry JSON, icon metadata, and LLM-friendly documentation exports. External dependencies include React Aria Components for accessibility, Recharts for charts, motion for animations, sonner for toasts, and tailwind-variants for styling variants. The library is monetized through sponsor tiers and premium design assets, but the core components are MIT-licensed.
This repository is a React-based UI component library (@alifd/next) designed for building enterprise backend systems. It provides over 50 reusable UI components (Button, Input, Table, Form, etc.) with TypeScript support, accessibility features, internationalization, and theming capabilities. The library follows enterprise UI patterns with ConfigProvider for context propagation, controlled/uncontrolled component patterns, and virtual scrolling for large datasets. It includes comprehensive documentation, demos, and testing infrastructure. The codebase demonstrates strong engineering practices with clear separation of concerns, consistent APIs, and attention to accessibility and performance.
This is a monorepo for SurveyJS, a comprehensive open-source form/survey library that renders dynamic JSON-based forms across multiple frontend frameworks (React, Angular, Vue 3, and plain JavaScript). The core engine (`survey-core`) handles model parsing, validation, expressions, triggers, input masks, drag-and-drop, theming, and localization. It provides 20+ question types (text, checkbox, radio, dropdown, matrix, ranking, file, signature, etc.) with extensible UI components via framework-specific rendering packages. The library also includes a built-in linter for survey JSON static analysis and a tester for programmatic survey test execution. Architecture follows a layered pattern: core logic separate from UI, with each framework package consuming the core via a shared set of exported model classes. The codebase is large (2896 files) but well-structured, featuring a custom expression parser (PEG), a modular action-bar system, advanced popup management with focus trapping, and a generic drag-drop engine. Maintenance is active with frequent releases, but there is some technical drift in the form of commented-out legacy testcafe tests, auto-generated theme files, and cross-framework duplication that requires careful synchronization.
This is a React component library and showcase application built with Vite. It provides interactive examples of various UI components including accordions, buttons, cards, carousels, controls, dropdowns, modals, navbars, sidebars, tables, and widgets. The application uses react-router-dom for client-side routing, with each component example accessible via a dedicated route. The architecture follows a standard React SPA pattern with components organized by type in the src/components directory. Each component includes its implementation file, example usage file, and associated styles. The project demonstrates modern React practices including functional components with hooks, proper state management, and integration with animation libraries like GSAP and Framer Motion.
ReactiveSearch is a comprehensive, multi-platform UI component library for building search interfaces backed by Elasticsearch, OpenSearch, Solr, or MongoDB. It provides a rich set of drop-in components (search boxes, filters, lists, ranges, maps, charts, and AI-powered answers) for React, Vue, React Native, and native mobile apps. The repository is structured as a monorepo with separate packages for each framework, sharing a common core library (`@appbaseio/reactivecore`) that manages state via a Redux-like store and generates Elasticsearch queries. The library follows a sensor/actuator pattern where filter components (sensors) reactively update result components (actuators) through a central store. It includes extensive documentation, dozens of example apps, and support for server-side rendering, URL state sync, and analytics. While the codebase is well-organized and actively maintained, it exhibits medium technical drift due to the use of deprecated React lifecycle methods, duplicated implementations across frameworks, and a large number of example apps with boilerplate code that increase maintenance burden.
This repository is the LLM Inference Handbook, a comprehensive technical documentation site built with Docusaurus. It serves as an educational resource for engineers building, optimizing, and deploying LLM inference systems. The site covers inference fundamentals, model preparation, interaction patterns, optimization techniques (batching, KV cache, prefix caching, speculative decoding), kernel optimization (FlashAttention, GPU architecture), and infrastructure operations. It includes interactive React components such as GPU memory calculators, KV cache simulators, batching visualizers, and GPU execution visualizers that demonstrate concepts through live demos. The codebase is well-structured with TypeScript, CSS modules, a custom design system (DLS), and integration with Mantine UI. While primarily a documentation site, the interactive components are self-contained and could be extracted for reuse in other educational contexts. The handbook is framework-agnostic but has a strong emphasis on the Modular MAX ecosystem.
PrimeReact is a comprehensive React UI component library providing over 80 components including forms, data tables, overlays, menus, charts, and more. The repository also contains its official documentation website built with Next.js, featuring live demos, code snippets, accessibility guides, and theming documentation for both styled and unstyled (Tailwind) modes. The library follows a consistent architecture: each component extends a shared ComponentBase that defines default props, CSS classes, and pass-through theming support. It includes a custom hooks library, SVG icon set, and utility modules. However, the project is no longer under active development; only security fixes are published, with all new features and bug fixes moving to the PrimeUI fork. This has led to a growing divergence and a backlog of unresolved issues. The codebase shows signs of technical drift such as aging dependencies (Next.js 12), deprecated patterns, and extensive duplication in documentation and style definitions.
This repository is a monorepo containing the `@react-google-maps/api` library, which provides React components and hooks for the Google Maps JavaScript API (v3.x). It includes sub-packages for InfoBox and MarkerClusterer overlays. The library is the primary product, offering declarative React wrappers for map features like markers, info windows, polygons, directions, street view, and more. The codebase also includes a full-stack web application (`web-app`) built with React Router v7, Hono, and Cloudflare Workers, serving as the library's documentation site, license sales platform, and user dashboard. The web-app features authentication, Stripe payment integration, multi-language support (9 locales), and a comprehensive interactive documentation page with code examples. The library itself follows a consistent functional component pattern with hooks for lifecycle management, but suffers from some code duplication and verbose event listener handling. The commercial license change in v3.0.0 may impact community adoption. Overall, the repository is actively maintained and functional, but not exceptionally polished.
Geist UI is an archived React UI component library and design system inspired by Vercel's design language. It provides a comprehensive set of 40+ components (Button, Card, Modal, Table, Input, Select, etc.), a flexible theming system with light/dark presets and custom theme creation, a proprietary scaling system for responsive sizing, and utility hooks (useClipboard, useClickAway, useKeyboard, useToasts, etc.). The repository also contains a full documentation site built with Next.js and MDX, featuring interactive playgrounds, attribute tables, and bilingual content (English/Chinese). The library is published as @geist-ui/core and supports tree-shaking, server-side rendering, and integration with Next.js, Remix, Create React App, and webpack. However, the project is archived and no longer receives active updates; its reliance on styled-jsx, deprecated test utilities (Enzyme), and older dependency versions pose compatibility risks for modern React and bundler ecosystems. The codebase demonstrates solid engineering practices with compound components, context-driven state management, and well-isolated hooks, making many parts reusable despite the project's dormant status.
This repository is a curated list of React components and libraries. It is not a software application, data pipeline, or library in the traditional sense. It is a Markdown-based document (README.md) containing categorized links to open-source React projects, with a GitHub Actions workflow that auto-generates the table of contents on push/PR. The only executable code is a single GitHub Actions workflow file (`.github/workflows/update-table-of-contents.yml`) that runs the `technote-space/toc-generator` action to keep the TOC in sync with the Markdown headers. The repository's value is purely as a reference document — it contains no application logic, no reusable code components, no tests, no package manifests, and no build system. The README itself is a large Markdown file with categorized links to React libraries, maintained through a contribution policy that requires removing an existing entry for every new addition to keep the list fresh. The CI workflow is minimal and standard — it checks out the repo and runs a third-party TOC generator action. There is no custom code to evaluate for craftsmanship or reusability.