@open-mercato/ui 0.6.8-develop.7031.1.005201cd70 → 0.6.8-develop.7037.1.ea0277b01e

package/dist/backend/inputs/ComboboxInput.js

@@ -65,6 +65,7 @@ function ComboboxInput({
   const blurClosePendingRef = React.useRef(false);
   const suppressOpenOnFocusRef = React.useRef(Boolean(autoFocus && !disabled));
   const eagerFallbackLoadedValueRef = React.useRef(null);
+  const userTypedRef = React.useRef(false);
   const staticOptions = React.useMemo(
     () => normalizeOptions([...seedOptions ?? [], ...suggestions ?? []]),
     [seedOptions, suggestions]
@@ -186,10 +187,10 @@ function ComboboxInput({
     };
   }, [value, disabled, knownLabelValues, coveredOptionValues, eagerResolveLabel, loadSuggestions]);
   React.useEffect(() => {
-    if (document.activeElement !== inputRef.current) {
-      const option = optionMap.get(value);
-      setInput(option?.label ?? value ?? "");
-    }
+    const option = optionMap.get(value);
+    const hasRealLabel = Boolean(option && option.label !== option.value);
+    if (document.activeElement === inputRef.current && (userTypedRef.current || !hasRealLabel)) return;
+    setInput(option?.label ?? value ?? "");
   }, [value, optionMap]);
   const selectValue = React.useCallback(
     (nextValue) => {
@@ -201,6 +202,7 @@ function ComboboxInput({
       setInput(option?.label ?? trimmed);
       setShowSuggestions(false);
       setSelectedIndex(-1);
+      userTypedRef.current = false;
     },
     [disabled, onChange, optionMap, resetBlurCloseState]
   );
@@ -348,12 +350,14 @@ function ComboboxInput({
         },
         onChange: (event) => {
           setTouched(true);
+          userTypedRef.current = true;
           setInput(event.target.value);
           setShowSuggestions(true);
           setSelectedIndex(-1);
         },
         onKeyDown: handleKeyDown,
         onBlur: () => {
+          userTypedRef.current = false;
           blurClosePendingRef.current = true;
           clearBlurCloseTimer();
           if (loadingRef.current) {

package/dist/backend/inputs/ComboboxInput.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/backend/inputs/ComboboxInput.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { X } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Button } from '../../primitives/button'\nimport { IconButton } from '../../primitives/icon-button'\n\nexport type ComboboxOption = {\n  value: string\n  label: string\n  description?: string | null\n}\n\nexport type ComboboxInputProps = {\n  value: string\n  onChange: (next: string) => void\n  placeholder?: string\n  suggestions?: Array<string | ComboboxOption>\n  // Options to hydrate the option map up front (typically the linked entity's\n  // display fields, already present in a record-detail payload). Merged with\n  // `suggestions` so a pre-selected value renders its label without interaction.\n  seedOptions?: ComboboxOption[]\n  loadSuggestions?: (query?: string) => Promise<Array<string | ComboboxOption>>\n  // Eagerly resolve a pre-selected `value` to a human label when it is not\n  // covered by `suggestions`/`seedOptions`/`loadSuggestions` results. Runs once\n  // per value, before any user interaction. May be sync or async.\n  resolveLabel?: (value: string) => string | Promise<string>\n  resolveDescription?: (value: string) => string | null | undefined\n  autoFocus?: boolean\n  disabled?: boolean\n  allowCustomValues?: boolean\n  clearable?: boolean\n  clearLabel?: string\n}\n\nfunction normalizeOptions(input?: Array<string | ComboboxOption>): ComboboxOption[] {\n  if (!Array.isArray(input)) return []\n  return input\n    .map((option) => {\n      if (typeof option === 'string') {\n        const trimmed = option.trim()\n        if (!trimmed) return null\n        return { value: trimmed, label: trimmed }\n      }\n      const value = typeof option.value === 'string' ? option.value.trim() : ''\n      if (!value) return null\n      return {\n        value,\n        label: option.label?.trim() || value,\n        description: option.description ?? null,\n      }\n    })\n    .filter((option): option is ComboboxOption => !!option)\n}\n\nfunction areOptionsEqual(a: ComboboxOption[], b: ComboboxOption[]): boolean {\n  if (a.length !== b.length) return false\n  return a.every((option, index) => {\n    const next = b[index]\n    return option.value === next.value\n      && option.label === next.label\n      && (option.description ?? null) === (next.description ?? null)\n  })\n}\n\nexport function ComboboxInput({\n  value,\n  onChange,\n  placeholder,\n  suggestions,\n  seedOptions,\n  loadSuggestions,\n  resolveLabel,\n  resolveDescription,\n  autoFocus,\n  disabled = false,\n  allowCustomValues = true,\n  clearable = false,\n  clearLabel,\n}: ComboboxInputProps) {\n  const t = useT()\n  const resolvedPlaceholder = placeholder ?? t('ui.inputs.comboboxInput.placeholder', 'Type to search...')\n  const loadingLabel = t('ui.inputs.comboboxInput.loading', 'Loading suggestions\u2026')\n  const noMatchesLabel = t('ui.inputs.comboboxInput.noMatches', 'No matches found')\n  const resolvedClearLabel = clearLabel ?? t('ui.inputs.comboboxInput.clear', 'Clear value')\n  const blurCloseDelayMs = 250\n  const blurCloseMaxDelayMs = 1000\n  const [input, setInput] = React.useState('')\n  const [asyncOptions, setAsyncOptions] = React.useState<ComboboxOption[]>([])\n  const [resolvedOptions, setResolvedOptions] = React.useState<ComboboxOption[]>([])\n  const [loading, setLoading] = React.useState(false)\n  const [touched, setTouched] = React.useState(false)\n  const [showSuggestions, setShowSuggestions] = React.useState(false)\n  const [selectedIndex, setSelectedIndex] = React.useState(-1)\n  const listboxId = React.useId()\n  const inputRef = React.useRef<HTMLInputElement>(null)\n  const loadingRef = React.useRef(false)\n  const blurCloseTimerRef = React.useRef<number | null>(null)\n  const blurClosePendingRef = React.useRef(false)\n  const suppressOpenOnFocusRef = React.useRef(Boolean(autoFocus && !disabled))\n  const eagerFallbackLoadedValueRef = React.useRef<string | null>(null)\n\n  const staticOptions = React.useMemo(\n    () => normalizeOptions([...(seedOptions ?? []), ...(suggestions ?? [])]),\n    [seedOptions, suggestions]\n  )\n\n  // Single pass over all option sources to build both coverage sets at once.\n  // knownLabelValues: values with a genuine label (not a self-mapping placeholder) \u2014\n  //   used to decide whether eager resolution still needs to run.\n  // coveredOptionValues: all values present in any source (even self-mapped).\n  const { knownLabelValues, coveredOptionValues } = React.useMemo(() => {\n    const known = new Set<string>()\n    const covered = new Set<string>()\n    for (const opt of [...staticOptions, ...asyncOptions, ...resolvedOptions]) {\n      covered.add(opt.value)\n      if (opt.label && opt.label !== opt.value) known.add(opt.value)\n    }\n    return { knownLabelValues: known, coveredOptionValues: covered }\n  }, [staticOptions, asyncOptions, resolvedOptions])\n\n  const optionMap = React.useMemo(() => {\n    const map = new Map<string, ComboboxOption>()\n    const register = (option: ComboboxOption) => {\n      const existing = map.get(option.value)\n      // Prefer an entry that carries a real label over a self-mapping placeholder.\n      if (!existing || (existing.label === existing.value && option.label !== option.value)) {\n        map.set(option.value, option)\n      }\n    }\n    staticOptions.forEach(register)\n    asyncOptions.forEach(register)\n    resolvedOptions.forEach(register)\n    if (value) {\n      const existing = map.get(value)\n      if (!existing) {\n        map.set(value, {\n          value,\n          label: value,\n          description: resolveDescription?.(value) ?? null,\n        })\n      }\n    }\n    return map\n  }, [asyncOptions, resolvedOptions, resolveDescription, staticOptions, value])\n\n  const availableOptions = React.useMemo(() => {\n    return Array.from(optionMap.values())\n  }, [optionMap])\n\n  React.useEffect(() => {\n    loadingRef.current = loading\n  }, [loading])\n\n  const clearBlurCloseTimer = React.useCallback(() => {\n    if (blurCloseTimerRef.current === null) return\n    window.clearTimeout(blurCloseTimerRef.current)\n    blurCloseTimerRef.current = null\n  }, [])\n\n  const resetBlurCloseState = React.useCallback(() => {\n    blurClosePendingRef.current = false\n    clearBlurCloseTimer()\n  }, [clearBlurCloseTimer])\n\n  React.useEffect(() => resetBlurCloseState, [resetBlurCloseState])\n\n  const filteredSuggestions = React.useMemo(() => {\n    const query = input.toLowerCase().trim()\n    if (!query) return availableOptions\n    return availableOptions.filter((option) => {\n      const labelMatch = option.label.toLowerCase().includes(query)\n      const descMatch = option.description?.toLowerCase().includes(query)\n      return labelMatch || Boolean(descMatch)\n    })\n  }, [availableOptions, input])\n\n  React.useEffect(() => {\n    if (!loadSuggestions || !touched || disabled) return\n    const query = input.trim()\n    let cancelled = false\n    const handle = window.setTimeout(() => {\n      setLoading(true)\n      Promise.resolve()\n        .then(() => loadSuggestions(query))\n        .then((items) => {\n          if (!cancelled) {\n            const normalized = normalizeOptions(items)\n            setAsyncOptions((prev) => areOptionsEqual(prev, normalized) ? prev : normalized)\n          }\n        })\n        .catch(() => {})\n        .finally(() => {\n          if (!cancelled) setLoading(false)\n        })\n    }, 200)\n    return () => {\n      cancelled = true\n      window.clearTimeout(handle)\n    }\n  }, [disabled, input, loadSuggestions, touched])\n\n  // Eagerly resolve a pre-selected value to its label without requiring the user\n  // to focus the field. Runs once per value when it is not already covered.\n  const eagerResolveLabel = typeof resolveLabel === 'function' ? resolveLabel : undefined\n  React.useEffect(() => {\n    if (!value || disabled) return\n    let cancelled = false\n    const apply = (label?: string | null, description?: string | null) => {\n      const clean = typeof label === 'string' ? label.trim() : ''\n      if (cancelled || !clean || clean === value) return\n      setResolvedOptions((prev) => {\n        if (prev.some((option) => option.value === value && option.label === clean)) return prev\n        return [...prev.filter((option) => option.value !== value), { value, label: clean, description: description ?? null }]\n      })\n    }\n    if (eagerResolveLabel) {\n      if (knownLabelValues.has(value)) return\n      Promise.resolve()\n        .then(() => eagerResolveLabel(value))\n        .then((label) => apply(label, resolveDescription?.(value)))\n        .catch(() => {})\n      return () => { cancelled = true }\n    }\n    if (coveredOptionValues.has(value)) return\n    if (eagerFallbackLoadedValueRef.current === value) return\n    eagerFallbackLoadedValueRef.current = value\n    // Fallback: pull the first page of async suggestions so a remount that lost\n    // its option cache can still recover the label without user interaction.\n    // Note: if the loader is paginated and the value falls outside the first page,\n    // the fallback silently fails and the raw value remains visible.\n    if (loadSuggestions) {\n      setLoading(true)\n      Promise.resolve()\n        .then(() => loadSuggestions())\n        .then((items) => {\n          if (cancelled) return\n          const normalized = normalizeOptions(items)\n          setAsyncOptions((prev) => areOptionsEqual(prev, normalized) ? prev : normalized)\n        })\n        .catch(() => {})\n        .finally(() => { if (!cancelled) setLoading(false) })\n    }\n    return () => { cancelled = true }\n  // eslint-disable-next-line react-hooks/exhaustive-deps -- resolveDescription intentionally excluded:\n  // including it would re-run the effect on every render when the prop is an inline function\n  }, [value, disabled, knownLabelValues, coveredOptionValues, eagerResolveLabel, loadSuggestions])\n\n  // Sync input with value when value changes externally and input is not focused.\n  React.useEffect(() => {\n    if (document.activeElement !== inputRef.current) {\n      const option = optionMap.get(value)\n      setInput(option?.label ?? value ?? '')\n    }\n  }, [value, optionMap])\n\n  const selectValue = React.useCallback(\n    (nextValue: string) => {\n      if (disabled) return\n      resetBlurCloseState()\n      const trimmed = nextValue.trim()\n      onChange(trimmed)\n      const option = optionMap.get(trimmed)\n      setInput(option?.label ?? trimmed)\n      setShowSuggestions(false)\n      setSelectedIndex(-1)\n    },\n    [disabled, onChange, optionMap, resetBlurCloseState]\n  )\n\n  const findOptionForInput = React.useCallback(\n    (raw: string): ComboboxOption | null => {\n      const query = raw.trim().toLowerCase()\n      if (!query) return null\n      for (const option of optionMap.values()) {\n        if (option.value === raw.trim()) return option\n        if (option.label.toLowerCase() === query) return option\n      }\n      return null\n    },\n    [optionMap]\n  )\n\n  const confirmSelection = React.useCallback(\n    (raw: string) => {\n      if (disabled) return\n      if (clearable && raw.trim() === '') {\n        selectValue('')\n        return\n      }\n      const option = findOptionForInput(raw)\n      if (option) {\n        selectValue(option.value)\n        return\n      }\n      if (!allowCustomValues) {\n        // Revert to the current value's label \u2014 but only if we actually know it.\n        // Baking the raw value back in while eager resolution is still pending\n        // would freeze a placeholder (e.g. a UUID) into the visible input.\n        setShowSuggestions(false)\n        const currentOption = optionMap.get(value)\n        if (currentOption && currentOption.label !== currentOption.value) {\n          setInput(currentOption.label)\n        } else if (!value) {\n          setInput('')\n        }\n        return\n      }\n      selectValue(raw)\n    },\n    [allowCustomValues, clearable, disabled, findOptionForInput, optionMap, selectValue, value]\n  )\n\n  const handleClear = React.useCallback(() => {\n    if (disabled) return\n    selectValue('')\n    inputRef.current?.focus()\n  }, [disabled, selectValue])\n\n  const closeAfterBlur = React.useCallback(() => {\n    blurCloseTimerRef.current = null\n    if (disabled) return\n    blurClosePendingRef.current = false\n    confirmSelection(input)\n    setShowSuggestions(false)\n    setSelectedIndex(-1)\n  }, [confirmSelection, disabled, input])\n\n  const attemptBlurClose = React.useCallback(() => {\n    blurCloseTimerRef.current = null\n    if (disabled) return\n    if (loadingRef.current) {\n      blurCloseTimerRef.current = window.setTimeout(closeAfterBlur, blurCloseMaxDelayMs)\n      return\n    }\n    closeAfterBlur()\n  }, [blurCloseMaxDelayMs, closeAfterBlur, disabled])\n\n  React.useEffect(() => {\n    if (!blurClosePendingRef.current) return\n    if (loading) return\n    clearBlurCloseTimer()\n    closeAfterBlur()\n  }, [clearBlurCloseTimer, closeAfterBlur, loading])\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (disabled) return\n\n      if (event.key === 'ArrowDown') {\n        event.preventDefault()\n        if (!showSuggestions) {\n          setShowSuggestions(true)\n          setSelectedIndex(0)\n        } else {\n          setSelectedIndex((prev) => Math.min(prev + 1, filteredSuggestions.length - 1))\n        }\n      } else if (event.key === 'ArrowUp') {\n        event.preventDefault()\n        setSelectedIndex((prev) => Math.max(prev - 1, -1))\n      } else if (event.key === 'Enter') {\n        event.preventDefault()\n        if (selectedIndex >= 0 && filteredSuggestions[selectedIndex]) {\n          selectValue(filteredSuggestions[selectedIndex].value)\n        } else {\n          confirmSelection(input)\n        }\n      } else if (event.key === 'Escape') {\n        if (!showSuggestions) return\n        event.preventDefault()\n        event.stopPropagation()\n        setShowSuggestions(false)\n        setSelectedIndex(-1)\n      }\n    },\n    [confirmSelection, disabled, filteredSuggestions, input, selectValue, selectedIndex, showSuggestions]\n  )\n\n  const optionDomId = React.useCallback(\n    (index: number) => `${listboxId}-option-${index}`,\n    [listboxId],\n  )\n\n  React.useEffect(() => {\n    if (selectedIndex < 0 || !showSuggestions) return\n    const activeElement = typeof document !== 'undefined'\n      ? document.getElementById(optionDomId(selectedIndex))\n      : null\n    if (typeof activeElement?.scrollIntoView === 'function') {\n      activeElement.scrollIntoView({ block: 'nearest' })\n    }\n  }, [optionDomId, selectedIndex, showSuggestions])\n\n  const showClearButton = clearable && !disabled && (value !== '' || input !== '')\n  const listboxVisible = showSuggestions\n    && !disabled\n    && (loading || filteredSuggestions.length > 0 || (touched && input.trim().length > 0))\n\n  return (\n    <div className=\"relative w-full\">\n      {/* Use raw <input> here instead of the DS Input primitive: ComboboxInput's\n          focus / suggestions-popup interplay relies on the trigger being a plain\n          input element. The DS wrapper introduces a <div> that desyncs autocomplete\n          on this specific surface. Keeps the rest of the form on Input primitive. */}\n      <input\n        ref={inputRef}\n        type=\"text\"\n        className={[\n          'w-full h-9 rounded-md border border-input bg-background px-3 text-sm shadow-xs transition-colors outline-none placeholder:text-muted-foreground focus-visible:shadow-focus focus-visible:border-foreground disabled:bg-bg-disabled disabled:border-border-disabled disabled:text-muted-foreground disabled:cursor-not-allowed',\n          showClearButton ? 'pr-9' : '',\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        value={input}\n        placeholder={resolvedPlaceholder}\n        autoFocus={autoFocus}\n        data-crud-focus-target=\"\"\n        disabled={disabled}\n        role=\"combobox\"\n        aria-expanded={listboxVisible}\n        aria-controls={listboxVisible && !loading && filteredSuggestions.length > 0 ? listboxId : undefined}\n        aria-autocomplete=\"list\"\n        aria-activedescendant={listboxVisible && selectedIndex >= 0 ? optionDomId(selectedIndex) : undefined}\n        onFocus={() => {\n          setTouched(true)\n          if (suppressOpenOnFocusRef.current) {\n            suppressOpenOnFocusRef.current = false\n            return\n          }\n          resetBlurCloseState()\n          if (loadSuggestions && availableOptions.length === 0) {\n            setLoading(true)\n          }\n          setShowSuggestions(true)\n        }}\n        onChange={(event) => {\n          setTouched(true)\n          setInput(event.target.value)\n          setShowSuggestions(true)\n          setSelectedIndex(-1)\n        }}\n        onKeyDown={handleKeyDown}\n        onBlur={() => {\n          // Delay closing so clicks on the popup can resolve first. If async\n          // suggestions are still loading, keep the dropdown open instead of\n          // closing before the first payload arrives.\n          blurClosePendingRef.current = true\n          clearBlurCloseTimer()\n          if (loadingRef.current) {\n            blurCloseTimerRef.current = window.setTimeout(closeAfterBlur, blurCloseMaxDelayMs)\n            return\n          }\n          blurCloseTimerRef.current = window.setTimeout(attemptBlurClose, blurCloseDelayMs)\n        }}\n      />\n\n      {showClearButton ? (\n        <IconButton\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"xs\"\n          aria-label={resolvedClearLabel}\n          className=\"absolute right-1 top-1/2 -translate-y-1/2\"\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={handleClear}\n        >\n          <X className=\"size-3\" />\n        </IconButton>\n      ) : null}\n\n      {listboxVisible && (\n        <div\n          className=\"absolute z-popover w-full mt-1 rounded-md border border-input bg-popover p-2 shadow-md max-h-48 sm:max-h-60 overflow-auto\"\n        >\n          {loading && touched ? (\n            <div className=\"px-2 py-1.5 text-xs text-muted-foreground\" role=\"status\">{loadingLabel}</div>\n          ) : touched && !filteredSuggestions.length ? (\n            <div className=\"px-2 py-1.5 text-xs text-muted-foreground\" role=\"status\">{noMatchesLabel}</div>\n          ) : (\n            <div id={listboxId} role=\"listbox\" className=\"flex flex-col gap-1\">\n              {filteredSuggestions.map((option, index) => (\n                <Button\n                  key={option.value}\n                  id={optionDomId(index)}\n                  type=\"button\"\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  role=\"option\"\n                  aria-selected={index === selectedIndex}\n                  className={[\n                    'w-full h-auto justify-start font-normal text-left flex flex-col items-start rounded-lg p-2',\n                    index === selectedIndex ? 'bg-muted' : '',\n                  ]\n                    .filter(Boolean)\n                    .join(' ')}\n                  onMouseDown={(event) => event.preventDefault()}\n                  onClick={() => {\n                    resetBlurCloseState()\n                    selectValue(option.value)\n                  }}\n                  onMouseEnter={() => setSelectedIndex(index)}\n                >\n                  <span className=\"font-medium text-foreground\">{option.label}</span>\n                  {option.description ? (\n                    <span className=\"text-xs text-muted-foreground\">{option.description}</span>\n                  ) : null}\n                </Button>\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n"],
-  "mappings": ";AAqZM,cA6EU,YA7EV;AAnZN,YAAY,WAAW;AACvB,SAAS,SAAS;AAClB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AA8B3B,SAAS,iBAAiB,OAA0D;AAClF,MAAI,CAAC,MAAM,QAAQ,KAAK,EAAG,QAAO,CAAC;AACnC,SAAO,MACJ,IAAI,CAAC,WAAW;AACf,QAAI,OAAO,WAAW,UAAU;AAC9B,YAAM,UAAU,OAAO,KAAK;AAC5B,UAAI,CAAC,QAAS,QAAO;AACrB,aAAO,EAAE,OAAO,SAAS,OAAO,QAAQ;AAAA,IAC1C;AACA,UAAM,QAAQ,OAAO,OAAO,UAAU,WAAW,OAAO,MAAM,KAAK,IAAI;AACvE,QAAI,CAAC,MAAO,QAAO;AACnB,WAAO;AAAA,MACL;AAAA,MACA,OAAO,OAAO,OAAO,KAAK,KAAK;AAAA,MAC/B,aAAa,OAAO,eAAe;AAAA,IACrC;AAAA,EACF,CAAC,EACA,OAAO,CAAC,WAAqC,CAAC,CAAC,MAAM;AAC1D;AAEA,SAAS,gBAAgB,GAAqB,GAA8B;AAC1E,MAAI,EAAE,WAAW,EAAE,OAAQ,QAAO;AAClC,SAAO,EAAE,MAAM,CAAC,QAAQ,UAAU;AAChC,UAAM,OAAO,EAAE,KAAK;AACpB,WAAO,OAAO,UAAU,KAAK,SACxB,OAAO,UAAU,KAAK,UACrB,OAAO,eAAe,WAAW,KAAK,eAAe;AAAA,EAC7D,CAAC;AACH;AAEO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,YAAY;AAAA,EACZ;AACF,GAAuB;AACrB,QAAM,IAAI,KAAK;AACf,QAAM,sBAAsB,eAAe,EAAE,uCAAuC,mBAAmB;AACvG,QAAM,eAAe,EAAE,mCAAmC,2BAAsB;AAChF,QAAM,iBAAiB,EAAE,qCAAqC,kBAAkB;AAChF,QAAM,qBAAqB,cAAc,EAAE,iCAAiC,aAAa;AACzF,QAAM,mBAAmB;AACzB,QAAM,sBAAsB;AAC5B,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAS,EAAE;AAC3C,QAAM,CAAC,cAAc,eAAe,IAAI,MAAM,SAA2B,CAAC,CAAC;AAC3E,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,MAAM,SAA2B,CAAC,CAAC;AACjF,QAAM,CAAC,SAAS,UAAU,IAAI,MAAM,SAAS,KAAK;AAClD,QAAM,CAAC,SAAS,UAAU,IAAI,MAAM,SAAS,KAAK;AAClD,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,MAAM,SAAS,KAAK;AAClE,QAAM,CAAC,eAAe,gBAAgB,IAAI,MAAM,SAAS,EAAE;AAC3D,QAAM,YAAY,MAAM,MAAM;AAC9B,QAAM,WAAW,MAAM,OAAyB,IAAI;AACpD,QAAM,aAAa,MAAM,OAAO,KAAK;AACrC,QAAM,oBAAoB,MAAM,OAAsB,IAAI;AAC1D,QAAM,sBAAsB,MAAM,OAAO,KAAK;AAC9C,QAAM,yBAAyB,MAAM,OAAO,QAAQ,aAAa,CAAC,QAAQ,CAAC;AAC3E,QAAM,8BAA8B,MAAM,OAAsB,IAAI;AAEpE,QAAM,gBAAgB,MAAM;AAAA,IAC1B,MAAM,iBAAiB,CAAC,GAAI,eAAe,CAAC,GAAI,GAAI,eAAe,CAAC,CAAE,CAAC;AAAA,IACvE,CAAC,aAAa,WAAW;AAAA,EAC3B;AAMA,QAAM,EAAE,kBAAkB,oBAAoB,IAAI,MAAM,QAAQ,MAAM;AACpE,UAAM,QAAQ,oBAAI,IAAY;AAC9B,UAAM,UAAU,oBAAI,IAAY;AAChC,eAAW,OAAO,CAAC,GAAG,eAAe,GAAG,cAAc,GAAG,eAAe,GAAG;AACzE,cAAQ,IAAI,IAAI,KAAK;AACrB,UAAI,IAAI,SAAS,IAAI,UAAU,IAAI,MAAO,OAAM,IAAI,IAAI,KAAK;AAAA,IAC/D;AACA,WAAO,EAAE,kBAAkB,OAAO,qBAAqB,QAAQ;AAAA,EACjE,GAAG,CAAC,eAAe,cAAc,eAAe,CAAC;AAEjD,QAAM,YAAY,MAAM,QAAQ,MAAM;AACpC,UAAM,MAAM,oBAAI,IAA4B;AAC5C,UAAM,WAAW,CAAC,WAA2B;AAC3C,YAAM,WAAW,IAAI,IAAI,OAAO,KAAK;AAErC,UAAI,CAAC,YAAa,SAAS,UAAU,SAAS,SAAS,OAAO,UAAU,OAAO,OAAQ;AACrF,YAAI,IAAI,OAAO,OAAO,MAAM;AAAA,MAC9B;AAAA,IACF;AACA,kBAAc,QAAQ,QAAQ;AAC9B,iBAAa,QAAQ,QAAQ;AAC7B,oBAAgB,QAAQ,QAAQ;AAChC,QAAI,OAAO;AACT,YAAM,WAAW,IAAI,IAAI,KAAK;AAC9B,UAAI,CAAC,UAAU;AACb,YAAI,IAAI,OAAO;AAAA,UACb;AAAA,UACA,OAAO;AAAA,UACP,aAAa,qBAAqB,KAAK,KAAK;AAAA,QAC9C,CAAC;AAAA,MACH;AAAA,IACF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,cAAc,iBAAiB,oBAAoB,eAAe,KAAK,CAAC;AAE5E,QAAM,mBAAmB,MAAM,QAAQ,MAAM;AAC3C,WAAO,MAAM,KAAK,UAAU,OAAO,CAAC;AAAA,EACtC,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,UAAU,MAAM;AACpB,eAAW,UAAU;AAAA,EACvB,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,sBAAsB,MAAM,YAAY,MAAM;AAClD,QAAI,kBAAkB,YAAY,KAAM;AACxC,WAAO,aAAa,kBAAkB,OAAO;AAC7C,sBAAkB,UAAU;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,sBAAsB,MAAM,YAAY,MAAM;AAClD,wBAAoB,UAAU;AAC9B,wBAAoB;AAAA,EACtB,GAAG,CAAC,mBAAmB,CAAC;AAExB,QAAM,UAAU,MAAM,qBAAqB,CAAC,mBAAmB,CAAC;AAEhE,QAAM,sBAAsB,MAAM,QAAQ,MAAM;AAC9C,UAAM,QAAQ,MAAM,YAAY,EAAE,KAAK;AACvC,QAAI,CAAC,MAAO,QAAO;AACnB,WAAO,iBAAiB,OAAO,CAAC,WAAW;AACzC,YAAM,aAAa,OAAO,MAAM,YAAY,EAAE,SAAS,KAAK;AAC5D,YAAM,YAAY,OAAO,aAAa,YAAY,EAAE,SAAS,KAAK;AAClE,aAAO,cAAc,QAAQ,SAAS;AAAA,IACxC,CAAC;AAAA,EACH,GAAG,CAAC,kBAAkB,KAAK,CAAC;AAE5B,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,mBAAmB,CAAC,WAAW,SAAU;AAC9C,UAAM,QAAQ,MAAM,KAAK;AACzB,QAAI,YAAY;AAChB,UAAM,SAAS,OAAO,WAAW,MAAM;AACrC,iBAAW,IAAI;AACf,cAAQ,QAAQ,EACb,KAAK,MAAM,gBAAgB,KAAK,CAAC,EACjC,KAAK,CAAC,UAAU;AACf,YAAI,CAAC,WAAW;AACd,gBAAM,aAAa,iBAAiB,KAAK;AACzC,0BAAgB,CAAC,SAAS,gBAAgB,MAAM,UAAU,IAAI,OAAO,UAAU;AAAA,QACjF;AAAA,MACF,CAAC,EACA,MAAM,MAAM;AAAA,MAAC,CAAC,EACd,QAAQ,MAAM;AACb,YAAI,CAAC,UAAW,YAAW,KAAK;AAAA,MAClC,CAAC;AAAA,IACL,GAAG,GAAG;AACN,WAAO,MAAM;AACX,kBAAY;AACZ,aAAO,aAAa,MAAM;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,UAAU,OAAO,iBAAiB,OAAO,CAAC;AAI9C,QAAM,oBAAoB,OAAO,iBAAiB,aAAa,eAAe;AAC9E,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,SAAS,SAAU;AACxB,QAAI,YAAY;AAChB,UAAM,QAAQ,CAAC,OAAuB,gBAAgC;AACpE,YAAM,QAAQ,OAAO,UAAU,WAAW,MAAM,KAAK,IAAI;AACzD,UAAI,aAAa,CAAC,SAAS,UAAU,MAAO;AAC5C,yBAAmB,CAAC,SAAS;AAC3B,YAAI,KAAK,KAAK,CAAC,WAAW,OAAO,UAAU,SAAS,OAAO,UAAU,KAAK,EAAG,QAAO;AACpF,eAAO,CAAC,GAAG,KAAK,OAAO,CAAC,WAAW,OAAO,UAAU,KAAK,GAAG,EAAE,OAAO,OAAO,OAAO,aAAa,eAAe,KAAK,CAAC;AAAA,MACvH,CAAC;AAAA,IACH;AACA,QAAI,mBAAmB;AACrB,UAAI,iBAAiB,IAAI,KAAK,EAAG;AACjC,cAAQ,QAAQ,EACb,KAAK,MAAM,kBAAkB,KAAK,CAAC,EACnC,KAAK,CAAC,UAAU,MAAM,OAAO,qBAAqB,KAAK,CAAC,CAAC,EACzD,MAAM,MAAM;AAAA,MAAC,CAAC;AACjB,aAAO,MAAM;AAAE,oBAAY;AAAA,MAAK;AAAA,IAClC;AACA,QAAI,oBAAoB,IAAI,KAAK,EAAG;AACpC,QAAI,4BAA4B,YAAY,MAAO;AACnD,gCAA4B,UAAU;AAKtC,QAAI,iBAAiB;AACnB,iBAAW,IAAI;AACf,cAAQ,QAAQ,EACb,KAAK,MAAM,gBAAgB,CAAC,EAC5B,KAAK,CAAC,UAAU;AACf,YAAI,UAAW;AACf,cAAM,aAAa,iBAAiB,KAAK;AACzC,wBAAgB,CAAC,SAAS,gBAAgB,MAAM,UAAU,IAAI,OAAO,UAAU;AAAA,MACjF,CAAC,EACA,MAAM,MAAM;AAAA,MAAC,CAAC,EACd,QAAQ,MAAM;AAAE,YAAI,CAAC,UAAW,YAAW,KAAK;AAAA,MAAE,CAAC;AAAA,IACxD;AACA,WAAO,MAAM;AAAE,kBAAY;AAAA,IAAK;AAAA,EAGlC,GAAG,CAAC,OAAO,UAAU,kBAAkB,qBAAqB,mBAAmB,eAAe,CAAC;AAG/F,QAAM,UAAU,MAAM;AACpB,QAAI,SAAS,kBAAkB,SAAS,SAAS;AAC/C,YAAM,SAAS,UAAU,IAAI,KAAK;AAClC,eAAS,QAAQ,SAAS,SAAS,EAAE;AAAA,IACvC;AAAA,EACF,GAAG,CAAC,OAAO,SAAS,CAAC;AAErB,QAAM,cAAc,MAAM;AAAA,IACxB,CAAC,cAAsB;AACrB,UAAI,SAAU;AACd,0BAAoB;AACpB,YAAM,UAAU,UAAU,KAAK;AAC/B,eAAS,OAAO;AAChB,YAAM,SAAS,UAAU,IAAI,OAAO;AACpC,eAAS,QAAQ,SAAS,OAAO;AACjC,yBAAmB,KAAK;AACxB,uBAAiB,EAAE;AAAA,IACrB;AAAA,IACA,CAAC,UAAU,UAAU,WAAW,mBAAmB;AAAA,EACrD;AAEA,QAAM,qBAAqB,MAAM;AAAA,IAC/B,CAAC,QAAuC;AACtC,YAAM,QAAQ,IAAI,KAAK,EAAE,YAAY;AACrC,UAAI,CAAC,MAAO,QAAO;AACnB,iBAAW,UAAU,UAAU,OAAO,GAAG;AACvC,YAAI,OAAO,UAAU,IAAI,KAAK,EAAG,QAAO;AACxC,YAAI,OAAO,MAAM,YAAY,MAAM,MAAO,QAAO;AAAA,MACnD;AACA,aAAO;AAAA,IACT;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,mBAAmB,MAAM;AAAA,IAC7B,CAAC,QAAgB;AACf,UAAI,SAAU;AACd,UAAI,aAAa,IAAI,KAAK,MAAM,IAAI;AAClC,oBAAY,EAAE;AACd;AAAA,MACF;AACA,YAAM,SAAS,mBAAmB,GAAG;AACrC,UAAI,QAAQ;AACV,oBAAY,OAAO,KAAK;AACxB;AAAA,MACF;AACA,UAAI,CAAC,mBAAmB;AAItB,2BAAmB,KAAK;AACxB,cAAM,gBAAgB,UAAU,IAAI,KAAK;AACzC,YAAI,iBAAiB,cAAc,UAAU,cAAc,OAAO;AAChE,mBAAS,cAAc,KAAK;AAAA,QAC9B,WAAW,CAAC,OAAO;AACjB,mBAAS,EAAE;AAAA,QACb;AACA;AAAA,MACF;AACA,kBAAY,GAAG;AAAA,IACjB;AAAA,IACA,CAAC,mBAAmB,WAAW,UAAU,oBAAoB,WAAW,aAAa,KAAK;AAAA,EAC5F;AAEA,QAAM,cAAc,MAAM,YAAY,MAAM;AAC1C,QAAI,SAAU;AACd,gBAAY,EAAE;AACd,aAAS,SAAS,MAAM;AAAA,EAC1B,GAAG,CAAC,UAAU,WAAW,CAAC;AAE1B,QAAM,iBAAiB,MAAM,YAAY,MAAM;AAC7C,sBAAkB,UAAU;AAC5B,QAAI,SAAU;AACd,wBAAoB,UAAU;AAC9B,qBAAiB,KAAK;AACtB,uBAAmB,KAAK;AACxB,qBAAiB,EAAE;AAAA,EACrB,GAAG,CAAC,kBAAkB,UAAU,KAAK,CAAC;AAEtC,QAAM,mBAAmB,MAAM,YAAY,MAAM;AAC/C,sBAAkB,UAAU;AAC5B,QAAI,SAAU;AACd,QAAI,WAAW,SAAS;AACtB,wBAAkB,UAAU,OAAO,WAAW,gBAAgB,mBAAmB;AACjF;AAAA,IACF;AACA,mBAAe;AAAA,EACjB,GAAG,CAAC,qBAAqB,gBAAgB,QAAQ,CAAC;AAElD,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,oBAAoB,QAAS;AAClC,QAAI,QAAS;AACb,wBAAoB;AACpB,mBAAe;AAAA,EACjB,GAAG,CAAC,qBAAqB,gBAAgB,OAAO,CAAC;AAEjD,QAAM,gBAAgB,MAAM;AAAA,IAC1B,CAAC,UAAiD;AAChD,UAAI,SAAU;AAEd,UAAI,MAAM,QAAQ,aAAa;AAC7B,cAAM,eAAe;AACrB,YAAI,CAAC,iBAAiB;AACpB,6BAAmB,IAAI;AACvB,2BAAiB,CAAC;AAAA,QACpB,OAAO;AACL,2BAAiB,CAAC,SAAS,KAAK,IAAI,OAAO,GAAG,oBAAoB,SAAS,CAAC,CAAC;AAAA,QAC/E;AAAA,MACF,WAAW,MAAM,QAAQ,WAAW;AAClC,cAAM,eAAe;AACrB,yBAAiB,CAAC,SAAS,KAAK,IAAI,OAAO,GAAG,EAAE,CAAC;AAAA,MACnD,WAAW,MAAM,QAAQ,SAAS;AAChC,cAAM,eAAe;AACrB,YAAI,iBAAiB,KAAK,oBAAoB,aAAa,GAAG;AAC5D,sBAAY,oBAAoB,aAAa,EAAE,KAAK;AAAA,QACtD,OAAO;AACL,2BAAiB,KAAK;AAAA,QACxB;AAAA,MACF,WAAW,MAAM,QAAQ,UAAU;AACjC,YAAI,CAAC,gBAAiB;AACtB,cAAM,eAAe;AACrB,cAAM,gBAAgB;AACtB,2BAAmB,KAAK;AACxB,yBAAiB,EAAE;AAAA,MACrB;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,UAAU,qBAAqB,OAAO,aAAa,eAAe,eAAe;AAAA,EACtG;AAEA,QAAM,cAAc,MAAM;AAAA,IACxB,CAAC,UAAkB,GAAG,SAAS,WAAW,KAAK;AAAA,IAC/C,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,UAAU,MAAM;AACpB,QAAI,gBAAgB,KAAK,CAAC,gBAAiB;AAC3C,UAAM,gBAAgB,OAAO,aAAa,cACtC,SAAS,eAAe,YAAY,aAAa,CAAC,IAClD;AACJ,QAAI,OAAO,eAAe,mBAAmB,YAAY;AACvD,oBAAc,eAAe,EAAE,OAAO,UAAU,CAAC;AAAA,IACnD;AAAA,EACF,GAAG,CAAC,aAAa,eAAe,eAAe,CAAC;AAEhD,QAAM,kBAAkB,aAAa,CAAC,aAAa,UAAU,MAAM,UAAU;AAC7E,QAAM,iBAAiB,mBAClB,CAAC,aACA,WAAW,oBAAoB,SAAS,KAAM,WAAW,MAAM,KAAK,EAAE,SAAS;AAErF,SACE,qBAAC,SAAI,WAAU,mBAKb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,MAAK;AAAA,QACL,WAAW;AAAA,UACT;AAAA,UACA,kBAAkB,SAAS;AAAA,QAC7B,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QACX,OAAO;AAAA,QACP,aAAa;AAAA,QACb;AAAA,QACA,0BAAuB;AAAA,QACvB;AAAA,QACA,MAAK;AAAA,QACL,iBAAe;AAAA,QACf,iBAAe,kBAAkB,CAAC,WAAW,oBAAoB,SAAS,IAAI,YAAY;AAAA,QAC1F,qBAAkB;AAAA,QAClB,yBAAuB,kBAAkB,iBAAiB,IAAI,YAAY,aAAa,IAAI;AAAA,QAC3F,SAAS,MAAM;AACb,qBAAW,IAAI;AACf,cAAI,uBAAuB,SAAS;AAClC,mCAAuB,UAAU;AACjC;AAAA,UACF;AACA,8BAAoB;AACpB,cAAI,mBAAmB,iBAAiB,WAAW,GAAG;AACpD,uBAAW,IAAI;AAAA,UACjB;AACA,6BAAmB,IAAI;AAAA,QACzB;AAAA,QACA,UAAU,CAAC,UAAU;AACnB,qBAAW,IAAI;AACf,mBAAS,MAAM,OAAO,KAAK;AAC3B,6BAAmB,IAAI;AACvB,2BAAiB,EAAE;AAAA,QACrB;AAAA,QACA,WAAW;AAAA,QACX,QAAQ,MAAM;AAIZ,8BAAoB,UAAU;AAC9B,8BAAoB;AACpB,cAAI,WAAW,SAAS;AACtB,8BAAkB,UAAU,OAAO,WAAW,gBAAgB,mBAAmB;AACjF;AAAA,UACF;AACA,4BAAkB,UAAU,OAAO,WAAW,kBAAkB,gBAAgB;AAAA,QAClF;AAAA;AAAA,IACF;AAAA,IAEC,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,aAAa,CAAC,UAAU,MAAM,eAAe;AAAA,QAC7C,SAAS;AAAA,QAET,8BAAC,KAAE,WAAU,UAAS;AAAA;AAAA,IACxB,IACE;AAAA,IAEH,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QAET,qBAAW,UACV,oBAAC,SAAI,WAAU,6CAA4C,MAAK,UAAU,wBAAa,IACrF,WAAW,CAAC,oBAAoB,SAClC,oBAAC,SAAI,WAAU,6CAA4C,MAAK,UAAU,0BAAe,IAEzF,oBAAC,SAAI,IAAI,WAAW,MAAK,WAAU,WAAU,uBAC1C,8BAAoB,IAAI,CAAC,QAAQ,UAChC;AAAA,UAAC;AAAA;AAAA,YAEC,IAAI,YAAY,KAAK;AAAA,YACrB,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,MAAK;AAAA,YACL,iBAAe,UAAU;AAAA,YACzB,WAAW;AAAA,cACT;AAAA,cACA,UAAU,gBAAgB,aAAa;AAAA,YACzC,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,YACX,aAAa,CAAC,UAAU,MAAM,eAAe;AAAA,YAC7C,SAAS,MAAM;AACb,kCAAoB;AACpB,0BAAY,OAAO,KAAK;AAAA,YAC1B;AAAA,YACA,cAAc,MAAM,iBAAiB,KAAK;AAAA,YAE1C;AAAA,kCAAC,UAAK,WAAU,+BAA+B,iBAAO,OAAM;AAAA,cAC3D,OAAO,cACN,oBAAC,UAAK,WAAU,iCAAiC,iBAAO,aAAY,IAClE;AAAA;AAAA;AAAA,UAvBC,OAAO;AAAA,QAwBd,CACD,GACH;AAAA;AAAA,IAEJ;AAAA,KAEJ;AAEJ;",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { X } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Button } from '../../primitives/button'\nimport { IconButton } from '../../primitives/icon-button'\n\nexport type ComboboxOption = {\n  value: string\n  label: string\n  description?: string | null\n}\n\nexport type ComboboxInputProps = {\n  value: string\n  onChange: (next: string) => void\n  placeholder?: string\n  suggestions?: Array<string | ComboboxOption>\n  // Options to hydrate the option map up front (typically the linked entity's\n  // display fields, already present in a record-detail payload). Merged with\n  // `suggestions` so a pre-selected value renders its label without interaction.\n  seedOptions?: ComboboxOption[]\n  loadSuggestions?: (query?: string) => Promise<Array<string | ComboboxOption>>\n  // Eagerly resolve a pre-selected `value` to a human label when it is not\n  // covered by `suggestions`/`seedOptions`/`loadSuggestions` results. Runs once\n  // per value, before any user interaction. May be sync or async.\n  resolveLabel?: (value: string) => string | Promise<string>\n  resolveDescription?: (value: string) => string | null | undefined\n  autoFocus?: boolean\n  disabled?: boolean\n  allowCustomValues?: boolean\n  clearable?: boolean\n  clearLabel?: string\n}\n\nfunction normalizeOptions(input?: Array<string | ComboboxOption>): ComboboxOption[] {\n  if (!Array.isArray(input)) return []\n  return input\n    .map((option) => {\n      if (typeof option === 'string') {\n        const trimmed = option.trim()\n        if (!trimmed) return null\n        return { value: trimmed, label: trimmed }\n      }\n      const value = typeof option.value === 'string' ? option.value.trim() : ''\n      if (!value) return null\n      return {\n        value,\n        label: option.label?.trim() || value,\n        description: option.description ?? null,\n      }\n    })\n    .filter((option): option is ComboboxOption => !!option)\n}\n\nfunction areOptionsEqual(a: ComboboxOption[], b: ComboboxOption[]): boolean {\n  if (a.length !== b.length) return false\n  return a.every((option, index) => {\n    const next = b[index]\n    return option.value === next.value\n      && option.label === next.label\n      && (option.description ?? null) === (next.description ?? null)\n  })\n}\n\nexport function ComboboxInput({\n  value,\n  onChange,\n  placeholder,\n  suggestions,\n  seedOptions,\n  loadSuggestions,\n  resolveLabel,\n  resolveDescription,\n  autoFocus,\n  disabled = false,\n  allowCustomValues = true,\n  clearable = false,\n  clearLabel,\n}: ComboboxInputProps) {\n  const t = useT()\n  const resolvedPlaceholder = placeholder ?? t('ui.inputs.comboboxInput.placeholder', 'Type to search...')\n  const loadingLabel = t('ui.inputs.comboboxInput.loading', 'Loading suggestions\u2026')\n  const noMatchesLabel = t('ui.inputs.comboboxInput.noMatches', 'No matches found')\n  const resolvedClearLabel = clearLabel ?? t('ui.inputs.comboboxInput.clear', 'Clear value')\n  const blurCloseDelayMs = 250\n  const blurCloseMaxDelayMs = 1000\n  const [input, setInput] = React.useState('')\n  const [asyncOptions, setAsyncOptions] = React.useState<ComboboxOption[]>([])\n  const [resolvedOptions, setResolvedOptions] = React.useState<ComboboxOption[]>([])\n  const [loading, setLoading] = React.useState(false)\n  const [touched, setTouched] = React.useState(false)\n  const [showSuggestions, setShowSuggestions] = React.useState(false)\n  const [selectedIndex, setSelectedIndex] = React.useState(-1)\n  const listboxId = React.useId()\n  const inputRef = React.useRef<HTMLInputElement>(null)\n  const loadingRef = React.useRef(false)\n  const blurCloseTimerRef = React.useRef<number | null>(null)\n  const blurClosePendingRef = React.useRef(false)\n  const suppressOpenOnFocusRef = React.useRef(Boolean(autoFocus && !disabled))\n  const eagerFallbackLoadedValueRef = React.useRef<string | null>(null)\n  // Tracks whether the user actually typed into the field during the current focus\n  // session. `touched` cannot serve this purpose because it is set by `onFocus`,\n  // which `autoFocus` triggers before the user does anything at all.\n  const userTypedRef = React.useRef(false)\n\n  const staticOptions = React.useMemo(\n    () => normalizeOptions([...(seedOptions ?? []), ...(suggestions ?? [])]),\n    [seedOptions, suggestions]\n  )\n\n  // Single pass over all option sources to build both coverage sets at once.\n  // knownLabelValues: values with a genuine label (not a self-mapping placeholder) \u2014\n  //   used to decide whether eager resolution still needs to run.\n  // coveredOptionValues: all values present in any source (even self-mapped).\n  const { knownLabelValues, coveredOptionValues } = React.useMemo(() => {\n    const known = new Set<string>()\n    const covered = new Set<string>()\n    for (const opt of [...staticOptions, ...asyncOptions, ...resolvedOptions]) {\n      covered.add(opt.value)\n      if (opt.label && opt.label !== opt.value) known.add(opt.value)\n    }\n    return { knownLabelValues: known, coveredOptionValues: covered }\n  }, [staticOptions, asyncOptions, resolvedOptions])\n\n  const optionMap = React.useMemo(() => {\n    const map = new Map<string, ComboboxOption>()\n    const register = (option: ComboboxOption) => {\n      const existing = map.get(option.value)\n      // Prefer an entry that carries a real label over a self-mapping placeholder.\n      if (!existing || (existing.label === existing.value && option.label !== option.value)) {\n        map.set(option.value, option)\n      }\n    }\n    staticOptions.forEach(register)\n    asyncOptions.forEach(register)\n    resolvedOptions.forEach(register)\n    if (value) {\n      const existing = map.get(value)\n      if (!existing) {\n        map.set(value, {\n          value,\n          label: value,\n          description: resolveDescription?.(value) ?? null,\n        })\n      }\n    }\n    return map\n  }, [asyncOptions, resolvedOptions, resolveDescription, staticOptions, value])\n\n  const availableOptions = React.useMemo(() => {\n    return Array.from(optionMap.values())\n  }, [optionMap])\n\n  React.useEffect(() => {\n    loadingRef.current = loading\n  }, [loading])\n\n  const clearBlurCloseTimer = React.useCallback(() => {\n    if (blurCloseTimerRef.current === null) return\n    window.clearTimeout(blurCloseTimerRef.current)\n    blurCloseTimerRef.current = null\n  }, [])\n\n  const resetBlurCloseState = React.useCallback(() => {\n    blurClosePendingRef.current = false\n    clearBlurCloseTimer()\n  }, [clearBlurCloseTimer])\n\n  React.useEffect(() => resetBlurCloseState, [resetBlurCloseState])\n\n  const filteredSuggestions = React.useMemo(() => {\n    const query = input.toLowerCase().trim()\n    if (!query) return availableOptions\n    return availableOptions.filter((option) => {\n      const labelMatch = option.label.toLowerCase().includes(query)\n      const descMatch = option.description?.toLowerCase().includes(query)\n      return labelMatch || Boolean(descMatch)\n    })\n  }, [availableOptions, input])\n\n  React.useEffect(() => {\n    if (!loadSuggestions || !touched || disabled) return\n    const query = input.trim()\n    let cancelled = false\n    const handle = window.setTimeout(() => {\n      setLoading(true)\n      Promise.resolve()\n        .then(() => loadSuggestions(query))\n        .then((items) => {\n          if (!cancelled) {\n            const normalized = normalizeOptions(items)\n            setAsyncOptions((prev) => areOptionsEqual(prev, normalized) ? prev : normalized)\n          }\n        })\n        .catch(() => {})\n        .finally(() => {\n          if (!cancelled) setLoading(false)\n        })\n    }, 200)\n    return () => {\n      cancelled = true\n      window.clearTimeout(handle)\n    }\n  }, [disabled, input, loadSuggestions, touched])\n\n  // Eagerly resolve a pre-selected value to its label without requiring the user\n  // to focus the field. Runs once per value when it is not already covered.\n  const eagerResolveLabel = typeof resolveLabel === 'function' ? resolveLabel : undefined\n  React.useEffect(() => {\n    if (!value || disabled) return\n    let cancelled = false\n    const apply = (label?: string | null, description?: string | null) => {\n      const clean = typeof label === 'string' ? label.trim() : ''\n      if (cancelled || !clean || clean === value) return\n      setResolvedOptions((prev) => {\n        if (prev.some((option) => option.value === value && option.label === clean)) return prev\n        return [...prev.filter((option) => option.value !== value), { value, label: clean, description: description ?? null }]\n      })\n    }\n    if (eagerResolveLabel) {\n      if (knownLabelValues.has(value)) return\n      Promise.resolve()\n        .then(() => eagerResolveLabel(value))\n        .then((label) => apply(label, resolveDescription?.(value)))\n        .catch(() => {})\n      return () => { cancelled = true }\n    }\n    if (coveredOptionValues.has(value)) return\n    if (eagerFallbackLoadedValueRef.current === value) return\n    eagerFallbackLoadedValueRef.current = value\n    // Fallback: pull the first page of async suggestions so a remount that lost\n    // its option cache can still recover the label without user interaction.\n    // Note: if the loader is paginated and the value falls outside the first page,\n    // the fallback silently fails and the raw value remains visible.\n    if (loadSuggestions) {\n      setLoading(true)\n      Promise.resolve()\n        .then(() => loadSuggestions())\n        .then((items) => {\n          if (cancelled) return\n          const normalized = normalizeOptions(items)\n          setAsyncOptions((prev) => areOptionsEqual(prev, normalized) ? prev : normalized)\n        })\n        .catch(() => {})\n        .finally(() => { if (!cancelled) setLoading(false) })\n    }\n    return () => { cancelled = true }\n  // eslint-disable-next-line react-hooks/exhaustive-deps -- resolveDescription intentionally excluded:\n  // including it would re-run the effect on every render when the prop is an inline function\n  }, [value, disabled, knownLabelValues, coveredOptionValues, eagerResolveLabel, loadSuggestions])\n\n  // Sync input with a value that changed outside the component. A focused field is\n  // synced too, because `autoFocus` can focus the control before an async default value\n  // arrives and a focus-only guard then leaves the control rendering an empty label for\n  // a value the form has already committed. Two conditions still block the sync:\n  //   - the user is typing, so their query is never clobbered mid-keystroke;\n  //   - `optionMap` only holds the self-mapping placeholder it synthesises for an\n  //     uncovered value, which would paint the raw record id over a label the user just\n  //     picked (`asyncOptions` is replaced on every load, so any follow-up load that\n  //     misses the picked entry \u2014 a failed request, a debounce race, a composite label\n  //     the route's `?search=` cannot match \u2014 drops it back to the placeholder).\n  React.useEffect(() => {\n    const option = optionMap.get(value)\n    const hasRealLabel = Boolean(option && option.label !== option.value)\n    if (document.activeElement === inputRef.current && (userTypedRef.current || !hasRealLabel)) return\n    setInput(option?.label ?? value ?? '')\n  }, [value, optionMap])\n\n  const selectValue = React.useCallback(\n    (nextValue: string) => {\n      if (disabled) return\n      resetBlurCloseState()\n      const trimmed = nextValue.trim()\n      onChange(trimmed)\n      const option = optionMap.get(trimmed)\n      setInput(option?.label ?? trimmed)\n      setShowSuggestions(false)\n      setSelectedIndex(-1)\n      userTypedRef.current = false\n    },\n    [disabled, onChange, optionMap, resetBlurCloseState]\n  )\n\n  const findOptionForInput = React.useCallback(\n    (raw: string): ComboboxOption | null => {\n      const query = raw.trim().toLowerCase()\n      if (!query) return null\n      for (const option of optionMap.values()) {\n        if (option.value === raw.trim()) return option\n        if (option.label.toLowerCase() === query) return option\n      }\n      return null\n    },\n    [optionMap]\n  )\n\n  const confirmSelection = React.useCallback(\n    (raw: string) => {\n      if (disabled) return\n      if (clearable && raw.trim() === '') {\n        selectValue('')\n        return\n      }\n      const option = findOptionForInput(raw)\n      if (option) {\n        selectValue(option.value)\n        return\n      }\n      if (!allowCustomValues) {\n        // Revert to the current value's label \u2014 but only if we actually know it.\n        // Baking the raw value back in while eager resolution is still pending\n        // would freeze a placeholder (e.g. a UUID) into the visible input.\n        setShowSuggestions(false)\n        const currentOption = optionMap.get(value)\n        if (currentOption && currentOption.label !== currentOption.value) {\n          setInput(currentOption.label)\n        } else if (!value) {\n          setInput('')\n        }\n        return\n      }\n      selectValue(raw)\n    },\n    [allowCustomValues, clearable, disabled, findOptionForInput, optionMap, selectValue, value]\n  )\n\n  const handleClear = React.useCallback(() => {\n    if (disabled) return\n    selectValue('')\n    inputRef.current?.focus()\n  }, [disabled, selectValue])\n\n  const closeAfterBlur = React.useCallback(() => {\n    blurCloseTimerRef.current = null\n    if (disabled) return\n    blurClosePendingRef.current = false\n    confirmSelection(input)\n    setShowSuggestions(false)\n    setSelectedIndex(-1)\n  }, [confirmSelection, disabled, input])\n\n  const attemptBlurClose = React.useCallback(() => {\n    blurCloseTimerRef.current = null\n    if (disabled) return\n    if (loadingRef.current) {\n      blurCloseTimerRef.current = window.setTimeout(closeAfterBlur, blurCloseMaxDelayMs)\n      return\n    }\n    closeAfterBlur()\n  }, [blurCloseMaxDelayMs, closeAfterBlur, disabled])\n\n  React.useEffect(() => {\n    if (!blurClosePendingRef.current) return\n    if (loading) return\n    clearBlurCloseTimer()\n    closeAfterBlur()\n  }, [clearBlurCloseTimer, closeAfterBlur, loading])\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (disabled) return\n\n      if (event.key === 'ArrowDown') {\n        event.preventDefault()\n        if (!showSuggestions) {\n          setShowSuggestions(true)\n          setSelectedIndex(0)\n        } else {\n          setSelectedIndex((prev) => Math.min(prev + 1, filteredSuggestions.length - 1))\n        }\n      } else if (event.key === 'ArrowUp') {\n        event.preventDefault()\n        setSelectedIndex((prev) => Math.max(prev - 1, -1))\n      } else if (event.key === 'Enter') {\n        event.preventDefault()\n        if (selectedIndex >= 0 && filteredSuggestions[selectedIndex]) {\n          selectValue(filteredSuggestions[selectedIndex].value)\n        } else {\n          confirmSelection(input)\n        }\n      } else if (event.key === 'Escape') {\n        if (!showSuggestions) return\n        event.preventDefault()\n        event.stopPropagation()\n        setShowSuggestions(false)\n        setSelectedIndex(-1)\n      }\n    },\n    [confirmSelection, disabled, filteredSuggestions, input, selectValue, selectedIndex, showSuggestions]\n  )\n\n  const optionDomId = React.useCallback(\n    (index: number) => `${listboxId}-option-${index}`,\n    [listboxId],\n  )\n\n  React.useEffect(() => {\n    if (selectedIndex < 0 || !showSuggestions) return\n    const activeElement = typeof document !== 'undefined'\n      ? document.getElementById(optionDomId(selectedIndex))\n      : null\n    if (typeof activeElement?.scrollIntoView === 'function') {\n      activeElement.scrollIntoView({ block: 'nearest' })\n    }\n  }, [optionDomId, selectedIndex, showSuggestions])\n\n  const showClearButton = clearable && !disabled && (value !== '' || input !== '')\n  const listboxVisible = showSuggestions\n    && !disabled\n    && (loading || filteredSuggestions.length > 0 || (touched && input.trim().length > 0))\n\n  return (\n    <div className=\"relative w-full\">\n      {/* Use raw <input> here instead of the DS Input primitive: ComboboxInput's\n          focus / suggestions-popup interplay relies on the trigger being a plain\n          input element. The DS wrapper introduces a <div> that desyncs autocomplete\n          on this specific surface. Keeps the rest of the form on Input primitive. */}\n      <input\n        ref={inputRef}\n        type=\"text\"\n        className={[\n          'w-full h-9 rounded-md border border-input bg-background px-3 text-sm shadow-xs transition-colors outline-none placeholder:text-muted-foreground focus-visible:shadow-focus focus-visible:border-foreground disabled:bg-bg-disabled disabled:border-border-disabled disabled:text-muted-foreground disabled:cursor-not-allowed',\n          showClearButton ? 'pr-9' : '',\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        value={input}\n        placeholder={resolvedPlaceholder}\n        autoFocus={autoFocus}\n        data-crud-focus-target=\"\"\n        disabled={disabled}\n        role=\"combobox\"\n        aria-expanded={listboxVisible}\n        aria-controls={listboxVisible && !loading && filteredSuggestions.length > 0 ? listboxId : undefined}\n        aria-autocomplete=\"list\"\n        aria-activedescendant={listboxVisible && selectedIndex >= 0 ? optionDomId(selectedIndex) : undefined}\n        onFocus={() => {\n          setTouched(true)\n          if (suppressOpenOnFocusRef.current) {\n            suppressOpenOnFocusRef.current = false\n            return\n          }\n          resetBlurCloseState()\n          if (loadSuggestions && availableOptions.length === 0) {\n            setLoading(true)\n          }\n          setShowSuggestions(true)\n        }}\n        onChange={(event) => {\n          setTouched(true)\n          userTypedRef.current = true\n          setInput(event.target.value)\n          setShowSuggestions(true)\n          setSelectedIndex(-1)\n        }}\n        onKeyDown={handleKeyDown}\n        onBlur={() => {\n          // Delay closing so clicks on the popup can resolve first. If async\n          // suggestions are still loading, keep the dropdown open instead of\n          // closing before the first payload arrives.\n          userTypedRef.current = false\n          blurClosePendingRef.current = true\n          clearBlurCloseTimer()\n          if (loadingRef.current) {\n            blurCloseTimerRef.current = window.setTimeout(closeAfterBlur, blurCloseMaxDelayMs)\n            return\n          }\n          blurCloseTimerRef.current = window.setTimeout(attemptBlurClose, blurCloseDelayMs)\n        }}\n      />\n\n      {showClearButton ? (\n        <IconButton\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"xs\"\n          aria-label={resolvedClearLabel}\n          className=\"absolute right-1 top-1/2 -translate-y-1/2\"\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={handleClear}\n        >\n          <X className=\"size-3\" />\n        </IconButton>\n      ) : null}\n\n      {listboxVisible && (\n        <div\n          className=\"absolute z-popover w-full mt-1 rounded-md border border-input bg-popover p-2 shadow-md max-h-48 sm:max-h-60 overflow-auto\"\n        >\n          {loading && touched ? (\n            <div className=\"px-2 py-1.5 text-xs text-muted-foreground\" role=\"status\">{loadingLabel}</div>\n          ) : touched && !filteredSuggestions.length ? (\n            <div className=\"px-2 py-1.5 text-xs text-muted-foreground\" role=\"status\">{noMatchesLabel}</div>\n          ) : (\n            <div id={listboxId} role=\"listbox\" className=\"flex flex-col gap-1\">\n              {filteredSuggestions.map((option, index) => (\n                <Button\n                  key={option.value}\n                  id={optionDomId(index)}\n                  type=\"button\"\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  role=\"option\"\n                  aria-selected={index === selectedIndex}\n                  className={[\n                    'w-full h-auto justify-start font-normal text-left flex flex-col items-start rounded-lg p-2',\n                    index === selectedIndex ? 'bg-muted' : '',\n                  ]\n                    .filter(Boolean)\n                    .join(' ')}\n                  onMouseDown={(event) => event.preventDefault()}\n                  onClick={() => {\n                    resetBlurCloseState()\n                    selectValue(option.value)\n                  }}\n                  onMouseEnter={() => setSelectedIndex(index)}\n                >\n                  <span className=\"font-medium text-foreground\">{option.label}</span>\n                  {option.description ? (\n                    <span className=\"text-xs text-muted-foreground\">{option.description}</span>\n                  ) : null}\n                </Button>\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-mercato/ui",
-  "version": "0.6.8-develop.7031.1.005201cd70",
+  "version": "0.6.8-develop.7037.1.ea0277b01e",
   "license": "MIT",
   "type": "module",
   "main": "./dist/index.js",
@@ -155,14 +155,14 @@
     "remark-gfm": "^4.0.1"
   },
   "peerDependencies": {
-    "@open-mercato/shared": "0.6.8-develop.7031.1.005201cd70",
+    "@open-mercato/shared": "0.6.8-develop.7037.1.ea0277b01e",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0",
     "react-is": ">=18.0.0"
   },
   "devDependencies": {
     "@figma/code-connect": "^1.3.4",
-    "@open-mercato/shared": "0.6.8-develop.7031.1.005201cd70",
+    "@open-mercato/shared": "0.6.8-develop.7037.1.ea0277b01e",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^7.0.0",
     "@testing-library/react": "^16.3.1",

package/src/backend/inputs/ComboboxInput.tsx

@@ -100,6 +100,10 @@ export function ComboboxInput({
   const blurClosePendingRef = React.useRef(false)
   const suppressOpenOnFocusRef = React.useRef(Boolean(autoFocus && !disabled))
   const eagerFallbackLoadedValueRef = React.useRef<string | null>(null)
+  // Tracks whether the user actually typed into the field during the current focus
+  // session. `touched` cannot serve this purpose because it is set by `onFocus`,
+  // which `autoFocus` triggers before the user does anything at all.
+  const userTypedRef = React.useRef(false)
 
   const staticOptions = React.useMemo(
     () => normalizeOptions([...(seedOptions ?? []), ...(suggestions ?? [])]),
@@ -247,12 +251,21 @@ export function ComboboxInput({
   // including it would re-run the effect on every render when the prop is an inline function
   }, [value, disabled, knownLabelValues, coveredOptionValues, eagerResolveLabel, loadSuggestions])
 
-  // Sync input with value when value changes externally and input is not focused.
+  // Sync input with a value that changed outside the component. A focused field is
+  // synced too, because `autoFocus` can focus the control before an async default value
+  // arrives and a focus-only guard then leaves the control rendering an empty label for
+  // a value the form has already committed. Two conditions still block the sync:
+  //   - the user is typing, so their query is never clobbered mid-keystroke;
+  //   - `optionMap` only holds the self-mapping placeholder it synthesises for an
+  //     uncovered value, which would paint the raw record id over a label the user just
+  //     picked (`asyncOptions` is replaced on every load, so any follow-up load that
+  //     misses the picked entry — a failed request, a debounce race, a composite label
+  //     the route's `?search=` cannot match — drops it back to the placeholder).
   React.useEffect(() => {
-    if (document.activeElement !== inputRef.current) {
-      const option = optionMap.get(value)
-      setInput(option?.label ?? value ?? '')
-    }
+    const option = optionMap.get(value)
+    const hasRealLabel = Boolean(option && option.label !== option.value)
+    if (document.activeElement === inputRef.current && (userTypedRef.current || !hasRealLabel)) return
+    setInput(option?.label ?? value ?? '')
   }, [value, optionMap])
 
   const selectValue = React.useCallback(
@@ -265,6 +278,7 @@ export function ComboboxInput({
       setInput(option?.label ?? trimmed)
       setShowSuggestions(false)
       setSelectedIndex(-1)
+      userTypedRef.current = false
     },
     [disabled, onChange, optionMap, resetBlurCloseState]
   )
@@ -436,6 +450,7 @@ export function ComboboxInput({
         }}
         onChange={(event) => {
           setTouched(true)
+          userTypedRef.current = true
           setInput(event.target.value)
           setShowSuggestions(true)
           setSelectedIndex(-1)
@@ -445,6 +460,7 @@ export function ComboboxInput({
           // Delay closing so clicks on the popup can resolve first. If async
           // suggestions are still loading, keep the dropdown open instead of
           // closing before the first payload arrives.
+          userTypedRef.current = false
           blurClosePendingRef.current = true
           clearBlurCloseTimer()
           if (loadingRef.current) {

package/src/backend/inputs/__tests__/ComboboxInput.test.tsx

@@ -396,6 +396,148 @@ describe('ComboboxInput — eager label resolution', () => {
     rerender(<ComboboxInput value="b" onChange={() => {}} resolveLabel={resolveLabel} />)
     await waitFor(() => expect(getInput(container).value).toBe('Label-b'))
   })
+
+  it('shows a default value that arrives after autoFocus already took the field', async () => {
+    const options = [{ value: 'wh-1', label: 'Central warehouse' }]
+    const { container, rerender } = render(
+      <ComboboxInput value="" onChange={() => {}} autoFocus seedOptions={options} />,
+    )
+    expect(document.activeElement).toBe(getInput(container))
+    rerender(<ComboboxInput value="wh-1" onChange={() => {}} autoFocus seedOptions={options} />)
+    await waitFor(() => expect(getInput(container).value).toBe('Central warehouse'))
+  })
+
+  // Guards the opposite direction of the case above: it passes on both the old
+  // focus-based guard and the current typing-based one, so it is a behavior pin
+  // rather than a regression test for any specific bug.
+  it('does not overwrite the query while the user is typing into a focused field', async () => {
+    const options = [
+      { value: 'red', label: 'Red' },
+      { value: 'green', label: 'Green' },
+    ]
+    const { container, rerender } = render(
+      <ComboboxInput value="red" onChange={() => {}} seedOptions={options} />,
+    )
+    await waitFor(() => expect(getInput(container).value).toBe('Red'))
+    const input = getInput(container)
+    act(() => {
+      input.focus()
+      fireEvent.change(input, { target: { value: 'gre' } })
+    })
+    rerender(<ComboboxInput value="green" onChange={() => {}} seedOptions={options} />)
+    expect(getInput(container).value).toBe('gre')
+  })
+
+  // The regression the typing-based guard originally introduced: `selectValue` clears
+  // `userTypedRef` while the field keeps focus, so a follow-up load that no longer
+  // carries the picked option let the self-mapping placeholder overwrite the label with
+  // the raw record id. Fails on the intermediate implementation, passes on this one.
+  it('keeps a picked label when a follow-up load drops the option from the list', async () => {
+    const loadSuggestions = jest.fn(async (query?: string) =>
+      query === 'WH-B' ? [{ value: 'wh-b', label: 'Warehouse B (WH-B)' }] : [],
+    )
+    function Controlled() {
+      const [value, setValue] = React.useState('')
+      return (
+        <ComboboxInput
+          value={value}
+          onChange={setValue}
+          loadSuggestions={loadSuggestions}
+          allowCustomValues={false}
+        />
+      )
+    }
+    const { container } = render(<Controlled />)
+    const input = getInput(container)
+    act(() => {
+      input.focus()
+      fireEvent.change(input, { target: { value: 'WH-B' } })
+    })
+
+    const option = await screen.findByRole('option', { name: /Warehouse B \(WH-B\)/ })
+    act(() => {
+      fireEvent.click(option)
+    })
+    expect(getInput(container).value).toBe('Warehouse B (WH-B)')
+    expect(document.activeElement).toBe(getInput(container))
+
+    // Picking rewrote the query to the label, which re-fires the debounced loader; the
+    // route cannot match a composite label, so the option list comes back empty.
+    await waitFor(() => expect(loadSuggestions).toHaveBeenCalledWith('Warehouse B (WH-B)'))
+    await act(async () => {
+      await new Promise((res) => setTimeout(res, 250))
+    })
+    expect(getInput(container).value).toBe('Warehouse B (WH-B)')
+  })
+
+  it('adopts a real label that arrives while the field is focused', async () => {
+    const { container, rerender } = render(
+      <ComboboxInput value="wh-1" onChange={() => {}} seedOptions={[]} />,
+    )
+    const input = getInput(container)
+    act(() => {
+      input.focus()
+    })
+    expect(getInput(container).value).toBe('wh-1')
+
+    rerender(
+      <ComboboxInput
+        value="wh-1"
+        onChange={() => {}}
+        seedOptions={[{ value: 'wh-1', label: 'Central warehouse' }]}
+      />,
+    )
+    await waitFor(() => expect(getInput(container).value).toBe('Central warehouse'))
+  })
+
+  it('does not resurrect the previous label when the parent keeps the value after a clear', () => {
+    const onChange = jest.fn()
+    const { container } = render(
+      <ComboboxInput
+        value="red"
+        onChange={onChange}
+        clearable
+        seedOptions={[{ value: 'red', label: 'Red' }]}
+      />,
+    )
+    expect(getInput(container).value).toBe('Red')
+
+    act(() => {
+      fireEvent.click(screen.getByRole('button', { name: /clear value/i }))
+    })
+
+    expect(onChange).toHaveBeenCalledWith('')
+    expect(getInput(container).value).toBe('')
+  })
+
+  it('resumes syncing after a blur, so a later external change is not mistaken for typing', async () => {
+    const options = [
+      { value: 'red', label: 'Red' },
+      { value: 'green', label: 'Green' },
+    ]
+    const { container, rerender } = render(
+      <ComboboxInput value="red" onChange={() => {}} seedOptions={options} allowCustomValues={false} />,
+    )
+    const input = getInput(container)
+    act(() => {
+      input.focus()
+      fireEvent.change(input, { target: { value: 'gre' } })
+    })
+    expect(getInput(container).value).toBe('gre')
+
+    act(() => {
+      fireEvent.blur(input)
+    })
+    await waitFor(() => expect(getInput(container).value).toBe('Red'))
+
+    act(() => {
+      getInput(container).focus()
+    })
+    rerender(
+      <ComboboxInput value="green" onChange={() => {}} seedOptions={options} allowCustomValues={false} />,
+    )
+    await waitFor(() => expect(getInput(container).value).toBe('Green'))
+  })
 })
 
 describe('ComboboxInput accessibility', () => {