diff --git a/packages/common/business_components/src/ui/tab/index.tsx b/packages/common/business_components/src/ui/tab/index.tsx
index 9d24562f8..9dde67780 100644
--- a/packages/common/business_components/src/ui/tab/index.tsx
+++ b/packages/common/business_components/src/ui/tab/index.tsx
@@ -10,14 +10,20 @@ interface UITabProps extends React.HTMLAttributes<HTMLDivElement> {
   defaultValue?: string;
   tabList: TabItem[];
   children: React.ReactNode;
+  onValueChange?: (value: string) => void;
 }
 
 const UITab  = React.forwardRef<
   HTMLDivElement,
   UITabProps
->(({defaultValue, tabList, children}, ref)=>{
+>(({defaultValue, tabList, children, onValueChange, ...props}, ref)=>{
     return (
-      <Tabs defaultValue={defaultValue || tabList[0]?.value} className={"w-full space-x-1 border-b border-gray-200"}>
+      <Tabs 
+        defaultValue={defaultValue || tabList[0]?.value} 
+        className={"w-full space-x-1 border-b border-gray-200"}
+        onValueChange={onValueChange}
+        {...props}
+      >
         <TabsList className="flex space-x-1">
           {tabList.map((tab) => (
             <TabsTrigger