A rewrite built around a stylesheet, templates and events. Toasts are still created with SimpleToast(...).

New

• Styling by classes. SimpleToast never sets inline styles. The default look is dist/simpletoast.css, with custom properties for colors, spacing and position.
• Four builds in dist/: simpletoast.js (everything, injects its stylesheet), simpletoast.core.js (toasts only), simpletoast.timers.js (timeouts add-on for the core build) and simpletoast.css. Type definitions come with each.
• Templates. A <template id="simpletoast-template"> controls a toast's structure. It can have one root element or several top-level elements.
• Handle: toast.element, setTitle and setFooter, next to setText, exists and close.
• Events: simpletoast:add and simpletoast:close bubble to document. Dispatch simpletoast:dismiss on a toast's element to close it with a reason.
• Timers. Each toast has its own timer, exact to the millisecond. It pauses while hovered or focused, while the tab is hidden or unfocused, and after idle milliseconds without input (pauseOnHover and idle control this).
• Options: signal (an AbortSignal), html: false for plain text, dismissOnClick: false, role and data.
• Accessibility. The root is a polite live region, toasts have role="status" and are focusable, and Escape, Enter and Space dismiss them.
• TypeScript types, checked against the source.
• Title-only toasts work.

Breaking changes

• The builds moved to dist/, and the root simpletoast.js is gone. Load a tagged file, for example https://raw.githubusercontent.com/feildmaster/SimpleToast/3.0.0/dist/simpletoast.js, not one from the default branch.
• The css option is removed. Use classes, custom properties or toast.element.
• Buttons no longer dismiss the toast. Call toast.close() from the handler.
• Timeouts only run while the tab is visible and focused and the user is not idle. The core build alone ignores timeout.

Notes

• The default build injects its stylesheet as a <style> element, which a strict style-src Content Security Policy blocks. On such pages use simpletoast.core.js (plus simpletoast.timers.js) and load simpletoast.css yourself.
• To manage the styles yourself with the default build, add your own <style data-simpletoast-stylesheet> without a data-version, and SimpleToast will not inject or change a stylesheet.
• Only the top frame gets SimpleToast. Nothing is defined in iframes.

See the readme for the full option list.

Changes

• Buttons take onClick, matching the casing used everywhere else. onclick still works.

Fixes

• setText('') now clears the text. Empty strings used to be ignored.
• close() no longer needs the toast to still be inside #AlertToast, so it works if something else removed or replaced the root.

Breaking changes

• onClose is now called with (reason, toast) instead of (toast, reason), and this is the toast.
• toast.close(reason) accepts a close reason. Toasts close with 'timeout' when they time out and 'dismissed' when clicked, and 'unknown' is the default.

Fixes

• The toast handle given to callers no longer exposes the library's internal object.