Skip to content

Commit f330a1e

Browse files
committed
fix(Select): clear select field only when clearable is set to true
1 parent 5915870 commit f330a1e

File tree

2 files changed

+24
-2
lines changed

2 files changed

+24
-2
lines changed

src/app/components/select/select.mdx

+18
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,24 @@ The Select contain an additional Hooks, see subsection [useModal](/hooks/use-mod
8383
`}
8484
/>
8585

86+
<Playground
87+
title="Clearable"
88+
desc="Allow clearing the selected value(s)."
89+
scope={{ Select }}
90+
code={`
91+
<>
92+
<Select
93+
placeholder="Select a value"
94+
clearable={true}
95+
>
96+
<Select.Option value="1">Option 1</Select.Option>
97+
<Select.Option value="2">Option 2</Select.Option>
98+
<Select.Option value="3">Option 3</Select.Option>
99+
</Select>
100+
</>
101+
`}
102+
/>
103+
86104
<Playground
87105
title="Without Icon"
88106
desc="Hide icon on right."

src/components/select/select.tsx

+6-2
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ const SelectComponent = React.forwardRef<SelectRef, React.PropsWithChildren<Sele
5454
pure = false,
5555
multiple = false,
5656
hasBorder = true,
57-
clearable = true,
57+
clearable = false,
5858
placeholder,
5959
className = '',
6060
dropdownClassName,
@@ -86,10 +86,14 @@ const SelectComponent = React.forwardRef<SelectRef, React.PropsWithChildren<Sele
8686
onDropdownVisibleChange(next);
8787
setVisible(next);
8888
};
89+
8990
const updateValue = (next: string) => {
9091
setValue(last => {
9192
if (!Array.isArray(last)) {
92-
return last === next ? undefined : next;
93+
if (clearable && last === next) {
94+
return undefined;
95+
}
96+
return next;
9397
}
9498
if (!last.includes(next)) return [...last, next];
9599
return last.filter(item => item !== next);

0 commit comments

Comments
 (0)