SearchInline — Componente de búsqueda híbrida del shell del Workspace

Ubicación

src/components/shell/SearchInline.tsx

Propósito

Caja de búsqueda global del shell del Workspace. Desde s72 opera en modo híbrido: puede hacer búsqueda fuzzy local (Fuse.js) o consultar al Oráculo de EL (POST /api/oraculo/ask) según el tipo de query detectado automáticamente.

API pública

Handle (`SearchInlineHandle`)

El componente usa forwardRef y expone un handle que permite que el shell enfoque la caja desde el exterior (e.g. atajo de teclado):

export interface SearchInlineHandle {
  focus: () => void;
}

Uso típico en el shell:

const searchRef = useRef<SearchInlineHandle>(null);
// …
<SearchInline ref={searchRef} />
// …
searchRef.current?.focus();

Props

No expone props propias (_props ignorado en esta versión). Toda la configuración es interna.

Estado interno relevante

State	Tipo	Descripción
`q`	`string`	Query actual del input
`mode`	`SearchMode`	`'auto' \| 'search' \| 'oracle'`
`results`	`SearchEntry[]`	Resultados Fuse
`oracleAnswer`	`OracleResponse \| null`	Respuesta del Oráculo
`oracleLoading`	`boolean`	Request en vuelo
`oracleError`	`string \| null`	Mensaje de error
`history`	`string[]`	Últimas queries (max 6, `localStorage`)

Comportamiento por modo

Ver detalle en [[feature—workspace—oraculo-el]].

Modo search (Fuse)

Carga /search-index.json en memoria una sola vez (singleton fuseInstance).
Búsqueda síncrona en el useEffect de q.
Sin red.

Modo oracle (Oráculo de EL)

Activado por shouldAskOracle(query, mode).
Debounce 450 ms + AbortController para cancelar requests en vuelo.
Renderiza respuesta Markdown con marked (GFM, sin DOMPurify).
Chips de fuentes clickables cuando sourceToHref(path) resuelve una URL.

Historial de búsqueda

Clave localStorage: 'ws-search-history'
Máximo 6 entradas (MAX_HISTORY = 6).
Se muestra cuando el input está enfocado y vacío.
Se guarda al navegar a un resultado (Fuse o historia).

Constantes clave

Constante	Valor	Descripción
`HISTORY_KEY`	`'ws-search-history'`	Clave localStorage
`MAX_HISTORY`	`6`	Máx entradas historial
`ORACLE_DEBOUNCE_MS`	`450`	Debounce antes de llamar al Oráculo
`ORACLE_MIN_CHARS`	`8`	Mínimo caracteres para activar Oráculo

Clases CSS principales

Todas en src/styles/globals.css. Tokens de diseño referenciados: --overlay-3/4, --accent, --fg, --fg-dim, --text-sm/xs, --border-soft, --danger, --font-mono.

Clase	Descripción
`.search-inline-wrap`	Contenedor raíz
`.search-inline-dropdown`	Panel desplegable
`.search-inline-mode-toggle`	Fila de chips Auto/Buscar/Preguntar
`.search-inline-mode-chip`	Chip individual; `.active` cuando está seleccionado
`.search-inline-oracle`	Sección de respuesta del Oráculo
`.search-inline-oracle-answer`	Contenedor del HTML renderizado de la respuesta
`.search-inline-oracle-sources`	Fila de chips de fuentes
`.search-inline-oracle-chip`	Chip de fuente; `.linkable` si tiene href
`.search-inline-result-main`	Contenedor resultado Fuse

Véase también

[[feature—workspace—oraculo-el]] — Feature completa del Oráculo de EL que extiende este componente
[[workspace—agentes-ia]] — Agentes IA del workspace, incluido el Bibliotecario que alimenta el Oráculo
[[workspace—que-es-workspace]] — Arquitectura general del Workspace donde se integra este componente
[[workspace—dashboard]] — Shell principal que monta SearchInline

Page aislada parcial: no existen todavía entity pages para NoteEditor, FuseSearch ni el endpoint /api/oraculo/ask — candidatos a crear cuando se documente Fase 2.