// title: Image editor toolbar with transform, zoom, and export actions "use client"; import { CropIcon, DownloadIcon, Maximize2Icon, RotateCcwIcon, RotateCwIcon, SlidersHorizontalIcon, ZoomInIcon, ZoomOutIcon, } from "lucide-react"; import { Button } from "@/registry/default/ui/button"; import { Toolbar, ToolbarButton, ToolbarGroup, ToolbarSeparator, } from "@/registry/default/ui/toolbar"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "@/registry/default/ui/tooltip"; const transformTools = [ { icon: CropIcon, label: "Crop" }, { icon: RotateCcwIcon, label: "Rotate left" }, { icon: RotateCwIcon, label: "Rotate right" }, ] as const; const zoomTools = [ { icon: ZoomOutIcon, label: "Zoom out" }, { icon: ZoomInIcon, label: "Zoom in" }, { icon: Maximize2Icon, label: "Fit to screen" }, ] as const; export function Pattern() { return ( {transformTools.map(({ icon: Icon, label }) => ( } > } /> {label} ))} {zoomTools.map(({ icon: Icon, label }) => ( } > } /> {label} ))} } > } /> Adjustments }> Export ); }