profile
viewpoint

AndreyLuzinov/aws-appsync-chat 0

Real-Time Offline Ready Chat App written with GraphQL, AWS AppSync, & AWS Amplify

AndreyLuzinov/downshift 0

🏎 Primitive to build simple, flexible, WAI-ARIA compliant enhanced input React components

AndreyLuzinov/react-webcomponent 0

This projects automates the wrapping of a React component in a CustomElement.

AndreyLuzinov/shadow-dom-bench 0

Compare rendering perfomance of vanila button vs button behind custom element with shadow dom.

issue openeddownshift-js/downshift

[useSelect] Dropdown doesn't get closed on selection change in case of defaultIsOpen.

  • downshift version: 6.0.6

Relevant code or config

  const {
    isOpen,
    selectedItem,
    getToggleButtonProps,
    getLabelProps,
    getMenuProps,
    highlightedIndex,
    getItemProps
  } = useSelect({ items, defaultIsOpen: true });

What you did: Set defaultIsOpen to true

What happened: Dropdownlist doesn't closed on item select (by mouse or keyboard). However I can still close it by click toggle button or click outside dropdown.

Reproduction repository:

https://codesandbox.io/s/loving-worker-sifxr?file=/src/index.js

created time in a month

pull request commentdownshift-js/downshift

Always scroll to highlighted item on open

That’s not a safe thing to do. Maybe try using the ‘disabled’ prop? And disable the items while animation. On Fri, 31 Jul 2020 at 19:30, Andrey Luzinov ***@***.***> wrote: I cannot reproduce it on sample code and I had in real project. Issue reproduced If I move mouse while list plays close animation. Which causes mutilple assignmenst like highlightedIndex = -1 and after this on list open item not scrolled. I've found workaround to fix this issue for now by disabling item props while list closing: {...(isOpen ? getItemProps({ item, index }) : {})} — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#1130 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACWAZAF5HYW3NEIRQNHP5QLR6LWRDANCNFSM4PIXPPFQ .

This also works, thanks.

AndreyLuzinov

comment created time in 3 months

PR closed downshift-js/downshift

Always scroll to highlighted item on open

<!-- What changes are being made? (What feature/bug is being fixed here?) -->

What: Ensure that list will scrolled to highlighted item on drop down open.

<!-- Why are these changes necessary? -->

Why: shouldScrollRef == false could prevent list from scrolling to highlighted item on list open.

<!-- How were these changes implemented? -->

How: Reset shouldScrollRef to true on list open state changes.

<!-- Have you done all of these things? -->

Checklist:

<!-- add "N/A" to the end of each line that's irrelevant to your changes -->

<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->

  • [ ] Documentation
  • [ ] Tests
  • [ ] TypeScript Types
  • [ ] Flow Types
  • [X] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->

<!-- feel free to add additional comments -->

+10 -0

4 comments

2 changed files

AndreyLuzinov

pr closed time in 3 months

pull request commentdownshift-js/downshift

Always scroll to highlighted item on open

I cannot reproduce it on sample code and I had in real project. Issue reproduced If I move mouse while list plays close animation. Which causes mutilple assignmenst like highlightedIndex = -1 and after this on list open item not scrolled. I've found workaround to fix this issue for now by disabling item props while list closing:

{...(isOpen ? getItemProps({ item, index }) : {})}

AndreyLuzinov

comment created time in 3 months

pull request commentdownshift-js/downshift

Always scroll to highlighted item on open

What issue does this solve?

I run into an issue when list doesn't scroll to highlighted item on open.

AndreyLuzinov

comment created time in 3 months

delete branch AndreyLuzinov/downshift

delete branch : fix/scroll-to-selected-on-open

delete time in 3 months

pull request commentdownshift-js/downshift

Scroll list to highlighted item regadless of list open state.

Replaced solutuion with new https://github.com/downshift-js/downshift/pull/1130

AndreyLuzinov

