thehardwarestore.ai

where AI agents shop for the right tools

── 99083 repos indexed ── | filtered by tag: components
TheOrcDev/8bitcn-ui ★ 2022 117 APPLICATION

This repository is a Next.js application that serves both as a documentation site and a registry server for a retro 8-bit styled UI component library, built on top of shadcn/ui primitives. It provides dozens of copy-paste components (buttons, cards, dialogs, health bars, etc.) and pre-built page blocks (heroes, features, pricing, gaming HUDs) distributed via a shadcn-style registry (`shadcn add @8bitcn/...`). The project also includes two full, playable arcade games (Brick Breaker and Crate Pusher) used as creative 404 pages, with well-tested, deterministic game engines. The codebase demonstrates strong engineering practices: pure immutable game state reducers, fixed-timestep physics, accessibility-focused UI, and a custom cold-path benchmarking harness used to optimize development compilation times by 27.7%. The architecture is a monorepo-like structure within a single Next.js app, with the component library living as source files that are copied into user projects via the registry mechanism.

RATING: 8.6/10 MAINT: active DRIFT: low
▸ 4 reusable components found
blazorblueprintui/ui ★ 591 48 APPLICATION

BlazorBlueprint is a comprehensive Blazor UI component library inspired by shadcn/ui, providing over 112 styled components and 28 headless primitives. It targets .NET 8 across Server, WebAssembly, and Auto render modes, with full accessibility (ARIA, keyboard navigation), theming via CSS custom properties (compatible with shadcn CSS variables), and zero Tailwind/Node setup. The library is split into two layers: Primitives (headless, behavioral components with focus management, positioning, and portal services) and Components (styled, ready-to-use widgets like DataGrid, charts, forms, dialogs, and navigation). It ships with four icon libraries (5,200+ icons) and 11 chart types via Apache ECharts. The architecture emphasizes composability through cascading contexts, a consistent form-field pattern, and a utility-first approach with the ClassNames.cn helper for Tailwind class merging. The codebase demonstrates strong engineering practices: extensive use of generics, expression trees for filtering, JS interop with guarded disposal, and a localization system with 200+ string keys. However, the large API surface, heavy JS interop, and limited test coverage (only a few unit tests for DataGrid and hierarchy utilities) present maintenance risks.

RATING: 8.6/10 MAINT: active DRIFT: low
▸ 4 reusable components found
buefy/buefy ★ 9510 1093 APPLICATION

Buefy is a Vue 3 UI component library providing approximately 40+ Bulma-based components (buttons, inputs, tables, modals, datepickers, carousels, trees, etc.) that can be consumed individually or as a full bundle. It includes programmatic APIs for overlay components (dialog, toast, notification, snackbar, loading) and a global configuration system for icon packs, locale, and default behaviors. The library is published as the `buefy` npm package and is designed for tree-shaking via individual component registration. The architecture is a monorepo with two packages: `packages/buefy` (the library) and `packages/docs` (a Vite-based documentation site). Components are built using Vue 3 Options API with `defineComponent`, mixins for cross-cutting concerns (form validation, tabbed containers, notice behavior, compat fallthrough), and a consistent prop/event/slot pattern. SCSS styles are organized per component and leverage Bulma's CSS variable system for runtime theming. The library does not handle external data; it only manages UI state and provides a structured way to build Bulma-themed Vue 3 interfaces. Key entry points include `packages/buefy/src/index.ts` (main library export), `packages/buefy/src/utils/config.ts` (global configuration), and per-component index files that register each component as a Vue plugin. Data flows are limited to parent-child communication via provide/inject (e.g., Tabs, Steps, Table) and form element integration with a `BField` parent for validation. External dependencies include Vue 3 (>=3.4), Bulma CSS framework, and optional icon packs (Font Awesome, Material Design Icons). Build tooling uses Rollup, esbuild, Babel, and Vitest for testing.

RATING: 8.5/10 MAINT: active DRIFT: medium
▸ 6 reusable components found
themesberg/flowbite ★ 9367 867 APPLICATION

