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:

  1. Open your terminal and navigate to your project directory.
  2. Run the following command to install shadcn/ui:
npx shadcn@latest init
  1. 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! 🚀