chore(menu): added a custom root submenu example in storybook

adobe · Sep 4, 2024 · 8314907 · 8314907
1 parent 95674cd
commit 8314907
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 1 deletion.
diff --git a/packages/menu/stories/submenu.stories.ts b/packages/menu/stories/submenu.stories.ts
@@ -368,3 +368,26 @@ export const contextMenu = (): TemplateResult => {
         </sp-overlay>
     `;
 };
+
+export const customRootSubmenu = (): TemplateResult => {
+    return html`
+        <sp-action-menu label="More Actions">
+            <sp-menu-item>Bronx</sp-menu-item>
+            <sp-menu-item id="submenu-item-1">
+                Brooklyn
+                <div role="menuitem" slot="submenu" style="padding: 12px">
+                    <img
+                        src="https://placekitten.com/200/200"
+                        alt="Kitten"
+                        style="width: 100%; height: auto; border-radius: 4px"
+                    />
+                    <p>I am an arbitrary content in submenu</p>
+                </div>
+            </sp-menu-item>
+        </sp-action-menu>
+    `;
+};
+
+customRootSubmenu.swc_vrt = {
+    skip: true,
+};
diff --git a/packages/menu/test/submenu.test.ts b/packages/menu/test/submenu.test.ts
@@ -1068,7 +1068,7 @@ describe('Submenu', () => {
         expect(rootItem1.open, 'finally closed 1').to.be.false;
         expect(rootItem2.open, 'finally closed 2').to.be.false;
     });
-    it.only('supports using non-menu-item elements as the root of a submenu', async () => {
+    it('supports using non-menu-item elements as the root of a submenu', async () => {
         const el = await fixture<Menu>(html`
             <sp-menu>
                 <sp-menu-item class="root">