fix(multi-select): type dispatched select event

This commit is contained in:
Eric Y Liu 2021-03-12 15:51:29 -08:00
commit df63254c79
5 changed files with 24 additions and 10 deletions

View file

@ -2185,12 +2185,12 @@ None.
### Events ### Events
| Event name | Type | Detail | | Event name | Type | Detail |
| :--------- | :--------- | :----- | | :--------- | :--------- | :-------------------------------------------------------------------------------------------------- |
| select | dispatched | <code>{ selectedIds: string[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }</code> |
| clear | forwarded | -- | | clear | forwarded | -- |
| keydown | forwarded | -- | | keydown | forwarded | -- |
| focus | forwarded | -- | | focus | forwarded | -- |
| blur | forwarded | -- | | blur | forwarded | -- |
| select | dispatched | -- |
## `NotificationActionButton` ## `NotificationActionButton`

View file

@ -5403,11 +5403,15 @@
], ],
"slots": [], "slots": [],
"events": [ "events": [
{
"type": "dispatched",
"name": "select",
"detail": "{ selectedIds: string[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }"
},
{ "type": "forwarded", "name": "clear", "element": "ListBoxSelection" }, { "type": "forwarded", "name": "clear", "element": "ListBoxSelection" },
{ "type": "forwarded", "name": "keydown", "element": "input" }, { "type": "forwarded", "name": "keydown", "element": "input" },
{ "type": "forwarded", "name": "focus", "element": "input" }, { "type": "forwarded", "name": "focus", "element": "input" },
{ "type": "forwarded", "name": "blur", "element": "input" }, { "type": "forwarded", "name": "blur", "element": "input" }
{ "type": "dispatched", "name": "select" }
], ],
"typedefs": [ "typedefs": [
{ {

View file

@ -121,6 +121,7 @@
* @typedef {string} MultiSelectItemId * @typedef {string} MultiSelectItemId
* @typedef {string} MultiSelectItemText * @typedef {string} MultiSelectItemText
* @typedef {{ id: MultiSelectItemId; text: MultiSelectItemText; }} MultiSelectItem * @typedef {{ id: MultiSelectItemId; text: MultiSelectItemText; }} MultiSelectItem
* @event {{ selectedIds: string[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }} select
*/ */
import { afterUpdate, createEventDispatcher, setContext } from "svelte"; import { afterUpdate, createEventDispatcher, setContext } from "svelte";

View file

@ -11,6 +11,11 @@
{ id: '1', text: 'Email' }, { id: '1', text: 'Email' },
{ id: '2', text: 'Fax' }, { id: '2', text: 'Fax' },
]}" ]}"
on:select="{(e) => {
console.log(e.detail.selectedIds);
console.log(e.detail.selected);
console.log(e.detail.unselected);
}}"
/> />
<MultiSelect <MultiSelect

View file

@ -179,11 +179,15 @@ export interface MultiSelectProps
export default class MultiSelect extends SvelteComponentTyped< export default class MultiSelect extends SvelteComponentTyped<
MultiSelectProps, MultiSelectProps,
{ {
select: CustomEvent<{
selectedIds: string[];
selected: MultiSelectItem[];
unselected: MultiSelectItem[];
}>;
clear: WindowEventMap["clear"]; clear: WindowEventMap["clear"];
keydown: WindowEventMap["keydown"]; keydown: WindowEventMap["keydown"];
focus: WindowEventMap["focus"]; focus: WindowEventMap["focus"];
blur: WindowEventMap["blur"]; blur: WindowEventMap["blur"];
select: CustomEvent<any>;
}, },
{} {}
> {} > {}