iframe-b.html

<!DOCTYPE html>
<html lang="pt-BR">
<head>
  <meta charset="UTF-8">
  <title>Iframe B</title>
</head>
<body>
  <h2>Iframe B</h2>
  <button id="sendToA">Emitir para iframe A (via host)</button>
  <button id="sendHiToHost">Mandar oi para o host</button>
  <div id="output"></div>

  <script type="module">
    import { IframeBus } from './iframe-bus.js';

    const bus = new IframeBus('iframe-b', { debug: true });

    const p = (text) => {
      const p = document.createElement('p');
      p.textContent = text;
      return p;
    }

    // Recebe mensagem do host
    bus.subscribe('from:host', (data) => {
      document.getElementById('output').appendChild(p(`[Iframe B] Host disse: ${data.text}`));
    });

    bus.subscribe('from:host-to-b', (data) => {
      document.getElementById('output').appendChild(p(`[Iframe B] Host disse para B: ${data.text}`));
    });

    // Recebe mensagem de A
    bus.subscribe('from:iframe-a', (data) => {
      document.getElementById('output').appendChild(p(`[Iframe B] A disse: ${data.text}`));
    });

    // Envia para A via tópico
    document.getElementById('sendToA').onclick = () => {
      bus.publish('from:iframe-b', { text: 'Oi A, aqui é o B!' });
    };

    // Também pode emitir algo para host, se quiser
    document.getElementById('sendHiToHost').onclick = () => {
      bus.publish('from:iframe', { text: 'Oi host, aqui é o B!' });
    }

    // Responder a requisição (opcional — só para mostrar que todos podem responder)
    bus.reply('get:iframeBStatus', () => {
      return { status: 'Iframe B está pronto' };
    });
  </script>
</body>
</html>