mwc-layout.html

<dom-module id="mwc-layout">

  <template>
    <style>
:host {
  display: none!important;
}

    :host([active]) {
      display: block!important;
    }
    </style>


    <content class="mwc-layout" select="*"></content>
  </template>

  <script>
// HTMLImports.whenReady(function() {
Polymer({

  activeChange: function(newValue, oldValue) {
    if (newValue === false && oldValue === true) {
      var region = Object.keys(this.opt);

      for (var A = 0; A < region.length; A++) {
        var element = this.querySelectorAll('*[region="' + region[A] + '"]');

        for (Z = 0; Z < element.length; Z++) {
          element[Z].innerHTML = "";
        }
      }
    }
  },

  is: "mwc-layout",

  properties: {
    active: {
      notify: true,
      observer: "activeChange",
      reflectToAttribute: true,
      type: Boolean,
      value: false
    },
    opt: {
      type: Object
    }
  },

  render: function(opt) {
    var region = Object.keys(opt);

    for (var A = 0; A < region.length; A++) {
      if (typeof(opt[region[A]]) === "object") {
        var element = this.querySelectorAll('*[region="' + region[A] + '"]');

        for (Z = 0; Z < element.length; Z++) {
          element[Z].innerHTML = "";

          Polymer.dom(element[Z]).appendChild(opt[region[A]]);
        }
      } else {
        if (document.createElement(opt[region[A]]).constructor !== HTMLElement) {
          var element = this.querySelectorAll('*[region="' + region[A] + '"]');

          for (Z = 0; Z < element.length; Z++) {
            element[Z].innerHTML = "";

            Polymer.dom(element[Z]).appendChild(document.createElement(opt[region[A]]));
          }
        } else {
          console.log(opt[region[A]] + " not registered");
        }
      }
    }

    this.opt = opt;
  }

});
// });
  </script>

</dom-module>

<script>
var PolymerLayout = function() {
  this.currentLayout = null;
};

// layout[String]
// opt[Object] one-level deep
// forceRender[Boolean]

PolymerLayout.prototype.render = function(layout, opt, forceRender) {
  if (document.querySelector('mwc-layout[id="' + layout + '"]')) {
    if (this.currentLayout != layout || forceRender) {
      if (this.currentLayout) {
        document.querySelector('mwc-layout[id="' + this.currentLayout + '"]').active = false
      }

      document.querySelector('mwc-layout[id="' + layout + '"]').render(Object.prototype.toString.call(opt) == "[object Object]" ? opt : {});

      document.querySelector('mwc-layout[id="' + layout + '"]').active = true;

      this.currentLayout = layout;
    }
  }
};

mwcLayout = new PolymerLayout();
</script>