Installation
AI Block provides a collection of customizable AI components to enhance your project. Follow the steps below to get started.
Prerequisites
Before proceeding with the installation, ensure your development environment meets the following requirements:
Installing shadcn/ui
AI Block components are built on shadcn/ui
. Before installing AI Block, you must set up shadcn/ui
in your project. Follow the official shadcn/ui installation to configure it properly.
Steps to Install shadcn/ui
:
- Open your terminal and navigate to your project directory.
- Run the following command to install
shadcn/ui
:
npx shadcn@latest init
- Follow the on-screen prompts to complete the setup.
Installing AI Block Components
Once shadcn/ui
is set up, you can install AI Block components using the shadcn
CLI.
Using the shadcn
CLI
Run the following command to install AI Block components:
npx shadcn@latest add "https://aiblock.site/c/[COMPONENT].json"
Replace [COMPONENT]
with the name of the AI Block component you want to install.
Example Installation
To install the PromptInput
component, run:
npx shadcn@latest add "https://aiblock.site/c/prompt-input.json"
Importing and Using AI Block Components
After installation, you can import and use the components in your React project.
Importing Components
Use the following import statement to include an AI Block component in your project:
import { PromptInput } from "@/components/ui/prompt-input";
Additional Resources
For more information on using AI Block components, check out the following resources:
Now you're ready to integrate AI-powered components into your project. Happy coding! 🚀