Adding Variant prop to AssistantCard

dust-tt · Dec 18, 2024 · 1ac7445 · 1ac7445
1 parent 48ee34e
commit 1ac7445
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/sparkle/src/components/AssistantCard.tsx b/sparkle/src/components/AssistantCard.tsx
@@ -6,6 +6,7 @@ import {
   CardActionButton,
   MiniButtonProps,
 } from "@sparkle/components/";
+import { CardVariantType } from "@sparkle/components/Card";
 import { MoreIcon } from "@sparkle/icons/";
 import { cn } from "@sparkle/lib/utils";
 
@@ -16,6 +17,7 @@ interface BaseAssistantCardProps {
   subtitle?: string;
   className?: string;
   onClick?: () => void;
+  variant?: CardVariantType;
 }
 
 type AssistantCardMore = Omit<MiniButtonProps, "icon" | "size">;
@@ -37,7 +39,16 @@ export const AssistantCard = React.forwardRef<
   AssistantCardProps
 >(
   (
-    { className, onClick, title, description, pictureUrl, subtitle, action },
+    {
+      className,
+      onClick,
+      title,
+      description,
+      pictureUrl,
+      subtitle,
+      action,
+      variant = "primary",
+    },
     ref
   ) => {
     return (
@@ -47,6 +58,7 @@ export const AssistantCard = React.forwardRef<
         className={cn("s-flex s-flex-col s-gap-3", className)}
         onClick={onClick}
         action={action}
+        variant={variant}
       >
         <div className="s-flex s-gap-3">
           <Avatar visual={pictureUrl} size="md" />

diff --git a/sparkle/src/stories/AssistantCard.stories.tsx b/sparkle/src/stories/AssistantCard.stories.tsx
@@ -90,6 +90,7 @@ export const AssistantCardExample = () => (
         description="Showing a custom action element"
         onClick={() => console.log("AssistantCard clicked")}
         action={<AssistantCardMore onClick={() => console.log("hello")} />}
+        variant="secondary"
       />
     </CardGrid>
   </div>