Calcite-components: Enhancement: Block - add a header-menu-actions slot like Panel

[kat10140]

Description

Wiring up the same UX in Block is hard and often sees devs using calcite-dropdown and looks like this.

Would be nice if Block could do what ~FlowItem~ Panel does using the same pattern.

Acceptance Criteria

• don't break the control slot?
• use same pattern as ~FlowItem's~ Panel's header-menu-actions

Relevant Info

Which Component

Block

Example Use Case

Any time we need actions coming out of a ... menu.

[kat10140]

https://github.com/Esri/calcite-app-components/issues/894

[macandcheese]

Can we just use dropdown with selection-mode:none- so there isn't the indication of selection there, and width=s ?

The slot request is still totally valid but would be nice to use dropdown vs. actions there.

[asangma]

@jcfranco @caripizza Bringing this one back up. Seems like often when someone uses Block, they need to hand-roll a popover for menu actions.

[jcfranco]

@asangma Couple of questions for you:

1. When the user slots in actions, should the toggle icon still be displayed or is it dropped in favor of the menu? If we do need to show it do we place it before the toggle icon?

   

2. (Revisiting https://github.com/Esri/calcite-app-components/issues/894#issuecomment-636106949) Can users still slot a control along with menu actions? Or does one supersede the other?

[macandcheese]

This change has created a weird moment in our icon search. We currently slot an action when chips are selected beneath (ignore the incorrect color overrides, this is just a local build).

This causes the caret affordance to disappear (blinking is just video recording):

https://user-images.githubusercontent.com/4733155/123008033-07c34380-d36f-11eb-97c3-a58d3d2ce792.mp4

[jcfranco]

@macandcheese Can you share a snippet? I think it may be unrelated. As far as I can tell, there haven't been any installs related to this issue yet.

[jcfranco]

@asangma 🔊 https://github.com/Esri/calcite-components/issues/963#issuecomment-866379004

[asangma]

The toggle icon should not render if anything is put into the control slot. That's by design.

re: "Can we just use dropdown"
I suggest we follow the pattern that Panel uses and place a ... Action into the control slot.

[asangma]

We may also want to retain the ability to "overload" the control slot.
That is to say, if Actions are added to header-menu-actions, we'd treat them like Panel does but use the Block's control slot.

And if Actions (or whatever) are also added directly to the control slot, we'd honor that. The ... Action to open the menu would just always stay at the end of the header (right in LTR and left in RTL).

[jcfranco]

Installed.

[jcfranco]

@kat10140 Can you help verify this one? If not, let us know if you want us to reassign it. Thanks!

[julio8a]

Verified on master