[sparkle] - enh: Tabs (#8564)

* [sparkle] - feature: allow different button variants in TabsTrigger component

 - Add a `buttonVariant` prop to TabsTrigger to support different button styles
 - Set default `buttonVariant` to "ghost" to maintain backward compatibility

* [sparkle] - feature: bump package version to 0.2.303

 - Updated the package version for new release

sparkle/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dust-tt/sparkle",
-  "version": "0.2.302",
+  "version": "0.2.303",
   "scripts": {
     "build": "rm -rf dist && npm run tailwind && npm run build:esm && npm run build:cjs",
     "tailwind": "tailwindcss -i ./src/styles/tailwind.css -o dist/sparkle.css",

sparkle/src/components/Tabs.tsx

@@ -40,6 +40,7 @@ const TabsTrigger = React.forwardRef<
     tooltip?: string;
     icon?: React.ComponentType;
     isLoading?: boolean;
+    buttonVariant?: React.ComponentProps<typeof Button>["variant"]
   } & Omit<LinkWrapperProps, "children" | "className">
 >(
   (
@@ -54,6 +55,7 @@ const TabsTrigger = React.forwardRef<
       replace,
       shallow,
       disabled,
+      buttonVariant = "ghost",
       ...props
     },
     ref
@@ -72,7 +74,7 @@ const TabsTrigger = React.forwardRef<
       >
         <div>
           <Button
-            variant="ghost"
+            variant={buttonVariant}
             size="sm"
             label={label}
             tooltip={tooltip}