openui / openui/open-ui

[invokers] add some way to toggle a popover without considering interest state

Open
#1,354 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
MDX
Stars
4.5k
Forks
226
Avg merge
2d 22h
Merged PRs (30d)
4

Description

Consider the following example where both an interestfor and commandfor target the same popover:

<button
  interestfor="my-popover"
  commandfor="my-popover"
  command="toggle-popover"
>?</a>
<div id="my-popover" popover="hint">Popover content</div>

in this example, clicking the button hides the popover, if clicked again it shows it but gets light dismissed on hovering the button again. It would be nice if we could have this work such that clicking the button makes the popover persist so that the user does not have to continue hovering over the button. (And can then dismiss the popover by clicking the button again).

I would like to propose either:

  • Changing the existing behavior: toggle-popover should not consider popovers shown by interestfor when deciding the toggle state, and losing interest should not clear an explictly opened popover (whether via toggle-popover/show-popover in HTML or the equivalent in JS).
    • I think this is preferable as I don't see how the current behavior is useful to either developers or users
  • Adding a new value and state to popovers (all names to be bike-shedded):
    • show-persistent-popover which shows a popover and prevents losing interest from the popover
      • and an equivalent JS api .showPopover({ preventDismissOnInterestLoss: true })
    • hide-persistent-popover which hides a popover that was shown via show-persistent-popover but doesn't hide a popover which is shown due to interest
      • and an equivalent JS api .hidePopover({ allowInterestToContinueShowing: true })
    • toggle-popover-persistent which is a combination of the above properties in the same way as toggle-popover

Just to clarify what the intended user flow would be:

  • Initially the popover is hidden
  • The user hovers the button and the popover is shown due to interest
  • The user clicks the button, this causes the popover to persist (not be hidden as current behavior)
  • The user can freely move their pointer around, the popover will persist (and hovering the button should not cause an implicit dismiss due to interest loss)
  • The user clicks the button again which causes the popover to no longer be persistent and will be light dismissed when the user stops hovering the button

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading the existing popover, interestfor, and commandfor behavior described in the relevant Open UI specification sections. Trace how interest loss and toggle commands interact, then compare the proposed alternatives against the stated hover-and-click flow; done means a clear, agreed behavior or API design is documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript
Domain
frontend, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
40/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.