fix(overflow-menu): type dispatched close event

This commit is contained in:
Eric Liu 2020-12-05 17:00:29 -08:00
commit 4967d49b03
5 changed files with 25 additions and 13 deletions

View file

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

View file

@ -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" }

View file

@ -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();

View file

@ -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/"

View file

@ -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;
}