import { useAutocomplete, FilterOptionsState } from '@material-ui/lab'; import { expectType } from '@material-ui/types'; interface Person { id: string; name: string; } const persons: Person[] = [ { id: '1', name: 'Chris' }, { id: '2', name: 'Kim' }, { id: '3', name: 'Ben' }, { id: '4', name: 'Matt' }, ]; // Single selection mode // value type is inferred correctly when multiple is undefined useAutocomplete({ options: ['1', '2', '3'], onChange(event, value) { expectType(value); }, }); // value type is inferred correctly when multiple is false useAutocomplete({ options: ['1', '2', '3'], multiple: false, onChange(event, value) { expectType(value); }, }); // value type is inferred correctly for type unions useAutocomplete({ options: ['1', '2', '3', 4, true], onChange(event, value) { expectType(value); }, }); // value type is inferred correctly for interface useAutocomplete({ options: persons, onChange(event, value) { expectType(value); }, }); // value type is inferred correctly when value is set useAutocomplete({ options: ['1', '2', '3'], onChange(event, value) { expectType(value); value; }, filterOptions(options, state) { expectType, typeof state>(state); expectType(options); return options; }, getOptionLabel(option) { expectType(option); return option; }, value: null, }); // Multiple selection mode // value type is inferred correctly for simple type useAutocomplete({ options: ['1', '2', '3'], multiple: true, onChange(event, value) { expectType(value); value; }, }); // value type is inferred correctly for union type useAutocomplete({ options: ['1', '2', '3', 4, true], multiple: true, onChange(event, value) { expectType, typeof value>(value); }, }); // value type is inferred correctly for interface useAutocomplete({ options: persons, multiple: true, onChange(event, value) { expectType(value); value; }, }); // no type inference conflict when value type is set explicitly useAutocomplete({ options: persons, multiple: true, onChange(event, value: Person[]) {}, }); // Disable clearable useAutocomplete({ options: ['1', '2', '3'], disableClearable: true, onChange(event, value) { expectType(value); }, }); useAutocomplete({ options: ['1', '2', '3'], disableClearable: false, onChange(event, value) { expectType(value); }, }); useAutocomplete({ options: ['1', '2', '3'], onChange(event, value) { expectType(value); }, }); // Free solo useAutocomplete({ options: persons, onChange(event, value) { expectType(value); }, freeSolo: true, }); useAutocomplete({ options: persons, disableClearable: true, onChange(event, value) { expectType(value); }, freeSolo: true, }); useAutocomplete({ options: persons, multiple: true, onChange(event, value) { expectType, typeof value>(value); }, freeSolo: true, });