diff --git a/package.json b/package.json
index e02d679f3..222a2a2d4 100644
--- a/package.json
+++ b/package.json
@@ -52,8 +52,8 @@
     "@upstash/ratelimit": "^2.1.0",
     "@upstash/redis": "^1.38.4",
     "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
+    "cn": "^0.3.0",
     "date-fns": "^4.4.0",
     "drizzle-orm": "^0.45.2",
     "export-to-csv": "^1.5.0",
@@ -72,7 +72,6 @@
     "server-only": "^0.0.1",
     "shadcn": "4.21.0",
     "sonner": "^2.0.8",
-    "tailwind-merge": "^3.7.0",
     "uploadthing": "^7.7.4",
     "vaul": "^1.1.2",
     "zod": "^4.6.5"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e0a7ce5e5..ab4902ce5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -217,12 +217,12 @@ importers:
       class-variance-authority:
         specifier: ^0.7.1
         version: 0.7.1
-      clsx:
-        specifier: ^2.1.1
-        version: 2.1.1
       cmdk:
         specifier: ^1.1.1
         version: 1.1.1(@types/react-dom@19.3.0(@types/react@19.3.0))(@types/react@19.3.0)(react-dom@19.3.0(react@19.3.0))(react@19.3.0)
+      cn:
+        specifier: ^0.3.0
+        version: 0.3.0
       date-fns:
         specifier: ^4.4.0
         version: 4.4.0
@@ -277,9 +277,6 @@ importers:
       sonner:
         specifier: ^2.0.8
         version: 2.0.8(@types/react@19.3.0)(react-dom@19.3.0(react@19.3.0))(react@19.3.0)
