spaper 0.2.5 → 0.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -4
- package/components/Toast/Toast.svelte +16 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
on:mouseenter={pause}
|
|
5
5
|
on:mouseleave={dismiss}
|
|
6
6
|
in:fly={{ y: position.includes('top') ? -100 : 100 }}
|
|
7
|
-
out:fade={{ duration:
|
|
7
|
+
out:fade={{ duration: TRANSITION_OUT_DURATION }}
|
|
8
8
|
role="alert">
|
|
9
9
|
{@html message}
|
|
10
10
|
{#if dismissible||indefinite}
|
|
@@ -30,6 +30,7 @@ export let dismissible = false;
|
|
|
30
30
|
export let indefinite = false;
|
|
31
31
|
export let closeAriaLabel = 'close';
|
|
32
32
|
export let onClose = null;
|
|
33
|
+
const TRANSITION_OUT_DURATION = 300;
|
|
33
34
|
let active = true;
|
|
34
35
|
let toastElement;
|
|
35
36
|
let timeoutId;
|
|
@@ -56,19 +57,31 @@ function dismiss() {
|
|
|
56
57
|
}
|
|
57
58
|
function close() {
|
|
58
59
|
active = false;
|
|
60
|
+
removeContainer();
|
|
59
61
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
60
62
|
}
|
|
63
|
+
function getContainer() {
|
|
64
|
+
return document.querySelector(containerSelector);
|
|
65
|
+
}
|
|
61
66
|
function setupContainer() {
|
|
62
67
|
new ToastContainer({
|
|
63
68
|
target: document.body,
|
|
64
69
|
props: { position },
|
|
65
70
|
});
|
|
66
|
-
return
|
|
71
|
+
return getContainer();
|
|
67
72
|
}
|
|
68
73
|
function insert() {
|
|
69
|
-
const container =
|
|
74
|
+
const container = getContainer() || setupContainer();
|
|
70
75
|
container.insertAdjacentElement('afterbegin', toastElement);
|
|
71
76
|
}
|
|
77
|
+
function removeContainer() {
|
|
78
|
+
const container = getContainer();
|
|
79
|
+
setTimeout(() => {
|
|
80
|
+
if (container.children.length === 1) {
|
|
81
|
+
container.remove();
|
|
82
|
+
}
|
|
83
|
+
}, TRANSITION_OUT_DURATION);
|
|
84
|
+
}
|
|
72
85
|
</script>
|
|
73
86
|
|
|
74
87
|
<style>
|