38 lines
1.4 KiB
TypeScript
38 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { ChevronRight } from "lucide-react";
|
|
import type { PersonaState } from "@/shared/ai-elements/persona";
|
|
import { cn } from "@/lib/utils";
|
|
import { MAP_MAJOR_PANEL_RADIUS_CLASS_NAME } from "@/features/map/core/components/map-control-styles";
|
|
import { AgentPersona } from "./agent-persona";
|
|
|
|
type AgentCollapsedRailProps = {
|
|
personaState?: PersonaState;
|
|
onExpand: () => void;
|
|
};
|
|
|
|
export function AgentCollapsedRail({ personaState, onExpand }: AgentCollapsedRailProps) {
|
|
return (
|
|
<aside
|
|
aria-label="Agent 折叠栏"
|
|
className={cn(
|
|
"agent-rail-enter acrylic-panel pointer-events-auto w-[136px] border p-1.5",
|
|
MAP_MAJOR_PANEL_RADIUS_CLASS_NAME
|
|
)}
|
|
>
|
|
<button
|
|
type="button"
|
|
aria-label="展开排水助手面板"
|
|
title="展开排水助手面板"
|
|
onClick={onExpand}
|
|
className="agent-rail-item surface-control group flex h-14 w-full items-center justify-center gap-4 rounded-xl border px-3 transition-[background-color,transform] hover:bg-white active:scale-95"
|
|
>
|
|
<AgentPersona className="h-12 w-12" state={personaState} />
|
|
<span className="agent-panel-primary-icon grid h-8 w-8 shrink-0 place-items-center rounded-lg border-0! transition-transform group-hover:translate-x-0.5">
|
|
<ChevronRight size={17} strokeWidth={2.25} aria-hidden="true" />
|
|
</span>
|
|
</button>
|
|
</aside>
|
|
);
|
|
}
|