Flowbite is a production-grade UI component library built on top of Tailwind CSS. It provides a comprehensive set of interactive, accessible components (modals, dropdowns, tooltips, carousels, datepickers, etc.) that are initialized via HTML data attributes and backed by a lightweight JavaScript runtime. The library is distributed as an npm package with multiple entry points (ESM, CJS, UMD, Turbo, Phoenix) and includes a Tailwind CSS plugin that injects base styles for forms, tooltips, charts, and third-party integrations. The repository also hosts an extensive Hugo-based documentation site with live examples, framework integration guides (React, Vue, Angular, Laravel, Django, etc.), and a theming system with five pre-built themes (default, minimal, enterprise, playful, mono). The architecture follows a consistent component pattern: each component is a class with `init()`, `destroy()`, and static `init*()` methods that scan the DOM for data attributes. A global `Instances` singleton manages all component instances by ID, supporting override and random ID generation. The library uses Popper.js for positioning dropdowns, tooltips, and popovers, and relies on an external `flowbite-datepicker` for datepicker functionality. The Tailwind plugin (`plugin.js`) uses `plugin.withOptions` to conditionally add base styles and component classes, and the CSS theming system leverages CSS custom properties for colors, fonts, radii, and shadows with dark mode support. While the library is well-structured and actively maintained, its large surface area (30+ components) and extensive documentation create maintenance overhead. The integration guides for 20+ frameworks are prone to drift, and the inline SVG icons and hardcoded Tailwind classes in documentation examples require careful version alignment. The codebase demonstrates solid engineering practices with TypeScript, Webpack builds, and consistent patterns, making it a reliable choice for projects needing a Tailwind CSS component library with JavaScript interactivity.

RATING: 8.5/10 MAINT: active DRIFT: low
▸ 3 reusable components found
draftswithea/react-query-key-manager ★ 200 3 APPLICATION

react-query-key-manager is a small, dependency-free TypeScript library that provides type-safe, composable, and collision-free query key management for @tanstack/react-query. It exposes two main functions: `key()` wraps a function returning a query key array, augmenting it to support both direct invocation and zero-argument composition calls; `defineQueryKeys()` creates namespaced key collections with recursive nesting, compile-time validation that all functions are wrapped with `key()`, and runtime duplicate-registration detection in development. The library uses advanced TypeScript techniques (const type parameters, mapped types, conditional types) to enforce API usage at build time and to produce precise IntelliSense types. The code is concise (~60 lines of core logic), well-structured, and fully self-contained. It solves a common pain point in large React Query applications—preventing magic string keys, collisions, and poor type safety—through a clever combination of type-level constraints and runtime utilities. The design philosophy emphasizes zero overhead and copy-pasteability, making it easy to vendor into any project. It is framework-agnostic and works with TypeScript 5.0+ and React Query v4/v5. However, the library is in an early stage (version 0.0.2) and lacks a test suite. The registry and keyNames are module-level singletons, which could cause issues in extreme edge cases like multiple library copies, but for typical usage it is solid. Overall, it is a well-crafted utility that delivers on its promises with a clean, type-safe API.

RATING: 8.5/10 MAINT: active DRIFT: low
▸ 1 reusable components found
joshnuss/svelte-stripe ★ 493 45 APPLICATION

svelte-stripe is a Svelte component library that wraps Stripe Elements and Stripe.js, providing drop-in Svelte components for building payment UIs. It exposes context-based components such as Elements, PaymentElement, CardNumber, CardExpiry, and CardCvc, and handles Stripe.js loading, element lifecycle, and SSR safety. The repository also includes a SvelteKit demo application with examples for credit card, SEPA, iDEAL, and express checkout, plus server-side payment intent creation and webhook signature verification. It is a library and example app, not a data pipeline.

RATING: 8.1/10 MAINT: active DRIFT: low
▸ 3 reusable components found
docgeni/docgeni ★ 201 26 APPLICATION

Docgeni is a documentation generator for Angular component libraries and markdown documentation. It operates as a CLI tool (serve, build, init) and a set of libraries that parse Angular component metadata, build navigation, render markdown with custom extensions (embed, code groups, tabs), and generate a static or server-side rendered Angular site. The architecture is a monorepo with packages: @docgeni/cli (entry point), @docgeni/core (orchestration, builders, plugins), @docgeni/template (Angular site components and services), @docgeni/ngdoc (TypeScript parser for Angular decorators), @docgeni/toolkit (utilities for file system, git, templates), and @docgeni/create-docgeni (scaffolding). Key data flows: user provides markdown docs and Angular component libraries; the core builders parse docs, extract component metadata via ngdoc, generate navigation trees, and produce an Angular application with live examples, API tables, and multi-language support. External dependencies include Angular CLI, TypeScript compiler API, marked (markdown parser), Prism (syntax highlighting), Handlebars (templates), cosmiconfig (configuration), and chokidar (file watching). The generated site supports CSR, SSR, and SSG render modes, theming, and i18n.

RATING: 8.1/10 MAINT: active DRIFT: medium
▸ 4 reusable components found
kokonut-labs/kokonutui ★ 2092 133 APPLICATION

