Bug 1402394 CamelCase all React component files in \devtools\client\shared\components\. r=pbro

MozReview-Commit-ID: HH4mbqB6RTK --HG-- rename : devtools/client/shared/components/autocomplete-popup.js => devtools/client/shared/components/AutoCompletePopup.js rename : devtools/client/shared/components/frame.js => devtools/client/shared/components/Frame.js rename : devtools/client/shared/components/h-split-box.js => devtools/client/shared/components/HSplitBox.js rename : devtools/client/shared/components/notification-box.css => devtools/client/shared/components/NotificationBox.css rename : devtools/client/shared/components/notification-box.js => devtools/client/shared/components/NotificationBox.js rename : devtools/client/shared/components/search-box.js => devtools/client/shared/components/SearchBox.js rename : devtools/client/shared/components/sidebar-toggle.css => devtools/client/shared/components/SidebarToggle.css rename : devtools/client/shared/components/sidebar-toggle.js => devtools/client/shared/components/SidebarToggle.js rename : devtools/client/shared/components/stack-trace.js => devtools/client/shared/components/StackTrace.js rename : devtools/client/shared/components/tree.js => devtools/client/shared/components/Tree.js rename : devtools/client/shared/components/splitter/draggable.js => devtools/client/shared/components/splitter/Draggable.js rename : devtools/client/shared/components/splitter/split-box.css => devtools/client/shared/components/splitter/SplitBox.css rename : devtools/client/shared/components/splitter/split-box.js => devtools/client/shared/components/splitter/SplitBox.js rename : devtools/client/shared/components/tabs/tabbar.css => devtools/client/shared/components/tabs/TabBar.css rename : devtools/client/shared/components/tabs/tabbar.js => devtools/client/shared/components/tabs/TabBar.js rename : devtools/client/shared/components/tabs/tabs.css => devtools/client/shared/components/tabs/Tabs.css rename : devtools/client/shared/components/tabs/tabs.js => devtools/client/shared/components/tabs/Tabs.js rename : devtools/client/shared/components/tree/label-cell.js => devtools/client/shared/components/tree/LabelCell.js rename : devtools/client/shared/components/tree/object-provider.js => devtools/client/shared/components/tree/ObjectProvider.js rename : devtools/client/shared/components/tree/tree-cell.js => devtools/client/shared/components/tree/TreeCell.js rename : devtools/client/shared/components/tree/tree-header.js => devtools/client/shared/components/tree/TreeHeader.js rename : devtools/client/shared/components/tree/tree-row.js => devtools/client/shared/components/tree/TreeRow.js rename : devtools/client/shared/components/tree/tree-view.css => devtools/client/shared/components/tree/TreeView.css rename : devtools/client/shared/components/tree/tree-view.js => devtools/client/shared/components/tree/TreeView.js extra : rebase_source : 5ef89b4169dda156a8160d4d21655147f4d9da11
2017-09-27 01:12:13 -04:00 · 2017-09-27 01:12:13 -04:00 · b9e816d060
--- a/devtools/client/animationinspector/animation-inspector.xhtml
+++ b/devtools/client/animationinspector/animation-inspector.xhtml
@ -7,7 +7,7 @@
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" href="chrome://devtools/skin/animationinspector.css" type="text/css"/>
-    <link rel="stylesheet" href="resource://devtools/client/shared/components/splitter/split-box.css"/>
+    <link rel="stylesheet" href="resource://devtools/client/shared/components/splitter/SplitBox.css"/>
    <script type="application/javascript" src="chrome://devtools/content/shared/theme-switching.js"/>
  </head>
  <body class="theme-sidebar" role="application" empty="true">
