@finastra/menu/demo/index.html

Menu Web Component

<script type="module" src="node_modules/@finastra/menu/dist/src/menu.js"></script>
<script type="module" src="node_modules/@finastra/button/dist/src/index.js"></script>
<script type="module" src="node_modules/@finastra/list/dist/src/index.js"></script>

<div style="position: relative">
  <fds-button id="basicButton" raised label="Open Basic Menu"></fds-button>
  <fds-menu id="basicMenu">
    <fds-list-item>one</fds-list-item>
    <fds-list-item>two</fds-list-item>
    <fds-list-item>three</fds-list-item>
    <fds-list-item disabled><div>four</div></fds-list-item>
    <li divider></li>
    <fds-list-item>aaa</fds-list-item>
    <fds-list-item>bbb</fds-list-item>
  </fds-menu>
</div>

<script>
  const menu = document.getElementById('basicMenu');
  const button = document.getElementById('basicButton');

  // anchor must share a parent with menu that is `position: relative`
  menu.anchor = button;
  button.addEventListener('click', function () {
    menu.open = !menu.open;
  });
</script>