feat(list)!: Support moving between different lists via keyboard#10480
feat(list)!: Support moving between different lists via keyboard#10480
Conversation
| * | ||
| * @deprecated use calciteListItemSortHandleOpen instead. | ||
| */ | ||
| @Event({ cancelable: false }) calciteListItemDragHandleChange: EventEmitter<void>; |
There was a problem hiding this comment.
can I just remove this since its a breaking change already?
There was a problem hiding this comment.
No, I'd like to keep this PR focused. Applies to other similar questions.
There was a problem hiding this comment.
Apologies, I thought you were suggesting removing previously deprecated members. If the "keyboard list move" changes made the prop and event irrelevant, they should be fine to remove. Let’s just make sure to note this in the breaking change footer and our 3.x breaking change doc.
geospatialem
left a comment
geospatialem
left a comment
There was a problem hiding this comment.
Overall this is great support, in particular when JAWS and NVDA are present. For both the keyboard keys and context provided is fantastic. ✨
Observed some odd behavior via keyboard (without AT active), where the "Reorder" menu seems to have a weird UX/behavior. Recorded a screen grab for the key combinations and context. I'm not sure if its something that could be mitigated, without impacting the AT experience, but wanted to showcase the "bugginess" experience:
WDYT if we consider adding the ability to close the menu and shift focus back to the list-item when using the Esc key?
# Conflicts: # packages/calcite-components/src/components/list/list.tsx
The calcite-dropdown is handling this escape action so it might be tricky to override it.
Can you test this again? What exactly is the expected behavior vs the observed behavior? |
The |
# Conflicts: # packages/calcite-components/src/components.d.ts
jcfranco
left a comment
jcfranco
left a comment
There was a problem hiding this comment.
Had a few notes, but this is great stuff, @driskull!
I'd like to get @alisonailea to sign off on component tokens before proceeding, but in the meantime can you move the BREAKING CHANGE footer to the end of the description? It needs to be placed at the bottom to adhere to the conventional commits spec:
<type>[optional scope]: <description>
[optional body]
[optional footer(s)]
Once approved, this can be merged after the Oct milestone wraps up.
|
@jcfranco @alisonailea I can just not document the tokens for now by removing the JS doc for them if that is what we want. This isn't a public component anyway. |
|
Removing tokens. for future reference here they are: ced0936 |
driskull
added
the
pr ready for visual snapshots
driskull
added
pr ready for visual snapshots
driskull
added
pr ready for visual snapshots
) **Related Issue:** #7537 ## Summary - depends on #10241 - updates `action` to allow cursor to be overriden - lists should set the `label` property for the "Move to" sorting menu to have a name for the list. - adds `calcite-sort-handle` component to handle sorting and moving between lists for non mouse users - internal component - adds stories - adds tests - list-item - deprecates `dragSelected` property: no longer needed. - deprecates `calciteListItemDragHandleChange` event. no longer needed. - removed setting `aria-posinset` and `aria-setsize`. These are only needed when only part of the items are availalbe in the DOM. So we can safely remove these. - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-setsize - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-posinset - replaces `calcite-handle` with `calcite-sort-handle` in the `list` component. - updates tests - adds tests - adds demo pages BREAKING CHANGE: Modifies the component's keyboard sorting experience by using a dropdown menu to move list items. The ListItem `dragSelected` property and `calciteListItemDragHandleChange` event have been removed due to no longer being relevant.
3 participants
Related Issue: #7537
Summary
actionto allow cursor to be overridenlabelproperty for the "Move to" sorting menu to have a name for the list.calcite-sort-handlecomponent to handle sorting and moving between lists for non mouse usersdragSelectedproperty: no longer needed.calciteListItemDragHandleChangeevent. no longer needed.aria-posinsetandaria-setsize. These are only needed when only part of the items are availalbe in the DOM. So we can safely remove these.calcite-handlewithcalcite-sort-handlein thelistcomponent.BREAKING CHANGE: Modifies the component's keyboard sorting experience by using a dropdown menu to move list items. The ListItem
dragSelectedproperty andcalciteListItemDragHandleChangeevent have been removed due to no longer being relevant.