@softize/opus 8.7.0 → 8.7.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@softize/opus",
-  "version": "8.7.0",
+  "version": "8.7.1",
   "description": "End-to-end action protocol for TypeScript. Single package with subpath exports (core + adapters).",
   "license": "MIT",
   "type": "module",

package/src/ui/components/primitives/select.tsx

@@ -217,9 +217,24 @@ function CustomSelect(props: Exclude<SelectProps, SelectNativeProps>): React.Rea
   const inputRef = React.useRef<HTMLInputElement>(null)
   /** Fechando por Esc: o foco volta pro gatilho, e focar abre. Marca pra ignorar UM foco. */
   const closingRef = React.useRef(false)
+  const searchRef = React.useRef<HTMLInputElement>(null)
 
   const selectedOption = options.find((o) => o.value === singleValue)
 
+  /**
+   * Abrir com busca FOCA a caixa — abrir e já poder digitar é o ponto do padrão.
+   *
+   * Explícito e não pelo `autoFocus`: aqui dependeria de o Radix (que move o foco ao
+   * abrir o popover) e o cmdk concordarem sobre quem manda, e o resultado varia com a
+   * ordem de montagem. `requestAnimationFrame` porque o conteúdo do popover entra no DOM
+   * depois deste efeito.
+   */
+  React.useEffect(() => {
+    if (!open || !canSearch) return
+    const r = requestAnimationFrame(() => searchRef.current?.focus())
+    return () => cancelAnimationFrame(r)
+  }, [open, canSearch])
+
   /**
    * O termo de busca zera ao FECHAR.
    *
@@ -467,8 +482,8 @@ function CustomSelect(props: Exclude<SelectProps, SelectNativeProps>): React.Rea
               <div data-slot="select-search-row" className="flex items-center gap-2 border-b px-3">
                 <SearchIcon className="size-4 shrink-0 opacity-50" aria-hidden="true" />
                 <CommandPrimitive.Input
+                  ref={searchRef}
                   data-slot="select-search"
-                  autoFocus
                   value={query}
                   onValueChange={setQuery}
                   placeholder={searchPlaceholder ?? 'Buscar…'}