comment created time in 3 months

PR closed downshift-js/downshift

Scroll list to highlighted item regadless of list open state.

<!-- What changes are being made? (What feature/bug is being fixed here?) -->

What: Scroll list to highlighted item regadless of list open state.

<!-- Why are these changes necessary? -->

Why: I use async list opening with @kunukn/react-collapse animation library so I need to scroll to highlighted item BEFORE list opens. I need this on list open starts.

<!-- How were these changes implemented? -->

How: I've removed isOpen check which scrolls list to highlighed item.

<!-- Have you done all of these things? -->

Checklist:

<!-- add "N/A" to the end of each line that's irrelevant to your changes -->

<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->

  • [ ] Documentation
  • [ ] Tests
  • [ ] TypeScript Types
  • [ ] Flow Types
  • [x] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->

<!-- feel free to add additional comments -->

+0 -1

0 comment

1 changed file

AndreyLuzinov

pr closed time in 3 months

PR opened downshift-js/downshift

Always scroll to highlighted item on open

<!-- What changes are being made? (What feature/bug is being fixed here?) -->

What: Ensure that list will scrolled to highlighted item on drop down open.

<!-- Why are these changes necessary? -->

Why: shouldScrollRef == false could prevent list from scrolling to highlighted item on list open.

<!-- How were these changes implemented? -->

How: Reset shouldScrollRef to true on list open state changes.

<!-- Have you done all of these things? -->

Checklist:

<!-- add "N/A" to the end of each line that's irrelevant to your changes -->

<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->

  • [ ] Documentation
  • [ ] Tests
  • [ ] TypeScript Types
  • [ ] Flow Types
  • [X] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->

<!-- feel free to add additional comments -->

+10 -0

0 comment

2 changed files

pr created time in 3 months

push eventAndreyLuzinov/downshift

Andrey Luzinov

commit sha 51d7747cc00d235c67ff79cf9e6de8ccba6aca4b

Always scroll to selected item on drop down open.

view details

push time in 3 months

push eventAndreyLuzinov/downshift

Andrey Luzinov

commit sha f37d34356a0c3cbe2c2ffee5997ffca367194b12

Always scroll to selected item on drop down open.

view details

push time in 3 months

create barnchAndreyLuzinov/downshift

branch : fix/always-scroll-to-selected-on-open

created branch time in 3 months

PR opened downshift-js/downshift

Scroll list to highlighted item regadless of list open state.

<!-- What changes are being made? (What feature/bug is being fixed here?) -->

What: Scroll list to highlighted item regadless of list open state.

<!-- Why are these changes necessary? -->

Why: I use async list opening with @kunukn/react-collapse animation library so I need to scroll to highlighted item BEFORE list opens. I need this on list open starts.

<!-- How were these changes implemented? -->

How: I've removed isOpen check which scrolls list to highlighed item.

<!-- Have you done all of these things? -->

Checklist:

<!-- add "N/A" to the end of each line that's irrelevant to your changes -->

<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->

  • [ ] Documentation
  • [ ] Tests
  • [ ] TypeScript Types
  • [ ] Flow Types
  • [x] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->

<!-- feel free to add additional comments -->

+0 -1

0 comment

1 changed file

pr created time in 3 months

push eventAndreyLuzinov/downshift

Andrey Luzinov

commit sha 260df1e718bd80aa1587790f954ec90a79441646

Scroll to highlighted item on list opening.

view details

push time in 3 months

create barnchAndreyLuzinov/downshift

branch : fix/scroll-to-selected-on-open

created branch time in 3 months

issue commentdownshift-js/downshift

[useSelect] Focus is not set to dropdown part if it's open with transition using keyboard.

I've pasted reproduction code where keyboard navigation doesn' work. https://codesandbox.io/s/useselect-usage-dy6zg?file=/index.js:219-224

Have you tried?

AndreyLuzinov

comment created time in 3 months

more