#What is TanCN?

TanCN is a free, open-source component set designed to simplify building forms and tables using TanStack libraries with shadcn/ui. Its primary goal is to provide developers with fully featured, type-safe components for rapid UI development, targeting React developers constructing dashboards, admin panels, or data-heavy applications. Built with React, TypeScript, Tailwind CSS, and shadcn/ui, TanCN leverages TanStack Form for validation and TanStack Table for data display, ensuring accessibility and consistency. It supports Zod for schema validation and offers easy integration via shadcn CLI. For the shadcn/ui ecosystem, TanCN is a perfect fit, extending shadcn/ui's accessible foundation to deliver optimized, TanStack-powered components for React applications.

#Features ⚡

• TanStack Form Support: Fully featured form components with Zod validation and type-safety.

• ShadCN UI Integration: Builds on ShadCN UI for accessible, customizable components.

• Accessibility: Inherits ShadCN UI's WAI-ARIA compliance with Radix UI primitives.

• CLI Support: Add components with npx shadcn@latest add for quick setup.

• Responsive Design: Tailwind CSS ensures components adapt to all screen sizes.

• Type Safety: TypeScript ensures robust, error-free development

#Pros ✅

• Seamless TanStack Integration: Easy Zod support saves validation setup time.

• Free and Open-Source: MIT license allows unrestricted use and modification.

• ShadCN UI Fit: Perfect for ShadCN UI with its React and ShadCN UI foundation.

• Community Support: Active GitHub with contributions encouraged.

• Easy Integration: Copy-paste model with CLI simplifies adding components.

#Cons ⚠️

• React Dependency: Limited to React projects, though fitting for ShadCN UI.

• Setup Complexity: Requires ShadCN UI, Tailwind CSS, and TanStack libraries pre-installed.

• Learning Curve: Familiarity with ShadCN UI, React, and TypeScript needed for effective use.

#Included Components - Templates

TanCN provides a variety of ShadCN UI-powered components:

• TanStack Form: Type-safe forms with Zod validation.

• TanStack Table: Data tables with sorting and filtering.

• Zod Integration: Schema-based validation for forms.

• Custom Inputs: Accessible form fields with TanStack support.

#Pricing 💸

TanCN operates on a Free model:

• Free Access: All components are free under the MIT license.

• No Pro Version: No premium features or paid tiers.

#Integrations 🧰

TanCN integrates with:

• React: Core framework for building components.

• ShadCN UI: Accessible component library for styling and structure.

• Tailwind CSS: Utility-first styling for responsive design.

• TanStack Form/Table: Support for advanced form and table logic.

• Zod: Schema validation for type-safety.