UNPKG

@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
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] md:rfs-px-[calc(24px+0.5rem)] rfs-flex-col rfs-items-center rfs-gap-4 md:rfs-flex-row", children: [_jsx(SearchIcon, { className: "rfs-absolute rfs-left-7 md:rfs-left-12 rfs-top-3.5 rfs-size-4 rfs-text-muted-foreground md:rfs-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 md:rfs-h-full md:rfs-w-auto", children: _jsx(Button, { ...props.getButtonProps(), variant: "secondary", className: "rfs-grow", size: "lg", children: "Search" }) })] })); } //# sourceMappingURL=DefaultSearchBox.js.map