fix(tabs): correct props interfaces of TabsTrigger and TabsList (#597)

Co-authored-by: vivekg734 <vivekananda.g@syncoffice.com>
Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>

Author: 3 people

src/tabs/tabs.tsx

@@ -1,5 +1,12 @@
-import React, { type ComponentPropsWithoutRef } from "react";
-import { Root, List, Trigger, Content } from "@radix-ui/react-tabs";
+import React from "react";
+import {
+	Root,
+	List,
+	Trigger,
+	Content,
+	type TabsTriggerProps,
+	type TabsListProps,
+} from "@radix-ui/react-tabs";
 
 const buttonClassNames =
 	"flex-1 block relative px-2.5 py-[5px] text-sm text-foreground-secondary border-none aria-selected:font-bold aria-selected:bg-foreground-quaternary aria-selected:text-background-secondary hover:bg-background-quaternary";
@@ -10,15 +17,15 @@ const listClassNames =
 
 export const TabsTrigger = React.forwardRef<
 	React.ElementRef<typeof Trigger>,
-	ComponentPropsWithoutRef<typeof Trigger>
+	TabsTriggerProps
 >(({ className, ...props }, ref) => {
 	const triggerClasses = [buttonClassNames, className].join(" ");
 	return <Trigger ref={ref} className={triggerClasses} {...props} />;
 });
 
 export const TabsList = React.forwardRef<
 	React.ElementRef<typeof List>,
-	ComponentPropsWithoutRef<typeof List>
+	TabsListProps
 >(({ className, ...props }, ref) => {
 	const listClasses = [listClassNames, className].join(" ");
 	return <List ref={ref} className={listClasses} {...props} />;