apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-04-28 09:56:23 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add copilot animations

Browse source
This commit is contained in:
akhisud3195 2025-04-14 14:00:06 +05:30
parent 903ed7ced4
commit 577d637c75
3 changed files with 53 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

22
apps/rowboat/components/common/panel-common.tsx
View file

@ -1,4 +1,5 @@
import clsx from "clsx";
import { Sparkles } from "lucide-react";
export function ActionButton({
icon = null,
@ -34,6 +35,7 @@ interface PanelProps {
children: React.ReactNode;
maxHeight?: string;
variant?: 'default' | 'copilot' | 'projects';
showWelcome?: boolean;
}
export function Panel({
@ -43,17 +45,31 @@ export function Panel({
children,
maxHeight,
variant = 'default',
showWelcome = true,
}: PanelProps) {
return <div className={clsx(
"flex flex-col overflow-hidden rounded-xl border",
"flex flex-col overflow-hidden rounded-xl border relative",
"border-zinc-200 dark:border-zinc-800",
"bg-white dark:bg-zinc-900",
maxHeight ? "max-h-[var(--panel-height)]" : "h-full"
)}
style={{ '--panel-height': maxHeight } as React.CSSProperties}
style={{
'--panel-height': maxHeight
} as React.CSSProperties}
>
{variant === 'copilot' && showWelcome && (
<div className="absolute inset-0 flex flex-col items-center justify-center pointer-events-none -mt-16">
<Sparkles className="w-32 h-32 text-blue-400/40 dark:text-blue-500/25 animate-sparkle" />
<div className="relative mt-8 max-w-full px-8">
<div className="font-mono text-sm whitespace-nowrap text-blue-400/60 dark:text-blue-500/40 font-small inline-flex">
<div className="overflow-hidden w-0 animate-typing">What can I help you build?</div>
<div className="border-r-2 border-blue-400 dark:border-blue-500 animate-cursor">&nbsp;</div>
</div>
</div>
</div>
)}
<div className={clsx(
"shrink-0 border-b border-zinc-100 dark:border-zinc-800",
"shrink-0 border-b border-zinc-100 dark:border-zinc-800 relative",
variant === 'projects' ? "flex flex-col gap-3 px-4 py-3" : "flex items-center justify-between px-4 py-3"
)}>
{variant === 'projects' ? (