Skip to content

Explicit onDeselect #15

@Zasa-san

Description

@Zasa-san

After working on #12 to improve onDeselect we noticed a problem. Previous to that PR, onDeselect only worked when clicking within HandleTextSelection component. This was a problem (#7) because clicking anywhere else on the screen did not trigger onDeselect. So the onDeselect function was not called consistently, and the experience was spotty for the user (sometimes they lost the selection, sometimes they didn't) .

#12 Attempted to fix this by listening to the global events in the dom and triggering the onDeselect function consistently: when the user had something selected and clicked in other areas of the screen onDeselect would be called.

After implementing this and seeing it in action we noticed that automatically triggering onDeselect is not the correct behavior. Currently, if the user has some selections, and then clicks anywhere on the screen, the selection goes away. If the users is clicking on other buttons of the UI trying to do something with the selection it feels like they lost it and have to select again since the text is not painted anymore.

onDeselect should not happen automatically, it should be something explicitly triggered by the component using this library.

What we think would work:

  • The user paints some text withing the region.
  • The text gets highlighted with a given color (we explicitly highlight the text so we don't rely on the browsers text selection highlight)
  • The text remains highlighted and does not disappear if the user clicks anywhere on the screen.
  • onDeselect is made available as a function that can be imported, and called programmatically to clear the current selection when pertinent.

This would more closely mimic the behavior of text selection on other apps where selecting some text and clicking on a button does not automatically deselect text (eg: select text on a word processor and click on the bold or italic icons, the text remains selected).

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions