Function ListBox

packages/react-aria/stories/combobox/example.tsx:129–150

(props)

}

function ListBox(props) {
  let ref = React.useRef(undefined);
  let {listBoxRef = ref, state} = props;
  let {listBoxProps} = useListBox(props, state, listBoxRef);

  return (
    <ul
      {...listBoxProps}
      ref={listBoxRef}
      style={{
        margin: 0,
        padding: 0,
        listStyle: 'none',
        maxHeight: '150px',
        overflow: 'auto'
      }}>
      {[...state.collection].map(item => (
        <Option key={item.key} item={item} state={state} />
      ))}
    </ul>
  );
}

function Option({item, state}) {
  let ref = React.useRef<HTMLLIElement | null>(null);