Scaffold for MD-Settings, inside chrome://md-settings.

chrome/browser/resources/settings/settings_drawer/settings_drawer.js

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview
  * 'cr-settings-drawer' holds the user card and navigation menu for settings
  * pages.
  *
  * Example:
  *
  *     <core-drawer-panel>
- *       <cr-settings-drawer drawer selectedId="{{selectedId}}"
- *           pages="{{pages}}">
+ *       <cr-settings-drawer drawer selectedIndex="{{index}}" pages="{{pages}}">
  *       </cr-settings-drawer>
- *       <cr-settings-main main selectedId="{{selectedId}}" pages="{{pages}}">
+ *       <cr-settings-main main currentPageIndex="{{index}}" pages="{{pages}}">
  *       </cr-settings-main>
  *     </core-drawer-panel>
  *
  * @group Chrome Settings Elements
  * @element cr-settings-drawer
  */
 Polymer('cr-settings-drawer', {
   publish: {
     /**
      * Pages to include in the navigation.
      *
      * @attribute pages
-     * @type Array<!Object>
+     * @type Array<!CrSettingsPage>
      * @default null
      */
     pages: null,
 
     /**
      * ID of the currently selected page.
      *
-     * @attribute selectedId
+     * @attribute selectedIndex
      * @type string
      * default ''
      */
     selectedId: '',
+
+    /**
+     * Index of the currently selected page.
+     *
+     * @attribute selectedIndex
+     * @type number
+     * default 0
+     */
+    selectedIndex: 0,
   },
 
   /** @override */
   created: function() {
     this.pages = [];
   },
 
   /**
    * @type {Object}
    * TODO(michaelpg): Create custom element and data source for user card.
    */
   user: {
     name: 'Chrome User',
     email: 'user@example.com',
     iconUrl: 'chrome://theme/IDR_PROFILE_AVATAR_23@1x',
   },
 });