discourse/app/assets/javascripts/float-kit/addon/lib/d-toast-instance.js
Joffrey JAFFEUX 552cf56afe
DEV: toasts improvements (#24046)
- more subtle animation when showing a toast
- resumes auto close when removing the mouse from the toast
- correctly follows reduced motion
- uses output with role status as element: https://web.dev/articles/building/a-toast-component
- shows toasts inside a section element
- prevents toast to all have the same width
- fixes a bug on mobile where we would limit the width and the close button wouldn't show correctly aligned

I would prefer to have tests for this, but the conjunction of css/animations and our helper changing `discourseLater` to 0 in tests is making it quite challenging for a rather low value. We have system specs using  toasts ensuring they show when they should.
2023-10-23 15:23:10 +02:00

23 lines
516 B
JavaScript

import { setOwner } from "@ember/application";
import { action } from "@ember/object";
import { inject as service } from "@ember/service";
import uniqueId from "discourse/helpers/unique-id";
import { TOAST } from "float-kit/lib/constants";
export default class DToastInstance {
@service toasts;
options = null;
id = uniqueId();
constructor(owner, options = {}) {
setOwner(this, owner);
this.options = { ...TOAST.options, ...options };
}
@action
close() {
this.toasts.close(this);
}
}