-
Notifications
You must be signed in to change notification settings - Fork 2
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
YH-474: add dropdown #321
base: develop
Are you sure you want to change the base?
YH-474: add dropdown #321
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
}; | ||
|
||
return ( | ||
<div> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
пустой див нужен?
size === 'S' ? styles['option-s'] : styles['option-l'], | ||
); | ||
|
||
const [selectedOption, setSelectedOption] = useState<DropdownOption | null>(null); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
тут лучше максимально наверх выносить все
у дропдавна не должно быть внутренних стейтов, все хэндлеры и стейты приходят извне
return ( | ||
<ul ref={ref} className={`${dropdownStyle} ${positionStyle}`} role="listbox"> | ||
{options.map((option) => ( | ||
<DropdownOptions |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Option - единственное число, убрать s
DropdownOption
@@ -0,0 +1,6 @@ | |||
export interface DropdownOptionType { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Название без Type
value: string | number; | ||
} | ||
|
||
export type Size = 'S' | 'L'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
DropdownSize
setSelectedOption?: (option: DropdownOptionType) => void; | ||
} | ||
|
||
export const Dropdown: React.FC<DropdownProps> = ({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
FC мы не используем
suffix={ | ||
suffix || ( | ||
<Arrow | ||
className={`${isOpen ? `${styles.suffix} ${styles.active}` : styles.suffix}`} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Тут используй classNames
classNames(styles.suffix, { [styles.active]: isOpen })
isSelected: boolean; | ||
} | ||
|
||
const DropdownOption: React.FC<DropdownOptionProps> = ({ option, onClick, isSelected }) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Тоже убери FC
@@ -1 +1,3 @@ | |||
export type Size = 'L' | 'S'; | |||
|
|||
export type Variant = 'input' | 'dropdown'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
К обоим типам добавь вначале Input
No description provided.