mirror of
https://github.com/stefanpejcic/openpanel
synced 2025-06-26 18:28:26 +00:00
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import clsx from "clsx";
|
|
import React from "react";
|
|
|
|
type Props = React.ComponentProps<"button">;
|
|
|
|
export const CommonDocSearchButton = React.forwardRef<HTMLButtonElement, Props>(
|
|
function CommonDocSearchButtonComponent({ className, ...props }, ref) {
|
|
return (
|
|
<button
|
|
ref={ref}
|
|
type="button"
|
|
{...props}
|
|
className={clsx(
|
|
"dark:text-gray-0 text-gray-500",
|
|
"dark:bg-gray-700 bg-gray-0",
|
|
"pl-3 pr-1.5",
|
|
"py-1.5",
|
|
"rounded-lg",
|
|
"w-36",
|
|
"text-xs",
|
|
"leading-5",
|
|
"flex items-center justify-between",
|
|
"dark:hover:brightness-110",
|
|
"transition-[filter]",
|
|
"duration-200",
|
|
"ease-in-out",
|
|
"group",
|
|
)}
|
|
>
|
|
<span className="opacity-50">Search</span>
|
|
<kbd
|
|
className={clsx(
|
|
"h-5",
|
|
"border dark:border-gray-600 border-gray-200",
|
|
"py-px px-1",
|
|
"rounded",
|
|
"dark:bg-gray-900 bg-gray-100",
|
|
"dark:text-gray-400 text-gray-500",
|
|
"text-sm leading-4",
|
|
"tracking-wide",
|
|
"text-refine-kbd",
|
|
"font-sans",
|
|
"shadow-none",
|
|
)}
|
|
>
|
|
⌘K
|
|
</kbd>
|
|
</button>
|
|
);
|
|
},
|
|
);
|