Fix InlineNotification and ToastNotification timeout

* Dispatch close event when a notification closes due to timeout
* Fix documentation text on the timeout prop (its removing the notification after opening it, not after closing it)
This commit is contained in:
Lukas Rieder 2020-08-23 17:45:35 +02:00
commit ce607c6f26
2 changed files with 32 additions and 13 deletions

View file

@ -17,6 +17,12 @@
*/
export let lowContrast = false;
/**
* Set the timeout duration (ms) to hide the notification after opening it
* @type {number} [timeout=0]
*/
export let timeout = 0;
/**
* Set the `role` attribute
* @type {string} [role="alert"]
@ -54,7 +60,23 @@
const dispatch = createEventDispatcher();
$: open = true;
let open = true;
let timeoutId = undefined;
function close() {
open = false;
dispatch('close');
}
onMount(() => {
if (timeout) {
timeoutId = setTimeout(() => close(), timeout);
}
return () => {
clearTimeout(timeoutId);
};
});
</script>
{#if open}
@ -81,10 +103,7 @@
<NotificationButton
{iconDescription}
{notificationType}
on:click={() => {
open = false;
dispatch('close');
}} />
on:click={close()} />
{/if}
</div>
{/if}