chore: refactor component paths and enhance utility functions

- Updated component path aliases in components.json:
  - Changed "components" from "@/app/components" to "@/components"
  - Changed "ui" from "@/components/ui" to "@/ui"

- Added utility function `cn` in lib/utils.ts for class name merging using clsx and tailwind-merge.

- Removed outdated AGENTS.md documentation for AI Elements Components.

- Refactored imports in AI Elements components to use new path aliases:
  - Updated imports in artifact.tsx, chain-of-thought.tsx, checkpoint.tsx, code-block.tsx, confirmation.tsx, context.tsx, conversation.tsx, inline-citation.tsx, message.tsx, model-selector.tsx, node.tsx, open-in-chat.tsx, plan.tsx, prompt-input.tsx, queue.tsx, reasoning.tsx, sources.tsx, suggestion.tsx, task.tsx, tool.tsx, web-preview.tsx.

- Deleted AGENTS.md documentation for UI components.

- Fixed minor styling issues in button-group.tsx, command.tsx, dropdown-menu.tsx, select.tsx, and tooltip.tsx.

Author: ssdeanx

components.json

@@ -12,9 +12,9 @@
   },
   "iconLibrary": "lucide",
   "aliases": {
-    "components": "@/app/components",
+    "components": "@/components",
     "utils": "@/lib/utils",
-    "ui": "@/components/ui",
+    "ui": "@/ui",
     "lib": "@/lib",
     "app": "@/app",
     "hooks": "@/hooks"

lib/utils.ts

@@ -1 +1,6 @@
-1
+import { type ClassValue, clsx } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+    return twMerge(clsx(inputs))
+}

src/components/ai-elements/AGENTS.md

@@ -1,12 +1,12 @@
 "use client";
 
-import { Button } from "@/components/ui/button";
+import { Button } from "@/ui/button";
 import {
   Tooltip,
   TooltipContent,
   TooltipProvider,
   TooltipTrigger,
-} from "@/components/ui/tooltip";
+} from "@/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { type LucideIcon, XIcon } from "lucide-react";
 import type { ComponentProps, HTMLAttributes } from "react";

src/components/ai-elements/artifact.tsx

@@ -1,12 +1,12 @@
 "use client";
 
 import { useControllableState } from "@radix-ui/react-use-controllable-state";
-import { Badge } from "@/components/ui/badge";
+import { Badge } from "@/ui/badge";
 import {
   Collapsible,
   CollapsibleContent,
   CollapsibleTrigger,
-} from "@/components/ui/collapsible";
+} from "@/ui/collapsible";
 import { cn } from "@/lib/utils";
 import {
   BrainIcon,
@@ -211,7 +211,7 @@ export type ChainOfThoughtImageProps = ComponentProps<"div"> & {
 export const ChainOfThoughtImage = memo(
   ({ className, children, caption, ...props }: ChainOfThoughtImageProps) => (
     <div className={cn("mt-2 space-y-2", className)} {...props}>
-      <div className="relative flex max-h-[22rem] items-center justify-center overflow-hidden rounded-lg bg-muted p-3">
+      <div className="relative flex max-h-88 items-center justify-center overflow-hidden rounded-lg bg-muted p-3">
         {children}
       </div>
       {caption && <p className="text-muted-foreground text-xs">{caption}</p>}

src/components/ai-elements/chain-of-thought.tsx

@@ -1,12 +1,12 @@
 "use client";
 
-import { Button } from "@/components/ui/button";
-import { Separator } from "@/components/ui/separator";
+import { Button } from "@/ui/button";
+import { Separator } from "@/ui/separator";
 import {
   Tooltip,
   TooltipContent,
   TooltipTrigger,
-} from "@/components/ui/tooltip";
+} from "@/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { BookmarkIcon, type LucideProps } from "lucide-react";
 import type { ComponentProps, HTMLAttributes } from "react";

src/components/ai-elements/checkpoint.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Button } from "@/components/ui/button";
+import { Button } from "@/ui/button";
 import { cn } from "@/lib/utils";
 import { CheckIcon, CopyIcon } from "lucide-react";
 import {

src/components/ai-elements/code-block.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import { Alert, AlertDescription } from "@/components/ui/alert";
-import { Button } from "@/components/ui/button";
+import { Alert, AlertDescription } from "@/ui/alert";
+import { Button } from "@/ui/button";
 import { cn } from "@/lib/utils";
 import type { ToolUIPart } from "ai";
 import {

src/components/ai-elements/confirmation.tsx

@@ -1,12 +1,12 @@
 "use client";
 
-import { Button } from "@/components/ui/button";
+import { Button } from "@/ui/button";
 import {
   HoverCard,
   HoverCardContent,
   HoverCardTrigger,
-} from "@/components/ui/hover-card";
-import { Progress } from "@/components/ui/progress";
+} from "@/ui/hover-card";
+import { Progress } from "@/ui/progress";
 import { cn } from "@/lib/utils";
 import type { LanguageModelUsage } from "ai";
 import { type ComponentProps, createContext, useContext } from "react";

src/components/ai-elements/context.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Button } from "@/components/ui/button";
+import { Button } from "@/ui/button";
 import { cn } from "@/lib/utils";
 import { ArrowDownIcon } from "lucide-react";
 import type { ComponentProps } from "react";