JSFiddle - React, Tailwind, and code Playground

HTML

<script>Polymer={dom: 'shadow'};</script>
<base href="https://polygit.org/*+:master/components/">
<link rel="import" href="polymer/polymer.html">
<link rel="import" href="paper-menu/paper-menu.html">
<link rel="import" href="paper-item/paper-item.html">
<link rel="import" href="paper-button/paper-button.html">
<link rel="import" href="neon-animation/neon-animated-pages.html">
<link rel="import" href="neon-animation/neon-animatable.html">
<link rel="import" href="neon-animation/neon-animatable.html">
<link rel="import" href="neon-animation/animations/fade-in-animation.html">
<link rel="import" href="neon-animation/animations/fade-out-animation.html">

<dom-module id="x-foo">
  <template>
    <neon-animated-pages id="pages" entry-animation="fade-in-animation" exit-animation="fade-out-animation">
      <neon-animatable>
        <h1>First page </h1>
        <paper-menu id="innerMenu">
          <paper-item>inner menu item 1</paper-item>
          <paper-item>inner menu item 2</paper-item>
        </paper-menu>
      </neon-animatable>
      <neon-animatable>
        <h1>Second page </h1>
      </neon-animatable>
    </neon-animated-pages>
  </template>
</dom-module>

<x-foo></x-foo>

JavaScript

Polymer({
  is: 'x-foo',
  attached: function() {
    window.foo = this;
    this.$.pages.selected='0';
    this.$.innerMenu.selected='0';
  },
});