Files
CVault/vault/components/search-bar.tsx
T
arsam a79e378781 Import source: vault/components/search-bar
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
2026-09-18 23:17:53 +03:30

35 lines
957 B
TypeScript

"use client";
import { Search, X } from "lucide-react";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
interface SearchBarProps {
value: string;
onChange: (value: string) => void;
}
export function SearchBar({ value, onChange }: SearchBarProps) {
return (
<div className="relative">
<Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
<Input
placeholder="Search snippets..."
value={value}
onChange={(e) => onChange(e.target.value)}
className="pl-9 pr-9 h-10 bg-muted/50 border-border/50 focus:border-primary/50"
/>
{value && (
<Button
variant="ghost"
size="icon"
className="absolute right-1 top-1/2 -translate-y-1/2 h-7 w-7"
onClick={() => onChange("")}
>
<X className="h-3.5 w-3.5" />
</Button>
)}
</div>
);
}