dp-action-menu

The overflow ("More") menu for content action bars. Every content detail page and card (posts,
projects, gists, news, quizzes) keeps its voting, reactions, main call to action and private note in
the bar, and groups the rest (share, save, report, block, edit, delete) into this one menu.

Source: static/js/components/AppActionMenu.js. Registered as dp-action-menu on every page.

The markup lives in the light DOM: the trigger is a real button with data-action-menu-trigger, the
panel is a popover with data-action-menu-panel, and the actions inside stay real buttons, links
and forms, so existing confirm, modal and submit handlers keep working. Items marked
data-menu-action close the panel when chosen, and Escape closes it. If the panel has no actions,
the trigger hides itself. Panels on cards must not hardcode ids; the component generates them.
Without JavaScript the panel stays hidden, the same trade-off as the profile and project menus.

Usage#

<dp-action-menu>
  <button type="button" data-action-menu-trigger aria-haspopup="menu" aria-expanded="false">More</button>
  <div class="action-menu-panel" data-action-menu-panel popover hidden>
    <button type="button" data-menu-action>Share</button>
  </div>
</dp-action-menu>