toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2024-12-23 10:42:00 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #261 from caleboleary/bugfix/fix-select-enter-key

Browse Source 
fix(component): make Select close when option chosen with Enter key
This commit is contained in:
Qi 2022-08-26 13:48:25 +08:00 committed by GitHub
commit 77e3513d6d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
libs/components/ui/src/select/Select.tsx
View File

@ -1,5 +1,6 @@
import {
forwardRef,
useState,
type CSSProperties,
type ForwardedRef,
type ReactNode,
@ -39,6 +40,7 @@ export const Select = forwardRef(function CustomSelect<TValue>(
props: ExtendSelectProps & SelectUnstyledProps<TValue>,
ref: ForwardedRef<HTMLUListElement>
) {
const [isOpen, setIsOpen] = useState(false);
const { width = '100%', style, listboxStyle, placeholder } = props;
const components: SelectUnstyledProps<TValue>['components'] = {
// Root: generateStyledRoot({ width, ...style }),
@ -76,7 +78,21 @@ export const Select = forwardRef(function CustomSelect<TValue>(
...props.components,
};
return <SelectUnstyled {...props} ref={ref} components={components} />;
return (
<SelectUnstyled
listboxOpen={isOpen}
onListboxOpenChange={() => {
setIsOpen(true);
}}
{...props}
onChange={v => {
setIsOpen(false);
props.onChange && props.onChange(v);
}}
ref={ref}
components={components}
/>
);
}) as <TValue>(
props: ExtendSelectProps &
SelectUnstyledProps<TValue> &