diff --git a/src/drafts/InlineAutocomplete/InlineAutocomplete.tsx b/src/drafts/InlineAutocomplete/InlineAutocomplete.tsx index 189b1586aa5..1f66b24f910 100644 --- a/src/drafts/InlineAutocomplete/InlineAutocomplete.tsx +++ b/src/drafts/InlineAutocomplete/InlineAutocomplete.tsx @@ -1,6 +1,5 @@ import React, {cloneElement, useRef} from 'react' import Box from '../../Box' -import {useCombinedRefs} from '../../hooks/useCombinedRefs' import {useSyntheticChange} from '../hooks/useSyntheticChange' import Portal from '../../Portal' import {BetterSystemStyleObject} from '../../sx' @@ -14,6 +13,7 @@ import { requireChildrenToBeInput } from './utils' import AutocompleteSuggestions from './_AutocompleteSuggestions' +import {useRefObjectAsForwardedRef} from '../../hooks' export type InlineAutocompleteProps = { /** Register the triggers that can cause suggestions to appear. */ @@ -86,7 +86,9 @@ const InlineAutocomplete = ({ // Forward accessibility props so it works with FormControl ...forwardProps }: InlineAutocompleteProps & React.ComponentProps<'textarea' | 'input'>) => { - const inputRef = useCombinedRefs(children.ref) + const inputRef = useRef(null) + useRefObjectAsForwardedRef(children.ref, inputRef) + const externalInput = requireChildrenToBeInput(children, inputRef) const emitSyntheticChange = useSyntheticChange({