import { jsxs as f, jsx as r } from "react/jsx-runtime";
import { forwardRef as x } from "react";
import { cn as p } from "../../utils/cn.js";
import { useSearch as l } from "./provider.js";
import u from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/search.js";
const h = x(
  ({
    showShortcut: o = !0,
    shortcutText: s = "⌘K",
    className: n,
    children: a,
    onClick: e,
    ...d
  }, i) => {
    const t = l(), m = (c) => {
      t == null || t.open(), e == null || e(c);
    };
    return /* @__PURE__ */ f(
      "button",
      {
        className: p(
          "flex w-full items-center gap-2 px-3 py-2 text-left text-sm",
          "bg-transparent",
          "border border-stone-200 dark:border-white/10",
          "rounded-xl",
          "text-stone-500",
          "hover:border-stone-300 dark:hover:border-white/20",
          "focus:outline-none focus:ring-0 focus:ring-offset-0",
          "transition-colors",
          "cursor-pointer",
          n
        ),
        onClick: m,
        ref: i,
        type: "button",
        ...d,
        children: [
          /* @__PURE__ */ r(
            u,
            {
              className: "shrink-0 text-stone-800 dark:text-stone-500",
              size: 16
            }
          ),
          /* @__PURE__ */ r("span", { className: "flex-1 text-stone-500 dark:text-stone-400", children: a || "Search..." }),
          o && /* @__PURE__ */ r("kbd", { className: "hidden items-center gap-0.5 rounded px-1.5 py-0.5 font-medium font-sans text-stone-500 text-xs sm:inline-flex dark:text-stone-400", children: s })
        ]
      }
    );
  }
);
h.displayName = "SearchButton";
export {
  h as SearchButton
};
