Panel
A floating panel pinned to a corner of the Canvas.
import { Panel } from "@cynco-labs/ui/ai"; Example
import { Button } from "@cynco-labs/ui";
import { Canvas, Panel } from "@cynco-labs/ui/ai";
export default function PanelDemo() {
return (
<div style={{ height: 180 }} className="rounded-lg border">
<Canvas nodes={[]} edges={[]}>
<Panel position="top-left">
<span className="text-body px-1">Workflow · draft</span>
</Panel>
<Panel position="top-right">
<Button variant="primary" size="mini">
Publish
</Button>
</Panel>
</Canvas>
</div>
);
} Use
Canvas titles, run buttons, legends.
Props
position (top-left … bottom-right), children.