What is moai-lib-shadcn-ui?

It is an enterprise-grade component library for React based on shadcn/ui, specifically optimized for use with AI coding assistants like Claude to generate high-quality UI code.

How do I customize the theme?

The library uses a comprehensive design token system based on CSS variables, allowing you to easily adjust colors, radius, and typography for both light and dark modes.

How does this skill improve my Claude Code workflow?

This skill provides Claude with specific context regarding your UI architecture, enabling it to write code that adheres to your design system, accessibility requirements, and TypeScript patterns automatically.

Does it support the latest React version?

Yes, the library is designed for React 19 and fully supports modern patterns including React Server Components (RSC).

Are the components accessible?

Yes, all components are built using Radix UI primitives and follow WCAG 2.1 AA compliance standards for web accessibility.

Moai Enterprise UI Library

Name: Moai Enterprise UI Library
Author: jg-chalk-io

byjg-chalk-io

デザインツール

Streamlines React development with an enterprise-grade shadcn/ui component library and AI-enhanced design system architecture.

概要

This skill integrates a comprehensive suite of over 40 production-ready React components built on shadcn/ui, Radix UI, and Tailwind CSS. It provides developers with a robust foundation for building modern, accessible (WCAG 2.1 AA), and high-performance web applications. By leveraging enterprise-level design tokens and CSS variables, it enables seamless theming and consistent branding across complex projects while maintaining full TypeScript type safety and compatibility with React 19 Server Components.

主な機能

40+ production-ready UI components
Optimized React 19 Server Component support
0 GitHub stars
Enterprise-grade design system architecture
WCAG 2.1 AA accessibility compliance
Full TypeScript 5.5 type safety

ユースケース

Implementing consistent design systems across distributed teams
Building accessible enterprise-level dashboards
Rapidly prototyping production-grade interfaces with AI assistance

概要

主な機能

40+ production-ready UI components
Optimized React 19 Server Component support
0 GitHub stars
Enterprise-grade design system architecture
WCAG 2.1 AA accessibility compliance
Full TypeScript 5.5 type safety

ユースケース

Implementing consistent design systems across distributed teams
Building accessible enterprise-level dashboards
Rapidly prototyping production-grade interfaces with AI assistance