refactor: migrate UI components to React 19

demo/nextjs/components/ui/alert.tsx

@@ -19,41 +19,49 @@ const alertVariants = cva(
 	},
 );
 
-const Alert = React.forwardRef<
-	HTMLDivElement,
-	React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>
->(({ className, variant, ...props }, ref) => (
-	<div
-		ref={ref}
-		role="alert"
-		className={cn(alertVariants({ variant }), className)}
-		{...props}
-	/>
-));
+const Alert = (
+    {
+        ref,
+        className,
+        variant,
+        ...props
+    }
+) => (<div
+    ref={ref}
+    role="alert"
+    className={cn(alertVariants({ variant }), className)}
+    {...props}
+/>);
 Alert.displayName = "Alert";
 
-const AlertTitle = React.forwardRef<
-	HTMLParagraphElement,
-	React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-	<h5
-		ref={ref}
-		className={cn("mb-1 font-medium leading-none tracking-tight", className)}
-		{...props}
-	/>
-));
+const AlertTitle = (
+    {
+        ref,
+        className,
+        ...props
+    }: React.HTMLAttributes<HTMLHeadingElement> & {
+        ref: React.RefObject<HTMLParagraphElement>;
+    }
+) => (<h5
+    ref={ref}
+    className={cn("mb-1 font-medium leading-none tracking-tight", className)}
+    {...props}
+/>);
 AlertTitle.displayName = "AlertTitle";
 
-const AlertDescription = React.forwardRef<
-	HTMLParagraphElement,
-	React.HTMLAttributes<HTMLParagraphElement>
->(({ className, ...props }, ref) => (
-	<div
-		ref={ref}
-		className={cn("text-sm [&_p]:leading-relaxed", className)}
-		{...props}
-	/>
-));
+const AlertDescription = (
+    {
+        ref,
+        className,
+        ...props
+    }: React.HTMLAttributes<HTMLParagraphElement> & {
+        ref: React.RefObject<HTMLParagraphElement>;
+    }
+) => (<div
+    ref={ref}
+    className={cn("text-sm [&_p]:leading-relaxed", className)}
+    {...props}
+/>);
 AlertDescription.displayName = "AlertDescription";
 
 export { Alert, AlertTitle, AlertDescription };