diff --git a/packages/components/src/spectrum/comboBox/ComboBox.tsx b/packages/components/src/spectrum/comboBox/ComboBox.tsx index 75baff7de..98d36cdff 100644 --- a/packages/components/src/spectrum/comboBox/ComboBox.tsx +++ b/packages/components/src/spectrum/comboBox/ComboBox.tsx @@ -1,3 +1,4 @@ +import React from 'react'; import { ComboBox as SpectrumComboBox, SpectrumComboBoxProps, @@ -9,24 +10,19 @@ import { PickerPropsT, usePickerProps } from '../picker'; export type ComboBoxProps = PickerPropsT>; -export function ComboBox({ - UNSAFE_className, - ...props -}: ComboBoxProps): JSX.Element { - const { - defaultSelectedKey, - disabledKeys, - ref, - selectedKey, - ...comboBoxProps - } = usePickerProps(props); +export const ComboBox = React.forwardRef(function ComboBox( + { UNSAFE_className, ...props }: ComboBoxProps, + ref: FocusableRef +): JSX.Element { + const { defaultSelectedKey, disabledKeys, selectedKey, ...comboBoxProps } = + usePickerProps(props); return ( } + ref={ref} // Type assertions are necessary here since Spectrum types don't account // for number and boolean key values even though they are valid runtime // values. @@ -41,4 +37,4 @@ export function ComboBox({ } /> ); -} +});