A hand-drawn, sketch-styled radial action menu with a rotating plus trigger that fans a set of icon actions out in a semicircular arc.
"use client";
import RadialMenu from "@/components/ui/radial-menu";
export default function RadialMenuDemo() {
return (
<div className="flex min-h-[320px] w-full items-center justify-center bg-background p-10 text-foreground">
<RadialMenu
aria-label="Open tools"
items={[
{
id: "crop",
icon: <span className="text-sm font-semibold">#</span>,
label: "Crop",
},
{
id: "text",
icon: <span className="text-sm font-semibold">T</span>,
label: "Text",
},
{ id: "shape", icon: <span aria-hidden>▢</span>, label: "Shape" },
{ id: "draw", icon: <span aria-hidden>✎</span>, label: "Draw" },
{
id: "favorite",
icon: <span aria-hidden>☆</span>,
label: "Favorite",
},
]}
/>
</div>
);
}