feat(menu): tray submenus

Adds CSS and examples for the "Tray submenus" design in the guidelines
and design file. This is for the use of Menu within Tray, to show the
parent menu item at the top with a back button.

Also updates some examples markup:
- Remove several duplicate IDs
- Remove not needed aria attributes when the label text is already
  wrapped by the label element (previously was resulting in screen
  reader reading the label twice in a row).

components/menu/index.css

@@ -91,6 +91,8 @@ governing permissions and limitations under the License.
   --spectrum-menu-checkmark-display-shown: block;
   --spectrum-menu-checkmark-display: var(--spectrum-menu-checkmark-display-shown);
 
+  --spectrum-menu-back-icon-margin: var(--spectrum-navigational-indicator-top-to-back-icon-medium);
+
   /* "one" icon: chevron + additional icon (we don't count the chevron as an icon because it HAS to be there for a collapsible) */
   --spectrum-menu-item-collapsible-has-icon-submenu-item-padding-x-start:
     calc((
@@ -135,6 +137,8 @@ governing permissions and limitations under the License.
   --spectrum-menu-item-checkmark-height: var(--spectrum-menu-item-checkmark-height-small);
   --spectrum-menu-item-checkmark-width: var(--spectrum-menu-item-checkmark-width-small);
   --spectrum-menu-item-top-to-checkmark: var(--spectrum-menu-item-top-to-selected-icon-small);
+
+  --spectrum-menu-back-icon-margin: var(--spectrum-navigational-indicator-top-to-back-icon-small);
 }
 
 .spectrum-Menu--sizeL {
@@ -160,6 +164,8 @@ governing permissions and limitations under the License.
   --spectrum-menu-item-checkmark-height: var(--spectrum-menu-item-checkmark-height-large);
   --spectrum-menu-item-checkmark-width: var(--spectrum-menu-item-checkmark-width-large);
   --spectrum-menu-item-top-to-checkmark: var(--spectrum-menu-item-top-to-selected-icon-large);
+
+  --spectrum-menu-back-icon-margin: var(--spectrum-navigational-indicator-top-to-back-icon-large);
 }
 
 .spectrum-Menu--sizeXL {
@@ -185,6 +191,8 @@ governing permissions and limitations under the License.
   --spectrum-menu-item-checkmark-height: var(--spectrum-menu-item-checkmark-height-extra-large);
   --spectrum-menu-item-checkmark-width: var(--spectrum-menu-item-checkmark-width-extra-large);
   --spectrum-menu-item-top-to-checkmark: var(--spectrum-menu-item-top-to-selected-icon-extra-large);
+
+  --spectrum-menu-back-icon-margin: var(--spectrum-navigational-indicator-top-to-back-icon-extra-large);
 }
 
 @media (forced-colors: active) {
@@ -203,7 +211,6 @@ governing permissions and limitations under the License.
     --highcontrast-menu-item-selected-background-color: Highlight;
     --highcontrast-menu-item-selected-color: HighlightText;
 
-
     @supports (color: SelectedItem) {
       --highcontrast-menu-item-selected-background-color: SelectedItem;
       --highcontrast-menu-item-selected-color: SelectedItemText;
@@ -256,6 +263,7 @@ governing permissions and limitations under the License.
 
 .spectrum-Menu {
   display: inline-block;
+  inline-size: var(--mod-menu-inline-size, auto);
   box-sizing: border-box;
   margin: 0;
   padding: 0;
@@ -431,7 +439,8 @@ governing permissions and limitations under the License.
   }
 }
 
-.spectrum-Menu-item:focus-visible {
+.spectrum-Menu-item:focus-visible,
+.spectrum-Menu-back:focus-visible {
   box-shadow: inset
     calc(var(--mod-menu-item-focus-indicator-width, var(--spectrum-menu-item-focus-indicator-width)) * var(--spectrum-menu-item-focus-indicator-direction-scalar, 1))
     0 0 0
@@ -782,4 +791,18 @@ governing permissions and limitations under the License.
       color: var(--highcontrast-menu-item-color-disabled, var(--mod-menu-item-label-icon-color-disabled, var(--spectrum-menu-item-label-icon-color-disabled)));
     }
   }
-}
+}
+
+/* Tray submenu */
+.spectrum-Menu-item--back {
+  display: flex;
+  flex-flow: row wrap;
+  align-items: center;
+  padding-inline-start: var(--mod-menu-back-padding-inline-start, 0);
+  padding-block: var(--mod-menu-back-padding-block, 0);
+}
+
+.spectrum-Menu-backIcon {
+  margin-block: var(--mod-menu-back-icon-margin-block, var(--spectrum-menu-back-icon-margin));
+  margin-inline: var(--mod-menu-back-icon-margin-inline, var(--spectrum-menu-back-icon-margin));
+}