--- a/devtools/client/animationinspector/components/animation-timeline.js
+++ b/devtools/client/animationinspector/components/animation-timeline.js
@ -89,7 +89,7 @@ AnimationsTimeline.prototype = {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");

    const SplitBox = React.createFactory(
-      browserRequire("devtools/client/shared/components/splitter/split-box"));
+      browserRequire("devtools/client/shared/components/splitter/SplitBox"));

    const splitter = SplitBox({
      className: "animation-root",
--- a/devtools/client/dom/content/components/dom-tree.js
+++ b/devtools/client/dom/content/components/dom-tree.js
@ -9,7 +9,7 @@
 const React = require("devtools/client/shared/vendor/react");
 const { connect } = require("devtools/client/shared/vendor/react-redux");

-const TreeView = React.createFactory(require("devtools/client/shared/components/tree/tree-view"));
+const TreeView = React.createFactory(require("devtools/client/shared/components/tree/TreeView"));

 // Reps
 const { REPS, MODE } = require("devtools/client/shared/components/reps/reps");
--- a/devtools/client/dom/content/components/main-toolbar.js
+++ b/devtools/client/dom/content/components/main-toolbar.js
@ -14,7 +14,7 @@ const { createFactories } = require("devtools/client/shared/react-utils");
 const { Toolbar, ToolbarButton } = createFactories(require("devtools/client/jsonview/components/reps/toolbar"));

 // DOM Panel
-const SearchBox = React.createFactory(require("devtools/client/shared/components/search-box"));
+const SearchBox = React.createFactory(require("devtools/client/shared/components/SearchBox"));

 // Actions
 const { fetchProperties } = require("../actions/grips");
--- a/devtools/client/dom/dom.html
+++ b/devtools/client/dom/dom.html
@ -9,7 +9,7 @@

  <link href="resource://devtools/client/dom/content/dom-view.css" rel="stylesheet" />
  <link href="resource://devtools/client/jsonview/css/toolbar.css" rel="stylesheet" />
-  <link href="resource://devtools/client/shared/components/tree/tree-view.css" rel="stylesheet" />
+  <link href="resource://devtools/client/shared/components/tree/TreeView.css" rel="stylesheet" />

  <script type="text/javascript"
          src="chrome://devtools/content/shared/theme-switching.js"></script>
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@ -1022,7 +1022,7 @@ Toolbox.prototype = {
    if (!this._notificationBox) {
      let { NotificationBox, PriorityLevels } =
        this.browserRequire(
-          "devtools/client/shared/components/notification-box");
+          "devtools/client/shared/components/NotificationBox");

      NotificationBox = this.React.createFactory(NotificationBox);

--- a/devtools/client/framework/toolbox.xul
+++ b/devtools/client/framework/toolbox.xul
@ -4,7 +4,7 @@
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/toolbox.css" type="text/css"?>
-<?xml-stylesheet href="resource://devtools/client/shared/components/notification-box.css" type="text/css"?>
+<?xml-stylesheet href="resource://devtools/client/shared/components/NotificationBox.css" type="text/css"?>

 <?xul-overlay href="chrome://global/content/editMenuOverlay.xul"?>

--- a/devtools/client/inspector/extensions/components/ObjectTreeView.js
+++ b/devtools/client/inspector/extensions/components/ObjectTreeView.js
@ -12,7 +12,7 @@ const {

 const { REPS, MODE } = require("devtools/client/shared/components/reps/reps");
 const { Rep } = REPS;
-const TreeViewClass = require("devtools/client/shared/components/tree/tree-view");
+const TreeViewClass = require("devtools/client/shared/components/tree/TreeView");
 const TreeView = createFactory(TreeViewClass);

 /**
--- a/devtools/client/inspector/fonts/components/App.js
+++ b/devtools/client/inspector/fonts/components/App.js
@ -8,7 +8,7 @@ const { addons, createClass, createFactory, DOM: dom, PropTypes } =
  require("devtools/client/shared/vendor/react");
 const { connect } = require("devtools/client/shared/vendor/react-redux");

-const SearchBox = createFactory(require("devtools/client/shared/components/search-box"));
+const SearchBox = createFactory(require("devtools/client/shared/components/SearchBox"));
 const FontList = createFactory(require("./FontList"));

 const { getStr } = require("../utils/l10n");
--- a/devtools/client/inspector/inspector.js
+++ b/devtools/client/inspector/inspector.js
@ -487,7 +487,7 @@ Inspector.prototype = {
   */
  setupSplitter: function () {
    let SplitBox = this.React.createFactory(this.browserRequire(
-      "devtools/client/shared/components/splitter/split-box"));
+      "devtools/client/shared/components/splitter/SplitBox"));

    let { width, height } = this.getSidebarSize();
    let splitter = SplitBox({
--- a/devtools/client/inspector/inspector.xhtml
+++ b/devtools/client/inspector/inspector.xhtml
@ -16,13 +16,13 @@
  <link rel="stylesheet" href="chrome://devtools/skin/boxmodel.css"/>
  <link rel="stylesheet" href="chrome://devtools/skin/layout.css"/>
  <link rel="stylesheet" href="chrome://devtools/skin/animationinspector.css"/>
-  <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/tabs.css"/>
-  <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/tabbar.css"/>
+  <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/Tabs.css"/>
+  <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/TabBar.css"/>
  <link rel="stylesheet" href="resource://devtools/client/inspector/components/InspectorTabPanel.css"/>
-  <link rel="stylesheet" href="resource://devtools/client/shared/components/splitter/split-box.css"/>
+  <link rel="stylesheet" href="resource://devtools/client/shared/components/splitter/SplitBox.css"/>
  <link rel="stylesheet" href="resource://devtools/client/inspector/layout/components/Accordion.css"/>
  <link rel="stylesheet" href="resource://devtools/client/shared/components/reps/reps.css"/>
-  <link rel="stylesheet" href="resource://devtools/client/shared/components/tree/tree-view.css"/>
+  <link rel="stylesheet" href="resource://devtools/client/shared/components/tree/TreeView.css"/>

  <script type="application/javascript"
          src="chrome://devtools/content/shared/theme-switching.js"></script>
--- a/devtools/client/inspector/toolsidebar.js
+++ b/devtools/client/inspector/toolsidebar.js
@ -73,7 +73,7 @@ ToolSidebar.prototype = {

  render: function () {
    let Tabbar = this.React.createFactory(this.browserRequire(
-      "devtools/client/shared/components/tabs/tabbar"));
+      "devtools/client/shared/components/tabs/TabBar"));

    let sidebar = Tabbar({
      menuDocument: this._toolPanel._toolbox.doc,
--- a/devtools/client/jsonview/components/json-panel.js
+++ b/devtools/client/jsonview/components/json-panel.js
@ -8,7 +8,7 @@

 define(function (require, exports, module) {
  const { DOM: dom, createFactory, createClass, PropTypes } = require("devtools/client/shared/vendor/react");
-  const TreeViewClass = require("devtools/client/shared/components/tree/tree-view");
+  const TreeViewClass = require("devtools/client/shared/components/tree/TreeView");
  const TreeView = createFactory(TreeViewClass);

  const { REPS, MODE } = require("devtools/client/shared/components/reps/reps");
--- a/devtools/client/jsonview/components/main-tabbed-area.js
+++ b/devtools/client/jsonview/components/main-tabbed-area.js
@ -13,7 +13,7 @@ define(function (require, exports, module) {
  const { JsonPanel } = createFactories(require("./json-panel"));
  const { TextPanel } = createFactories(require("./text-panel"));
  const { HeadersPanel } = createFactories(require("./headers-panel"));
-  const { Tabs, TabPanel } = createFactories(require("devtools/client/shared/components/tabs/tabs"));
+  const { Tabs, TabPanel } = createFactories(require("devtools/client/shared/components/tabs/Tabs"));

  /**
   * This object represents the root application template
--- a/devtools/client/jsonview/css/main.css
+++ b/devtools/client/jsonview/css/main.css
@ -7,8 +7,8 @@
@import "resource://devtools/client/themes/common.css";
@import "resource://devtools/client/themes/toolbars.css";

-@import "resource://devtools/client/shared/components/tree/tree-view.css";
-@import "resource://devtools/client/shared/components/tabs/tabs.css";
+@import "resource://devtools/client/shared/components/tree/TreeView.css";
+@import "resource://devtools/client/shared/components/tabs/Tabs.css";

@import "general.css";
@import "search-box.css";
--- a/devtools/client/memory/components/census-tree-item.js
+++ b/devtools/client/memory/components/census-tree-item.js
@ -11,7 +11,7 @@ const {
  PropTypes
 } = require("devtools/client/shared/vendor/react");
 const { L10N, formatNumber, formatPercent } = require("../utils");
-const Frame = createFactory(require("devtools/client/shared/components/frame"));
+const Frame = createFactory(require("devtools/client/shared/components/Frame"));
 const { TREE_ROW_HEIGHT } = require("../constants");
 const models = require("../models");

--- a/devtools/client/memory/components/census.js
+++ b/devtools/client/memory/components/census.js
@ -5,7 +5,7 @@
 "use strict";

 const { createClass, PropTypes, createFactory } = require("devtools/client/shared/vendor/react");
-const Tree = createFactory(require("devtools/client/shared/components/tree"));
+const Tree = createFactory(require("devtools/client/shared/components/Tree"));
 const CensusTreeItem = createFactory(require("./census-tree-item"));
 const { TREE_ROW_HEIGHT } = require("../constants");
 const { censusModel, diffingModel } = require("../models");
--- a/devtools/client/memory/components/dominator-tree-item.js
+++ b/devtools/client/memory/components/dominator-tree-item.js
@ -7,7 +7,7 @@
 const { assert, isSavedFrame } = require("devtools/shared/DevToolsUtils");
 const { DOM: dom, createClass, createFactory, PropTypes } = require("devtools/client/shared/vendor/react");
 const { L10N, formatNumber, formatPercent } = require("../utils");
-const Frame = createFactory(require("devtools/client/shared/components/frame"));
+const Frame = createFactory(require("devtools/client/shared/components/Frame"));
 const { TREE_ROW_HEIGHT } = require("../constants");

 const Separator = createFactory(createClass({
--- a/devtools/client/memory/components/dominator-tree.js
+++ b/devtools/client/memory/components/dominator-tree.js
@ -7,7 +7,7 @@
 const { DOM: dom, createClass, PropTypes, createFactory } = require("devtools/client/shared/vendor/react");
 const { assert } = require("devtools/shared/DevToolsUtils");
 const { createParentMap } = require("devtools/shared/heapsnapshot/CensusUtils");
-const Tree = createFactory(require("devtools/client/shared/components/tree"));
+const Tree = createFactory(require("devtools/client/shared/components/Tree"));
 const DominatorTreeItem = createFactory(require("./dominator-tree-item"));
 const { L10N } = require("../utils");
 const { TREE_ROW_HEIGHT, dominatorTreeState } = require("../constants");
--- a/devtools/client/memory/components/heap.js
+++ b/devtools/client/memory/components/heap.js
@ -11,7 +11,7 @@ const CensusHeader = createFactory(require("./census-header"));
 const DominatorTree = createFactory(require("./dominator-tree"));
 const DominatorTreeHeader = createFactory(require("./dominator-tree-header"));
 const TreeMap = createFactory(require("./tree-map"));
-const HSplitBox = createFactory(require("devtools/client/shared/components/h-split-box"));
+const HSplitBox = createFactory(require("devtools/client/shared/components/HSplitBox"));
 const Individuals = createFactory(require("./individuals"));
 const IndividualsHeader = createFactory(require("./individuals-header"));
 const ShortestPaths = createFactory(require("./shortest-paths"));
--- a/devtools/client/memory/components/individuals.js
+++ b/devtools/client/memory/components/individuals.js
@ -5,7 +5,7 @@
 "use strict";

 const { createClass, PropTypes, createFactory } = require("devtools/client/shared/vendor/react");
-const Tree = createFactory(require("devtools/client/shared/components/tree"));
+const Tree = createFactory(require("devtools/client/shared/components/Tree"));
 const DominatorTreeItem = createFactory(require("./dominator-tree-item"));
 const { TREE_ROW_HEIGHT } = require("../constants");
 const models = require("../models");
--- a/devtools/client/netmonitor/src/assets/styles/netmonitor.css
+++ b/devtools/client/netmonitor/src/assets/styles/netmonitor.css
@ -4,10 +4,10 @@

@import "chrome://devtools/skin/widgets.css";
@import "resource://devtools/client/themes/light-theme.css";
-@import "resource://devtools/client/shared/components/splitter/split-box.css";
-@import "resource://devtools/client/shared/components/tree/tree-view.css";
-@import "resource://devtools/client/shared/components/tabs/tabs.css";
-@import "resource://devtools/client/shared/components/tabs/tabbar.css";
+@import "resource://devtools/client/shared/components/splitter/SplitBox.css";
+@import "resource://devtools/client/shared/components/tree/TreeView.css";
+@import "resource://devtools/client/shared/components/tabs/Tabs.css";
+@import "resource://devtools/client/shared/components/tabs/TabBar.css";
@import "chrome://devtools/skin/components-frame.css";
@import "chrome://devtools/content/sourceeditor/codemirror/lib/codemirror.css";
@import "chrome://devtools/content/sourceeditor/codemirror/addon/dialog/dialog.css";
--- a/devtools/client/netmonitor/src/components/monitor-panel.js
+++ b/devtools/client/netmonitor/src/components/monitor-panel.js
@ -19,7 +19,7 @@ const { getFormDataSections } = require("../utils/request-utils");
 const { getSelectedRequest } = require("../selectors/index");

 // Components
-const SplitBox = createFactory(require("devtools/client/shared/components/splitter/split-box"));
+const SplitBox = createFactory(require("devtools/client/shared/components/splitter/SplitBox"));
 const NetworkDetailsPanel = createFactory(require("./network-details-panel"));
 const RequestList = createFactory(require("./request-list"));
 const Toolbar = createFactory(require("./toolbar"));
--- a/devtools/client/netmonitor/src/components/properties-view.js
+++ b/devtools/client/netmonitor/src/components/properties-view.js
@ -19,10 +19,10 @@ const { Rep } = REPS;
 const { FILTER_SEARCH_DELAY } = require("../constants");

 // Components
-const SearchBox = createFactory(require("devtools/client/shared/components/search-box"));
-const TreeViewClass = require("devtools/client/shared/components/tree/tree-view");
+const SearchBox = createFactory(require("devtools/client/shared/components/SearchBox"));
+const TreeViewClass = require("devtools/client/shared/components/tree/TreeView");
 const TreeView = createFactory(TreeViewClass);
-const TreeRow = createFactory(require("devtools/client/shared/components/tree/tree-row"));
+const TreeRow = createFactory(require("devtools/client/shared/components/tree/TreeRow"));
 const SourceEditor = createFactory(require("./source-editor"));

 const { div, tr, td } = DOM;
--- a/devtools/client/netmonitor/src/components/security-panel.js
+++ b/devtools/client/netmonitor/src/components/security-panel.js
@ -13,7 +13,7 @@ const { L10N } = require("../utils/l10n");
 const { getUrlHost } = require("../utils/request-utils");

 // Components
-const TreeViewClass = require("devtools/client/shared/components/tree/tree-view");
+const TreeViewClass = require("devtools/client/shared/components/tree/TreeView");
 const PropertiesView = createFactory(require("./properties-view"));

 const { div, input, span } = DOM;
--- a/devtools/client/netmonitor/src/components/stack-trace-panel.js
+++ b/devtools/client/netmonitor/src/components/stack-trace-panel.js
@ -14,7 +14,7 @@ const { viewSourceInDebugger } = require("../connector/index");
 const { div } = DOM;

 // Components
-const StackTrace = createFactory(require("devtools/client/shared/components/stack-trace"));
+const StackTrace = createFactory(require("devtools/client/shared/components/StackTrace"));

 function StackTracePanel({
  openLink,
--- a/devtools/client/netmonitor/src/components/tabbox-panel.js
+++ b/devtools/client/netmonitor/src/components/tabbox-panel.js
@ -13,8 +13,8 @@ const { L10N } = require("../utils/l10n");
 const { PANELS } = require("../constants");

 // Components
-const Tabbar = createFactory(require("devtools/client/shared/components/tabs/tabbar"));
-const TabPanel = createFactory(require("devtools/client/shared/components/tabs/tabs").TabPanel);
+const Tabbar = createFactory(require("devtools/client/shared/components/tabs/TabBar"));
+const TabPanel = createFactory(require("devtools/client/shared/components/tabs/Tabs").TabPanel);
 const CookiesPanel = createFactory(require("./cookies-panel"));
 const HeadersPanel = createFactory(require("./headers-panel"));
 const ParamsPanel = createFactory(require("./params-panel"));
--- a/devtools/client/netmonitor/src/components/toolbar.js
+++ b/devtools/client/netmonitor/src/components/toolbar.js
@ -25,7 +25,7 @@ const { autocompleteProvider } = require("../utils/filter-autocomplete-provider"
 const { L10N } = require("../utils/l10n");

 // Components
-const SearchBox = createFactory(require("devtools/client/shared/components/search-box"));
+const SearchBox = createFactory(require("devtools/client/shared/components/SearchBox"));

 const { button, div, input, label, span } = DOM;

--- a/devtools/client/performance/components/jit-optimizations-item.js
+++ b/devtools/client/performance/components/jit-optimizations-item.js
@ -9,7 +9,7 @@ const L10N = new LocalizationHelper(STRINGS_URI);

 const {PluralForm} = require("devtools/shared/plural-form");
 const { DOM: dom, PropTypes, createClass, createFactory } = require("devtools/client/shared/vendor/react");
-const Frame = createFactory(require("devtools/client/shared/components/frame"));
+const Frame = createFactory(require("devtools/client/shared/components/Frame"));
 const PROPNAME_MAX_LENGTH = 4;
 // If TREE_ROW_HEIGHT changes, be sure to change `var(--jit-tree-row-height)`
 // in `devtools/client/themes/jit-optimizations.css`
--- a/devtools/client/performance/components/jit-optimizations.js
+++ b/devtools/client/performance/components/jit-optimizations.js
@ -9,9 +9,9 @@ const L10N = new LocalizationHelper(STRINGS_URI);

 const { assert } = require("devtools/shared/DevToolsUtils");
 const { DOM: dom, createClass, createFactory, PropTypes } = require("devtools/client/shared/vendor/react");
-const Tree = createFactory(require("../../shared/components/tree"));
+const Tree = createFactory(require("../../shared/components/Tree"));
 const OptimizationsItem = createFactory(require("./jit-optimizations-item"));
-const FrameView = createFactory(require("../../shared/components/frame"));
+const FrameView = createFactory(require("../../shared/components/Frame"));
 const JIT_TITLE = L10N.getStr("jit.title");
 // If TREE_ROW_HEIGHT changes, be sure to change `var(--jit-tree-row-height)`
 // in `devtools/client/themes/jit-optimizations.css`
--- a/devtools/client/performance/components/waterfall-tree.js
+++ b/devtools/client/performance/components/waterfall-tree.js
@ -4,7 +4,7 @@
 "use strict";

 const { createClass, createFactory, PropTypes } = require("devtools/client/shared/vendor/react");
-const Tree = createFactory(require("devtools/client/shared/components/tree"));
+const Tree = createFactory(require("devtools/client/shared/components/Tree"));
 const WaterfallTreeRow = createFactory(require("./waterfall-tree-row"));

 // Keep in sync with var(--waterfall-tree-row-height) in performance.css
--- a/devtools/client/shared/components/autocomplete-popup.js
+++ b/devtools/client/shared/components/autocomplete-popup.js
--- a/devtools/client/shared/components/Frame.js
+++ b/devtools/client/shared/components/Frame.js
--- a/devtools/client/shared/components/h-split-box.js
+++ b/devtools/client/shared/components/h-split-box.js
--- a/devtools/client/shared/components/notification-box.css
+++ b/devtools/client/shared/components/notification-box.css
--- a/devtools/client/shared/components/notification-box.js
+++ b/devtools/client/shared/components/notification-box.js
--- a/devtools/client/shared/components/search-box.js
+++ b/devtools/client/shared/components/search-box.js
@ -8,7 +8,7 @@

 const { DOM: dom, createClass, PropTypes, createFactory } = require("devtools/client/shared/vendor/react");
 const KeyShortcuts = require("devtools/client/shared/key-shortcuts");
-const AutocompletePopup = createFactory(require("devtools/client/shared/components/autocomplete-popup"));
+const AutocompletePopup = createFactory(require("devtools/client/shared/components/AutoCompletePopup"));

 /**
 * A generic search box component for use across devtools
--- a/devtools/client/shared/components/sidebar-toggle.css
+++ b/devtools/client/shared/components/sidebar-toggle.css
--- a/devtools/client/shared/components/sidebar-toggle.js
+++ b/devtools/client/shared/components/sidebar-toggle.js
--- a/devtools/client/shared/components/stack-trace.js
+++ b/devtools/client/shared/components/stack-trace.js
@ -7,7 +7,7 @@
 const React = require("devtools/client/shared/vendor/react");
 const { DOM: dom, createClass, createFactory, PropTypes } = React;
 const { LocalizationHelper } = require("devtools/shared/l10n");
-const Frame = createFactory(require("./frame"));
+const Frame = createFactory(require("./Frame"));

 const l10n = new LocalizationHelper("devtools/client/locales/webconsole.properties");

--- a/devtools/client/shared/components/Tree.js
+++ b/devtools/client/shared/components/Tree.js
--- a/devtools/client/shared/components/moz.build
+++ b/devtools/client/shared/components/moz.build
@ -12,16 +12,16 @@ DIRS += [
 ]

 DevToolsModules(
-    'autocomplete-popup.js',
-    'frame.js',
-    'h-split-box.js',
-    'notification-box.css',
-    'notification-box.js',
-    'search-box.js',
-    'sidebar-toggle.css',
-    'sidebar-toggle.js',
-    'stack-trace.js',
-    'tree.js',
+    'AutoCompletePopup.js',
+    'Frame.js',
+    'HSplitBox.js',
+    'NotificationBox.css',
+    'NotificationBox.js',
+    'SearchBox.js',
+    'SidebarToggle.css',
+    'SidebarToggle.js',
+    'StackTrace.js',
+    'Tree.js',
 )

 MOCHITEST_CHROME_MANIFESTS += ['test/mochitest/chrome.ini']
--- a/devtools/client/shared/components/splitter/Draggable.js
+++ b/devtools/client/shared/components/splitter/Draggable.js
--- a/devtools/client/shared/components/splitter/split-box.css
+++ b/devtools/client/shared/components/splitter/split-box.css
--- a/devtools/client/shared/components/splitter/split-box.js
+++ b/devtools/client/shared/components/splitter/split-box.js
@ -6,7 +6,7 @@

 const React = require("devtools/client/shared/vendor/react");
 const ReactDOM = require("devtools/client/shared/vendor/react-dom");
-const Draggable = React.createFactory(require("devtools/client/shared/components/splitter/draggable"));
+const Draggable = React.createFactory(require("devtools/client/shared/components/splitter/Draggable"));
 const { DOM: dom, PropTypes } = React;

 /**
--- a/devtools/client/shared/components/splitter/moz.build
+++ b/devtools/client/shared/components/splitter/moz.build
@ -5,7 +5,7 @@
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.

 DevToolsModules(
-    'draggable.js',
-    'split-box.css',
-    'split-box.js',
+    'Draggable.js',
+    'SplitBox.css',
+    'SplitBox.js',
 )
--- a/devtools/client/shared/components/tabs/TabBar.css
+++ b/devtools/client/shared/components/tabs/TabBar.css
--- a/devtools/client/shared/components/tabs/TabBar.js
+++ b/devtools/client/shared/components/tabs/TabBar.js
@ -9,7 +9,7 @@
 "use strict";

 const { DOM, createClass, PropTypes, createFactory } = require("devtools/client/shared/vendor/react");
-const Tabs = createFactory(require("devtools/client/shared/components/tabs/tabs").Tabs);
+const Tabs = createFactory(require("devtools/client/shared/components/tabs/Tabs").Tabs);

 const Menu = require("devtools/client/framework/menu");
 const MenuItem = require("devtools/client/framework/menu-item");
--- a/devtools/client/shared/components/tabs/Tabs.css
+++ b/devtools/client/shared/components/tabs/Tabs.css
--- a/devtools/client/shared/components/tabs/Tabs.js
+++ b/devtools/client/shared/components/tabs/Tabs.js
--- a/devtools/client/shared/components/tabs/moz.build
+++ b/devtools/client/shared/components/tabs/moz.build
@ -5,8 +5,8 @@
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.

 DevToolsModules(
-    'tabbar.css',
-    'tabbar.js',
-    'tabs.css',
-    'tabs.js',
+    'TabBar.css',
+    'TabBar.js',
+    'Tabs.css',
+    'Tabs.js',
 )
--- a/devtools/client/shared/components/test/mochitest/test_HSplitBox_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_HSplitBox_01.html
@ -35,7 +35,7 @@ window.onload = Task.async(function* () {
    const React = browserRequire("devtools/client/shared/vendor/react");
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");

-    let HSplitBox = React.createFactory(browserRequire("devtools/client/shared/components/h-split-box"));
+    let HSplitBox = React.createFactory(browserRequire("devtools/client/shared/components/HSplitBox"));
    ok(HSplitBox, "Should get HSplitBox");

    const newSizes = [];
--- a/devtools/client/shared/components/test/mochitest/test_frame_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_frame_01.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let Frame = React.createFactory(browserRequire("devtools/client/shared/components/frame"));
+    let Frame = React.createFactory(browserRequire("devtools/client/shared/components/Frame"));
    ok(Frame, "Should get Frame");

    // Check when there's a column
--- a/devtools/client/shared/components/test/mochitest/test_frame_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_frame_02.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
    const Services = browserRequire("Services");
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let Frame = React.createFactory(browserRequire("devtools/client/shared/components/frame"));
+    let Frame = React.createFactory(browserRequire("devtools/client/shared/components/Frame"));

    const resolvedLocation = {
      sourceId: "whatever",
--- a/devtools/client/shared/components/test/mochitest/test_notification_box_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_notification_box_01.html
@ -24,7 +24,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let { NotificationBox, PriorityLevels } = browserRequire("devtools/client/shared/components/notification-box");
+    let { NotificationBox, PriorityLevels } = browserRequire("devtools/client/shared/components/NotificationBox");

    const renderedBox = shallowRenderComponent(NotificationBox, {});
    is(renderedBox.type, "div", "NotificationBox is rendered as <div>");
--- a/devtools/client/shared/components/test/mochitest/test_notification_box_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_notification_box_02.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let { NotificationBox, PriorityLevels } = browserRequire("devtools/client/shared/components/notification-box");
+    let { NotificationBox, PriorityLevels } = browserRequire("devtools/client/shared/components/NotificationBox");

    // Test rendering
    let boxElement = React.createElement(NotificationBox);
--- a/devtools/client/shared/components/test/mochitest/test_notification_box_03.html
+++ b/devtools/client/shared/components/test/mochitest/test_notification_box_03.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let { NotificationBox, PriorityLevels } = browserRequire("devtools/client/shared/components/notification-box");
+    let { NotificationBox, PriorityLevels } = browserRequire("devtools/client/shared/components/NotificationBox");

    // Test rendering
    let boxElement = React.createElement(NotificationBox);
--- a/devtools/client/shared/components/test/mochitest/test_searchbox-with-autocomplete.html
+++ b/devtools/client/shared/components/test/mochitest/test_searchbox-with-autocomplete.html
@ -39,7 +39,7 @@ window.onload = async function () {

  let React = browserRequire("devtools/client/shared/vendor/react");
  let SearchBox = React.createFactory(
-    browserRequire("devtools/client/shared/components/search-box")
+    browserRequire("devtools/client/shared/components/SearchBox")
  );
  const { component, $ } = await createComponentTest(SearchBox, {
    type: "search",
--- a/devtools/client/shared/components/test/mochitest/test_searchbox.html
+++ b/devtools/client/shared/components/test/mochitest/test_searchbox.html
@ -22,7 +22,7 @@ Test the searchbox component
 window.onload = function () {
  let React = browserRequire("devtools/client/shared/vendor/react");
  let SearchBox = React.createFactory(
-    browserRequire("devtools/client/shared/components/search-box")
+    browserRequire("devtools/client/shared/components/SearchBox")
  );
  ok(SearchBox, "Got the SearchBox factory");

--- a/devtools/client/shared/components/test/mochitest/test_sidebar_toggle.html
+++ b/devtools/client/shared/components/test/mochitest/test_sidebar_toggle.html
@ -17,7 +17,7 @@ Test sidebar toggle button
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
 window.onload = Task.async(function* () {
-  let SidebarToggle = browserRequire("devtools/client/shared/components/sidebar-toggle.js");
+  let SidebarToggle = browserRequire("devtools/client/shared/components/SidebarToggle.js");

  try {
    yield test();
--- a/devtools/client/shared/components/test/mochitest/test_stack-trace-source-maps.html
+++ b/devtools/client/shared/components/test/mochitest/test_stack-trace-source-maps.html
@ -23,7 +23,7 @@ window.onload = function () {
  let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
  let React = browserRequire("devtools/client/shared/vendor/react");
  let StackTrace = React.createFactory(
-    browserRequire("devtools/client/shared/components/stack-trace")
+    browserRequire("devtools/client/shared/components/StackTrace")
  );
  ok(StackTrace, "Got the StackTrace factory");

--- a/devtools/client/shared/components/test/mochitest/test_stack-trace.html
+++ b/devtools/client/shared/components/test/mochitest/test_stack-trace.html
@ -23,7 +23,7 @@ window.onload = function () {
  let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
  let React = browserRequire("devtools/client/shared/vendor/react");
  let StackTrace = React.createFactory(
-    browserRequire("devtools/client/shared/components/stack-trace")
+    browserRequire("devtools/client/shared/components/StackTrace")
  );
  ok(StackTrace, "Got the StackTrace factory");

--- a/devtools/client/shared/components/test/mochitest/test_tabs_accessibility.html
+++ b/devtools/client/shared/components/test/mochitest/test_tabs_accessibility.html
@ -22,7 +22,7 @@ window.onload = Task.async(function* () {
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
    const InspectorTabPanel = React.createFactory(browserRequire("devtools/client/inspector/components/InspectorTabPanel"));
-    const Tabbar = React.createFactory(browserRequire("devtools/client/shared/components/tabs/tabbar"));
+    const Tabbar = React.createFactory(browserRequire("devtools/client/shared/components/tabs/TabBar"));
    const tabbar = Tabbar();
    const tabbarReact = ReactDOM.render(tabbar, window.document.body);
    const tabbarEl = ReactDOM.findDOMNode(tabbarReact);
--- a/devtools/client/shared/components/test/mochitest/test_tabs_menu.html
+++ b/devtools/client/shared/components/test/mochitest/test_tabs_menu.html
@ -14,8 +14,8 @@ Test all-tabs menu.
  <link rel="stylesheet" type="text/css" href="resource://devtools/client/themes/variables.css">
  <link rel="stylesheet" type="text/css" href="resource://devtools/client/themes/common.css">
  <link rel="stylesheet" type="text/css" href="resource://devtools/client/themes/light-theme.css">
-  <link rel="stylesheet" type="text/css" href="resource://devtools/client/shared/components/tabs/tabs.css">
-  <link rel="stylesheet" type="text/css" href="resource://devtools/client/shared/components/tabs/tabbar.css">
+  <link rel="stylesheet" type="text/css" href="resource://devtools/client/shared/components/tabs/Tabs.css">
+  <link rel="stylesheet" type="text/css" href="resource://devtools/client/shared/components/tabs/TabBar.css">
  <link rel="stylesheet" type="text/css" href="resource://devtools/client/inspector/components/side-panel.css">
  <link rel="stylesheet" type="text/css" href="resource://devtools/client/inspector/components/InspectorTabPanel.css">
 </head>
@ -27,7 +27,7 @@ window.onload = Task.async(function* () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
-    const Tabbar = React.createFactory(browserRequire("devtools/client/shared/components/tabs/tabbar"));
+    const Tabbar = React.createFactory(browserRequire("devtools/client/shared/components/tabs/TabBar"));

    // Create container for the TabBar. Set smaller width
    // to ensure that tabs won't fit and the all-tabs menu
--- a/devtools/client/shared/components/test/mochitest/test_tree_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_01.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    let Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    ok(React, "Should get React");
    ok(Tree, "Should get Tree");
--- a/devtools/client/shared/components/test/mochitest/test_tree_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_02.html
@ -20,7 +20,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    let Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    const tree = ReactDOM.render(Tree(TEST_TREE_INTERFACE), window.document.body);

--- a/devtools/client/shared/components/test/mochitest/test_tree_03.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_03.html
@ -20,7 +20,7 @@ window.onload = Task.async(function* () {
  try {
    let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    let React = browserRequire("devtools/client/shared/vendor/react");
-    let Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    let Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    const tree = ReactDOM.render(Tree(Object.assign({}, TEST_TREE_INTERFACE, {
      autoExpandDepth: 1
--- a/devtools/client/shared/components/test/mochitest/test_tree_04.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_04.html
@ -29,7 +29,7 @@ window.onload = Task.async(function* () {

    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    const tree = ReactDOM.render(
      Tree(Object.assign({}, TEST_TREE_INTERFACE, { itemHeight: ITEM_HEIGHT })),
--- a/devtools/client/shared/components/test/mochitest/test_tree_05.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_05.html
@ -22,7 +22,7 @@ window.onload = Task.async(function* () {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    function renderTree(props) {
      const treeProps = Object.assign({},
--- a/devtools/client/shared/components/test/mochitest/test_tree_06.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_06.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    function renderTree(props) {
      const treeProps = Object.assign({},
--- a/devtools/client/shared/components/test/mochitest/test_tree_07.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_07.html
@ -21,7 +21,7 @@ window.onload = Task.async(function* () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    const treeProps = Object.assign({}, TEST_TREE_INTERFACE, {
      renderItem: (item, depth, focused, arrow) => {
--- a/devtools/client/shared/components/test/mochitest/test_tree_08.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_08.html
@ -23,7 +23,7 @@ window.onload = Task.async(function* () {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    function renderTree(props) {
      const treeProps = Object.assign({},
--- a/devtools/client/shared/components/test/mochitest/test_tree_09.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_09.html
@ -22,7 +22,7 @@ window.onload = Task.async(function* () {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    let numberOfExpands = 0;
    let lastExpandedItem = null;
--- a/devtools/client/shared/components/test/mochitest/test_tree_10.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_10.html
@ -22,7 +22,7 @@ window.onload = Task.async(function* () {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    function renderTree(props) {
      const treeProps = Object.assign({},
--- a/devtools/client/shared/components/test/mochitest/test_tree_11.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_11.html
@ -33,7 +33,7 @@ window.onload = Task.async(function* () {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const React = browserRequire("devtools/client/shared/vendor/react");
    const { Simulate } = React.addons.TestUtils;
-    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/tree"));
+    const Tree = React.createFactory(browserRequire("devtools/client/shared/components/Tree"));

    TEST_TREE.expanded = new Set("ABCDEFGHIJKLMNO".split(""));

--- a/devtools/client/shared/components/tree/label-cell.js
+++ b/devtools/client/shared/components/tree/label-cell.js
--- a/devtools/client/shared/components/tree/object-provider.js
+++ b/devtools/client/shared/components/tree/object-provider.js
--- a/devtools/client/shared/components/tree/tree-cell.js
+++ b/devtools/client/shared/components/tree/tree-cell.js
--- a/devtools/client/shared/components/tree/tree-header.js
+++ b/devtools/client/shared/components/tree/tree-header.js
--- a/devtools/client/shared/components/tree/tree-row.js
+++ b/devtools/client/shared/components/tree/tree-row.js
@ -12,8 +12,8 @@ define(function (require, exports, module) {
  const ReactDOM = require("devtools/client/shared/vendor/react-dom");

  // Tree
-  const TreeCell = React.createFactory(require("./tree-cell"));
-  const LabelCell = React.createFactory(require("./label-cell"));
+  const TreeCell = React.createFactory(require("./TreeCell"));
+  const LabelCell = React.createFactory(require("./LabelCell"));

  // Scroll
  const { scrollIntoViewIfNeeded } = require("devtools/client/shared/scroll");
--- a/devtools/client/shared/components/tree/tree-view.css
+++ b/devtools/client/shared/components/tree/tree-view.css
--- a/devtools/client/shared/components/tree/tree-view.js
+++ b/devtools/client/shared/components/tree/tree-view.js
@ -11,9 +11,9 @@ define(function (require, exports, module) {
  const React = require("devtools/client/shared/vendor/react");

  // Reps
-  const { ObjectProvider } = require("./object-provider");
-  const TreeRow = React.createFactory(require("./tree-row"));
-  const TreeHeader = React.createFactory(require("./tree-header"));
+  const { ObjectProvider } = require("./ObjectProvider");
+  const TreeRow = React.createFactory(require("./TreeRow"));
+  const TreeHeader = React.createFactory(require("./TreeHeader"));

  // Shortcuts
  const DOM = React.DOM;
--- a/devtools/client/shared/components/tree/moz.build
+++ b/devtools/client/shared/components/tree/moz.build
@ -4,11 +4,11 @@
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.

 DevToolsModules(
-    'label-cell.js',
-    'object-provider.js',
-    'tree-cell.js',
-    'tree-header.js',
-    'tree-row.js',
-    'tree-view.css',
-    'tree-view.js',
+    'LabelCell.js',
+    'ObjectProvider.js',
+    'TreeCell.js',
+    'TreeHeader.js',
+    'TreeRow.js',
+    'TreeView.css',
+    'TreeView.js',
 )
--- a/devtools/client/shared/react-utils.js
+++ b/devtools/client/shared/react-utils.js
@ -14,7 +14,7 @@ define(function (require, exports, module) {
   *   const {
   *     Tabs,
   *     TabPanel
-   *   } = createFactories(require("devtools/client/shared/components/tabs/tabs"));
+   *   } = createFactories(require("devtools/client/shared/components/tabs/Tabs"));
   */
  function createFactories(args) {
    let result = {};
--- a/devtools/client/storage/storage.xul
+++ b/devtools/client/storage/storage.xul
@ -6,7 +6,7 @@
 <?xml-stylesheet href="chrome://devtools/content/shared/widgets/widgets.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/widgets.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/storage.css" type="text/css"?>
-<?xml-stylesheet href="resource://devtools/client/shared/components/sidebar-toggle.css" type="text/css"?>
+<?xml-stylesheet href="resource://devtools/client/shared/components/SidebarToggle.css" type="text/css"?>

 <!DOCTYPE window [
  <!ENTITY % storageDTD SYSTEM "chrome://devtools/locale/storage.dtd">
--- a/devtools/client/themes/components-frame.css
+++ b/devtools/client/themes/components-frame.css
@ -5,7 +5,7 @@

 /**
 * Frame Component
- * Styles for React component at `devtools/client/shared/components/frame.js`
+ * Styles for React component at `devtools/client/shared/components/Frame.js`
 */

 .frame-link {
--- a/devtools/client/themes/components-h-split-box.css
+++ b/devtools/client/themes/components-h-split-box.css
@ -5,7 +5,7 @@

 /**
 * HSplitBox Component
- * Styles for React component at `devtools/client/shared/components/h-split-box.js`
+ * Styles for React component at `devtools/client/shared/components/HSplitBox.js`
 */

 .h-split-box,
--- a/devtools/client/webconsole/local-dev/index.js
+++ b/devtools/client/webconsole/local-dev/index.js
@ -26,8 +26,8 @@ require("../../themes/webconsole.css");
 require("../../themes/components-frame.css");
 require("../../themes/light-theme.css");
 require("../../shared/components/reps/reps.css");
-require("../../shared/components/tabs/tabs.css");
-require("../../shared/components/tabs/tabbar.css");
+require("../../shared/components/tabs/Tabs.css");
+require("../../shared/components/tabs/TabBar.css");
 require("../../netmonitor/src/assets/styles/netmonitor.css");

 pref("devtools.debugger.remote-timeout", 10000);
--- a/devtools/client/webconsole/net/components/net-info-body.js
+++ b/devtools/client/webconsole/net/components/net-info-body.js
@ -5,7 +5,7 @@

 const React = require("devtools/client/shared/vendor/react");
 const { createFactories } = require("devtools/client/shared/react-utils");
-const { Tabs, TabPanel } = createFactories(require("devtools/client/shared/components/tabs/tabs"));
+const { Tabs, TabPanel } = createFactories(require("devtools/client/shared/components/tabs/Tabs"));

 // Network
 const HeadersTab = React.createFactory(require("./headers-tab"));
--- a/devtools/client/webconsole/net/components/post-tab.js
+++ b/devtools/client/webconsole/net/components/post-tab.js
@ -5,7 +5,7 @@

 const React = require("devtools/client/shared/vendor/react");

-const TreeView = React.createFactory(require("devtools/client/shared/components/tree/tree-view"));
+const TreeView = React.createFactory(require("devtools/client/shared/components/tree/TreeView"));

 const { REPS, MODE, parseURLEncodedText } = require("devtools/client/shared/components/reps/reps");
 const { Rep } = REPS;
--- a/devtools/client/webconsole/net/components/response-tab.js
+++ b/devtools/client/webconsole/net/components/response-tab.js
@ -6,7 +6,7 @@
 const React = require("devtools/client/shared/vendor/react");

 // Reps
-const TreeView = React.createFactory(require("devtools/client/shared/components/tree/tree-view"));
+const TreeView = React.createFactory(require("devtools/client/shared/components/tree/TreeView"));
 const { REPS, MODE } = require("devtools/client/shared/components/reps/reps");
 const { Rep } = REPS;

--- a/devtools/client/webconsole/net/components/stacktrace-tab.js
+++ b/devtools/client/webconsole/net/components/stacktrace-tab.js
@ -4,7 +4,7 @@
 "use strict";

 const { PropTypes, createClass, createFactory } = require("devtools/client/shared/vendor/react");
-const StackTrace = createFactory(require("devtools/client/shared/components/stack-trace"));
+const StackTrace = createFactory(require("devtools/client/shared/components/StackTrace"));

 const StackTraceTab = createClass({
  displayName: "StackTraceTab",
--- a/devtools/client/webconsole/net/main.js
+++ b/devtools/client/webconsole/net/main.js
@ -23,7 +23,7 @@ const L10N = new LocalizationHelper("devtools/client/locales/netmonitor.properti
 // Stylesheets
 var styleSheets = [
  "resource://devtools/client/jsonview/css/toolbar.css",
-  "resource://devtools/client/shared/components/tree/tree-view.css",
+  "resource://devtools/client/shared/components/tree/TreeView.css",
  "resource://devtools/client/shared/components/reps.css",
  "resource://devtools/client/webconsole/net/net-request.css",
  "resource://devtools/client/webconsole/net/components/size-limit.css",
--- a/devtools/client/webconsole/new-console-output/components/message.js
+++ b/devtools/client/webconsole/new-console-output/components/message.js
@ -20,8 +20,8 @@ const CollapseButton = require("devtools/client/webconsole/new-console-output/co
 const MessageIndent = require("devtools/client/webconsole/new-console-output/components/message-indent").MessageIndent;
 const MessageIcon = require("devtools/client/webconsole/new-console-output/components/message-icon");
 const MessageRepeat = require("devtools/client/webconsole/new-console-output/components/message-repeat");
-const FrameView = createFactory(require("devtools/client/shared/components/frame"));
-const StackTrace = createFactory(require("devtools/client/shared/components/stack-trace"));
+const FrameView = createFactory(require("devtools/client/shared/components/Frame"));
+const StackTrace = createFactory(require("devtools/client/shared/components/StackTrace"));

 const Message = createClass({
  displayName: "Message",
--- a/devtools/client/webconsole/webconsole.js
+++ b/devtools/client/webconsole/webconsole.js
@ -234,8 +234,8 @@ function WebConsoleFrame(webConsoleOwner) {

  this.React = require("devtools/client/shared/vendor/react");
  this.ReactDOM = require("devtools/client/shared/vendor/react-dom");
-  this.FrameView = this.React.createFactory(require("devtools/client/shared/components/frame"));
-  this.StackTraceView = this.React.createFactory(require("devtools/client/shared/components/stack-trace"));
+  this.FrameView = this.React.createFactory(require("devtools/client/shared/components/Frame"));
+  this.StackTraceView = this.React.createFactory(require("devtools/client/shared/components/StackTrace"));

  this._telemetry = new Telemetry();

--- a/devtools/client/webconsole/webconsole.xhtml
+++ b/devtools/client/webconsole/webconsole.xhtml
@ -11,8 +11,8 @@
    <link rel="stylesheet" href="chrome://devtools/skin/webconsole.css"/>
    <link rel="stylesheet" href="chrome://devtools/skin/components-frame.css"/>
    <link rel="stylesheet" href="resource://devtools/client/shared/components/reps/reps.css"/>
-    <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/tabs.css"/>
-    <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/tabbar.css"/>
+    <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/Tabs.css"/>
+    <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/TabBar.css"/>
    <link rel="stylesheet" href="chrome://devtools/content/netmonitor/src/assets/styles/netmonitor.css"/>

    <script src="chrome://devtools/content/shared/theme-switching.js"></script>