fumadocs-ui
Version:
The Radix UI version of Fumadocs UI
54 lines (53 loc) • 1.93 kB
JavaScript
"use client";
import { cn } from "../../../utils/cn.js";
import { buttonVariants } from "../../../components/ui/button.js";
import { useSearchContext } from "../../../contexts/search.js";
import { jsx, jsxs } from "react/jsx-runtime";
import { Search } from "lucide-react";
import { useTranslations } from "@fuma-translate/react";
//#region src/layouts/shared/slots/search-trigger.tsx
function SearchTrigger({ hideIfDisabled, size = "icon-sm", color = "ghost", ...props }) {
const { setOpenSearch, enabled } = useSearchContext();
const t = useTranslations({ note: "search trigger" });
if (hideIfDisabled && !enabled) return null;
return /* @__PURE__ */ jsx("button", {
type: "button",
className: cn(buttonVariants({
size,
color
}), props.className),
"data-search": "",
"aria-label": t("Open Search", { note: "aria-label" }),
onClick: () => {
setOpenSearch(true);
},
children: /* @__PURE__ */ jsx(Search, {})
});
}
function FullSearchTrigger({ hideIfDisabled, ...props }) {
const { enabled, hotKey, setOpenSearch } = useSearchContext();
const t = useTranslations({ note: "search trigger" });
if (hideIfDisabled && !enabled) return null;
return /* @__PURE__ */ jsxs("button", {
type: "button",
"data-search-full": "",
...props,
className: cn("inline-flex items-center gap-2 rounded-lg border bg-fd-secondary/50 p-1.5 ps-2 text-sm text-fd-muted-foreground transition-colors hover:bg-fd-accent hover:text-fd-accent-foreground", props.className),
onClick: () => {
setOpenSearch(true);
},
children: [
/* @__PURE__ */ jsx(Search, { className: "size-4" }),
t("Search"),
/* @__PURE__ */ jsx("div", {
className: "ms-auto inline-flex gap-0.5",
children: hotKey.map((k, i) => /* @__PURE__ */ jsx("kbd", {
className: "rounded-md border bg-fd-background px-1.5",
children: k.display
}, i))
})
]
});
}
//#endregion
export { FullSearchTrigger, SearchTrigger };