41 lines
1.4 KiB
TypeScript
41 lines
1.4 KiB
TypeScript
import { ChevronRight } from "lucide-react";
|
|
import type { PersonaState } from "@/shared/ai-elements/persona";
|
|
import { cn } from "@/shared/ui/cn";
|
|
import { AgentPersona } from "./agent-persona";
|
|
|
|
type AgentCollapsedRailProps = {
|
|
personaState?: PersonaState;
|
|
statusLabel?: string;
|
|
onExpand: () => void;
|
|
};
|
|
|
|
export function AgentCollapsedRail({
|
|
personaState,
|
|
statusLabel = "Agent 已就绪",
|
|
onExpand
|
|
}: AgentCollapsedRailProps) {
|
|
const expandLabel = `展开 Agent 助手面板，当前状态：${statusLabel}`;
|
|
|
|
return (
|
|
<aside
|
|
aria-label="Agent 折叠栏"
|
|
className={cn(
|
|
"agent-rail-enter surface-dock pointer-events-auto w-[72px] rounded-2xl border p-1.5 shadow-[0_8px_24px_rgba(15,23,42,0.1)]"
|
|
)}
|
|
>
|
|
<button
|
|
type="button"
|
|
aria-label={expandLabel}
|
|
title={expandLabel}
|
|
onClick={onExpand}
|
|
className="agent-rail-item surface-control group relative flex h-14 w-full items-center justify-center rounded-xl border hover:bg-white"
|
|
>
|
|
<AgentPersona className="h-11 w-11" state={personaState} />
|
|
<span className="agent-panel-primary-icon absolute bottom-0.5 right-0.5 grid h-5 w-5 place-items-center rounded-md border-0! shadow-xs transition-transform group-hover:translate-x-0.5">
|
|
<ChevronRight size={13} strokeWidth={2.5} aria-hidden="true" />
|
|
</span>
|
|
</button>
|
|
</aside>
|
|
);
|
|
}
|