metatron-open-seo/web/src/components/run-skill-callout.tsx
2026-05-24 18:35:55 -04:00

27 lines
1.0 KiB
TypeScript

type RunSkillCalloutProps = {
command: string;
};
export function RunSkillCallout({ command }: RunSkillCalloutProps) {
const slashCommand = command.startsWith("/") ? command : `/${command}`;
return (
<div className="my-6 overflow-hidden rounded-lg border border-fd-border bg-fd-card">
<div className="flex items-center gap-1.5 border-b border-fd-border px-4 py-2">
<span className="size-2 rounded-full bg-fd-muted-foreground/30" />
<span className="size-2 rounded-full bg-fd-muted-foreground/30" />
<span className="size-2 rounded-full bg-fd-muted-foreground/30" />
<span className="ml-2 text-xs font-medium text-fd-muted-foreground">
Run this skill in your agent
</span>
</div>
<div className="flex items-center gap-3 p-4">
<span className="font-mono text-sm text-fd-muted-foreground">&gt;</span>
<code className="font-mono text-base font-semibold text-fd-foreground">
{slashCommand}
</code>
</div>
</div>
);
}