@kit-data-manager/react-search-component
Version:
All-in-one component for rendering an elastic search UI for searching anything. Built-in support for visualizing related items in a graph and resolving unique identifiers.
8 lines • 992 B
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button } from "../../components/ui/button";
import { Input } from "../../components/ui/input";
import { SearchIcon } from "lucide-react";
export function DefaultSearchBox(props) {
return (_jsxs("div", { className: "rfs:relative rfs:flex rfs:w-full rfs:max-w-[1300px] rfs:px-[15px] rfs:md:px-[calc(24px+0.5rem)] rfs:flex-col rfs:items-center rfs:gap-4 rfs:md:flex-row", children: [_jsx(SearchIcon, { className: "rfs:absolute rfs:left-7 rfs:md:left-12 rfs:top-3.5 rfs:size-4 rfs:text-muted-foreground rfs:md:top-auto" }), _jsx(Input, { ...props.getInputProps(), placeholder: "Search for something...", className: "rfs:h-11 rfs:pl-10" }), _jsx("div", { className: "rfs:flex rfs:w-full rfs:items-center rfs:md:h-full rfs:md:w-auto", children: _jsx(Button, { ...props.getButtonProps(), variant: "secondary", className: "rfs:grow", size: "lg", children: "Search" }) })] }));
}
//# sourceMappingURL=DefaultSearchBox.js.map