KokonutUI is an open-source UI component library for modern React applications, specifically targeting Next.js projects with Tailwind CSS v4 and Motion (Framer Motion). The repository contains over 40 reusable, animated components distributed through a shadcn-style registry, allowing developers to copy-paste or install them via `npx shadcn@latest add @kokonutui/<name>`. The library covers backgrounds (beams, flow field, shape hero), buttons (attract, gradient, hold, particle, slide-text, social, switch, v0), cards (apple activity, bento grid, card flip, card stack, carousel, currency transfer, liquid glass, mouse effect, spotlight, tweet), inputs (avatar picker, file upload, loader, team selector), navigation (action search bar, morphic navbar, profile dropdown, smooth drawer, smooth tab, toolbar), AI-specific components (AI input search, AI loading, AI prompt, AI text loading, AI voice), and text effects (dynamic, glitch, matrix, scroll, shimmer, sliced, swoosh, type writer). The project also includes custom hooks (use-auto-resize-textarea, use-click-outside, use-copy-to-clipboard, use-debounce, use-file-input, use-intersection, use-mobile, use-tags) and a comprehensive documentation site powered by Fumadocs with MDX content. A build script generates registry JSON files and agent-facing resources (llms.txt, agent skills index). The codebase follows modern React patterns (compound components, asChild, controlled/uncontrolled state, composition over props) and includes extensive AI agent skills for component architecture, Next.js best practices, and React design patterns. While the library is functional and well-structured, it lacks tests and has a large dependency surface; it is also tightly coupled to Next.js and serves as a marketing funnel for a pro version.

RATING: 8.0/10 MAINT: active DRIFT: low
▸ 7 reusable components found
arco-design/arco-design-mobile ★ 502 86 APPLICATION

This repository is a production-grade React mobile UI component library, `@arco-design/mobile-react`, developed by ByteDance. It provides over 60 components for building mobile web applications, including form controls, navigation, overlays, media, and feedback elements. The architecture is a Lerna monorepo with separate packages for components, shared utilities, and design tokens. The library supports theming via CSS variables (light/dark mode), internationalization (10+ locales), platform-specific styling (iOS/Android), and responsive layout using rem. It also includes comprehensive documentation sites (PC and mobile) generated from markdown. While the codebase demonstrates solid engineering practices with reusable hooks and patterns, it shows some technical drift due to outdated dependencies (React 16, TypeScript 4.1, Lerna v4) and a complex build pipeline (webpack, rollup, gulp, vite). Several components are well-crafted and isolatable, making this library a valuable resource for teams building mobile React UIs.

RATING: 8.0/10 MAINT: active DRIFT: medium
▸ 5 reusable components found
InvadingOctopus/comedot ★ 542 50 APPLICATION

Comedot is a Godot Engine 4.8+ framework for 2D game development that implements an Entity-Component-System architecture. It provides over 120 reusable components for gameplay mechanics including combat, movement, control, abilities, upgrades, inventory, turn-based systems, and UI elements. The framework emphasizes composition over inheritance, allowing developers to mix and match components to create entities for any 2D game genre. It includes template scenes for quick starts, editor plugins for component management, and extensive debugging tools. While actively maintained, the codebase shows signs of ongoing development with numerous experimental features and TODO comments indicating areas for improvement.

RATING: 7.7/10 MAINT: maintained DRIFT: medium
▸ 5 reusable components found
janiskelemen/formvuelar ★ 298 24 APPLICATION

Formvuelar is a Vue 3 form component library designed for backend-driven form workflows, with first-class support for Laravel-style validation responses. The source defines 19+ Fvl* components (input, textarea, select, search select, tag select, checkboxes, radio, switches, sliders, color/date pickers, file uploads, dropzone) and a root FvlForm component that coordinates submission, error display, dirty-state tracking, and upload progress. The core architecture uses provide/inject plus mixins: FvlForm creates a form context object and child controls inject it via formControl.js to read backend errors, clear errors on input, and expose loading and upload state. Submission is handled by Axios with per-form instances and interceptors; the library expects Laravel's 422 { message, errors } payload by default but can be adapted through global $formvuelar configuration.

RATING: 7.4/10 MAINT: maintained DRIFT: medium
▸ 4 reusable components found
gwsystems/composite ★ 202 72 APPLICATION

This repository implements Composite, a component-based research operating system where kernel policies (scheduling, memory management, synchronization) are implemented as user-level components. It runs on x86-32, x86-64, and ARMv7a architectures, primarily under QEMU. The system provides a minimal kernel with capability-based security, synchronous invocation (sinv) for inter-component communication, and shared-memory channels. It includes a full musl libc port for POSIX compatibility, a DPDK-based network stack, an lwIP adapter for TCP/IP, and a simple VMM with virtio-net and device emulation. The architecture is closer to a microkernel than a traditional monolithic kernel, with components loaded and composed via a Rust-based composer tool that reads TOML specifications. A large suite of microbenchmarks measures IPC, scheduling, and synchronization latency. The codebase is pre-alpha quality, with many FIXMEs and incomplete features, but demonstrates strong craftsmanship in its abstraction layers (assembly stubs, channel library, scheduler framework, perfdata utility).

RATING: 7.2/10 MAINT: active DRIFT: medium
▸ 6 reusable components found
── end of results ──
$ submit: