Skip to content

Commit abb62b8

Browse files
committed
fix: restore correct behavior of clear button
1 parent 4be5749 commit abb62b8

File tree

1 file changed

+15
-11
lines changed
  • packages/shared/widget-plugin-dropdown-filter/src/controls/select

1 file changed

+15
-11
lines changed

packages/shared/widget-plugin-dropdown-filter/src/controls/select/Select.tsx

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,9 @@ import { useSelect, UseSelectProps } from "downshift";
33
import { observer } from "mobx-react-lite";
44
import React, { createElement, useRef } from "react";
55
import { OptionWithState } from "../../typings/OptionWithState";
6-
import { ClearButton } from "../base/ClearButton";
76
import { OptionsWrapper } from "../base/OptionsWrapper";
87
import { useFloatingMenu } from "../hooks/useFloatingMenu";
9-
import { Arrow, classes } from "../picker-primitives";
8+
import { Arrow, classes, Cross } from "../picker-primitives";
109

1110
interface SelectProps {
1211
value: string;
@@ -52,15 +51,20 @@ export const Select = observer(function Select(props: SelectProps): React.ReactE
5251
>
5352
<span className={cls.toggle}>{props.value}</span>
5453
<div className={`${cls.root}-controls`}>
55-
<ClearButton
56-
cls={cls}
57-
onClick={() => {
58-
props.onClear();
59-
toggleRef.current?.focus();
60-
}}
61-
showSeparator={false}
62-
visible={showClear}
63-
/>
54+
{showClear && (
55+
<div
56+
className={cls.clear}
57+
tabIndex={-1}
58+
aria-label="Clear combobox"
59+
onClick={event => {
60+
event.stopPropagation();
61+
props.onClear();
62+
toggleRef.current?.focus();
63+
}}
64+
>
65+
<Cross />
66+
</div>
67+
)}
6468
<Arrow className={cls.stateIcon} />
6569
</div>
6670
</button>

0 commit comments

Comments
 (0)