[COMPONENT] Action Menu

[mictro]

Describe the solution you'd like

This issue describes the revised Action Menu component as specified in Sketch - https://www.sketch.com/s/af90babd-c91f-4870-b097-ce26b590ed59/p/13C1424F-FEC5-4F70-B34B-026A0A4585AE/canvas
At the time of writing, the design guidelines for the new component are not present in zeplin.

They general UX guidelines for the Action Sheet reads as follows:
Action sheets are used as an overflow menu that appears in response to a control or action. An action sheet displays a set of two or more choices related to the current context. It appears on top of the app's content, and must be manually dismissed by the user before they can resume other interaction.

The Action Sheet look and work the same on the web and app.
There are two types of Action Sheets:
- Simple: Only actions
- Header + subheader: Title, subtitle (optional), and actions.

The Action Sheet acts almost like a dropdown. It appears below the control that triggered the action sheet and is without a background layer.

The Action Sheet is to be opened in response to a button action which is not part of the component. The Action Sheet should appear as a popover close to the button at the 'best possible' location with respect to the available space (not clarified yet - ask UX).
The popover functionality is to be provided by a new Kirby component built by a developer under the corporation contribution regime (at the time of writing unavailable).
The Action Sheet should close when an action is triggered, escape is pressed or the background layer is clicked.

Acceptance criterias

• The sheet appears as a popover both in normal and modal context.
• The sheet popover will dynamically adjust it's position in order to appear at the optimal place. (align with UX)
• The user is able to dismiss the sheet by pressing escape or tapping/clicking the background.
• The user is able to trigger an action notifying registered listeners.
• The sheet closes when an action is triggered.
• The sheet conforms to the design put forward in sketch/zeplin.

Initial Estimate: 13

Are there any additional context?

No

---

Clarifications

During the estimation session the following questions were posed:

• Max height and scroll bar?
  ja, sættes af bruger - scrollbar.
• Icon in header?
  Nej, måske senere.
• Animation on open?
  Nej
• Enforced location?
  Overvejes
• Action sheet - right name?
  Finder action-overlay nyt navn men bevarer design.
• Reuse dropdown?
  No, new component.

Checklist:

The following tasks should be carried out in sequence in order to follow the process of contributing correctly.

Refinement

• Request that the issue is UX refined; do not proceed until this is done.

• Request that the issue is tech refined; do not proceed until this is done.

• Make sure you have read: "Before you get coding".

• Signal to others you are working on the issue by assigning yourself.

• Create a branch from the develop branch following our branch naming convention.

• Publish a WIP implementation to Github as a draft PR and ask for feedback.

• Make sure you have implemented tests following the guidelines in: "The good: Test".

• Update the cookbook with examples and showcases.

Review

Once the issue has been implemented and is ready for review:

• Do a self-review.
• Create a pull-request. If you created a draft PR during implementation you can just mark that as "ready for review".

[NillerW]

Related to #2744

[NillerW]

Completed by #2744