Alert supplies role="alert" without moving focus. Mount the region, then update its text for an urgent change; an alert already present at page load may not be announced. Keep a recovery control near a failure rather than placing interactive content in the alert.
import { RefSubject } from "@typed/fx";
import { html } from "@typed/template";
import { Alert } from "@typed/ui/Alert";
import { Button } from "@typed/ui/Button";
import { component } from "@typed/template";
export const UploadStatus = component(function* () {
const message = yield* RefSubject.make("");
return html`${Alert({ content: message })}${Button({
content: "Simulate upload failure",
onclick: RefSubject.set(message, "Upload failed. Try again."),
})}`;
});
See the Alert API and the save failure path in building UI components.