diff --git a/src/components/inputs/Autocomplete/Autocomplete.tsx b/src/components/inputs/Autocomplete/Autocomplete.tsx index dd56fc0..de38634 100644 --- a/src/components/inputs/Autocomplete/Autocomplete.tsx +++ b/src/components/inputs/Autocomplete/Autocomplete.tsx @@ -19,10 +19,10 @@ import { import { both, concat, eqBy, has, identity, map, prop } from 'ramda' import { convertValueToOption, extractFirstValue, internalLabel, internalValue } from './utils' import Option from './Option' -import { emptyArray, emptyString } from 'components/utils/constants' import { useTrackVisibility } from 'react-intersection-observer-hook' import { AutocompleteProps, LoadOptionsPaginatedResult } from './types' -import LinearProgress from 'components/feedback/LinearProgress' +import LinearProgress from '../../feedback/LinearProgress' +import { emptyArray, emptyString } from '../../utils/constants' const baseFilter = createFilterOptions() const Autocomplete: React.FC< @@ -211,7 +211,7 @@ const Autocomplete: React.FC< > ) => { /** - * Display the loading text and attach a reference to monitor the visibility this option. + * Display the loading text and attach a reference to monitor the visibility of this option. * This should be the last option in the list. And it should only be added from the internal mechanism. * The visibility will be used to trigger the loadOptions function. */ diff --git a/src/components/inputs/Autocomplete/utils.ts b/src/components/inputs/Autocomplete/utils.ts index 7b62b6e..696333b 100644 --- a/src/components/inputs/Autocomplete/utils.ts +++ b/src/components/inputs/Autocomplete/utils.ts @@ -1,4 +1,4 @@ -import { emptyString } from 'components/utils/constants' +import { emptyString } from '../../utils/constants' import { any, curry, either, equals, find, head, isEmpty, isNil, prop, type } from 'ramda' export const isNilOrEmpty = either(isNil, isEmpty) diff --git a/src/components/themes/common/overrides/Autocomplete.ts b/src/components/themes/common/overrides/Autocomplete.ts index 529adff..a5add78 100644 --- a/src/components/themes/common/overrides/Autocomplete.ts +++ b/src/components/themes/common/overrides/Autocomplete.ts @@ -5,21 +5,22 @@ export default function Autocomplete(theme: Theme): CustomComponents { return { MuiAutocomplete: { styleOverrides: { - inputRoot: { - '& .MuiAutocomplete-input': { - width: 'fit-content', - minWidth: 'fit-content' - } - }, + inputRoot: (props: any) => + !props.ownerState.multiple && { + '& .MuiAutocomplete-input': { + width: 'fit-content', + minWidth: 'fit-content' + } + }, input: { display: 'flex', whiteSpace: 'nowrap' }, noOptions: { - ...theme.typography.defaultFont, - padding: `${theme.spacing()}px ${theme.spacing(2)}px`, - color: 'textSecondary' - }, + ...theme.typography.defaultFont, + padding: `${theme.spacing()}px ${theme.spacing(2)}px`, + color: 'textSecondary' + }, option: { div: { ...theme.typography.defaultFont,