Live Region

`pura-live-region` is a managed ARIA live announcer, hidden by default (sr-only), that delivers out-of-band status messages using the clear-and-rewrite technique so that every call is actually picked up by assistive technology. Use it for dynamic feedback (saving, errors, progress) without trapping focus. The machine-readable layer is the centerpiece: it reflects role=status, aria-live, and stable data-* attributes on the host in light DOM, and keeps a global registry `window.__puraLiveRegions` (with history and `query(id)`/`latest()` helpers), letting agents read the latest announcement of each region without a screen reader.

Preview

<div style="display:flex;flex-direction:column;gap:12px;align-items:flex-start">
  <button id="btn-salvar">Save changes</button>
  <pura-live-region id="status" live="polite" visible label="Form status">Ready to save.</pura-live-region>
</div>
<script type="module">
  import "/pura/lib/live-region.js";
  const regiao = document.getElementById("status");
  let n = 0;
  document.getElementById("btn-salvar").addEventListener("click", () => {
    n++;
    regiao.announce(`Changes saved successfully (${n}).`);
  });
</script>

<link rel="stylesheet" href="/pura/tokens.css">
<script type="module" src="/pura/lib/live-region.js"></script>

import "./pura/lib/live-region.js";