-
{
  let container = html`<div style='height:600px;' />`;
+
map = {
  let container = html`<div style='height:400px;' />`;

  yield container;

  let map = new mapboxgl.Map({
    container,
    style: "mapbox://styles/mapbox/streets-v9",
    center: [-79.4512, 43.6568],
    zoom: 13,
    scrollZoom: false
  });

  var geocoder = new MapboxGeocoder({
    accessToken: mapboxgl.accessToken
  });

  map.addControl(geocoder);

  invalidation.then(() => map.remove());
}

mapboxgl = {
  const gl = await require("mapbox-gl");
  if (!gl.accessToken) {
    gl.accessToken =
-
      "pk.eyJ1IjoibGF0aW1lcyIsImEiOiJjajhvcXRraGUwNnlwMzNyczR3cTBsaWh1In0.0cPKLwe2A0ET4P5CtWSiLQ";
+
      "pk.eyJ1IjoidG1jdyIsImEiOiJjamN0Z3ZiOXEwanZkMnh2dGFuemkzemE3In0.gibebYiJ5TEdXvwjpCY0jg";
    const href = await require.resolve("mapbox-gl/dist/mapbox-gl.css");
    document.head.appendChild(html`<link href=${href} rel=stylesheet>`);
  }
  return gl;
}