Skip to content

Commit

Permalink
[EuiComboBox] Remove AutosizeInput references + update snapshots
Browse files Browse the repository at this point in the history
  • Loading branch information
@cee-chen
cee-chen committed Sep 25, 2023
1 parent 9e1f804 commit 784d91e
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 65 deletions.
73 changes: 23 additions & 50 deletions src/components/combo_box/__snapshots__/combo_box.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,26 +16,19 @@ exports[`EuiComboBox is rendered 1`] = `
data-test-subj="comboBoxInput"
tabindex="-1"
>
<div
<input
aria-autocomplete="list"
aria-controls=""
aria-expanded="false"
aria-invalid="false"
aria-label="aria-label"
class="euiComboBox__input"
style="font-size: 14px; display: inline-block;"
>
<input
aria-autocomplete="list"
aria-controls=""
aria-expanded="false"
aria-invalid="false"
aria-label="aria-label"
data-test-subj="comboBoxSearchInput"
id="generated-id__eui-combobox-id"
role="combobox"
style="box-sizing: content-box; width: 2px;"
value=""
/>
<div
style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-size: 14px; font-family: 'Inter',BlinkMacSystemFont,Helvetica,Arial,sans-serif; font-weight: 400; letter-spacing: normal; text-transform: none;"
/>
</div>
data-test-subj="comboBoxSearchInput"
id="generated-id__eui-combobox-id"
role="combobox"
style="inline-size: 2px;"
value=""
/>
</div>
<div
class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
Expand Down Expand Up @@ -67,7 +60,6 @@ exports[`props aria-label attribute is rendered 1`] = `
>
<EuiComboBoxInput
aria-label="Test label"
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={false}
Expand Down Expand Up @@ -102,7 +94,6 @@ exports[`props aria-labelledby attribute is rendered 1`] = `
>
<EuiComboBoxInput
aria-labelledby="test-heading-id"
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={false}
Expand Down Expand Up @@ -136,7 +127,6 @@ exports[`props autoFocus is rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -179,7 +169,6 @@ exports[`props custom ID is rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -222,7 +211,6 @@ exports[`props delimiter is rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -265,7 +253,6 @@ exports[`props full width is rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={true}
hasSelectedOptions={true}
Expand Down Expand Up @@ -305,7 +292,6 @@ exports[`props isClearable=false disallows user from clearing input when no opti
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={false}
Expand Down Expand Up @@ -338,7 +324,6 @@ exports[`props isClearable=false disallows user from clearing input when options
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -380,7 +365,6 @@ exports[`props isDisabled is rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -635,25 +619,18 @@ exports[`props options list is rendered 1`] = `
data-test-subj="comboBoxInput"
tabindex="-1"
>
<div
<input
aria-autocomplete="list"
aria-controls="generated-id_listbox"
aria-expanded="true"
aria-invalid="false"
class="euiComboBox__input"
style="font-size: 14px; display: inline-block;"
>
<input
aria-autocomplete="list"
aria-controls="generated-id_listbox"
aria-expanded="true"
aria-invalid="false"
data-test-subj="comboBoxSearchInput"
id="generated-id__eui-combobox-id"
role="combobox"
style="box-sizing: content-box; width: 2px;"
value=""
/>
<div
style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
/>
</div>
data-test-subj="comboBoxSearchInput"
id="generated-id__eui-combobox-id"
role="combobox"
style="inline-size: 2px;"
value=""
/>
</div>
<div
class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
Expand Down Expand Up @@ -952,7 +929,6 @@ exports[`props selectedOptions are rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -995,7 +971,6 @@ exports[`props singleSelection is rendered 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down Expand Up @@ -1036,7 +1011,6 @@ exports[`props singleSelection prepend and append is rendered 1`] = `
>
<EuiComboBoxInput
append="String"
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={false}
Expand Down Expand Up @@ -1079,7 +1053,6 @@ exports[`props singleSelection selects existing option when opened 1`] = `
onKeyDown={[Function]}
>
<EuiComboBoxInput
autoSizeInputRef={[Function]}
compressed={false}
fullWidth={false}
hasSelectedOptions={true}
Expand Down
15 changes: 0 additions & 15 deletions src/components/combo_box/combo_box.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ import React, {
RefCallback,
} from 'react';
import classNames from 'classnames';
import AutosizeInput from 'react-input-autosize';

import { findPopoverPosition, htmlIdGenerator, keys } from '../../services';
import { getElementZIndex } from '../../services/popover';
Expand Down Expand Up @@ -256,12 +255,6 @@ export class EuiComboBox<T> extends Component<
});
}
};
autoSizeInputRefInstance: RefInstance<AutosizeInput & HTMLDivElement> = null;
autoSizeInputRefCallback: RefCallback<AutosizeInput & HTMLDivElement> = (
ref
) => {
this.autoSizeInputRefInstance = ref;
};

searchInputRefInstance: RefInstance<HTMLInputElement> = null;
searchInputRefCallback: RefCallback<HTMLInputElement> = (ref) => {
Expand Down Expand Up @@ -787,13 +780,6 @@ export class EuiComboBox<T> extends Component<

componentDidMount() {
this._isMounted = true;

// TODO: This will need to be called once the actual stylesheet loads.
setTimeout(() => {
if (this.autoSizeInputRefInstance) {
this.autoSizeInputRefInstance.copyInputStyles();
}
}, 100);
}

static getDerivedStateFromProps<T>(
Expand Down Expand Up @@ -1044,7 +1030,6 @@ export class EuiComboBox<T> extends Component<
ref={this.comboBoxRefCallback}
>
<EuiComboBoxInput
autoSizeInputRef={this.autoSizeInputRefCallback}
compressed={compressed}
focusedOptionId={
this.hasActiveOption()
Expand Down

0 comments on commit 784d91e

Please sign in to comment.