Integration Guide

Step 1: Add the cn Utility

Create a file called src/lib/utils.ts and add the following code:

import { clsx, type ClassValue } from 'clsx';
import { twMerge } from 'tailwind-merge';

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs));
}

You'll need to install clsx and tailwind-merge if you haven't already. Use command npm i tailwind-merge clsx

Step 2: Install Required Radix UI Primitives

Each DSy component that uses Radix UI, package with installation code on top of component itself.

For example, if a component uses the Switch primitive, you'll see:

npm install @radix-ui/react-switch

Simply install the primitives as needed for the components you use.