fix(overflow-menu): type dispatched close event

COMPONENT_INDEX.md

@@ -2378,13 +2378,13 @@ None.
 ### Events
 
 | Event name | Type       | Detail                                        |
-| :--------- | :--------- | :----- |
+| :--------- | :--------- | :-------------------------------------------- |
+| close      | dispatched | <code>{ index: number; text: string; }</code> |
 | click      | forwarded  | --                                            |
 | mouseover  | forwarded  | --                                            |
 | mouseenter | forwarded  | --                                            |
 | mouseleave | forwarded  | --                                            |
 | keydown    | forwarded  | --                                            |
-| close      | dispatched | --     |
 
 ## `OverflowMenuItem`
 

docs/src/COMPONENT_API.json

@@ -3127,12 +3127,16 @@
         }
       ],
       "events": [
+        {
+          "type": "dispatched",
+          "name": "close",
+          "detail": "{ index: number; text: string; }"
+        },
         { "type": "forwarded", "name": "click", "element": "button" },
         { "type": "forwarded", "name": "mouseover", "element": "button" },
         { "type": "forwarded", "name": "mouseenter", "element": "button" },
         { "type": "forwarded", "name": "mouseleave", "element": "button" },
-        { "type": "forwarded", "name": "keydown", "element": "button" },
-        { "type": "dispatched", "name": "close" }
+        { "type": "forwarded", "name": "keydown", "element": "button" }
       ],
       "typedefs": [],
       "rest_props": { "type": "Element", "name": "button" }

src/OverflowMenu/OverflowMenu.svelte

@@ -1,4 +1,8 @@
 <script>
+  /**
+   * @event {{ index: number; text: string; }} close
+   */
+
   /**
    * Specify the size of the overflow menu
    * @type {"sm" | "xl"}
@@ -52,7 +56,7 @@
 
   import { createEventDispatcher, setContext, afterUpdate } from "svelte";
   import { writable } from "svelte/store";
-  import OverflowMenuVertical16 from "carbon-icons-svelte/lib/OverflowMenuVertical16";
+  import OverflowMenuVertical16 from "carbon-icons-svelte/lib/OverflowMenuVertical16/OverflowMenuVertical16.svelte";
   import { formatStyle } from "./formatStyle";
 
   const dispatch = createEventDispatcher();

tests/OverflowMenu.test.svelte

@@ -3,7 +3,11 @@
   import Add16 from "carbon-icons-svelte/lib/Add16";
 </script>
 
-<OverflowMenu>
+<OverflowMenu
+  on:close="{(e) => {
+    console.log(e.detail); // { index: number; text: string; }
+  }}"
+>
   <OverflowMenuItem text="Manage credentials" />
   <OverflowMenuItem
     href="https://cloud.ibm.com/docs/api-gateway/"

types/OverflowMenu/OverflowMenu.d.ts

@@ -77,11 +77,11 @@ export default class OverflowMenu {
     menu: {};
   };
 
+  $on(eventname: "close", cb: (event: CustomEvent<{ index: number; text: string }>) => void): () => void;
   $on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
   $on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void;
   $on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void;
   $on(eventname: "mouseleave", cb: (event: WindowEventMap["mouseleave"]) => void): () => void;
   $on(eventname: "keydown", cb: (event: WindowEventMap["keydown"]) => void): () => void;
-  $on(eventname: "close", cb: (event: CustomEvent<any>) => void): () => void;
   $on(eventname: string, cb: (event: Event) => void): () => void;
 }