discourse/app/assets/javascripts/float-kit/addon/components/d-toasts.gjs
David Battersby f75d119cd3
FEATURE: add progress bar to toast notifications (#26483)
This change adds a progress bar to toast notifications when autoClose is enabled (true by default).

The progress bar allows users to visually see how long is left before the notification disappears.

When hovered on desktop, the progress and autoclose timer will be paused, it will resume again once the mouse is moved away from the toast notification.
2024-04-05 18:29:11 +08:00

16 lines
389 B
Plaintext

import Component from "@glimmer/component";
import { service } from "@ember/service";
import DToast from "float-kit/components/d-toast";
export default class DToasts extends Component {
@service toasts;
<template>
<section class="fk-d-toasts">
{{#each this.toasts.activeToasts as |toast|}}
<DToast @toast={{toast}} />
{{/each}}
</section>
</template>
}