-      tailwind-merge:
-        specifier: ^3.7.0
-        version: 3.7.0
       uploadthing:
         specifier: ^7.7.4
         version: 7.7.4(express@5.2.1(supports-color@10.2.2))(next@16.3.5(@babel/core@7.29.7(supports-color@10.2.2))(@types/node@26.6.1)(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(tailwindcss@4.3.3)
@@ -3349,6 +3346,11 @@ packages:
     engines: {node: '>=20'}
     hasBin: true
 
+  cn@0.3.0:
+    resolution: {integrity: sha512-qRoU0ARrZD3Bbj1wKFftEKxPjSnzTEdFkf22NVhW+zU9D/wajhoP+qUZ5DChhhSOBCH1onV12hrmGqfu1+5Z2Q==}
+    engines: {node: '>=20'}
+    hasBin: true
+
   code-block-writer@13.0.3:
     resolution: {integrity: sha512-Oofo0pq3IKnsFtuHqSF7TqBfr71aeyZDVJ0HpmqB7FBM2qEigL0iPONSCZSO9pE9dZTAxANe5XHG9Uy0YMv8cg==}
 
@@ -5021,9 +5023,6 @@ packages:
     os: [darwin, linux, win32, freebsd, openbsd, netbsd, sunos, android]
     hasBin: true
 
-  tailwind-merge@3.7.0:
-    resolution: {integrity: sha512-XPPUyAc+cvspz3lHTcR/QgPfW2A0lv/xQNIjX3HGhLR+Nq2lHaLq5MtTesHn8GUr3W3DguT2KT5x3NVgRtYwmA==}
-
   tailwindcss@4.3.3:
     resolution: {integrity: sha512-gOhV3P7ufE62QDGg1zVaTgCR+EtPv92k2nIhVcVKcLmxT1sUBsQGhnZj175j+MqRt4zLF7ic+sCYjfhxMxj7YQ==}
 
@@ -7731,6 +7730,8 @@ snapshots:
 
   cn@0.2.6: {}
 
+  cn@0.3.0: {}
+
   code-block-writer@13.0.3: {}
 
   commander@11.1.0: {}
@@ -9419,8 +9420,6 @@ snapshots:
 
   systeminformation@5.33.11: {}
 
-  tailwind-merge@3.7.0: {}
-
   tailwindcss@4.3.3: {}
 
   tapable@2.3.3: {}
diff --git a/registry.json b/registry.json
index 7434bdc5a..e36818438 100644
--- a/registry.json
+++ b/registry.json
@@ -23,7 +23,7 @@
         "label",
         "skeleton"
       ],
-      "dependencies": ["@tanstack/react-table", "lucide-react", "nuqs"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "nuqs", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-table/data-table.tsx",
@@ -112,7 +112,7 @@
         "popover",
         "select"
       ],
-      "dependencies": ["@tanstack/react-table", "lucide-react"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-table/data-table-sort-list.tsx",
@@ -160,7 +160,7 @@
         "popover",
         "select"
       ],
-      "dependencies": ["@tanstack/react-table", "lucide-react", "nuqs"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "nuqs", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-table/data-table-filter-list.tsx",
@@ -240,7 +240,7 @@
         "popover",
         "select"
       ],
-      "dependencies": ["@tanstack/react-table", "lucide-react", "nuqs"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "nuqs", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-table/data-table-filter-menu.tsx",
@@ -317,7 +317,8 @@
         "@tanstack/react-table",
         "@tanstack/react-virtual",
         "lucide-react",
-        "sonner"
+        "sonner",
+        "cn"
       ],
       "files": [
         {
@@ -419,7 +420,7 @@
       "title": "Data Grid Select Column",
       "description": "A reusable select column definition for the data grid with checkbox selection and shift-click support",
       "registryDependencies": ["checkbox"],
-      "dependencies": ["@tanstack/react-table"],
+      "dependencies": ["@tanstack/react-table", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-grid/data-grid-select-column.tsx",
@@ -448,7 +449,7 @@
         "popover",
         "select"
       ],
-      "dependencies": ["@tanstack/react-table", "lucide-react"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-grid/data-grid-sort-menu.tsx",
@@ -508,7 +509,7 @@
       "title": "Data Grid View Menu",
       "description": "A view menu component for the data grid to toggle column visibility",
       "registryDependencies": ["button", "command", "popover"],
-      "dependencies": ["@tanstack/react-table", "lucide-react"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-grid/data-grid-view-menu.tsx",
@@ -564,7 +565,7 @@
         "popover",
         "select"
       ],
-      "dependencies": ["@tanstack/react-table", "lucide-react"],
+      "dependencies": ["@tanstack/react-table", "lucide-react", "cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-grid/data-grid-filter-menu.tsx",
@@ -613,7 +614,7 @@
       "title": "Data Grid Skeleton",
       "description": "A composable skeleton component for the data grid with toolbar and grid parts",
       "registryDependencies": ["skeleton"],
-      "dependencies": [],
+      "dependencies": ["cn"],
       "files": [
         {
           "path": "src/registry/bases/radix/components/data-grid/data-grid-skeleton.tsx",
diff --git a/scripts/build-registry.ts b/scripts/build-registry.ts
index 6222c6d03..38358dc86 100644
--- a/scripts/build-registry.ts
+++ b/scripts/build-registry.ts
@@ -85,7 +85,7 @@ function withImportedDependencies(
 
   const next = [...(dependencies ?? [])];
 
-  for (const pkg of ["@base-ui/react", "@base-ui/utils"] as const) {
+  for (const pkg of ["@base-ui/react", "@base-ui/utils", "cn"] as const) {
     if (contents.some((content) => content.includes(`"${pkg}`))) {
       if (!next.includes(pkg)) next.push(pkg);
     }
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 567912700..ed0f3af9a 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -1,9 +1,4 @@
-import { type ClassValue, clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}
+export { cn } from "cn";
 
 export function getAbsoluteUrl(path: string) {
   const normalizedPath = path.startsWith("/") ? path : `/${path}`;
diff --git a/src/registry/bases/base/components/data-grid/data-grid-cell-variants.tsx b/src/registry/bases/base/components/data-grid/data-grid-cell-variants.tsx
index a6af92ecd..132fb8daa 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-cell-variants.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-cell-variants.tsx
@@ -2,6 +2,7 @@
 
 import type { RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 import { toast } from "sonner";
 
@@ -19,7 +20,6 @@ import {
   getUrlHref,
   parseLocalDate,
 } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { DataGridCellWrapper } from "@/registry/bases/base/components/data-grid/data-grid-cell-wrapper";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import { Button } from "@/registry/bases/base/ui/button";
diff --git a/src/registry/bases/base/components/data-grid/data-grid-cell-wrapper.tsx b/src/registry/bases/base/components/data-grid/data-grid-cell-wrapper.tsx
index 147030e42..65802f394 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-cell-wrapper.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-cell-wrapper.tsx
@@ -3,12 +3,12 @@
 import type { RowData } from "@tanstack/react-table";
 
 import { useMergedRefs } from "@base-ui/utils/useMergedRefs";
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridCellProps } from "@/lib/data-grid-types";
 
 import { getCellKey } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { useDataGridPresence } from "@/registry/bases/base/components/data-grid/data-grid-presence";
 
 interface DataGridCellWrapperProps<TData extends RowData>
diff --git a/src/registry/bases/base/components/data-grid/data-grid-column-header.tsx b/src/registry/bases/base/components/data-grid/data-grid-column-header.tsx
index 240b1ac81..a661926b1 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-column-header.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-column-header.tsx
@@ -9,12 +9,12 @@ import type {
   Table,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
 import { getColumnVariant } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
diff --git a/src/registry/bases/base/components/data-grid/data-grid-filter-menu.tsx b/src/registry/bases/base/components/data-grid/data-grid-filter-menu.tsx
index 01d57a921..f1554ca3a 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-filter-menu.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-filter-menu.tsx
@@ -7,6 +7,7 @@ import type {
   Table,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
@@ -18,7 +19,6 @@ import {
   getOperatorsForVariant,
 } from "@/lib/data-grid-filters";
 import { formatDate } from "@/lib/format";
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import { Button } from "@/registry/bases/base/ui/button";
 import { useDirection } from "@/registry/bases/base/ui/direction";
diff --git a/src/registry/bases/base/components/data-grid/data-grid-paste-dialog.tsx b/src/registry/bases/base/components/data-grid/data-grid-paste-dialog.tsx
index c50612a9e..0425192c7 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-paste-dialog.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-paste-dialog.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type {
@@ -8,7 +9,6 @@ import type {
 } from "@/lib/data-grid-types";
 
 import { useAsRef } from "@/hooks/use-as-ref";
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/base/ui/button";
 import {
   Dialog,
diff --git a/src/registry/bases/base/components/data-grid/data-grid-row.tsx b/src/registry/bases/base/components/data-grid/data-grid-row.tsx
index b78adf794..fc35b74b7 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-row.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-row.tsx
@@ -9,6 +9,7 @@ import type {
 import type { VirtualItem } from "@tanstack/react-virtual";
 
 import { useMergedRefs } from "@base-ui/utils/useMergedRefs";
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
@@ -26,7 +27,6 @@ import {
   getColumnPinningStyle,
   getRowHeightValue,
 } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { DataGridCell } from "@/registry/bases/base/components/data-grid/data-grid-cell";
 
 interface DataGridRowProps<
diff --git a/src/registry/bases/base/components/data-grid/data-grid-select-column.tsx b/src/registry/bases/base/components/data-grid/data-grid-select-column.tsx
index 6cf517d1d..8d36db7e0 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-select-column.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-select-column.tsx
@@ -7,11 +7,11 @@ import type {
   RowData,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
-import { cn } from "@/lib/utils";
 import { Checkbox } from "@/registry/bases/base/ui/checkbox";
 
 type HitboxSize = "default" | "sm" | "lg";
diff --git a/src/registry/bases/base/components/data-grid/data-grid-skeleton.tsx b/src/registry/bases/base/components/data-grid/data-grid-skeleton.tsx
index eb39f2adf..b8f06048a 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-skeleton.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-skeleton.tsx
@@ -1,6 +1,7 @@
 import type * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
+
 import { Skeleton } from "@/registry/bases/radix/ui/skeleton";
 
 interface DivProps extends React.ComponentProps<"div"> {}
diff --git a/src/registry/bases/base/components/data-grid/data-grid-sort-menu.tsx b/src/registry/bases/base/components/data-grid/data-grid-sort-menu.tsx
index 69dabbd6d..6528e7fcd 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-sort-menu.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-sort-menu.tsx
@@ -2,11 +2,11 @@
 
 import type { ColumnSort, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import { Button } from "@/registry/bases/base/ui/button";
 import { useDirection } from "@/registry/bases/base/ui/direction";
diff --git a/src/registry/bases/base/components/data-grid/data-grid-view-menu.tsx b/src/registry/bases/base/components/data-grid/data-grid-view-menu.tsx
index 873cda6c1..cca105681 100644
--- a/src/registry/bases/base/components/data-grid/data-grid-view-menu.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid-view-menu.tsx
@@ -2,11 +2,11 @@
 
 import type { RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/base/ui/button";
 import { useDirection } from "@/registry/bases/base/ui/direction";
 import {
diff --git a/src/registry/bases/base/components/data-grid/data-grid.tsx b/src/registry/bases/base/components/data-grid/data-grid.tsx
index bb91d7bbc..766507470 100644
--- a/src/registry/bases/base/components/data-grid/data-grid.tsx
+++ b/src/registry/bases/base/components/data-grid/data-grid.tsx
@@ -2,6 +2,7 @@
 
 import type { RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { useDataGrid } from "@/hooks/use-data-grid";
@@ -13,7 +14,6 @@ import {
   getColumnBorderVisibility,
   getColumnPinningStyle,
 } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { DataGridColumnHeader } from "@/registry/bases/base/components/data-grid/data-grid-column-header";
 import { DataGridContextMenu } from "@/registry/bases/base/components/data-grid/data-grid-context-menu";
 import { DataGridPasteDialog } from "@/registry/bases/base/components/data-grid/data-grid-paste-dialog";
diff --git a/src/registry/bases/base/components/data-table/data-table-advanced-toolbar.tsx b/src/registry/bases/base/components/data-table/data-table-advanced-toolbar.tsx
index 4bcdd7d80..531e64f1d 100644
--- a/src/registry/bases/base/components/data-table/data-table-advanced-toolbar.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-advanced-toolbar.tsx
@@ -3,9 +3,10 @@
 import type { RowData, Table } from "@tanstack/react-table";
 import type * as React from "react";
 
+import { cn } from "cn";
+
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { DataTableViewOptions } from "@/registry/bases/base/components/data-table/data-table-view-options";
 
 interface DataTableAdvancedToolbarProps<
diff --git a/src/registry/bases/base/components/data-table/data-table-column-header.tsx b/src/registry/bases/base/components/data-table/data-table-column-header.tsx
index d50ad653a..f856fab21 100644
--- a/src/registry/bases/base/components/data-table/data-table-column-header.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-column-header.tsx
@@ -2,9 +2,10 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
+
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
diff --git a/src/registry/bases/base/components/data-table/data-table-faceted-filter.tsx b/src/registry/bases/base/components/data-table/data-table-faceted-filter.tsx
index 66100f897..2f0fe8f15 100644
--- a/src/registry/bases/base/components/data-table/data-table-faceted-filter.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-faceted-filter.tsx
@@ -2,12 +2,12 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { Option } from "@/lib/data-table-types";
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import { Button } from "@/registry/bases/base/ui/button";
 import {
diff --git a/src/registry/bases/base/components/data-table/data-table-filter-list.tsx b/src/registry/bases/base/components/data-table/data-table-filter-list.tsx
index f407ba73a..1ab4bee8c 100644
--- a/src/registry/bases/base/components/data-table/data-table-filter-list.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-filter-list.tsx
@@ -2,6 +2,7 @@
 
 import type { Column, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import { parseAsStringEnum, useQueryState } from "nuqs";
 import * as React from "react";
 
@@ -21,7 +22,6 @@ import {
 import { formatDate } from "@/lib/format";
 import { generateId } from "@/lib/id";
 import { getFiltersStateParser } from "@/lib/parsers";
-import { cn } from "@/lib/utils";
 import { DataTableRangeFilter } from "@/registry/bases/base/components/data-table/data-table-range-filter";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import { Button } from "@/registry/bases/base/ui/button";
diff --git a/src/registry/bases/base/components/data-table/data-table-filter-menu.tsx b/src/registry/bases/base/components/data-table/data-table-filter-menu.tsx
index 591cee2f7..f301a5226 100644
--- a/src/registry/bases/base/components/data-table/data-table-filter-menu.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-filter-menu.tsx
@@ -2,6 +2,7 @@
 
 import type { Column, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import { useQueryState } from "nuqs";
 import * as React from "react";
 
@@ -16,7 +17,6 @@ import {
 import { formatDate } from "@/lib/format";
 import { generateId } from "@/lib/id";
 import { getFiltersStateParser } from "@/lib/parsers";
-import { cn } from "@/lib/utils";
 import { DataTableRangeFilter } from "@/registry/bases/base/components/data-table/data-table-range-filter";
 import { Button } from "@/registry/bases/base/ui/button";
 import {
diff --git a/src/registry/bases/base/components/data-table/data-table-pagination.tsx b/src/registry/bases/base/components/data-table/data-table-pagination.tsx
index f80714071..59ecb026c 100644
--- a/src/registry/bases/base/components/data-table/data-table-pagination.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-pagination.tsx
@@ -1,8 +1,9 @@
 import type { RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
+
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/base/ui/button";
 import {
   Select,
diff --git a/src/registry/bases/base/components/data-table/data-table-range-filter.tsx b/src/registry/bases/base/components/data-table/data-table-range-filter.tsx
index 87baec358..35b3bbd2d 100644
--- a/src/registry/bases/base/components/data-table/data-table-range-filter.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-range-filter.tsx
@@ -2,12 +2,12 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { ExtendedColumnFilter } from "@/lib/data-table-types";
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Input } from "@/registry/bases/radix/ui/input";
 
 interface DataTableRangeFilterProps<
diff --git a/src/registry/bases/base/components/data-table/data-table-skeleton.tsx b/src/registry/bases/base/components/data-table/data-table-skeleton.tsx
index c2ec6045c..d17fe5501 100644
--- a/src/registry/bases/base/components/data-table/data-table-skeleton.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-skeleton.tsx
@@ -1,4 +1,5 @@
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
+
 import { Skeleton } from "@/registry/bases/radix/ui/skeleton";
 import {
   Table,
diff --git a/src/registry/bases/base/components/data-table/data-table-slider-filter.tsx b/src/registry/bases/base/components/data-table/data-table-slider-filter.tsx
index 54ab6d176..1339fb336 100644
--- a/src/registry/bases/base/components/data-table/data-table-slider-filter.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-slider-filter.tsx
@@ -2,11 +2,11 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/base/ui/button";
 import { Label } from "@/registry/bases/base/ui/label";
 import {
diff --git a/src/registry/bases/base/components/data-table/data-table-sort-list.tsx b/src/registry/bases/base/components/data-table/data-table-sort-list.tsx
index 5f4c799b6..b082d72d8 100644
--- a/src/registry/bases/base/components/data-table/data-table-sort-list.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-sort-list.tsx
@@ -2,12 +2,12 @@
 
 import type { ColumnSort, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
 import { dataTableConfig } from "@/lib/data-table-utils";
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import { Button } from "@/registry/bases/base/ui/button";
 import {
diff --git a/src/registry/bases/base/components/data-table/data-table-toolbar.tsx b/src/registry/bases/base/components/data-table/data-table-toolbar.tsx
index 0d87b8f96..463f20486 100644
--- a/src/registry/bases/base/components/data-table/data-table-toolbar.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-toolbar.tsx
@@ -2,11 +2,11 @@
 
 import type { Column, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { DataTableDateFilter } from "@/registry/bases/base/components/data-table/data-table-date-filter";
 import { DataTableFacetedFilter } from "@/registry/bases/base/components/data-table/data-table-faceted-filter";
 import { DataTableSliderFilter } from "@/registry/bases/base/components/data-table/data-table-slider-filter";
diff --git a/src/registry/bases/base/components/data-table/data-table-view-options.tsx b/src/registry/bases/base/components/data-table/data-table-view-options.tsx
index 2c149989f..d1ed6b1a6 100644
--- a/src/registry/bases/base/components/data-table/data-table-view-options.tsx
+++ b/src/registry/bases/base/components/data-table/data-table-view-options.tsx
@@ -2,11 +2,11 @@
 
 import type { RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/base/ui/button";
 import {
   Popover,
diff --git a/src/registry/bases/base/components/data-table/data-table.tsx b/src/registry/bases/base/components/data-table/data-table.tsx
index ecdcde25d..440b2fef7 100644
--- a/src/registry/bases/base/components/data-table/data-table.tsx
+++ b/src/registry/bases/base/components/data-table/data-table.tsx
@@ -5,11 +5,11 @@ import {
   type RowData,
   type Table as TanstackTable,
 } from "@tanstack/react-table";
+import { cn } from "cn";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
 import { getColumnPinningStyle } from "@/lib/data-table-utils";
-import { cn } from "@/lib/utils";
 import { DataTablePagination } from "@/registry/bases/base/components/data-table/data-table-pagination";
 import {
   Table,
diff --git a/src/registry/bases/base/ui/badge.tsx b/src/registry/bases/base/ui/badge.tsx
index a8cbbacc2..054ed3ee6 100644
--- a/src/registry/bases/base/ui/badge.tsx
+++ b/src/registry/bases/base/ui/badge.tsx
@@ -1,8 +1,7 @@
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { cva, type VariantProps } from "class-variance-authority";
-
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 const badgeVariants = cva(
   "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
diff --git a/src/registry/bases/base/ui/button.tsx b/src/registry/bases/base/ui/button.tsx
index e2ee79307..4212cbb98 100644
--- a/src/registry/bases/base/ui/button.tsx
+++ b/src/registry/bases/base/ui/button.tsx
@@ -1,7 +1,6 @@
 import { Button as ButtonPrimitive } from "@base-ui/react/button";
 import { cva, type VariantProps } from "class-variance-authority";
-
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 const buttonVariants = cva(
   "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
diff --git a/src/registry/bases/base/ui/checkbox.tsx b/src/registry/bases/base/ui/checkbox.tsx
index ca25c330b..8a80b513b 100644
--- a/src/registry/bases/base/ui/checkbox.tsx
+++ b/src/registry/bases/base/ui/checkbox.tsx
@@ -1,10 +1,9 @@
 "use client";
 
 import { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
+import { cn } from "cn";
 import { CheckIcon } from "lucide-react";
 
-import { cn } from "@/lib/utils";
-
 function Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props) {
   return (
     <CheckboxPrimitive.Root
diff --git a/src/registry/bases/base/ui/dialog.tsx b/src/registry/bases/base/ui/dialog.tsx
index 56d909587..da1dec8c9 100644
--- a/src/registry/bases/base/ui/dialog.tsx
+++ b/src/registry/bases/base/ui/dialog.tsx
@@ -1,10 +1,10 @@
 "use client";
 
 import { Dialog as DialogPrimitive } from "@base-ui/react/dialog";
+import { cn } from "cn";
 import { XIcon } from "lucide-react";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/base/ui/button";
 
 function Dialog({ ...props }: DialogPrimitive.Root.Props) {
diff --git a/src/registry/bases/base/ui/dropdown-menu.tsx b/src/registry/bases/base/ui/dropdown-menu.tsx
index afc05a1e2..e85f66b3f 100644
--- a/src/registry/bases/base/ui/dropdown-menu.tsx
+++ b/src/registry/bases/base/ui/dropdown-menu.tsx
@@ -1,11 +1,10 @@
 "use client";
 
 import { Menu as MenuPrimitive } from "@base-ui/react/menu";
+import { cn } from "cn";
 import { CheckIcon, ChevronRightIcon } from "lucide-react";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
-
 function DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {
   return <MenuPrimitive.Root data-slot="dropdown-menu" {...props} />;
 }
diff --git a/src/registry/bases/base/ui/faceted.tsx b/src/registry/bases/base/ui/faceted.tsx
index 6f78a43dc..043bfbddd 100644
--- a/src/registry/bases/base/ui/faceted.tsx
+++ b/src/registry/bases/base/ui/faceted.tsx
@@ -1,8 +1,8 @@
 "use client";
 
+import { cn } from "cn";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/base/ui/badge";
 import {
   Popover,
diff --git a/src/registry/bases/base/ui/label.tsx b/src/registry/bases/base/ui/label.tsx
index 680d9a657..207f5448e 100644
--- a/src/registry/bases/base/ui/label.tsx
+++ b/src/registry/bases/base/ui/label.tsx
@@ -1,9 +1,8 @@
 "use client";
 
+import { cn } from "cn";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
-
 function Label({ className, ...props }: React.ComponentProps<"label">) {
   return (
     <label
diff --git a/src/registry/bases/base/ui/popover.tsx b/src/registry/bases/base/ui/popover.tsx
index 1fe86ba3a..5cae75357 100644
--- a/src/registry/bases/base/ui/popover.tsx
+++ b/src/registry/bases/base/ui/popover.tsx
@@ -1,10 +1,9 @@
 "use client";
 
 import { Popover as PopoverPrimitive } from "@base-ui/react/popover";
+import { cn } from "cn";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
-
 function Popover({ ...props }: PopoverPrimitive.Root.Props) {
   return <PopoverPrimitive.Root data-slot="popover" {...props} />;
 }
diff --git a/src/registry/bases/base/ui/select.tsx b/src/registry/bases/base/ui/select.tsx
index 7941699d0..7986e3445 100644
--- a/src/registry/bases/base/ui/select.tsx
+++ b/src/registry/bases/base/ui/select.tsx
@@ -1,11 +1,10 @@
 "use client";
 
 import { Select as SelectPrimitive } from "@base-ui/react/select";
+import { cn } from "cn";
 import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
-
 const Select = SelectPrimitive.Root;
 
 function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {
diff --git a/src/registry/bases/base/ui/separator.tsx b/src/registry/bases/base/ui/separator.tsx
index bbd569a25..a4d74039d 100644
--- a/src/registry/bases/base/ui/separator.tsx
+++ b/src/registry/bases/base/ui/separator.tsx
@@ -1,8 +1,7 @@
 "use client";
 
 import { Separator as SeparatorPrimitive } from "@base-ui/react/separator";
-
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Separator({
   className,
diff --git a/src/registry/bases/base/ui/slider.tsx b/src/registry/bases/base/ui/slider.tsx
index 464b88c5f..88a6b5191 100644
--- a/src/registry/bases/base/ui/slider.tsx
+++ b/src/registry/bases/base/ui/slider.tsx
@@ -1,6 +1,5 @@
 import { Slider as SliderPrimitive } from "@base-ui/react/slider";
-
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Slider({
   className,
diff --git a/src/registry/bases/base/ui/sortable.tsx b/src/registry/bases/base/ui/sortable.tsx
index 8e2f28b36..c0ece5ae6 100644
--- a/src/registry/bases/base/ui/sortable.tsx
+++ b/src/registry/bases/base/ui/sortable.tsx
@@ -38,11 +38,11 @@ import {
   verticalListSortingStrategy,
 } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
+import { cn } from "cn";
 import * as React from "react";
 import * as ReactDOM from "react-dom";
 
 import { useIsomorphicLayoutEffect } from "@/hooks/use-isomorphic-layout-effect";
-import { cn } from "@/lib/utils";
 
 const orientationConfig = {
   vertical: {
diff --git a/src/registry/bases/base/ui/tooltip.tsx b/src/registry/bases/base/ui/tooltip.tsx
index a24a048db..0276e89a4 100644
--- a/src/registry/bases/base/ui/tooltip.tsx
+++ b/src/registry/bases/base/ui/tooltip.tsx
@@ -1,8 +1,7 @@
 "use client";
 
 import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
-
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function TooltipProvider({
   delay = 0,
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-cell-variants.tsx b/src/registry/bases/radix/components/data-grid/data-grid-cell-variants.tsx
index bef083feb..3b7327ccb 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-cell-variants.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-cell-variants.tsx
@@ -2,6 +2,7 @@
 
 import type { RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 import { toast } from "sonner";
 
@@ -19,7 +20,6 @@ import {
   getUrlHref,
   parseLocalDate,
 } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { DataGridCellWrapper } from "@/registry/bases/radix/components/data-grid/data-grid-cell-wrapper";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import { Button } from "@/registry/bases/radix/ui/button";
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-cell-wrapper.tsx b/src/registry/bases/radix/components/data-grid/data-grid-cell-wrapper.tsx
index a7709ff28..a4743ef04 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-cell-wrapper.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-cell-wrapper.tsx
@@ -2,13 +2,13 @@
 
 import type { RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import { useComposedRefs } from "radix-ui/internal";
 import * as React from "react";
 
 import type { DataGridCellProps } from "@/lib/data-grid-types";
 
 import { getCellKey } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { useDataGridPresence } from "@/registry/bases/radix/components/data-grid/data-grid-presence";
 
 interface DataGridCellWrapperProps<TData extends RowData>
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-column-header.tsx b/src/registry/bases/radix/components/data-grid/data-grid-column-header.tsx
index 95694209b..38ac937b7 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-column-header.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-column-header.tsx
@@ -9,12 +9,12 @@ import type {
   Table,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
 import { getColumnVariant } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-filter-menu.tsx b/src/registry/bases/radix/components/data-grid/data-grid-filter-menu.tsx
index 51fdd55cb..e8942773c 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-filter-menu.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-filter-menu.tsx
@@ -7,6 +7,7 @@ import type {
   Table,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
@@ -18,7 +19,6 @@ import {
   getOperatorsForVariant,
 } from "@/lib/data-grid-filters";
 import { formatDate } from "@/lib/format";
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import { Button } from "@/registry/bases/radix/ui/button";
 import { Calendar } from "@/registry/bases/radix/ui/calendar";
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-paste-dialog.tsx b/src/registry/bases/radix/components/data-grid/data-grid-paste-dialog.tsx
index 3f7dcab9e..acbba6f1c 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-paste-dialog.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-paste-dialog.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type {
@@ -8,7 +9,6 @@ import type {
 } from "@/lib/data-grid-types";
 
 import { useAsRef } from "@/hooks/use-as-ref";
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
   Dialog,
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-row.tsx b/src/registry/bases/radix/components/data-grid/data-grid-row.tsx
index 6f2508790..3be9133bf 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-row.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-row.tsx
@@ -8,6 +8,7 @@ import type {
 } from "@tanstack/react-table";
 import type { VirtualItem } from "@tanstack/react-virtual";
 
+import { cn } from "cn";
 import { useComposedRefs } from "radix-ui/internal";
 import * as React from "react";
 
@@ -26,7 +27,6 @@ import {
   getColumnPinningStyle,
   getRowHeightValue,
 } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { DataGridCell } from "@/registry/bases/radix/components/data-grid/data-grid-cell";
 
 interface DataGridRowProps<
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-select-column.tsx b/src/registry/bases/radix/components/data-grid/data-grid-select-column.tsx
index 15954e903..1dbba3583 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-select-column.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-select-column.tsx
@@ -7,11 +7,11 @@ import type {
   RowData,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
-import { cn } from "@/lib/utils";
 import { Checkbox } from "@/registry/bases/radix/ui/checkbox";
 
 type HitboxSize = "default" | "sm" | "lg";
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-skeleton.tsx b/src/registry/bases/radix/components/data-grid/data-grid-skeleton.tsx
index eb39f2adf..b8f06048a 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-skeleton.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-skeleton.tsx
@@ -1,6 +1,7 @@
 import type * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
+
 import { Skeleton } from "@/registry/bases/radix/ui/skeleton";
 
 interface DivProps extends React.ComponentProps<"div"> {}
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-sort-menu.tsx b/src/registry/bases/radix/components/data-grid/data-grid-sort-menu.tsx
index 07110b92d..9298af8bd 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-sort-menu.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-sort-menu.tsx
@@ -7,11 +7,11 @@ import type {
   Table,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
diff --git a/src/registry/bases/radix/components/data-grid/data-grid-view-menu.tsx b/src/registry/bases/radix/components/data-grid/data-grid-view-menu.tsx
index f7f21a474..24b78b5a4 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid-view-menu.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid-view-menu.tsx
@@ -2,11 +2,11 @@
 
 import type { RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataGridFeatures } from "@/lib/data-grid-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
   Command,
diff --git a/src/registry/bases/radix/components/data-grid/data-grid.tsx b/src/registry/bases/radix/components/data-grid/data-grid.tsx
index f8d99b75f..6ad4d1293 100644
--- a/src/registry/bases/radix/components/data-grid/data-grid.tsx
+++ b/src/registry/bases/radix/components/data-grid/data-grid.tsx
@@ -2,6 +2,7 @@
 
 import type { RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { useDataGrid } from "@/hooks/use-data-grid";
@@ -13,7 +14,6 @@ import {
   getColumnBorderVisibility,
   getColumnPinningStyle,
 } from "@/lib/data-grid-utils";
-import { cn } from "@/lib/utils";
 import { DataGridColumnHeader } from "@/registry/bases/radix/components/data-grid/data-grid-column-header";
 import { DataGridContextMenu } from "@/registry/bases/radix/components/data-grid/data-grid-context-menu";
 import { DataGridPasteDialog } from "@/registry/bases/radix/components/data-grid/data-grid-paste-dialog";
diff --git a/src/registry/bases/radix/components/data-table/data-table-advanced-toolbar.tsx b/src/registry/bases/radix/components/data-table/data-table-advanced-toolbar.tsx
index 8d2d1d719..edba767a1 100644
--- a/src/registry/bases/radix/components/data-table/data-table-advanced-toolbar.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-advanced-toolbar.tsx
@@ -3,9 +3,10 @@
 import type { RowData, Table } from "@tanstack/react-table";
 import type * as React from "react";
 
+import { cn } from "cn";
+
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { DataTableViewOptions } from "@/registry/bases/radix/components/data-table/data-table-view-options";
 
 interface DataTableAdvancedToolbarProps<
diff --git a/src/registry/bases/radix/components/data-table/data-table-column-header.tsx b/src/registry/bases/radix/components/data-table/data-table-column-header.tsx
index a39f6c3a9..a031b70ea 100644
--- a/src/registry/bases/radix/components/data-table/data-table-column-header.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-column-header.tsx
@@ -2,9 +2,10 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
+
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
diff --git a/src/registry/bases/radix/components/data-table/data-table-faceted-filter.tsx b/src/registry/bases/radix/components/data-table/data-table-faceted-filter.tsx
index 17448b6eb..81f7515e6 100644
--- a/src/registry/bases/radix/components/data-table/data-table-faceted-filter.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-faceted-filter.tsx
@@ -2,12 +2,12 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { Option } from "@/lib/data-table-types";
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
diff --git a/src/registry/bases/radix/components/data-table/data-table-filter-list.tsx b/src/registry/bases/radix/components/data-table/data-table-filter-list.tsx
index fc0c92446..c0d7180a9 100644
--- a/src/registry/bases/radix/components/data-table/data-table-filter-list.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-filter-list.tsx
@@ -2,6 +2,7 @@
 
 import type { Column, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import { parseAsStringEnum, useQueryState } from "nuqs";
 import * as React from "react";
 
@@ -22,7 +23,6 @@ import {
 import { formatDate } from "@/lib/format";
 import { generateId } from "@/lib/id";
 import { getFiltersStateParser } from "@/lib/parsers";
-import { cn } from "@/lib/utils";
 import { DataTableRangeFilter } from "@/registry/bases/radix/components/data-table/data-table-range-filter";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import { Button } from "@/registry/bases/radix/ui/button";
diff --git a/src/registry/bases/radix/components/data-table/data-table-filter-menu.tsx b/src/registry/bases/radix/components/data-table/data-table-filter-menu.tsx
index 036711914..2dfb09f8b 100644
--- a/src/registry/bases/radix/components/data-table/data-table-filter-menu.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-filter-menu.tsx
@@ -2,6 +2,7 @@
 
 import type { Column, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import { useQueryState } from "nuqs";
 import * as React from "react";
 
@@ -19,7 +20,6 @@ import {
 import { formatDate } from "@/lib/format";
 import { generateId } from "@/lib/id";
 import { getFiltersStateParser } from "@/lib/parsers";
-import { cn } from "@/lib/utils";
 import { DataTableRangeFilter } from "@/registry/bases/radix/components/data-table/data-table-range-filter";
 import { Button } from "@/registry/bases/radix/ui/button";
 import { Calendar } from "@/registry/bases/radix/ui/calendar";
diff --git a/src/registry/bases/radix/components/data-table/data-table-pagination.tsx b/src/registry/bases/radix/components/data-table/data-table-pagination.tsx
index 6fb28c94e..8226892f8 100644
--- a/src/registry/bases/radix/components/data-table/data-table-pagination.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-pagination.tsx
@@ -1,8 +1,9 @@
 import type { RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
+
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
   Select,
diff --git a/src/registry/bases/radix/components/data-table/data-table-range-filter.tsx b/src/registry/bases/radix/components/data-table/data-table-range-filter.tsx
index 87baec358..35b3bbd2d 100644
--- a/src/registry/bases/radix/components/data-table/data-table-range-filter.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-range-filter.tsx
@@ -2,12 +2,12 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { ExtendedColumnFilter } from "@/lib/data-table-types";
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Input } from "@/registry/bases/radix/ui/input";
 
 interface DataTableRangeFilterProps<
diff --git a/src/registry/bases/radix/components/data-table/data-table-skeleton.tsx b/src/registry/bases/radix/components/data-table/data-table-skeleton.tsx
index c2ec6045c..d17fe5501 100644
--- a/src/registry/bases/radix/components/data-table/data-table-skeleton.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-skeleton.tsx
@@ -1,4 +1,5 @@
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
+
 import { Skeleton } from "@/registry/bases/radix/ui/skeleton";
 import {
   Table,
diff --git a/src/registry/bases/radix/components/data-table/data-table-slider-filter.tsx b/src/registry/bases/radix/components/data-table/data-table-slider-filter.tsx
index 579dfef88..238b97cbe 100644
--- a/src/registry/bases/radix/components/data-table/data-table-slider-filter.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-slider-filter.tsx
@@ -2,11 +2,11 @@
 
 import type { Column, RowData } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import { Input } from "@/registry/bases/radix/ui/input";
 import { Label } from "@/registry/bases/radix/ui/label";
diff --git a/src/registry/bases/radix/components/data-table/data-table-sort-list.tsx b/src/registry/bases/radix/components/data-table/data-table-sort-list.tsx
index dc4ab242f..03b4c2e12 100644
--- a/src/registry/bases/radix/components/data-table/data-table-sort-list.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-sort-list.tsx
@@ -7,12 +7,12 @@ import type {
   Table,
 } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
 import { dataTableConfig } from "@/lib/data-table-utils";
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
diff --git a/src/registry/bases/radix/components/data-table/data-table-toolbar.tsx b/src/registry/bases/radix/components/data-table/data-table-toolbar.tsx
index e03ac694f..915edd7ca 100644
--- a/src/registry/bases/radix/components/data-table/data-table-toolbar.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-toolbar.tsx
@@ -2,11 +2,11 @@
 
 import type { Column, RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { DataTableDateFilter } from "@/registry/bases/radix/components/data-table/data-table-date-filter";
 import { DataTableFacetedFilter } from "@/registry/bases/radix/components/data-table/data-table-faceted-filter";
 import { DataTableSliderFilter } from "@/registry/bases/radix/components/data-table/data-table-slider-filter";
diff --git a/src/registry/bases/radix/components/data-table/data-table-view-options.tsx b/src/registry/bases/radix/components/data-table/data-table-view-options.tsx
index ad9b94620..5177c8627 100644
--- a/src/registry/bases/radix/components/data-table/data-table-view-options.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table-view-options.tsx
@@ -2,11 +2,11 @@
 
 import type { RowData, Table } from "@tanstack/react-table";
 
+import { cn } from "cn";
 import * as React from "react";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import {
   Command,
diff --git a/src/registry/bases/radix/components/data-table/data-table.tsx b/src/registry/bases/radix/components/data-table/data-table.tsx
index 0993011d0..e3f7e00ef 100644
--- a/src/registry/bases/radix/components/data-table/data-table.tsx
+++ b/src/registry/bases/radix/components/data-table/data-table.tsx
@@ -5,11 +5,11 @@ import {
   type RowData,
   type Table as TanstackTable,
 } from "@tanstack/react-table";
+import { cn } from "cn";
 
 import type { DataTableFeatures } from "@/lib/table-features";
 
 import { getColumnPinningStyle } from "@/lib/data-table-utils";
-import { cn } from "@/lib/utils";
 import { DataTablePagination } from "@/registry/bases/radix/components/data-table/data-table-pagination";
 import {
   Table,
diff --git a/src/registry/bases/radix/ui/action-bar.tsx b/src/registry/bases/radix/ui/action-bar.tsx
index 936b70890..f6d650b00 100644
--- a/src/registry/bases/radix/ui/action-bar.tsx
+++ b/src/registry/bases/radix/ui/action-bar.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { cn } from "cn";
 import { Slot as SlotPrimitive } from "radix-ui";
 import { useComposedRefs } from "radix-ui/internal";
 import * as React from "react";
@@ -7,7 +8,6 @@ import * as ReactDOM from "react-dom";
 
 import { useAsRef } from "@/hooks/use-as-ref";
 import { useIsomorphicLayoutEffect } from "@/hooks/use-isomorphic-layout-effect";
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import { useDirection } from "@/registry/bases/radix/ui/direction";
 
diff --git a/src/registry/bases/radix/ui/badge.tsx b/src/registry/bases/radix/ui/badge.tsx
index 6aa91156c..24bb245d3 100644
--- a/src/registry/bases/radix/ui/badge.tsx
+++ b/src/registry/bases/radix/ui/badge.tsx
@@ -1,10 +1,9 @@
 import type * as React from "react";
 
 import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "cn";
 import { Slot } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 const badgeVariants = cva(
   "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
   {
diff --git a/src/registry/bases/radix/ui/button.tsx b/src/registry/bases/radix/ui/button.tsx
index 62bf54d6e..362c5d85a 100644
--- a/src/registry/bases/radix/ui/button.tsx
+++ b/src/registry/bases/radix/ui/button.tsx
@@ -1,10 +1,9 @@
 import type * as React from "react";
 
 import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "cn";
 import { Slot } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 const buttonVariants = cva(
   "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
diff --git a/src/registry/bases/radix/ui/calendar.tsx b/src/registry/bases/radix/ui/calendar.tsx
index 6d4a2b3de..37a256f26 100644
--- a/src/registry/bases/radix/ui/calendar.tsx
+++ b/src/registry/bases/radix/ui/calendar.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { cn } from "cn";
 import {
   ChevronDownIcon,
   ChevronLeftIcon,
@@ -13,7 +14,6 @@ import {
   type Locale,
 } from "react-day-picker";
 
-import { cn } from "@/lib/utils";
 import { Button, buttonVariants } from "@/registry/bases/radix/ui/button";
 
 function Calendar({
diff --git a/src/registry/bases/radix/ui/checkbox.tsx b/src/registry/bases/radix/ui/checkbox.tsx
index 84bcb840c..758d2262f 100644
--- a/src/registry/bases/radix/ui/checkbox.tsx
+++ b/src/registry/bases/radix/ui/checkbox.tsx
@@ -2,11 +2,10 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { CheckIcon } from "lucide-react";
 import { Checkbox as CheckboxPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function Checkbox({
   className,
   ...props
diff --git a/src/registry/bases/radix/ui/command.tsx b/src/registry/bases/radix/ui/command.tsx
index 10b2254e7..f78f4ad16 100644
--- a/src/registry/bases/radix/ui/command.tsx
+++ b/src/registry/bases/radix/ui/command.tsx
@@ -3,9 +3,9 @@
 import type * as React from "react";
 
 import { Command as CommandPrimitive } from "cmdk";
+import { cn } from "cn";
 import { CheckIcon, SearchIcon } from "lucide-react";
 
-import { cn } from "@/lib/utils";
 import {
   Dialog,
   DialogContent,
diff --git a/src/registry/bases/radix/ui/dialog.tsx b/src/registry/bases/radix/ui/dialog.tsx
index 5b42d5663..ddf74aee1 100644
--- a/src/registry/bases/radix/ui/dialog.tsx
+++ b/src/registry/bases/radix/ui/dialog.tsx
@@ -2,10 +2,10 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { XIcon } from "lucide-react";
 import { Dialog as DialogPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 
 function Dialog({
diff --git a/src/registry/bases/radix/ui/drawer.tsx b/src/registry/bases/radix/ui/drawer.tsx
index 04513201a..8a607aa1c 100644
--- a/src/registry/bases/radix/ui/drawer.tsx
+++ b/src/registry/bases/radix/ui/drawer.tsx
@@ -2,10 +2,9 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { Drawer as DrawerPrimitive } from "vaul";
 
-import { cn } from "@/lib/utils";
-
 function Drawer({
   ...props
 }: React.ComponentProps<typeof DrawerPrimitive.Root>) {
diff --git a/src/registry/bases/radix/ui/dropdown-menu.tsx b/src/registry/bases/radix/ui/dropdown-menu.tsx
index 1fe59ed95..b943450f8 100644
--- a/src/registry/bases/radix/ui/dropdown-menu.tsx
+++ b/src/registry/bases/radix/ui/dropdown-menu.tsx
@@ -2,11 +2,10 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { CheckIcon, ChevronRightIcon } from "lucide-react";
 import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function DropdownMenu({
   ...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
diff --git a/src/registry/bases/radix/ui/faceted.tsx b/src/registry/bases/radix/ui/faceted.tsx
index bdeefddfb..34f3ef088 100644
--- a/src/registry/bases/radix/ui/faceted.tsx
+++ b/src/registry/bases/radix/ui/faceted.tsx
@@ -1,8 +1,8 @@
 "use client";
 
+import { cn } from "cn";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
 import { Badge } from "@/registry/bases/radix/ui/badge";
 import {
   Command,
diff --git a/src/registry/bases/radix/ui/form.tsx b/src/registry/bases/radix/ui/form.tsx
index 9da48b2a7..d1e88d2a5 100644
--- a/src/registry/bases/radix/ui/form.tsx
+++ b/src/registry/bases/radix/ui/form.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { cn } from "cn";
 import { type Label as LabelPrimitive, Slot as SlotPrimitive } from "radix-ui";
 import * as React from "react";
 import {
@@ -12,7 +13,6 @@ import {
   useFormState,
 } from "react-hook-form";
 
-import { cn } from "@/lib/utils";
 import { Label } from "@/registry/bases/radix/ui/label";
 
 const Form = FormProvider;
diff --git a/src/registry/bases/radix/ui/fps.tsx b/src/registry/bases/radix/ui/fps.tsx
index b0bcd4727..ecf8bcdaf 100644
--- a/src/registry/bases/radix/ui/fps.tsx
+++ b/src/registry/bases/radix/ui/fps.tsx
@@ -1,11 +1,10 @@
 "use client";
 
 import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "cn";
 import * as React from "react";
 import * as ReactDOM from "react-dom";
 
-import { cn } from "@/lib/utils";
-
 const fpsVariants = cva(
   "z-50 flex shrink-0 items-center gap-2 rounded-sm border bg-background/80 px-3 py-1.5 font-mono text-sm text-foreground backdrop-blur-sm",
   {
diff --git a/src/registry/bases/radix/ui/input-group.tsx b/src/registry/bases/radix/ui/input-group.tsx
index bab519a71..3e2d71652 100644
--- a/src/registry/bases/radix/ui/input-group.tsx
+++ b/src/registry/bases/radix/ui/input-group.tsx
@@ -3,8 +3,8 @@
 import type * as React from "react";
 
 import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "cn";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 import { Input } from "@/registry/bases/radix/ui/input";
 import { Textarea } from "@/registry/bases/radix/ui/textarea";
diff --git a/src/registry/bases/radix/ui/input.tsx b/src/registry/bases/radix/ui/input.tsx
index 3e1860705..045830dd2 100644
--- a/src/registry/bases/radix/ui/input.tsx
+++ b/src/registry/bases/radix/ui/input.tsx
@@ -1,6 +1,6 @@
 import type * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Input({ className, type, ...props }: React.ComponentProps<"input">) {
   return (
diff --git a/src/registry/bases/radix/ui/kbd.tsx b/src/registry/bases/radix/ui/kbd.tsx
index 44df65399..75a82b098 100644
--- a/src/registry/bases/radix/ui/kbd.tsx
+++ b/src/registry/bases/radix/ui/kbd.tsx
@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Kbd({ className, ...props }: React.ComponentProps<"kbd">) {
   return (
diff --git a/src/registry/bases/radix/ui/label.tsx b/src/registry/bases/radix/ui/label.tsx
index b31c13f38..ddea9ffb1 100644
--- a/src/registry/bases/radix/ui/label.tsx
+++ b/src/registry/bases/radix/ui/label.tsx
@@ -2,10 +2,9 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { Label as LabelPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function Label({
   className,
   ...props
diff --git a/src/registry/bases/radix/ui/popover.tsx b/src/registry/bases/radix/ui/popover.tsx
index 3440df2bb..95f6ccc2f 100644
--- a/src/registry/bases/radix/ui/popover.tsx
+++ b/src/registry/bases/radix/ui/popover.tsx
@@ -2,10 +2,9 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { Popover as PopoverPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function Popover({
   ...props
 }: React.ComponentProps<typeof PopoverPrimitive.Root>) {
diff --git a/src/registry/bases/radix/ui/select.tsx b/src/registry/bases/radix/ui/select.tsx
index fded4ae37..bb467f1c0 100644
--- a/src/registry/bases/radix/ui/select.tsx
+++ b/src/registry/bases/radix/ui/select.tsx
@@ -2,11 +2,10 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
 import { Select as SelectPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function Select({
   ...props
 }: React.ComponentProps<typeof SelectPrimitive.Root>) {
diff --git a/src/registry/bases/radix/ui/separator.tsx b/src/registry/bases/radix/ui/separator.tsx
index 7edf004fd..cb017bfef 100644
--- a/src/registry/bases/radix/ui/separator.tsx
+++ b/src/registry/bases/radix/ui/separator.tsx
@@ -2,10 +2,9 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { Separator as SeparatorPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function Separator({
   className,
   orientation = "horizontal",
diff --git a/src/registry/bases/radix/ui/sheet.tsx b/src/registry/bases/radix/ui/sheet.tsx
index 440951f24..319bb7e7d 100644
--- a/src/registry/bases/radix/ui/sheet.tsx
+++ b/src/registry/bases/radix/ui/sheet.tsx
@@ -2,10 +2,10 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { XIcon } from "lucide-react";
 import { Dialog as SheetPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
 import { Button } from "@/registry/bases/radix/ui/button";
 
 function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {
diff --git a/src/registry/bases/radix/ui/skeleton.tsx b/src/registry/bases/radix/ui/skeleton.tsx
index 26bc059db..6181e3b28 100644
--- a/src/registry/bases/radix/ui/skeleton.tsx
+++ b/src/registry/bases/radix/ui/skeleton.tsx
@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
   return (
diff --git a/src/registry/bases/radix/ui/slider.tsx b/src/registry/bases/radix/ui/slider.tsx
index 4de6ec9eb..9781adfdc 100644
--- a/src/registry/bases/radix/ui/slider.tsx
+++ b/src/registry/bases/radix/ui/slider.tsx
@@ -1,10 +1,9 @@
 "use client";
 
+import { cn } from "cn";
 import { Slider as SliderPrimitive } from "radix-ui";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
-
 function Slider({
   className,
   defaultValue,
diff --git a/src/registry/bases/radix/ui/sortable.tsx b/src/registry/bases/radix/ui/sortable.tsx
index 58cd21912..fd123f8ec 100644
--- a/src/registry/bases/radix/ui/sortable.tsx
+++ b/src/registry/bases/radix/ui/sortable.tsx
@@ -36,13 +36,13 @@ import {
   verticalListSortingStrategy,
 } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
+import { cn } from "cn";
 import { Slot as SlotPrimitive } from "radix-ui";
 import { useComposedRefs } from "radix-ui/internal";
 import * as React from "react";
 import * as ReactDOM from "react-dom";
 
 import { useIsomorphicLayoutEffect } from "@/hooks/use-isomorphic-layout-effect";
-import { cn } from "@/lib/utils";
 
 const orientationConfig = {
   vertical: {
diff --git a/src/registry/bases/radix/ui/table.tsx b/src/registry/bases/radix/ui/table.tsx
index ee12f0bdd..67856138c 100644
--- a/src/registry/bases/radix/ui/table.tsx
+++ b/src/registry/bases/radix/ui/table.tsx
@@ -2,7 +2,7 @@
 
 import type * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Table({ className, ...props }: React.ComponentProps<"table">) {
   return (
diff --git a/src/registry/bases/radix/ui/textarea.tsx b/src/registry/bases/radix/ui/textarea.tsx
index 9da9eab61..0f5d6fe73 100644
--- a/src/registry/bases/radix/ui/textarea.tsx
+++ b/src/registry/bases/radix/ui/textarea.tsx
@@ -1,6 +1,6 @@
 import type * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "cn";
 
 function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
   return (
diff --git a/src/registry/bases/radix/ui/toggle-group.tsx b/src/registry/bases/radix/ui/toggle-group.tsx
index b22eae421..3a26de914 100644
--- a/src/registry/bases/radix/ui/toggle-group.tsx
+++ b/src/registry/bases/radix/ui/toggle-group.tsx
@@ -2,10 +2,10 @@
 
 import type { VariantProps } from "class-variance-authority";
 
+import { cn } from "cn";
 import { ToggleGroup as ToggleGroupPrimitive } from "radix-ui";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
 import { toggleVariants } from "@/registry/bases/radix/ui/toggle";
 
 const ToggleGroupContext = React.createContext<
diff --git a/src/registry/bases/radix/ui/toggle.tsx b/src/registry/bases/radix/ui/toggle.tsx
index c352bbc6f..8768b002e 100644
--- a/src/registry/bases/radix/ui/toggle.tsx
+++ b/src/registry/bases/radix/ui/toggle.tsx
@@ -3,10 +3,9 @@
 import type * as React from "react";
 
 import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "cn";
 import { Toggle as TogglePrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 const toggleVariants = cva(
   "group/toggle inline-flex items-center justify-center gap-1 rounded-lg text-sm font-medium whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
diff --git a/src/registry/bases/radix/ui/tooltip.tsx b/src/registry/bases/radix/ui/tooltip.tsx
index a6a2e20fd..75b400ce3 100644
--- a/src/registry/bases/radix/ui/tooltip.tsx
+++ b/src/registry/bases/radix/ui/tooltip.tsx
@@ -2,10 +2,9 @@
 
 import type * as React from "react";
 
+import { cn } from "cn";
 import { Tooltip as TooltipPrimitive } from "radix-ui";
 
-import { cn } from "@/lib/utils";
-
 function TooltipProvider({
   delayDuration = 0,
   ...props