@knapsack/app/dist/client/renderer-client/renderer-client-main.ts

Build Design Systems on top of knapsack, by Basalt

import { KsRendererClientMeta } from './renderer-client-types';

const metaTag = document.getElementById('ks-meta');
const metaString = metaTag.innerText;
const meta: KsRendererClientMeta = JSON.parse(metaString);
// console.log(`got ks meta!`, meta);
const { isInIframe, websocketsPort } = meta;
// if (!isInIframe && websocketsPort) {
if (websocketsPort) {
  if ('WebSocket' in window && window.location.hostname === 'localhost') {
    const socket = new window.WebSocket(`ws://localhost:${websocketsPort}`);
    socket.addEventListener('message', function() {
      window.location.reload();
    });
  }
}

if (isInIframe) {
  /**
   * Prevents the natural click behavior of any links within the iframe.
   * Otherwise the iframe reloads with the current page or follows the url provided.
   */
  const links = document.querySelectorAll('a');
  links.forEach(link => {
    link.addEventListener('click', e => {
      e.preventDefault();
    });
  });

  import('./setup-iframe');
}