-
-
Notifications
You must be signed in to change notification settings - Fork 94
-
I use the UncontrolledTreeEnvironment and renderItem, but i lost the keyboard bindings, like Space cannot not expand/collapse. How can I customize keyboard event binding?
This is my renderItem code:
<li {...(context.itemContainerWithChildrenProps as any)}> <div {...(context.itemContainerWithoutChildrenProps as any)} style={{ '--depthOffset': `${(depth + 1) * 12}px` }}> {arrow} <div {...(context.interactiveElementProps as any)}> <div className="flex items-center gap-2"> <div onClick={(e) => e.stopPropagation()}> <Checkbox checked={isSelected} onCheckedChange={handleCheckedChange} className="shrink-0" /> </div> {title} </div> </div> </div> {children} </li>;
Beta Was this translation helpful? Give feedback.
All reactions
Replies: 1 comment
-
Hi! Some keyboard bindings like space are not specified by RCT as actual keyboard bindings, but the consequence of the browser treating a clickable element as something that will handle space inputs as click events if the element is focused. But since the element that receives context.interactiveElementProps is not actually a clickable element, my guess is that that's the reason that doesn't work. Does it fix it to replace that div element with a button element?
Beta Was this translation helpful? Give feedback.