MenuItem in any level #2749
Closed
MenuItem in any level #2749
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This was
linked to
issues
Jan 28, 2022
khlutkova
force-pushed
the
menu-item-next
branch
from
82464c3
to
f3f609e
Compare
khlutkova
force-pushed
the
menu-item-next
branch
from
c949029
to
8275fab
Compare
|
@zhzz А почему это изменение для |
khlutkova
force-pushed
the
menu-item-next
branch
from
51b32b4
to
f122a62
Compare
JackUait
suggested changes
Mar 2, 2022
packages/react-ui/internal/InternalMenu/__tests__/InternalMenu-test.tsx
Outdated
Show resolved
Hide resolved
Comment on lines
273
to
332
| private highlight = (key: string | undefined) => { | ||
| this.setState({ highlightedKey: key }); | ||
| getRootNode(this)?.focus(); | ||
| }; | ||
|
|
||
| private unhighlight = () => { | ||
| this.setState({ highlightedIndex: -1 }); | ||
| }; | ||
|
|
||
| private move(step: number) { | ||
| this.setState((state, props) => { | ||
| const children = childrenToArray(props.children); | ||
| if (!children.some(isActiveElement)) { | ||
| return null; | ||
| } | ||
| let index = state.highlightedIndex; | ||
| do { | ||
| index += step; | ||
| if (!props.cyclicSelection && (index < 0 || index > children.length)) { | ||
| return null; | ||
| } | ||
| const menuItems = this.menuItems; | ||
| if (!menuItems.length) { | ||
| return; | ||
| } | ||
|
|
||
| if (index < 0) { | ||
| index = children.length - 1; | ||
| } else if (index > children.length) { | ||
| index = 0; | ||
| } | ||
| let highlightedIndex = -1; | ||
| if (this.state.highlightedKey) { | ||
| highlightedIndex = this.menuItems.findIndex((item) => item.key === this.state.highlightedKey); | ||
| } | ||
|
|
||
| const child = children[index]; | ||
| if (isActiveElement(child)) { | ||
| return { highlightedIndex: index }; | ||
| } | ||
| } while (index !== state.highlightedIndex); | ||
| return null; | ||
| }, this.scrollToSelected); | ||
| const newHighlightedIndex = highlightedIndex + step; | ||
| if (newHighlightedIndex < 0) { | ||
| this.setState({ highlightedKey: menuItems[menuItems.length - 1].key }); | ||
| this.scrollToBottom(); | ||
| return; | ||
| } | ||
|
|
||
| if (newHighlightedIndex >= menuItems.length) { | ||
| this.setState({ highlightedKey: menuItems[0].key }); | ||
| this.scrollToTop(); | ||
| return; | ||
| } | ||
|
|
||
| this.setState({ highlightedKey: menuItems[newHighlightedIndex].key }); | ||
|
|
||
| switch (newHighlightedIndex) { | ||
| case 0: | ||
| this.scrollToTop(); | ||
| break; | ||
| case menuItems.length - 1: | ||
| this.scrollToBottom(); | ||
| break; | ||
| default: | ||
| this.scrollToSelected(); | ||
| } | ||
| } | ||
|
|
||
| private scrollToSelected = () => { | ||
| if (this.scrollContainer && this.highlighted) { | ||
| this.scrollContainer.scrollTo(getRootNode(this.highlighted)); | ||
| } | ||
| }; | ||
|
|
||
| private scrollToTop = () => { | ||
| if (this.scrollContainer) { | ||
| this.scrollContainer.scrollToTop(); | ||
| } | ||
| }; | ||
|
|
||
| private scrollToBottom = () => { | ||
| if (this.scrollContainer) { | ||
| this.scrollContainer.scrollToBottom(); | ||
| } | ||
| }; |
There was a problem hiding this comment.
Эта логика идентична логике из Menu. Нужно переиспользовать её. Это потенциальное место для большого количества багов.
There was a problem hiding this comment.
Про идентичность согласна.
Но на будущее есть задача про унификацию меню-подобных компонентов, в рамках которой и хотела избавиться от копипасты.
Подумаю, что и как можно сделать на текущем этапе.
packages/react-ui/internal/CustomComboBox/CustomComboBoxReducer.tsx
Outdated
Show resolved
Hide resolved
|
Нужно удалить лишние комментарии. |
|
Везде где используются значения из |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Актуальный пр