feat: integrated with artifacts in states

This commit is contained in:
Henry Li
2026-01-17 17:21:37 +08:00
parent 384353d613
commit f1c6991194
8 changed files with 118 additions and 70 deletions

View File

@@ -16,8 +16,8 @@ export type ArtifactProps = HTMLAttributes<HTMLDivElement>;
export const Artifact = ({ className, ...props }: ArtifactProps) => (
<div
className={cn(
"flex flex-col overflow-hidden rounded-lg border bg-background shadow-sm",
className
"bg-background flex flex-col overflow-hidden rounded-lg border shadow-sm",
className,
)}
{...props}
/>
@@ -31,8 +31,8 @@ export const ArtifactHeader = ({
}: ArtifactHeaderProps) => (
<div
className={cn(
"flex items-center justify-between border-b bg-muted/50 px-4 py-3",
className
"bg-muted/50 flex items-center justify-between border-b px-4 py-3",
className,
)}
{...props}
/>
@@ -49,8 +49,8 @@ export const ArtifactClose = ({
}: ArtifactCloseProps) => (
<Button
className={cn(
"size-8 p-0 text-muted-foreground hover:text-foreground",
className
"text-muted-foreground hover:text-foreground size-8 p-0",
className,
)}
size={size}
type="button"
@@ -65,8 +65,8 @@ export const ArtifactClose = ({
export type ArtifactTitleProps = HTMLAttributes<HTMLParagraphElement>;
export const ArtifactTitle = ({ className, ...props }: ArtifactTitleProps) => (
<p
className={cn("font-medium text-foreground text-sm", className)}
<div
className={cn("text-foreground text-sm font-medium", className)}
{...props}
/>
);
@@ -108,8 +108,8 @@ export const ArtifactAction = ({
const button = (
<Button
className={cn(
"size-8 p-0 text-muted-foreground hover:text-foreground",
className
"text-muted-foreground hover:text-foreground size-8 p-0",
className,
)}
size={size}
type="button"