From dd99e00aacb28eb8026efbd5d083d80c0e3d5813 Mon Sep 17 00:00:00 2001
From: gabrieldallafavera <gabrieldallafavera@moinhosul.com.br>
Date: Thu, 17 Oct 2024 11:13:26 -0300
Subject: [PATCH] fix(select): ajuste busca externa

---
 packages/ui/package.json                         |  2 +-
 packages/ui/src/components/ui/command.tsx        | 13 ++-----------
 .../src/components/ui/form/selector/content.tsx  | 16 ++++++++++++++--
 3 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/packages/ui/package.json b/packages/ui/package.json
index 258cc56..351301d 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@continha/ui",
-	"version": "1.14.17",
+	"version": "1.14.18",
 	"private": false,
 	"main": "dist/index.js",
 	"module": "dist/esm/index.js",
diff --git a/packages/ui/src/components/ui/command.tsx b/packages/ui/src/components/ui/command.tsx
index fc10b5a..7cd6d9e 100644
--- a/packages/ui/src/components/ui/command.tsx
+++ b/packages/ui/src/components/ui/command.tsx
@@ -25,13 +25,8 @@ Root.displayName = CommandPrimitive.displayName;
 
 const Input = React.forwardRef<
 	React.ElementRef<typeof CommandPrimitive.Input>,
-	Omit<
-		React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>,
-		"onSearch"
-	> & {
-		onSearch?: (newvalue: string) => void;
-	}
->(({ onSearch, className, ...props }, ref) => (
+	React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
+>(({ className, ...props }, ref) => (
 	<div
 		className="flex items-center border-b border-gray-6 dark:border-graydark-6 px-3"
 		cmdk-input-wrapper=""
@@ -43,10 +38,6 @@ const Input = React.forwardRef<
 				"flex h-8 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-gray-10 dark:placeholder:text-graydark-10 disabled:cursor-not-allowed disabled:opacity-50",
 				className,
 			)}
-			onValueChange={(search) => {
-				props.onValueChange?.(search);
-				onSearch?.(search);
-			}}
 			{...props}
 		/>
 	</div>
diff --git a/packages/ui/src/components/ui/form/selector/content.tsx b/packages/ui/src/components/ui/form/selector/content.tsx
index b6d032d..e43efe7 100644
--- a/packages/ui/src/components/ui/form/selector/content.tsx
+++ b/packages/ui/src/components/ui/form/selector/content.tsx
@@ -1,8 +1,10 @@
 "use client";
+import { Search } from "lucide-react";
 import { cn } from "../../../../lib/utils";
 import { Command } from "../../command";
 import { PageLoader } from "../../page-loader";
 import { Popover } from "../../popover";
+import { Input } from "../input";
 import type { SelectorCommonProps, SelectorMessages, TOption } from "./model";
 
 type SelectorContentProps<Option> = {
@@ -32,14 +34,24 @@ export function SelectorContent<Option extends TOption>(
 			align="start"
 		>
 			<Command.Root>
-				{props.searchable && (
+				{props.searchable && props.onSearch === undefined && (
 					<Command.Input
 						className="text-xs"
 						placeholder={props.message.searchPlaceholder}
-						onSearch={props.onSearch}
 					/>
 				)}
 
+				{props.onSearch !== undefined && (
+					<div className="flex items-center border-b border-gray-6 dark:border-graydark-6 px-3">
+						<Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
+						<input
+							className="text-xs flex h-8 w-full rounded-md bg-transparent py-3 outline-none placeholder:text-gray-10 dark:placeholder:text-graydark-10 disabled:cursor-not-allowed disabled:opacity-50"
+							placeholder={props.message.searchPlaceholder}
+							onChange={(event) => props.onSearch?.(event.target.value)}
+						/>
+					</div>
+				)}
+
 				{props.loadingOptions && <PageLoader />}
 
 				{!props.loadingOptions && (