Track HiveGrid Cloud planning reference

hivegrid-cloud/apps/web/app/components/ui/input/InputSearchButton.tsx

@@ -0,0 +1,45 @@
+import clsx from "clsx";
+import { FeatherSearch } from "@subframe/core";
+import { useTranslation } from "react-i18next";
+import { cn } from "~/lib/utils";
+import { Button } from "../button";
+
+interface Props {
+  size?: "xs" | "sm" | "md";
+  onClick: () => void;
+  className?: string;
+  placeholder?: string;
+}
+
+// Subframe migration (strangler shim): this is NOT an editable field — it is a button
+// styled like a search box that triggers `onClick` (e.g. opens a search modal/palette).
+// It therefore maps to the already-migrated Subframe `Button` shim (variant="outline")
+// rather than Subframe's TextInput/SearchInput. The inline SVG is replaced by the
+// design-system FeatherSearch icon. Public API (size/onClick/className/placeholder) is
+// preserved exactly. See docs/subframe/COMPONENT-MAPPING.md.
+export default function InputSearchButton({ size = "md", onClick, className, placeholder }: Props) {
+  const { t } = useTranslation();
+  return (
+    <div className={clsx("flex justify-between space-x-2")}>
+      <div className="relative flex w-full flex-auto items-center justify-center">
+        <div className="text-muted-foreground pointer-events-none absolute inset-y-0 flex items-center justify-center focus-within:z-10 lg:left-0 lg:pl-3">
+          <FeatherSearch className={cn(size === "xs" && "size-2", size === "sm" && "size-3.5", size === "md" && "size-4")} />
+        </div>
+        <Button
+          type="button"
+          onClick={onClick}
+          variant="outline"
+          className={cn(
+            "text-muted-foreground w-full justify-start text-left font-normal",
+            className,
+            size === "xs" && "h-7 text-xs lg:pl-8",
+            size === "sm" && "h-8 text-sm lg:pl-8",
+            size === "md" && "lg:pl-9"
+          )}
+        >
+          <span className="hidden text-xs lg:flex">{placeholder ?? t("shared.searchDot")}</span>
+        </Button>
+      </div>
+    </div>
+  );
+}