Import source: vault/components/view-toggle
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,33 @@
|
||||
"use client";
|
||||
|
||||
import { LayoutGrid, List } from "lucide-react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
interface ViewToggleProps {
|
||||
view: "grid" | "list";
|
||||
onChange: (view: "grid" | "list") => void;
|
||||
}
|
||||
|
||||
export function ViewToggle({ view, onChange }: ViewToggleProps) {
|
||||
return (
|
||||
<div className="flex items-center rounded-lg border border-border/50 bg-muted/50 p-0.5">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className={cn("h-8 w-8 rounded-md", view === "grid" && "bg-background shadow-sm")}
|
||||
onClick={() => onChange("grid")}
|
||||
>
|
||||
<LayoutGrid className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className={cn("h-8 w-8 rounded-md", view === "list" && "bg-background shadow-sm")}
|
||||
onClick={() => onChange("list")}
|
||||
>
|
||||
<List className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user