quip / quip-apps

Quip Live Apps API for creating applications in Quip documents.
Apache License 2.0
107 stars 75 forks source link

Unexpected RichTextBox cmp behaviour #445

Open andrew-bury opened 1 year ago

andrew-bury commented 1 year ago

This component doesn't work properly with allowDefaultTabNavigation={true}. Instead of changing interactive element on the Tab key, it's adds indent to the RichTextBox component (ex: the same like in Code Editor).

This issue occurred a week or two ago.

leiwsf commented 1 year ago

Thanks for reporting this. Can you clarify your use case? what are you trying to do with this component?

andrew-bury commented 1 year ago

Thanks for reporting this. Can you clarify your use case? what are you trying to do with this component?

Official documentation (ref: https://quip.com/dev/liveapps/1.x.x/reference/react-ui/richtextbox#allowdefaulttabnavigation)

Imagine you have an app with some interactive elements like buttons, links, custom elements/components (which contains something with tabindex="0") etc... Then for example y wanna navigate trough the app by Tab key, all works fine until RichTextComponent not in focus. When focus appears on RichTextComponent and you press on the "Tab" key on your keyboard (This action should change focus to the next interactive element) it's adding an indent to the content inside editable div (this div placed inside RichTextComponent).

leiwsf commented 1 year ago

Thanks for clarifying the use case!

zhouhao commented 1 year ago

BTW: This issue should be fixed in Q4 of 2022.