Skip to content

Commit

Permalink
feat: introduce disableArrowKeys flag (#362)
Browse files Browse the repository at this point in the history
  • Loading branch information
lukasbach committed May 18, 2024
1 parent b5f06fc commit 5da70a9
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 4 deletions.
36 changes: 36 additions & 0 deletions packages/core/src/stories/Accessibility.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -142,3 +142,39 @@ export const NoDescriptors = () => (
<Tree treeId="tree-1" rootItem="root" treeLabel="Tree Example" />
</UncontrolledTreeEnvironment>
);

export const NoKeyboardBindings = () => (
<UncontrolledTreeEnvironment<string>
canDragAndDrop
canDropOnFolder
canReorderItems
dataProvider={
new StaticTreeDataProvider(longTree.items, (item, data) => ({
...item,
data,
}))
}
getItemTitle={item => item.data}
viewState={{
'tree-1': {},
}}
keyboardBindings={{
primaryAction: [],
moveFocusToFirstItem: [],
moveFocusToLastItem: [],
expandSiblings: [],
renameItem: [],
abortRenameItem: [],
toggleSelectItem: [],
abortSearch: [],
startSearch: [],
selectAll: [],
startProgrammaticDnd: [],
abortProgrammaticDnd: [],
completeProgrammaticDnd: [],
}}
disableArrowKeys
>
<Tree treeId="tree-1" rootItem="root" treeLabel="Tree Example" />
</UncontrolledTreeEnvironment>
);
10 changes: 6 additions & 4 deletions packages/core/src/tree/useTreeKeyboardBindings.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ export const useTreeKeyboardBindings = () => {

const isActiveTree = environment.activeTreeId === treeId;
const isRenaming = !!renamingItem;
const { disableArrowKeys } = environment;
const enableArrowKeys = !disableArrowKeys && isActiveTree && !isRenaming;

useKey(
'arrowdown',
Expand All @@ -34,7 +36,7 @@ export const useTreeKeyboardBindings = () => {
}
}
},
isActiveTree && !isRenaming
enableArrowKeys
);

useKey(
Expand All @@ -51,7 +53,7 @@ export const useTreeKeyboardBindings = () => {
}
}
},
isActiveTree && !isRenaming
enableArrowKeys
);

useHotkey(
Expand Down Expand Up @@ -87,7 +89,7 @@ export const useTreeKeyboardBindings = () => {
return currentIndex;
});
},
isActiveTree && !dnd.isProgrammaticallyDragging && !isRenaming
enableArrowKeys && !dnd.isProgrammaticallyDragging
);

useKey(
Expand All @@ -111,7 +113,7 @@ export const useTreeKeyboardBindings = () => {
return currentIndex;
});
},
isActiveTree && !dnd.isProgrammaticallyDragging && !isRenaming
enableArrowKeys && !dnd.isProgrammaticallyDragging
);

useHotkey(
Expand Down
2 changes: 2 additions & 0 deletions packages/core/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -193,6 +193,8 @@ export interface TreeCapabilities<T = any, C extends string = never> {
* at the top.
*/
canDropBelowOpenFolders?: boolean;

disableArrowKeys?: boolean;
}

export type IndividualTreeViewState<C extends string = never> = {
Expand Down

0 comments on commit 5da70a9

Please sign in to comment.